root
--cream
#FFF8F0
--paper
#FFFFFF
--ink
#3D3A4B
--muted
#8A8699
--line
#F0E6DA
--primary
#FF7A45
--primary-d
#F2612E
--sunny
#FFC94D
--sky
#56C5F0
--mint
#5FD08A
--pink
#FF9EC4
--grape
#B388EB
--shadow
0 8px 24px rgba(255
138
91
.14)
--shadow-sm
0 4px 12px rgba(61
58
75
.08)
--radius
18px
--radius-sm
12px

*
box-sizing
border-box

html
body
margin
0
padding
0

body
background
var(--cream)
color
var(--ink)
font-size
15px
line-height
1.7
font-family
"PingFang SC"
"Microsoft YaHei"
"Hiragino Sans GB"
"Heiti SC"
sans-serif
-webkit-font-smoothing
antialiased
text-align
left

img
border
0
max-width
100%
height
auto
vertical-align
middle

a
color
var(--primary-d)
text-decoration
none
transition
.15s

a
hover
color
var(--primary)

ul
ol
margin
0
padding
0
list-style
none

h1
h2
h3
h4
margin
0
font-weight
800
line-height
1.35

.clear
clear
both

.yj-wrap
max-width
1200px
margin
0 auto
padding
0 16px

.yj-topbar
background
linear-gradient(90deg
var(--primary)
var(--sunny))
color
#fff
font-size
13px

.yj-topbar .yj-wrap
display
flex
align-items
center
justify-content
space-between
height
38px

.yj-topbar a
color
#fff
opacity
.95

.yj-topbar a
hover
opacity
1
text-decoration
underline

.yj-topbar .tb-right span
margin-left
14px

.yj-header
background
var(--paper)

.yj-header .yj-wrap
display
flex
align-items
center
gap
24px
padding
18px 16px
flex-wrap
wrap

.yj-logo
display
flex
align-items
center
gap
12px
text-decoration
none

.yj-logo .mark
width
54px
height
54px
border-radius
16px
flex
none
background
linear-gradient(135deg
var(--sky)
var(--mint))
display
flex
align-items
center
justify-content
center
font-size
30px
box-shadow
var(--shadow-sm)

.yj-logo .txt b
display
block
font-size
24px
color
var(--primary-d)
letter-spacing
1px

.yj-logo .txt small
display
block
font-size
12px
color
var(--muted)
letter-spacing
3px
font-weight
600

.yj-search
flex
1
min-width
220px
display
flex
max-width
460px

.yj-search input
flex
1
border
2px solid var(--line)
border-right
0
border-radius
999px 0 0 999px
padding
0 18px
height
44px
font-size
14px
outline
none
background
#FFFDFB
color
var(--ink)

.yj-search input
focus
border-color
var(--primary)

.yj-search button
border
0
background
var(--primary)
color
#fff
font-size
15px
font-weight
700
padding
0 26px
border-radius
0 999px 999px 0
cursor
pointer

.yj-search button
hover
background
var(--primary-d)

.yj-head-tools
display
flex
align-items
center
gap
12px
flex
none

.yj-btn
display
inline-flex
align-items
center
gap
6px
border-radius
999px
padding
9px 18px
font-size
14px
font-weight
700
cursor
pointer
border
0

.yj-btn.primary
background
var(--primary)
color
#fff
box-shadow
var(--shadow-sm)

.yj-btn.primary
hover
background
var(--primary-d)

.yj-btn.ghost
background
#FFF1E8
color
var(--primary-d)

.yj-btn.ghost
hover
background
#FFE2D2

.yj-nav
background
var(--paper)
border-top
1px solid var(--line)
border-bottom
3px solid var(--sunny)
position
sticky
top
0
z-index
50
box-shadow
var(--shadow-sm)

.yj-nav .yj-wrap
display
flex
flex-wrap
wrap
gap
4px
padding
0 8px

.yj-nav a
display
inline-flex
align-items
center
gap
6px
padding
13px 16px
font-size
16px
font-weight
700
color
var(--ink)
border-radius
0
position
relative

.yj-nav a
hover
color
var(--primary-d)
background
#FFF6EF

.yj-nav a .em
font-size
18px

.yj-hero
margin
22px auto
position
relative
overflow
hidden
border-radius
26px
background
radial-gradient(120px 120px at 12% 20%
rgba(255
255
255
.35)
transparent 60%)
radial-gradient(160px 160px at 88% 80%
rgba(255
255
255
.30)
transparent 60%)
linear-gradient(120deg
var(--sky)
var(--grape) 45%
var(--pink))
color
#fff
box-shadow
var(--shadow)

.yj-hero .yj-wrap
display
flex
align-items
center
gap
30px
padding
42px 24px
flex-wrap
wrap

.yj-hero .h-left
flex
1
min-width
280px

.yj-hero h1
font-size
34px
line-height
1.3
margin-bottom
12px
text-shadow
0 2px 8px rgba(0
0
0
.12)

.yj-hero p
font-size
16px
opacity
.95
margin
0 0 20px

.yj-hero .h-cta
display
flex
gap
12px
flex-wrap
wrap

.yj-hero .h-cta .yj-btn
background
#fff
color
var(--primary-d)

.yj-hero .h-cta .yj-btn.alt
background
rgba(255
255
255
.18)
color
#fff
border
1px solid rgba(255
255
255
.6)

.yj-hero .h-right
flex
none
width
300px

.yj-hero .float-card
background
rgba(255
255
255
.92)
border-radius
20px
padding
18px
color
var(--ink)
box-shadow
var(--shadow)

.yj-hero .float-card h3
font-size
16px
color
var(--primary-d)
margin-bottom
10px

.yj-hero .float-card li
display
flex
align-items
center
gap
8px
padding
6px 0
border-bottom
1px dashed var(--line)
font-size
14px

.yj-hero .float-card li
last-child
border-bottom
0

.yj-hero .float-card .em
font-size
18px

.yj-blob
position
absolute
border-radius
50%
background
rgba(255
255
255
.18)

.yj-blob.b1
width
120px
height
120px
top
-30px
right
30%

.yj-blob.b2
width
70px
height
70px
bottom
-20px
left
18%

.yj-section
margin
26px auto

.yj-sec-head
display
flex
align-items
center
gap
10px
margin-bottom
14px

.yj-sec-head .bar
width
6px
height
24px
border-radius
6px
background
var(--primary)

.yj-sec-head h2
font-size
22px
color
var(--ink)

.yj-sec-head .more
margin-left
auto
font-size
13px
color
var(--muted)
font-weight
600

.yj-sec-head .more
hover
color
var(--primary-d)

.yj-catgrid
display
grid
grid-template-columns
repeat(7
1fr)
gap
14px

.yj-cat
background
var(--paper)
border-radius
var(--radius)
padding
18px 10px
text-align
center
box-shadow
var(--shadow-sm)
transition
.18s
border
1px solid var(--line)

.yj-cat
hover
transform
translateY(-4px)
box-shadow
var(--shadow)
border-color
var(--sunny)

.yj-cat .ic
width
56px
height
56px
margin
0 auto 8px
border-radius
50%
display
flex
align-items
center
justify-content
center
font-size
28px
color
#fff

.yj-cat
nth-child(7n+1) .ic
background
var(--sky)

.yj-cat
nth-child(7n+2) .ic
background
var(--mint)

.yj-cat
nth-child(7n+3) .ic
background
var(--sunny)

.yj-cat
nth-child(7n+4) .ic
background
var(--pink)

.yj-cat
nth-child(7n+5) .ic
background
var(--grape)

.yj-cat
nth-child(7n+6) .ic
background
var(--primary)

.yj-cat
nth-child(7n+7) .ic
background
#7ED0C5

.yj-cat b
display
block
font-size
15px
color
var(--ink)
font-weight
700

.yj-main
display
flex
gap
24px
align-items
flex-start
margin
22px auto

.yj-col
flex
1
min-width
0

.yj-side
width
320px
flex
none

.yj-list
display
grid
grid-template-columns
repeat(2
1fr)
gap
16px

.yj-card
background
var(--paper)
border-radius
var(--radius)
overflow
hidden
box-shadow
var(--shadow-sm)
display
flex
flex-direction
column
transition
.18s
border
1px solid var(--line)

.yj-card
hover
transform
translateY(-3px)
box-shadow
var(--shadow)

.yj-card .thumb
height
150px
display
flex
align-items
center
justify-content
center
font-size
46px
color
#fff
background
linear-gradient(135deg
var(--sky)
var(--mint))

.yj-card .body
padding
14px 16px
flex
1
display
flex
flex-direction
column

.yj-card .body h3
font-size
16px
line-height
1.5
margin-bottom
8px
font-weight
700

.yj-card .body h3 a
color
var(--ink)

.yj-card .body h3 a
hover
color
var(--primary-d)

.yj-card .meta
margin-top
auto
font-size
12px
color
var(--muted)
display
flex
gap
12px

.yj-news
background
var(--paper)
border-radius
var(--radius)
box-shadow
var(--shadow-sm)
border
1px solid var(--line)
overflow
hidden

.yj-news li
display
flex
gap
14px
padding
14px 16px
border-bottom
1px dashed var(--line)
align-items
center

.yj-news li
last-child
border-bottom
0

.yj-news .pic
width
96px
height
70px
flex
none
border-radius
10px
display
flex
align-items
center
justify-content
center
font-size
30px
color
#fff
background
linear-gradient(135deg
var(--sunny)
var(--primary))
overflow
hidden

.yj-news .pic img
width
100%
height
100%
object-fit
cover

.yj-news .info
flex
1
min-width
0

.yj-news .info h3
font-size
16px
font-weight
700
line-height
1.5
margin-bottom
6px

.yj-news .info h3 a
color
var(--ink)

.yj-news .info h3 a
hover
color
var(--primary-d)

.yj-news .info .meta
font-size
12px
color
var(--muted)
display
flex
gap
14px
flex-wrap
wrap

.yj-news .info .desc
font-size
13px
color
var(--muted)
margin-top
4px
display
-webkit-box
-webkit-line-clamp
1
-webkit-box-orient
vertical
overflow
hidden

.yj-widget
background
var(--paper)
border-radius
var(--radius)
box-shadow
var(--shadow-sm)
border
1px solid var(--line)
margin-bottom
20px
overflow
hidden

.yj-widget .w-head
padding
12px 16px
font-weight
800
font-size
16px
color
#fff
background
linear-gradient(90deg
var(--primary)
var(--sunny))
display
flex
align-items
center
gap
8px

.yj-widget .w-body
padding
12px 16px

.yj-widget ul li
padding
8px 0
border-bottom
1px dotted var(--line)
font-size
14px
display
flex
gap
8px
align-items
baseline

.yj-widget ul li
last-child
border-bottom
0

.yj-widget ul li .dot
color
var(--primary)
font-weight
800

.yj-widget ul li a
color
var(--ink)

.yj-widget ul li a
hover
color
var(--primary-d)

.yj-widget ol
list-style
decimal inside

.yj-widget ol li
padding
7px 0
border-bottom
1px dotted var(--line)
font-size
14px

.yj-widget ol li a
color
var(--ink)

.yj-widget ol li a
hover
color
var(--primary-d)

.yj-widget .w-pics
display
grid
grid-template-columns
repeat(2
1fr)
gap
10px

.yj-widget .w-pics a
display
block
border-radius
10px
overflow
hidden
position
relative

.yj-widget .w-pics .ph
height
84px
display
flex
align-items
center
justify-content
center
font-size
28px
color
#fff
background
linear-gradient(135deg
var(--grape)
var(--pink))

.yj-widget .w-pics span
position
absolute
left
0
right
0
bottom
0
background
rgba(0
0
0
.45)
color
#fff
font-size
12px
padding
3px 6px

.yj-crumbs
font-size
13px
color
var(--muted)
padding
6px 0

.yj-crumbs a
color
var(--muted)

.yj-crumbs a
hover
color
var(--primary-d)

.yj-crumbs span
margin
0 6px
color
var(--line)

.yj-subcats
display
grid
grid-template-columns
repeat(4
1fr)
gap
12px
margin-top
6px

.yj-subcats a
background
var(--paper)
border
1px solid var(--line)
border-radius
var(--radius-sm)
padding
12px 14px
font-weight
700
color
var(--ink)
box-shadow
var(--shadow-sm)
transition
.15s

.yj-subcats a
hover
color
var(--primary-d)
border-color
var(--sunny)
transform
translateY(-2px)

.yj-article
background
var(--paper)
border-radius
var(--radius)
box-shadow
var(--shadow-sm)
border
1px solid var(--line)
padding
28px 32px

.yj-article h1
font-size
26px
line-height
1.4
color
var(--ink)
margin-bottom
12px

.yj-article .a-meta
font-size
13px
color
var(--muted)
padding-bottom
14px
margin-bottom
18px
border-bottom
2px dashed var(--line)
display
flex
gap
18px
flex-wrap
wrap

.yj-article .a-body
font-size
16px
line-height
1.95
color
#46435a

.yj-article .a-body p
margin
0 0 18px

.yj-article .a-body img
max-width
100%
border-radius
12px
margin
8px 0

.yj-article .a-body h2
.yj-article .a-body h3
margin
24px 0 12px
color
var(--primary-d)

.yj-article .a-body a
color
var(--primary-d)
text-decoration
underline

.yj-digg
display
flex
gap
16px
justify-content
center
margin
30px 0 10px

.yj-digg a
display
inline-flex
flex-direction
column
align-items
center
gap
4px
background
#FFF1E8
color
var(--primary-d)
border-radius
14px
padding
12px 22px
font-weight
700

.yj-digg a
hover
background
#FFE2D2

.yj-digg .num
font-size
20px

.yj-pager
display
flex
justify-content
center
gap
8px
flex-wrap
wrap
margin
22px 0

.yj-pager a
.yj-pager span
display
inline-flex
align-items
center
justify-content
center
min-width
38px
height
38px
padding
0 12px
border-radius
10px
background
var(--paper)
border
1px solid var(--line)
color
var(--ink)
font-size
14px
font-weight
600

.yj-pager a
hover
border-color
var(--primary)
color
var(--primary-d)

.yj-pager .cur
background
var(--primary)
border-color
var(--primary)
color
#fff

.yj-footer
background
#2F2B3A
color
#cfc9da
margin-top
34px

.yj-footer .yj-wrap
padding
30px 16px 10px

.yj-foot-cols
display
grid
grid-template-columns
repeat(4
1fr)
gap
24px

.yj-foot-cols h4
color
#fff
font-size
15px
margin-bottom
12px

.yj-foot-cols a
display
block
color
#cfc9da
font-size
13px
padding
4px 0

.yj-foot-cols a
hover
color
var(--sunny)

.yj-foot-bar
border-top
1px solid #443f54
margin-top
22px
padding
16px 0
text-align
center
font-size
13px
color
#a59fb6

.yj-foot-bar a
color
#cfc9da
margin
0 6px

.yj-foot-bar a
hover
color
var(--sunny)

#cyjpx-topbar
display
none

@media (max-width
980px)
.yj-catgrid
grid-template-columns
repeat(4
1fr)

.yj-side
width
100%

.yj-main
flex-direction
column

.yj-foot-cols
grid-template-columns
repeat(2
1fr)

.yj-subcats
grid-template-columns
repeat(2
1fr)


@media (max-width
680px)
body
font-size
14px

.yj-header .yj-wrap
gap
12px

.yj-logo .txt b
font-size
20px

.yj-hero .yj-wrap
padding
26px 18px

.yj-hero h1
font-size
26px

.yj-hero .h-right
width
100%

.yj-catgrid
grid-template-columns
repeat(3
1fr)

.yj-list
grid-template-columns
1fr

.yj-news li
flex-direction
column
align-items
stretch

.yj-news .pic
width
100%
height
120px

.yj-foot-cols
grid-template-columns
1fr

.yj-article
padding
18px 16px

.yj-article h1
font-size
21px


.yj-hot{margin-top:22px}.yj-hot .yj-sec-head .yj-tag{margin-left:10px;font-size:12px;font-weight:400;color:#fff;background:#ff7a45;padding:2px 10px;border-radius:20px;vertical-align:middle}.yj-hotgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}.yj-hotcard{display:block;background:#fff;border:1px solid #ffe3d6;border-radius:14px;padding:18px 18px 16px;box-shadow:0 6px 18px rgba(255,122,69,.08);transition:.2s;text-decoration:none;color:#333}.yj-hotcard:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(255,122,69,.16);border-color:#ffb38a}.yj-hotcard .ic{font-size:30px;line-height:1}.yj-hotcard b{display:block;margin:8px 0 6px;font-size:17px;color:#d4380d}.yj-hotcard p{margin:0;font-size:13px;line-height:1.7;color:#666}.yj-hotcard .go{display:inline-block;margin-top:10px;color:#ff7a45;font-weight:600;font-size:13px}