/* roulang page: index */
:root{
      --paper:#f5f1e8;--ink:#20211f;--cream:#fffdf7;--lime:#d7f542;
      --plum:#5a315d;--coral:#f17855;--teal:#167c70;--muted:#6b6b64;
      --line:rgba(32,33,31,.16);--shadow:0 14px 35px rgba(42,37,29,.11);
      --shadow-dark:0 18px 42px rgba(0,0,0,.24);--radius-lg:24px;--radius:16px;
      --mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
    }
    *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;line-height:1.72}
    body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.28;background-image:linear-gradient(rgba(32,33,31,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(32,33,31,.045) 1px,transparent 1px);background-size:28px 28px;z-index:-1}
    a{color:inherit;text-decoration:none} button,input,select,textarea{font:inherit} button{cursor:pointer} img{display:block;max-width:100%}
    ::selection{background:var(--lime);color:var(--ink)} :focus-visible{outline:3px solid var(--lime);outline-offset:3px}
    .site-shell{overflow:hidden}.container{width:min(1240px,calc(100% - 48px));margin:auto}.mono{font-family:var(--mono)}
    .progress{height:4px;background:var(--lime);position:fixed;top:0;left:0;z-index:100;width:0}
    .site-header{height:80px;background:rgba(255,253,247,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:70}
    .brand-mark{width:34px;height:34px;border-radius:10px;background:var(--ink);display:grid;place-items:center;position:relative;overflow:hidden}.brand-mark:after{content:"";width:18px;height:7px;background:var(--lime);transform:rotate(-24deg);border-radius:4px}
    .nav-link{height:80px;display:flex;align-items:center;padding:0 11px;font-size:14px;font-weight:700;position:relative;white-space:nowrap}.nav-link:after{content:"";position:absolute;bottom:0;left:12px;right:12px;height:4px;background:transparent}.nav-link:hover{color:var(--plum)}.nav-link.active:after{background:var(--lime)}
    .search-box{height:42px;border:1px solid var(--line);background:var(--paper);border-radius:999px;display:flex;align-items:center;gap:8px;padding:0 13px}.search-box input{width:126px;border:0;outline:0;background:transparent;font-size:13px;color:var(--ink)}.search-box input::placeholder{color:#77776e}
    .btn{min-height:44px;padding:10px 17px;border-radius:12px;border:1px solid transparent;display:inline-flex;justify-content:center;align-items:center;gap:8px;font-size:14px;font-weight:800;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 0 var(--ink)}.btn-primary{background:var(--lime);color:var(--ink)}.btn-secondary{background:transparent;border-color:rgba(255,253,247,.5);color:var(--cream)}.btn-secondary:hover{background:var(--cream);color:var(--ink)}
    .section{padding:108px 0}.section-kicker{font:700 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;display:flex;align-items:center;gap:9px;color:var(--plum)}.section-kicker:before{content:"";display:block;width:26px;height:6px;background:var(--coral)}.section-title{font-size:clamp(29px,4vw,52px);line-height:1.12;letter-spacing:-.055em;font-weight:900;margin:12px 0 14px}.section-copy{max-width:680px;color:var(--muted);font-size:16px;margin:0}
    .hero{background:var(--ink);color:var(--cream);position:relative;padding:58px 0 0;isolation:isolate}.hero:before{content:"";position:absolute;inset:0;opacity:.28;background:repeating-linear-gradient(90deg,transparent 0 66px,rgba(255,255,255,.13) 67px 68px),linear-gradient(135deg,transparent 50%,rgba(215,245,66,.14) 50%);background-size:auto,330px 330px;z-index:-1}
    .coupon{background:var(--lime);color:var(--ink);border-radius:var(--radius-lg);padding:clamp(26px,4vw,52px);min-height:364px;position:relative;overflow:hidden;box-shadow:var(--shadow-dark)}.coupon:before,.coupon:after{content:"";position:absolute;width:100px;height:100px;border:2px dashed rgba(32,33,31,.38);border-radius:50%;right:-35px}.coupon:before{top:-45px}.coupon:after{bottom:-48px;right:17%}.coupon-cut{position:absolute;right:0;top:25%;bottom:25%;border-left:2px dashed rgba(32,33,31,.35)}
    .coupon-code{font:800 12px var(--mono);letter-spacing:.1em;background:var(--ink);color:var(--lime);display:inline-flex;padding:7px 10px;border-radius:7px}.hero h1{font-size:clamp(40px,6vw,75px);line-height:.98;letter-spacing:-.08em;font-weight:950;margin:20px 0;max-width:720px}.hero p{max-width:670px;font-size:16px;color:rgba(255,253,247,.82);margin:0}.coupon h2{font-size:clamp(27px,3vw,42px);line-height:1.12;letter-spacing:-.05em;font-weight:900;margin:20px 0}.hero-stat{border-top:1px solid rgba(255,255,255,.21);margin-top:42px;padding:18px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.hero-stat strong{font:800 23px var(--mono);color:var(--lime);display:block}.hero-stat span{font-size:12px;color:rgba(255,255,255,.65)}
    .entry-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:20px}.entry-card{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;position:relative;box-shadow:0 7px 18px rgba(42,37,29,.06);transition:.24s ease}.entry-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.entry-card .bar{height:10px}.entry-main{padding:33px;min-height:340px}.entry-side{padding:24px;min-height:160px}.entry-side + .entry-side{margin-top:20px}.card-no{font:800 12px var(--mono);color:var(--muted)}.entry-card h3{font-size:25px;line-height:1.15;letter-spacing:-.04em;font-weight:900;margin:18px 0 10px}.entry-card p{font-size:14px;color:var(--muted);margin:0 0 20px;max-width:430px}.abstract{height:110px;border-radius:14px;position:relative;overflow:hidden;background:#eee6d7}.abstract:before{content:"";position:absolute;inset:19px;background:repeating-linear-gradient(90deg,rgba(32,33,31,.65) 0 4px,transparent 4px 17px);clip-path:polygon(0 36%,100% 0,100% 62%,0 100%)}.abstract:after{content:"";position:absolute;width:78px;height:78px;border-radius:50%;right:18px;bottom:-20px;background:var(--lime);border:10px solid var(--plum)}
    .scoreboard{background:var(--ink);color:var(--cream);border-radius:var(--radius-lg);padding:35px 28px;box-shadow:var(--shadow-dark)}.score-grid{display:grid;grid-template-columns:repeat(4,1fr)}.score{padding:8px 22px;border-right:1px solid rgba(255,255,255,.18)}.score:last-child{border:0}.score b{display:block;font:900 clamp(30px,4vw,52px) var(--mono);color:var(--lime);letter-spacing:-.08em}.score span{font-size:13px;color:rgba(255,255,255,.72)}.notice-row{border-top:1px solid rgba(255,255,255,.18);margin-top:25px;padding-top:16px;display:flex;flex-wrap:wrap;gap:13px 28px;font-size:13px;color:rgba(255,255,255,.75)}.notice-row i{width:8px;height:8px;background:var(--coral);display:inline-block;margin-right:7px}
    .ladder{display:grid;grid-template-columns:.85fr 1.1fr .85fr;gap:18px;align-items:end}.tier{background:var(--cream);border:1px solid var(--line);padding:24px;border-radius:18px;min-height:220px;position:relative}.tier.featured{background:var(--plum);color:var(--cream);min-height:270px;transform:translateY(-12px)}.tier .limit{font:700 12px var(--mono);color:var(--teal)}.tier.featured .limit{color:var(--lime)}.tier h3{font-size:23px;font-weight:900;margin:13px 0 9px}.tier p{font-size:14px;margin:0;color:var(--muted)}.tier.featured p{color:rgba(255,255,255,.77)}
    .sample-track{display:grid;grid-template-columns:1.45fr .85fr .85fr;gap:20px}.sample{background:var(--cream);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;transition:.23s ease}.sample:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:var(--plum)}.cover{height:170px;position:relative;overflow:hidden;background:var(--plum)}.cover:before{content:"";position:absolute;inset:0;background:linear-gradient(125deg,transparent 0 34%,rgba(215,245,66,.9) 34% 43%,transparent 43% 54%,rgba(241,120,85,.95) 54% 66%,transparent 66%)}.cover:after{content:"";position:absolute;left:22px;bottom:17px;font:900 44px var(--mono);color:rgba(255,253,247,.9)}.cover.one:after{content:"01"}.cover.two{background:var(--teal)}.cover.two:after{content:"02"}.cover.three{background:var(--coral)}.cover.three:after{content:"03"}.sample-body{padding:22px}.tag{font:800 11px var(--mono);letter-spacing:.06em;background:var(--paper);padding:5px 8px;border-radius:6px;display:inline-block}.sample h3{font-size:20px;font-weight:900;line-height:1.25;margin:11px 0 9px}.sample p{font-size:14px;color:var(--muted);margin:0}.meta{margin-top:16px;font-size:12px;color:var(--muted);display:flex;justify-content:space-between}
    .path{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:36px}.path-step{padding:0 23px 0 0;position:relative}.path-step:not(:last-child):after{content:"";height:2px;background:var(--ink);opacity:.25;position:absolute;top:25px;left:57px;right:-4px}.path-dot{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font:900 16px var(--mono);margin-bottom:20px;position:relative;z-index:1}.path-step h3{font-weight:900;font-size:19px;margin:0 0 8px}.path-step p{font-size:14px;color:var(--muted);margin:0}
    .viewpoint{border:1px solid var(--line);border-radius:var(--radius-lg);background:#eadde4;padding:30px;position:relative}.viewpoint blockquote{font-size:clamp(22px,3vw,34px);line-height:1.35;font-weight:900;letter-spacing:-.04em;margin:0;max-width:890px}.viewpoint footer{margin-top:15px;font:700 12px var(--mono);color:var(--plum)}
    .faq-wrap{display:grid;grid-template-columns:.75fr 1.25fr;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line)}.faq-intro{background:var(--ink);color:var(--cream);padding:38px}.faq-intro h2{font-size:36px;line-height:1.1;font-weight:900;letter-spacing:-.06em;margin:15px 0}.faq-intro p{color:rgba(255,255,255,.7);font-size:14px}.faq-list{background:var(--cream);padding:14px 26px}.faq-item{border-bottom:1px solid var(--line)}.faq-item:last-child{border:0}.faq-q{width:100%;border:0;background:transparent;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:21px 0;font-weight:850;color:var(--ink)}.faq-icon{width:27px;height:27px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;flex:0 0 auto}.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .24s ease}.faq-a>div{overflow:hidden}.faq-item.open .faq-a{grid-template-rows:1fr}.faq-a p{font-size:14px;color:var(--muted);margin:0;padding:0 37px 20px 0}
    .contact-panel{background:var(--plum);color:var(--cream);border-radius:var(--radius-lg);padding:clamp(28px,5vw,56px);display:grid;grid-template-columns:1fr 1fr;gap:42px;position:relative;overflow:hidden}.contact-panel:after{content:"";position:absolute;width:270px;height:270px;border-radius:50%;border:36px solid var(--coral);right:-120px;top:-130px;opacity:.75}.contact-panel h2{font-size:clamp(31px,4vw,48px);line-height:1.1;letter-spacing:-.06em;font-weight:900;margin:10px 0}.contact-panel p{font-size:15px;color:rgba(255,255,255,.8);max-width:450px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;position:relative;z-index:1}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:12px;font-weight:700}.field input,.field select,.field textarea{width:100%;border:1px solid rgba(255,255,255,.3);border-radius:10px;background:var(--cream);color:var(--ink);padding:11px 12px;outline:0}.field textarea{min-height:88px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--lime);box-shadow:0 0 0 3px rgba(215,245,66,.36)}.form-note{font-size:12px;color:rgba(255,255,255,.72);margin:10px 0 0}
    .site-footer{background:var(--ink);color:var(--cream);padding:58px 0 22px;margin-top:108px}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,.8fr);gap:28px}.footer-brand{font-size:22px;font-weight:900;letter-spacing:-.04em}.footer-copy{color:rgba(255,255,255,.62);font-size:13px;max-width:305px;margin-top:12px}.footer-heading{font:800 11px var(--mono);letter-spacing:.09em;color:var(--lime);margin-bottom:12px}.footer-links{display:grid;gap:8px;font-size:14px;color:rgba(255,255,255,.77)}.footer-links a:hover{color:var(--lime)}.footer-bottom{border-top:1px solid rgba(255,255,255,.17);margin-top:35px;padding-top:17px;font-size:12px;color:rgba(255,255,255,.52);display:flex;justify-content:space-between;gap:15px}
    .mobile-drawer{display:none}.back-top{position:fixed;right:20px;bottom:20px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);background:var(--cream);box-shadow:var(--shadow);z-index:50;opacity:0;pointer-events:none;transition:.2s}.back-top.show{opacity:1;pointer-events:auto}.back-top:hover{background:var(--lime);transform:translateY(-3px)}
    @media(max-width:1023px){.desktop-nav,.desktop-search{display:none}.mobile-drawer{display:block}.entry-grid,.faq-wrap,.contact-panel{grid-template-columns:1fr}.entry-side + .entry-side{margin-top:0}.entry-side{min-height:0}.ladder{grid-template-columns:1fr}.tier.featured{transform:none}.sample-track{grid-template-columns:1.2fr 1fr}.sample:last-child{display:none}.footer-grid{grid-template-columns:1.3fr 1fr 1fr}.hero-stat{max-width:720px}}
    @media(max-width:639px){.container{width:min(100% - 32px,1240px)}.site-header{height:70px}.nav-link{height:auto}.section{padding:68px 0}.site-footer{margin-top:68px}.hero{padding-top:30px}.coupon{min-height:0;padding:27px}.hero h1{font-size:43px}.hero-stat{grid-template-columns:repeat(3,1fr);gap:8px}.hero-stat strong{font-size:18px}.hero-stat span{font-size:10px}.score-grid{grid-template-columns:1fr 1fr}.score{padding:14px;border-bottom:1px solid rgba(255,255,255,.18)}.score:nth-child(2){border-right:0}.score:nth-child(3),.score:nth-child(4){border-bottom:0}.entry-grid{gap:14px}.entry-main,.entry-side{padding:24px}.sample-track{display:flex;overflow:auto;padding-bottom:12px;margin-right:-16px}.sample{min-width:83%}.sample:last-child{display:block}.path{display:block;margin-left:10px;border-left:2px solid rgba(32,33,31,.2)}.path-step{padding:0 0 27px 31px}.path-step:not(:last-child):after{width:2px;height:calc(100% - 40px);top:45px;left:-2px;right:auto}.path-dot{position:absolute;left:-27px;top:0;width:52px}.faq-list{padding:8px 18px}.contact-panel{gap:25px}.form-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:5px}.mobile-panel{display:none;position:absolute;top:70px;left:0;right:0;background:var(--ink);padding:22px 16px;border-top:1px solid rgba(255,255,255,.14)}.mobile-panel.open{display:block}.mobile-panel a{display:block;color:var(--cream);padding:13px 0;border-bottom:1px solid rgba(255,255,255,.12);font-weight:800}.mobile-panel a.active{color:var(--lime)}.mobile-search{margin:14px 0;background:var(--cream)}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.entry-card:hover,.sample:hover,.btn:hover{transform:none}}

/* roulang page: category1 */
:root{
 --paper:#f5f1e8;--ink:#20211f;--cream:#fffdf7;--lime:#d7f542;
 --plum:#5a315d;--coral:#f17855;--teal:#167c70;--muted:#6b6b64;
 --line:rgba(32,33,31,.16);--shadow:0 14px 35px rgba(42,37,29,.11);
 --shadow-dark:0 18px 42px rgba(0,0,0,.24);--radius-lg:24px;--radius:16px;
 --mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei","Noto Sans SC",Arial,sans-serif;line-height:1.72}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.28;background-image:linear-gradient(rgba(32,33,31,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(32,33,31,.045) 1px,transparent 1px);background-size:28px 28px;z-index:-1}
::selection{background:var(--lime);color:var(--ink)}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
.container{width:min(1240px,calc(100% - 48px));margin:auto}
.site-header{height:80px;background:rgba(255,253,247,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:70}
.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--ink);display:grid;place-items:center;position:relative;overflow:hidden}
.brand-mark:after{content:"";width:18px;height:7px;background:var(--lime);transform:rotate(-24deg);border-radius:4px}
.nav-link{height:80px;display:flex;align-items:center;padding:0 11px;font-size:14px;font-weight:700;position:relative;white-space:nowrap}
.nav-link:after{content:"";position:absolute;bottom:0;left:12px;right:12px;height:4px;background:transparent}
.nav-link:hover{color:var(--plum)}
.nav-link.active:after{background:var(--lime)}
.search-box{height:42px;border:1px solid var(--line);background:var(--paper);border-radius:999px;display:flex;align-items:center;gap:8px;padding:0 13px}
.search-box input{width:126px;border:0;outline:0;background:transparent;font-size:13px;color:var(--ink)}
.search-box input::placeholder{color:#77776e}
.btn{min-height:44px;padding:10px 17px;border-radius:12px;border:1px solid transparent;display:inline-flex;justify-content:center;align-items:center;gap:8px;font-size:14px;font-weight:800;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 0 var(--ink)}
.btn-primary{background:var(--lime);color:var(--ink)}
.btn-secondary{background:var(--cream);border-color:var(--line);color:var(--ink)}
.btn-secondary:hover{background:var(--plum);border-color:var(--plum);color:var(--cream)}
.mobile-drawer,.mobile-panel{display:none}
.page-head{padding:48px 0 44px;position:relative;overflow:hidden}
.channel-banner{min-height:318px;border-radius:var(--radius-lg);overflow:hidden;position:relative;background:var(--plum);color:var(--cream);padding:43px 46px;display:grid;grid-template-columns:1.05fr .95fr;gap:30px;isolation:isolate}
.channel-banner:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 47%,rgba(255,255,255,.06) 47% 48%,transparent 48%),repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 1px,transparent 1px 45px);opacity:.7;z-index:-1}
.breadcrumb{font:700 12px var(--mono);letter-spacing:.06em;color:rgba(255,253,247,.7);display:flex;gap:8px;align-items:center}
.channel-no{display:inline-flex;margin-top:27px;background:var(--lime);padding:5px 9px;font:900 12px var(--mono);color:var(--ink)}
.channel-banner h1{font-size:clamp(36px,5vw,61px);line-height:1;letter-spacing:-.075em;font-weight:950;margin:15px 0}
.channel-banner p{max-width:585px;margin:0;color:rgba(255,253,247,.82);font-size:15px}
.banner-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px}
.banner-meta span{border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:5px 10px;font-size:12px}
.banner-art{position:relative;min-height:230px;align-self:end}
.art-frame{position:absolute;right:0;bottom:0;width:min(100%,390px);height:226px;border:1px solid rgba(255,255,255,.28);background:#20211f;padding:17px;transform:rotate(-2deg)}
.art-frame:before{content:"";position:absolute;left:-26px;top:24px;width:92px;height:11px;background:var(--coral)}
.art-frame:after{content:"";position:absolute;right:32px;top:-17px;width:102px;height:12px;background:var(--lime)}
.art-grid{height:100%;display:grid;grid-template-columns:1.25fr .75fr;gap:10px}
.art-main{background:var(--teal);position:relative;overflow:hidden}
.art-main:after{content:"91";position:absolute;right:-8px;bottom:-34px;font:900 130px var(--mono);color:rgba(255,255,255,.16)}
.art-side{display:grid;gap:10px}.art-side span{background:var(--paper);position:relative}.art-side span:first-child:before{content:"浏览";position:absolute;color:var(--ink);font:900 15px var(--mono);top:14px;left:12px}.art-side span:last-child{background:var(--coral)}
.toolbar{padding:18px;border:1px solid var(--line);border-radius:18px;background:rgba(255,253,247,.76);box-shadow:0 8px 20px rgba(42,37,29,.05);display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.tool-search{flex:1 1 235px;height:45px;border:1px solid var(--line);background:var(--cream);border-radius:10px;display:flex;align-items:center;gap:9px;padding:0 13px}
.tool-search input{border:0;outline:0;background:transparent;width:100%;font-size:14px}
.chips{display:flex;gap:7px;flex-wrap:wrap}.chip{padding:7px 10px;border-radius:999px;border:1px solid var(--line);background:var(--cream);font-size:12px;font-weight:800;transition:.2s ease}.chip:hover,.chip.active{background:var(--ink);border-color:var(--ink);color:var(--cream)}.chip.active{box-shadow:inset 4px 0 var(--lime)}
.sort-select{height:42px;border:1px solid var(--line);border-radius:10px;background:var(--cream);padding:0 29px 0 11px;color:var(--ink);font-size:13px;font-weight:700;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 13px) 17px,calc(100% - 9px) 17px;background-size:4px 4px;background-repeat:no-repeat}
.result-count{font:700 12px var(--mono);color:var(--muted);white-space:nowrap}.view-switch{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}.view-switch button{height:40px;width:42px;border:0;background:var(--cream);color:var(--muted)}.view-switch button.active{background:var(--lime);color:var(--ink)}
.content-layout{display:grid;grid-template-columns:278px minmax(0,1fr);gap:28px;padding:43px 0 94px}
.filter-panel{position:sticky;top:102px;align-self:start;background:var(--cream);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.filter-panel h2{font-size:16px;font-weight:900;margin:0;padding:19px 20px;border-bottom:1px solid var(--line)}
.filter-group{padding:17px 20px;border-bottom:1px solid var(--line)}.filter-group:last-child{border:0}.filter-label{font:800 11px var(--mono);color:var(--muted);letter-spacing:.06em;margin-bottom:10px}.filter-list{display:grid;gap:6px}.filter-list label{display:flex;align-items:center;justify-content:space-between;font-size:13px;cursor:pointer;padding:6px 0}.filter-list input{accent-color:var(--plum)}.filter-list b{font:700 11px var(--mono);color:var(--muted)}
.side-tip{margin:16px;background:var(--ink);color:var(--cream);padding:16px;border-radius:12px}.side-tip strong{font:800 12px var(--mono);color:var(--lime)}.side-tip p{font-size:12px;color:rgba(255,255,255,.7);margin:7px 0 0}
.mobile-filter{display:none}
.list-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:18px}.list-heading h2{font-size:28px;line-height:1.1;letter-spacing:-.05em;font-weight:900;margin:0}.list-heading p{margin:0;color:var(--muted);font-size:13px}
.feature-list{display:grid;gap:17px}
.feature-card{display:grid;grid-template-columns:38% 1fr;background:var(--cream);border:1px solid var(--line);border-radius:18px;overflow:hidden;min-height:225px;transition:.24s ease}
.feature-card:hover,.mag-card:hover{transform:translateY(-5px);box-shadow:var(--shadow);border-color:rgba(90,49,93,.5)}
.cover{position:relative;overflow:hidden;min-height:100%;background:var(--teal)}
.cover:before,.cover:after{content:"";position:absolute}.cover:before{width:150%;height:34px;left:-28%;top:30%;background:var(--lime);transform:rotate(-27deg);opacity:.92}.cover:after{width:130px;height:130px;border:14px solid rgba(255,253,247,.6);border-radius:50%;right:-43px;bottom:-45px}
.cover.coral{background:var(--coral)}.cover.coral:before{background:var(--ink);width:65%;top:42%;left:-12%}.cover.plum{background:var(--plum)}.cover.plum:before{background:var(--paper);top:18%;left:15%;width:78%;height:12px;transform:rotate(0)}.cover .cover-no{position:absolute;left:17px;top:15px;color:var(--cream);font:900 14px var(--mono);z-index:2}
.card-content{padding:25px 27px;display:flex;flex-direction:column;align-items:flex-start}.label{font:800 11px var(--mono);letter-spacing:.06em;background:var(--paper);padding:5px 8px;border-radius:6px;color:var(--plum)}.card-content h3{font-size:24px;line-height:1.18;letter-spacing:-.05em;font-weight:900;margin:13px 0 8px}.card-content p{font-size:14px;color:var(--muted);margin:0;max-width:600px}.content-foot{display:flex;align-items:center;justify-content:space-between;width:100%;gap:12px;margin-top:auto;padding-top:17px;font-size:12px;color:var(--muted)}.arrow-link{font:900 20px var(--mono);color:var(--plum);transition:transform .2s ease}.feature-card:hover .arrow-link,.mag-card:hover .arrow-link{transform:translateX(5px)}
.editor-strip{margin:28px 0;background:var(--ink);color:var(--cream);border-radius:18px;overflow:hidden;display:grid;grid-template-columns:1.15fr .85fr}.editor-copy{padding:29px}.editor-copy small{font:800 11px var(--mono);letter-spacing:.08em;color:var(--lime)}.editor-copy h3{font-size:28px;line-height:1.12;letter-spacing:-.05em;font-weight:900;margin:11px 0}.editor-copy p{font-size:14px;color:rgba(255,255,255,.72);margin:0 0 20px}.editor-actions{display:flex;gap:10px;flex-wrap:wrap}.editor-art{min-height:240px;background:var(--plum);position:relative;overflow:hidden}.editor-art:before{content:"";position:absolute;width:230px;height:230px;border:30px solid var(--lime);border-radius:50%;right:-73px;top:-38px}.editor-art:after{content:"更新";position:absolute;left:27px;bottom:14px;font:900 69px var(--mono);letter-spacing:-.1em;color:rgba(255,253,247,.18)}
.magazine-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:17px;margin-top:17px}.mag-card{background:var(--cream);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:.24s ease}.mag-cover{height:166px;background:var(--paper);position:relative;overflow:hidden}.mag-cover:before{content:"";position:absolute;inset:24px;background:repeating-linear-gradient(90deg,var(--ink) 0 11px,transparent 11px 23px);opacity:.85}.mag-cover:after{content:"";position:absolute;width:120px;height:120px;background:var(--coral);border-radius:50%;right:-28px;bottom:-42px}.mag-cover.teal:after{background:var(--teal)}.mag-cover.plum:after{background:var(--plum)}.mag-card .card-content{padding:20px}.mag-card .card-content h3{font-size:20px}
.pagination{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:39px}.pagination a,.pagination span{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--cream);font:800 13px var(--mono);transition:.2s ease}.pagination a:hover{background:var(--plum);color:var(--cream);border-color:var(--plum)}.pagination .current{background:var(--lime);border-color:var(--lime);color:var(--ink)}.pagination .disabled{opacity:.42}
.bottom-area{padding:0 0 108px}.bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.quick-faq,.bottom-cta{border-radius:var(--radius-lg);padding:34px}.quick-faq{background:var(--cream);border:1px solid var(--line)}.quick-faq h2,.bottom-cta h2{font-size:28px;line-height:1.12;letter-spacing:-.05em;font-weight:900;margin:0 0 15px}.quick-faq ul{padding:0;margin:0;list-style:none}.quick-faq li{padding:13px 0;border-top:1px solid var(--line);font-size:14px}.quick-faq li:before{content:"＋";font-weight:900;color:var(--plum);margin-right:10px}.bottom-cta{background:var(--plum);color:var(--cream);position:relative;overflow:hidden}.bottom-cta:after{content:"01";position:absolute;right:18px;bottom:-35px;font:900 130px var(--mono);color:rgba(255,255,255,.09)}.bottom-cta p{max-width:420px;color:rgba(255,255,255,.76);font-size:14px;margin:0 0 22px;position:relative;z-index:1}
footer{background:var(--ink);color:var(--cream);padding:48px 0 22px}footer .footer-grid{display:grid;grid-template-columns:1.45fr 1fr 1fr;gap:36px;padding-bottom:35px;border-bottom:1px solid rgba(255,255,255,.17)}footer h3{font-size:16px;margin:0 0 9px;font-weight:900}footer p,footer a{font-size:13px;color:rgba(255,253,247,.68)}footer a{display:block;padding:3px 0}footer a:hover{color:var(--lime)}.footer-note{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;padding-top:18px;font:700 11px var(--mono);color:rgba(255,253,247,.58)}
.back-top{position:fixed;right:20px;bottom:20px;width:45px;height:45px;border:1px solid var(--line);border-radius:50%;background:var(--cream);font-size:19px;font-weight:900;box-shadow:var(--shadow);z-index:30;opacity:0;pointer-events:none;transform:translateY(10px);transition:.2s ease}.back-top.visible{opacity:1;pointer-events:auto;transform:translateY(0)}.back-top:hover{background:var(--lime)}
@media(max-width:1023px){.desktop-search{display:none}.desktop-nav{margin-left:auto}.content-layout{grid-template-columns:1fr}.filter-panel{display:none}.mobile-filter{display:inline-flex}.channel-banner{grid-template-columns:1fr}.banner-art{display:none}.bottom-grid{grid-template-columns:1fr}.page-head{padding-top:30px}}
@media(max-width:639px){.container{width:min(100% - 32px,1240px)}.site-header{height:70px}.site-header .container{gap:9px}.desktop-nav{display:none}.mobile-drawer{display:block}.mobile-panel{position:fixed;left:0;right:0;top:70px;padding:18px 16px 25px;background:var(--ink);color:var(--cream);border-top:1px solid rgba(255,255,255,.15);transform:translateY(-125%);opacity:0;pointer-events:none;transition:.25s ease;z-index:60}.mobile-panel.open{transform:translateY(0);opacity:1;pointer-events:auto}.mobile-panel a:not(.btn){display:block;padding:13px 4px;border-bottom:1px solid rgba(255,255,255,.15);font-weight:800}.mobile-panel a.active{color:var(--lime)}.mobile-search{background:var(--cream);margin-bottom:12px}.mobile-search input{width:100%}.channel-banner{padding:29px 24px;min-height:280px}.channel-banner h1{font-size:39px}.toolbar{padding:12px}.tool-search{flex-basis:100%}.chips{width:100%;overflow:auto;flex-wrap:nowrap;padding-bottom:2px}.chip{white-space:nowrap}.result-count{margin-right:auto}.view-switch{display:none}.content-layout{padding-top:28px;padding-bottom:62px}.list-heading{align-items:start;flex-direction:column;gap:5px}.feature-card{grid-template-columns:1fr}.cover{min-height:145px}.card-content{padding:21px}.card-content h3{font-size:21px}.editor-strip{grid-template-columns:1fr}.editor-art{display:none}.magazine-grid{grid-template-columns:1fr}.bottom-area{padding-bottom:62px}.quick-faq,.bottom-cta{padding:25px}.pagination a,.pagination span{width:37px;height:37px}footer .footer-grid{grid-template-columns:1fr;gap:22px}.footer-note{font-size:10px}.brand-mark{width:31px;height:31px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}