/* roulang page: index */
:root{
            --ink:#0d0d12;
            --charcoal:#15151d;
            --panel:#1d1d28;
            --panel-2:#242431;
            --plum:#7d315f;
            --plum-light:#a94d7f;
            --cyan:#79e4d1;
            --lime:#c9ef72;
            --orange:#f1a15d;
            --paper:#f5f2ed;
            --muted:#aaa7b2;
            --line:rgba(255,255,255,.12);
            --line-dark:rgba(16,14,22,.14);
            --radius:14px;
            --shadow:0 18px 48px rgba(0,0,0,.24);
            --ease:all .25s ease;
        }

        *,*::before,*::after{box-sizing:border-box}
        html{scroll-behavior:smooth}
        body{
            margin:0;
            color:var(--paper);
            background:var(--ink);
            font-family:"PingFang SC","Noto Sans CJK SC","Microsoft YaHei",Arial,sans-serif;
            font-size:16px;
            line-height:1.75;
            overflow-x:hidden;
        }
        a{color:inherit;text-decoration:none;transition:var(--ease)}
        a:hover{color:var(--cyan)}
        img{max-width:100%;display:block}
        button,input{font:inherit}
        button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{
            outline:3px solid var(--lime);
            outline-offset:3px;
        }
        .container{width:min(1200px,calc(100% - 40px));margin:0 auto}
        .topline{
            min-height:38px;
            border-bottom:1px solid var(--line);
            background:#0a0a0f;
            color:var(--muted);
            font-size:12px;
        }
        .topline-inner{
            min-height:38px;
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:18px;
        }
        .topline-center{color:#d9d5d5}
        .topline-action{
            color:var(--cyan);
            display:inline-flex;
            align-items:center;
            gap:7px;
            white-space:nowrap;
        }
        .topline-action::after{content:"↗";font-size:14px}
        .site-header{
            position:sticky;
            top:0;
            z-index:20;
            background:rgba(13,13,18,.94);
            border-bottom:1px solid var(--line);
            backdrop-filter:blur(14px);
        }
        .nav-wrap{
            min-height:76px;
            display:flex;
            align-items:center;
            gap:34px;
        }
        .brand{
            display:flex;
            align-items:center;
            gap:12px;
            min-width:245px;
            font-weight:800;
            line-height:1.2;
            letter-spacing:-.02em;
        }
        .brand-mark{
            width:38px;height:38px;
            display:grid;place-items:center;
            background:var(--plum);
            color:var(--lime);
            clip-path:polygon(0 0,100% 0,82% 100%,0 100%);
            font-weight:900;
        }
        .brand-text{font-size:15px}
        .nav-menu{
            display:flex;
            align-items:center;
            gap:8px;
            flex:1;
        }
        .nav-menu a{
            position:relative;
            padding:10px 14px;
            color:#cbc7cf;
            font-size:14px;
            white-space:nowrap;
        }
        .nav-menu a::after{
            content:"";
            position:absolute;
            left:14px;right:14px;bottom:3px;
            height:2px;background:var(--cyan);
            transform:scaleX(0);
            transform-origin:left;
            transition:var(--ease);
        }
        .nav-menu a:hover,.nav-menu a.active{color:#fff}
        .nav-menu a:hover::after,.nav-menu a.active::after{transform:scaleX(1)}
        .nav-tools{display:flex;align-items:center;gap:10px}
        .search-link{
            width:40px;height:40px;
            display:grid;place-items:center;
            border:1px solid var(--line);
            border-radius:8px;
            color:var(--cyan);
            font-size:18px;
        }
        .menu-toggle{display:none}
        .button{
            border-radius:7px;
            padding:.7em 1.15em;
            font-weight:700;
            line-height:1.3;
            transition:var(--ease);
            border:1px solid transparent;
        }
        .button.primary{
            color:var(--ink);
            background:var(--lime);
        }
        .button.primary:hover{background:#e0ff98;color:var(--ink);transform:translateY(-2px);box-shadow:0 8px 22px rgba(201,239,114,.2)}
        .button.secondary{
            color:var(--cyan);
            background:transparent;
            border-color:rgba(121,228,209,.55);
        }
        .button.secondary:hover{background:rgba(121,228,209,.1);transform:translateY(-2px)}
        .button.plum{background:var(--plum);color:#fff}
        .button.plum:hover{background:var(--plum-light);transform:translateY(-2px)}
        .hero{
            position:relative;
            min-height:610px;
            display:flex;
            align-items:center;
            overflow:hidden;
            background:
                linear-gradient(90deg,rgba(13,13,18,.96) 8%,rgba(13,13,18,.8) 46%,rgba(13,13,18,.3)),
                radial-gradient(circle at 82% 35%,rgba(125,49,95,.65),transparent 30%),
                #17131c;
        }
        .hero::before{
            content:"";
            position:absolute;inset:0;
            opacity:.2;
            background:linear-gradient(120deg,transparent 0 42%,var(--cyan) 42.2% 42.5%,transparent 42.7% 67%,var(--plum-light) 67.2% 67.5%,transparent 67.7%);
            pointer-events:none;
        }
        .hero-inner{position:relative;z-index:1;width:100%;padding:92px 0}
        .hero-copy{max-width:660px}
        .eyebrow,.section-kicker{
            display:inline-flex;
            align-items:center;
            gap:9px;
            color:var(--cyan);
            font-size:12px;
            letter-spacing:.14em;
            font-weight:800;
            text-transform:uppercase;
        }
        .eyebrow::before,.section-kicker::before{
            content:"";
            width:24px;height:2px;background:var(--lime);
        }
        h1,h2,h3{margin:0;color:#fff;line-height:1.2;letter-spacing:-.035em}
        h1{font-size:clamp(38px,5.5vw,72px);margin:20px 0 24px;max-width:700px}
        .hero-intro{max-width:610px;color:#d1ccd3;font-size:18px;line-height:1.9;margin:0 0 30px}
        .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
        .hero-notes{display:flex;gap:26px;margin-top:42px;flex-wrap:wrap}
        .hero-note{border-left:2px solid var(--plum-light);padding-left:13px}
        .hero-note strong{display:block;color:var(--lime);font-size:20px;line-height:1.2}
        .hero-note span{font-size:12px;color:var(--muted)}
        .poster-stage{
            position:absolute;
            right:2%;
            top:50%;
            transform:translateY(-50%);
            width:370px;height:475px;
            padding:14px;
            border:1px solid rgba(121,228,209,.35);
            background:rgba(21,21,29,.78);
            box-shadow:var(--shadow),0 0 50px rgba(125,49,95,.3);
            clip-path:polygon(8% 0,100% 0,100% 92%,92% 100%,0 100%,0 8%);
        }
        .poster-art{
            height:100%;
            position:relative;
            overflow:hidden;
            background:
                linear-gradient(160deg,transparent 34%,rgba(201,239,114,.18) 34.2% 35%,transparent 35.2%),
                radial-gradient(circle at 65% 28%,#c06b92 0 4%,transparent 4.5%),
                radial-gradient(ellipse at 62% 58%,#713b60 0 18%,transparent 18.5%),
                linear-gradient(135deg,#251520,#74345c 53%,#111a22);
        }
        .poster-art::after{
            content:"";
            position:absolute;inset:0;
            background:linear-gradient(0deg,rgba(8,8,12,.92),transparent 54%);
        }
        .poster-top,.poster-bottom{position:absolute;z-index:1;left:22px;right:22px}
        .poster-top{top:22px;display:flex;justify-content:space-between;font-size:11px;color:var(--lime)}
        .poster-bottom{bottom:24px}
        .poster-bottom h3{font-size:25px;margin-bottom:8px}
        .poster-bottom p{margin:0;color:#d5d0d3;font-size:13px}
        .status-chip{
            display:inline-flex;
            align-items:center;
            gap:6px;
            padding:4px 9px;
            background:rgba(13,13,18,.8);
            border:1px solid rgba(201,239,114,.45);
            color:var(--lime);
            font-size:11px;
        }
        .status-chip::before{content:"";width:6px;height:6px;background:var(--lime);border-radius:50%;box-shadow:0 0 8px var(--lime)}
        .section{padding:92px 0}
        .section.light{background:var(--paper);color:var(--ink)}
        .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}
        .section-head h2{font-size:clamp(28px,3vw,44px);margin-top:12px}
        .section.light h2,.section.light h3{color:var(--ink)}
        .section-desc{max-width:550px;color:var(--muted);margin:0}
        .light .section-desc{color:#67616a}
        .preview-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}
        .preview-main,.preview-side,.feature-panel,.topic-panel,.news-panel,.subscribe-panel,.faq-panel{
            border:1px solid var(--line);
            background:var(--panel);
            border-radius:var(--radius);
        }
        .preview-main{padding:28px;min-height:250px;position:relative;overflow:hidden}
        .preview-main::before{content:"01";position:absolute;right:22px;top:12px;color:rgba(255,255,255,.08);font-size:96px;font-weight:900}
        .preview-main h3{font-size:26px;margin:20px 0 8px}
        .preview-main p{color:#bdb8c0;max-width:600px;margin:0 0 23px}
        .meta-row{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:20px}
        .tag{display:inline-block;padding:4px 10px;border-radius:4px;background:rgba(121,228,209,.1);border:1px solid rgba(121,228,209,.25);color:var(--cyan);font-size:12px}
        .tag.warm{color:var(--orange);border-color:rgba(241,161,93,.35);background:rgba(241,161,93,.08)}
        .preview-side{padding:25px}
        .preview-side h3{font-size:19px;margin-bottom:17px}
        .signal-list{list-style:none;margin:0;padding:0}
        .signal-list li{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);font-size:13px;color:#c7c3ca}
        .signal-list li:last-child{border-bottom:0}
        .signal-list b{color:var(--lime);font-weight:600}
        .strip-list{display:grid;gap:0}
        .strip-item{display:grid;grid-template-columns:74px 1fr auto;gap:20px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line-dark)}
        .strip-item:last-child{border-bottom:0}
        .index{font-size:27px;font-weight:900;color:var(--plum-light)}
        .strip-item h3{font-size:19px;margin-bottom:3px}
        .light .strip-item h3{color:var(--ink)}
        .strip-item p{margin:0;color:#706b72;font-size:14px}
        .light .tag{color:#6e2e58;border-color:rgba(125,49,95,.25);background:rgba(125,49,95,.06)}
        .highlight-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:22px;align-items:stretch}
        .feature-panel{padding:30px;background:linear-gradient(145deg,#281c2a,#1a1b25)}
        .feature-panel h2{font-size:31px;margin:17px 0 13px}
        .feature-panel p{color:#bbb5bd;margin:0 0 24px}
        .feature-mark{font-size:64px;font-weight:900;color:var(--plum-light);line-height:1}
        .topic-panel{padding:20px}
        .topic-row{display:flex;align-items:center;gap:15px;padding:18px 10px;border-bottom:1px solid var(--line)}
        .topic-row:last-child{border-bottom:0}
        .topic-dot{width:11px;height:11px;border-radius:50%;background:var(--cyan);box-shadow:0 0 15px var(--cyan);flex:none}
        .topic-row h3{font-size:17px;flex:1}
        .topic-row span{font-size:12px;color:var(--muted)}
        .news-wrap{display:grid;grid-template-columns:1fr 320px;gap:25px}
        .news-panel{padding:25px;background:#191922}
        .news-item{display:flex;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid var(--line)}
        .news-item:last-child{border-bottom:0}
        .news-item a{font-weight:600;color:#eee}
        .news-item a:hover{color:var(--cyan)}
        .news-item time{font-size:12px;color:var(--muted);white-space:nowrap}
        .side-callout{padding:28px;background:var(--plum);border-radius:var(--radius);min-height:100%;clip-path:polygon(0 0,94% 0,100% 8%,100% 100%,0 100%)}
        .side-callout h3{font-size:25px;margin:15px 0 11px}
        .side-callout p{color:#f0dce6;font-size:14px;margin:0 0 22px}
        .subscribe-panel{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:32px;background:linear-gradient(100deg,#26202c,#1d2628)}
        .subscribe-panel h2{font-size:29px;margin:12px 0 8px}
        .subscribe-panel p{margin:0;color:#bbbfc0}
        .subscribe-form{display:flex;gap:8px;min-width:420px}
        .subscribe-form input{height:48px;flex:1;margin:0;background:#11151a;border:1px solid var(--line);border-radius:6px;color:#fff;padding:0 14px}
        .subscribe-form input::placeholder{color:#777b82}
        .faq-panel{padding:10px 25px;background:#181820}
        .accordion{background:transparent;margin:0}
        .accordion-title{color:#f3eff0;border-color:var(--line);font-size:16px;padding:20px 8px}
        .accordion-title:hover{background:rgba(121,228,209,.05);color:var(--cyan)}
        .accordion-content{background:transparent;color:#bcb7be;border-color:var(--line);padding:0 8px 20px;line-height:1.85}
        .cta-section{padding:70px 0}
        .cta-box{position:relative;overflow:hidden;padding:55px 60px;background:var(--lime);color:var(--ink);clip-path:polygon(0 0,98% 0,100% 18%,100% 100%,2% 100%,0 82%)}
        .cta-box::after{content:"浏览 / 播放 / 更新";position:absolute;right:45px;bottom:25px;color:rgba(13,13,18,.18);font-size:28px;font-weight:900}
        .cta-box h2{color:var(--ink);font-size:clamp(28px,4vw,46px);max-width:680px}
        .cta-box p{max-width:650px;margin:15px 0 25px;color:#3f4930}
        .cta-box .button{background:var(--ink);color:#fff}
        .cta-box .button:hover{background:var(--plum)}
        footer{padding:48px 0 25px;background:#09090d;border-top:1px solid var(--line)}
        .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;padding-bottom:35px}
        .footer-brand{font-weight:800;font-size:18px;margin-bottom:12px}
        footer p,footer li{color:var(--muted);font-size:13px}
        footer p{max-width:380px}
        footer h3{font-size:14px;margin-bottom:13px;color:#fff}
        .footer-links{list-style:none;margin:0;padding:0;display:grid;gap:6px}
        .copyright{border-top:1px solid var(--line);padding-top:20px;color:#77737c;font-size:12px;display:flex;justify-content:space-between;gap:20px}
        @media(max-width:1024px){
            .nav-wrap{gap:16px}.brand{min-width:210px}.poster-stage{right:-5%;opacity:.55}
            .hero-copy{position:relative;z-index:2}.news-wrap{grid-template-columns:1fr 280px}
        }
        @media(max-width:760px){
            .container{width:min(100% - 28px,600px)}
            .topline-inner{padding:7px 0;flex-wrap:wrap;line-height:1.4}
            .topline-center{order:3;width:100%}
            .nav-wrap{min-height:66px;position:relative}
            .brand{min-width:0;flex:1}.brand-text{font-size:13px}
            .nav-menu{display:none;position:absolute;top:66px;left:0;right:0;padding:12px;background:#121219;border:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column;align-items:stretch}
            .nav-menu.is-open{display:flex}
            .nav-menu a{padding:13px 14px}
            .nav-tools .button{display:none}.menu-toggle{display:grid;place-items:center;width:40px;height:40px;background:transparent;border:1px solid var(--line);color:var(--cyan);border-radius:7px}
            .hero{min-height:650px}.hero-inner{padding:68px 0}.poster-stage{position:relative;right:auto;top:auto;transform:none;width:100%;height:220px;margin-top:40px;opacity:1}
            .poster-art{height:190px}.hero-intro{font-size:16px}
            .section{padding:62px 0}.section-head{display:block}.section-desc{margin-top:14px}
            .preview-grid,.highlight-layout,.news-wrap{grid-template-columns:1fr}
            .strip-item{grid-template-columns:48px 1fr;gap:13px}.strip-item .button{grid-column:2;justify-self:start}
            .subscribe-panel{display:block}.subscribe-form{min-width:0;margin-top:22px;display:block}.subscribe-form input{width:100%;margin-bottom:9px}
            .cta-box{padding:40px 28px}.cta-box::after{display:none}
            .footer-grid{grid-template-columns:1fr 1fr;gap:25px}.footer-grid>div:first-child{grid-column:1/-1}
            .copyright{display:block}.copyright span{display:block;margin-top:5px}
        }
        @media(max-width:430px){
            h1{font-size:38px}.hero-actions .button{width:100%;text-align:center}
            .footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}
            .news-item{display:block}.news-item time{display:block;margin-top:5px}
        }

/* roulang page: category1 */
:root{
 --ink:#0d0d12;
 --charcoal:#15151d;
 --panel:#1d1d28;
 --panel-2:#242431;
 --plum:#7d315f;
 --plum-light:#a94d7f;
 --cyan:#79e4d1;
 --lime:#c9ef72;
 --orange:#f1a15d;
 --paper:#f5f2ed;
 --muted:#aaa7b2;
 --line:rgba(255,255,255,.12);
 --line-dark:rgba(16,14,22,.14);
 --radius:14px;
 --shadow:0 18px 48px rgba(0,0,0,.24);
 --ease:all .25s ease;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;color:var(--paper);background:var(--ink);
 font-family:"PingFang SC","Noto Sans CJK SC","Microsoft YaHei",Arial,sans-serif;
 font-size:16px;line-height:1.75;overflow-x:hidden
}
a{color:inherit;text-decoration:none;transition:var(--ease)}
a:hover{color:var(--cyan)}
img{max-width:100%;display:block}
button,input{font:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{
 outline:3px solid var(--lime);outline-offset:3px
}
.container{width:min(1200px,calc(100% - 40px));margin:0 auto}
.notice-bar{background:#111117;border-bottom:1px solid var(--line);color:var(--muted);font-size:12px}
.notice-inner{min-height:36px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.notice-center{color:#d8d3d8}
.notice-action{color:var(--cyan);font-weight:700}
.site-header{position:sticky;top:0;z-index:20;background:rgba(13,13,18,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
.nav-wrap{min-height:76px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:12px;min-width:245px;font-weight:800;line-height:1.2;letter-spacing:-.02em}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--plum);color:var(--lime);clip-path:polygon(0 0,100% 0,82% 100%,0 100%);font-weight:900}
.brand-text{font-size:15px}
.nav-menu{display:flex;align-items:center;gap:8px;flex:1}
.nav-menu a{position:relative;padding:10px 14px;color:#cbc7cf;font-size:14px;white-space:nowrap}
.nav-menu a:after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:2px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:var(--ease)}
.nav-menu a:hover,.nav-menu a.active{color:#fff}
.nav-menu a:hover:after,.nav-menu a.active:after{transform:scaleX(1)}
.nav-tools{display:flex;align-items:center;gap:10px}
.search-link{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;color:var(--cyan);font-size:18px}
.menu-toggle{display:none;background:none;border:1px solid var(--line);color:var(--cyan);padding:8px 11px;border-radius:7px}
.button{display:inline-block;border-radius:7px;padding:.7em 1.15em;font-weight:700;line-height:1.3;transition:var(--ease);border:1px solid transparent}
.button.primary{color:var(--ink);background:var(--lime)}
.button.primary:hover{background:#e0ff98;color:var(--ink);transform:translateY(-2px);box-shadow:0 8px 22px rgba(201,239,114,.2)}
.button.secondary{color:var(--cyan);background:transparent;border-color:rgba(121,228,209,.55)}
.button.secondary:hover{background:rgba(121,228,209,.1);transform:translateY(-2px)}
.button.plum{background:var(--plum);color:#fff}
.button.plum:hover{background:var(--plum-light);transform:translateY(-2px)}
.page-hero{position:relative;overflow:hidden;padding:88px 0 78px;background:linear-gradient(110deg,#17131c,#211522 57%,#17131c)}
.page-hero:before{content:"";position:absolute;inset:0;opacity:.2;background:linear-gradient(125deg,transparent 0 45%,var(--cyan) 45.2% 45.45%,transparent 45.7% 73%,var(--plum-light) 73.2% 73.5%,transparent 73.7%)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center}
.eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--cyan);font-size:12px;letter-spacing:.14em;font-weight:800}
.eyebrow:before,.section-kicker:before{content:"";width:24px;height:2px;background:var(--lime)}
h1,h2,h3{margin-top:0;line-height:1.25;letter-spacing:-.035em}
h1{font-size:clamp(36px,5vw,64px);margin:18px 0 20px}
h2{font-size:clamp(27px,3.2vw,42px);margin:12px 0 18px}
h3{font-size:20px;margin-bottom:9px}
.hero-copy p{max-width:650px;color:#d1ccd3;font-size:18px;line-height:1.9;margin-bottom:28px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.hero-panel{padding:24px;background:rgba(13,13,18,.72);border:1px solid rgba(121,228,209,.35);box-shadow:var(--shadow);clip-path:polygon(7% 0,100% 0,100% 91%,93% 100%,0 100%,0 9%)}
.panel-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:17px}
.status-chip,.tag{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;background:rgba(13,13,18,.8);border:1px solid rgba(201,239,114,.45);color:var(--lime);font-size:11px}
.status-chip:before{content:"";width:6px;height:6px;background:var(--lime);border-radius:50%;box-shadow:0 0 8px var(--lime)}
.panel-code{font-size:11px;color:var(--muted);letter-spacing:.1em}
.preview-title{font-size:25px;font-weight:800;margin:8px 0}
.preview-sub{color:var(--muted);font-size:14px}
.meta-row{display:flex;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);font-size:13px}
.meta-row span:last-child{color:var(--cyan)}
.section{padding:88px 0}
.section.light{background:var(--paper);color:var(--ink)}
.section-head{max-width:700px;margin-bottom:38px}
.section-head p{color:var(--muted);margin:0;line-height:1.85}
.light .section-head p{color:#68646b}
.issue-board{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.issue-row{display:grid;grid-template-columns:145px 1fr 150px;gap:22px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.issue-row:last-child{border-bottom:0}
.issue-label{color:var(--orange);font-size:12px;font-weight:800;letter-spacing:.08em}
.issue-row p{margin:0;color:#c8c3cb}
.issue-state{justify-self:end;color:var(--muted);font-size:12px}
.issue-state b{color:var(--lime);font-weight:700}
.solution-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:start}
.filter-card{background:var(--panel);padding:26px;border:1px solid var(--line);border-radius:var(--radius);position:sticky;top:110px}
.filter-card label{display:block;color:#d8d3d8;font-size:13px;margin:0 0 7px}
.filter-card input,.filter-card select{width:100%;height:45px;background:#101017;color:var(--paper);border:1px solid var(--line);border-radius:7px;margin-bottom:16px;padding:0 12px}
.filter-card input:focus,.filter-card select:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(121,228,209,.12)}
.content-stack{display:grid;gap:14px}
.content-item{display:grid;grid-template-columns:66px 1fr auto;gap:18px;align-items:center;background:var(--panel);border:1px solid var(--line);padding:19px 20px;border-radius:10px;transition:var(--ease)}
.content-item:hover{border-color:rgba(121,228,209,.5);transform:translateX(3px);box-shadow:var(--shadow)}
.item-number{font-size:25px;color:var(--plum-light);font-weight:900}
.item-title{margin:0 0 4px;font-size:18px}
.item-desc{margin:0;color:var(--muted);font-size:13px;line-height:1.6}
.tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}
.tag{color:var(--cyan);border-color:rgba(121,228,209,.28);background:transparent}
.item-time{color:var(--muted);font-size:12px;white-space:nowrap}
.metric-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr 1fr;gap:1px;background:var(--line-dark);border:1px solid var(--line-dark)}
.metric{background:var(--paper);padding:25px 22px;min-height:150px}
.metric strong{display:block;font-size:30px;color:var(--plum);line-height:1.2;margin-bottom:10px}
.metric span{font-size:14px;color:#68646b}
.meter{height:5px;background:#ded9d3;margin-top:19px;overflow:hidden}
.meter i{display:block;height:100%;background:var(--plum-light)}
.quote-section{background:#19151e}
.quote-main{border-left:3px solid var(--lime);padding:6px 0 6px 26px;max-width:820px;margin-bottom:30px}
.quote-main p{font-size:27px;line-height:1.65;margin:0 0 12px}
.quote-main span{color:var(--muted);font-size:13px}
.feedback-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.feedback{background:var(--panel);border:1px solid var(--line);padding:21px;border-radius:10px}
.feedback p{margin:0 0 13px;color:#d8d3d8;font-size:14px}
.feedback small{color:var(--cyan)}
.faq-wrap{max-width:850px}
.accordion{background:transparent;margin:0}
.accordion-title{background:var(--panel);color:var(--paper);border:1px solid var(--line);margin-bottom:8px;font-weight:700;padding:18px 22px}
.accordion-title:hover,.accordion-title:focus{background:var(--panel-2);color:var(--lime)}
.accordion-content{background:#111117;color:#c8c3cb;border:1px solid var(--line);border-top:0;margin-top:-8px;margin-bottom:8px;padding:18px 22px}
.cta{padding:60px 0;background:var(--plum);position:relative;overflow:hidden}
.cta:after{content:"";position:absolute;right:-100px;top:-120px;width:420px;height:420px;border:1px solid rgba(121,228,209,.35);transform:rotate(25deg)}
.cta-inner{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:30px}
.cta h2{margin-bottom:8px}
.cta p{margin:0;color:#eadde5;max-width:650px}
footer{background:#101016;padding:58px 0 22px;border-top:1px solid var(--line)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px;padding-bottom:42px}
.footer-brand{font-weight:800;font-size:19px;color:#fff;margin-bottom:11px}
footer p{color:var(--muted);font-size:14px;max-width:390px}
footer h3{font-size:14px;color:var(--lime);margin-bottom:12px}
.footer-links{list-style:none;margin:0;padding:0}
.footer-links li{margin:7px 0;color:#c8c3cb;font-size:14px}
.copyright{border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;gap:20px;color:#77737c;font-size:12px}
@media(max-width:1024px){
 .nav-wrap{gap:16px}.brand{min-width:215px}.nav-menu a{padding:10px 8px}
 .hero-grid{gap:35px}.solution-layout{grid-template-columns:1fr}.filter-card{position:static}
}
@media(max-width:768px){
 .nav-tools{margin-left:auto}.menu-toggle{display:block}.nav-menu{display:none;position:absolute;left:20px;right:20px;top:76px;background:var(--charcoal);border:1px solid var(--line);padding:12px;flex-direction:column;align-items:stretch;box-shadow:var(--shadow)}
 .nav-menu.is-open{display:flex}.nav-menu a{padding:12px 14px}.search-link{display:none}
 .hero-grid{grid-template-columns:1fr}.page-hero{padding:65px 0}.hero-panel{max-width:560px}
 .issue-row{grid-template-columns:110px 1fr}.issue-state{grid-column:2;justify-self:start}
 .metric-grid{grid-template-columns:repeat(2,1fr)}.feedback-grid{grid-template-columns:1fr}
 .cta-inner{display:block}.cta .button{margin-top:22px}
 .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
}
@media(max-width:520px){
 .container{width:min(100% - 28px,1200px)}.notice-inner{padding:7px 0;align-items:flex-start;flex-wrap:wrap;gap:2px 12px}
 .notice-center{order:3;width:100%}.brand{min-width:0}.brand-text{font-size:13px}.brand-mark{width:34px;height:34px}
 h1{font-size:37px}.hero-copy p{font-size:16px}.section{padding:62px 0}
 .issue-row{display:block;padding:19px 0}.issue-label,.issue-state{display:block;margin-bottom:6px}
 .content-item{grid-template-columns:42px 1fr;gap:12px;padding:16px}.content-item .button{grid-column:2;justify-self:start}
 .item-number{font-size:20px}.metric-grid{grid-template-columns:1fr}.metric{min-height:auto}
 .quote-main p{font-size:21px}.footer-grid{grid-template-columns:1fr}.copyright{display:block}.copyright span{display:block;margin-top:5px}
}

/* roulang page: category2 */
:root{
      --ink:#0d0d12;--charcoal:#15151d;--panel:#1d1d28;--panel-2:#242431;
      --plum:#7d315f;--plum-light:#a94d7f;--cyan:#79e4d1;--lime:#c9ef72;
      --orange:#f1a15d;--paper:#f5f2ed;--muted:#aaa7b2;--line:rgba(255,255,255,.12);
      --line-dark:rgba(16,14,22,.14);--radius:14px;--shadow:0 18px 48px rgba(0,0,0,.24);
      --ease:all .25s ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:var(--ink);color:var(--paper);font-family:"PingFang SC","Noto Sans CJK SC","Microsoft YaHei",Arial,sans-serif;font-size:16px;line-height:1.75;overflow-x:hidden}
    a{color:inherit;text-decoration:none;transition:var(--ease)}
    a:hover{color:var(--cyan)}
    img{max-width:100%;display:block}
    button,input,select{font:inherit}
    button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
    .container{width:min(1200px,calc(100% - 40px));margin:0 auto}
    .notice-bar{min-height:34px;border-bottom:1px solid var(--line);background:#111118;color:var(--muted);font-size:12px}
    .notice-inner{min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:18px}
    .notice-inner strong{color:var(--cyan);font-weight:600}
    .notice-action{color:var(--lime);white-space:nowrap}
    .site-header{position:sticky;top:0;z-index:20;background:rgba(13,13,18,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
    .nav-wrap{min-height:76px;display:flex;align-items:center;gap:34px}
    .brand{display:flex;align-items:center;gap:12px;min-width:245px;font-weight:800;line-height:1.2;letter-spacing:-.02em}
    .brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--plum);color:var(--lime);clip-path:polygon(0 0,100% 0,82% 100%,0 100%);font-weight:900}
    .brand-text{font-size:15px}
    .nav-menu{display:flex;align-items:center;gap:8px;flex:1}
    .nav-menu a{position:relative;padding:10px 14px;color:#cbc7cf;font-size:14px;white-space:nowrap}
    .nav-menu a::after{content:"";position:absolute;left:14px;right:14px;bottom:3px;height:2px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:var(--ease)}
    .nav-menu a:hover,.nav-menu a.active{color:#fff}
    .nav-menu a:hover::after,.nav-menu a.active::after{transform:scaleX(1)}
    .nav-tools{display:flex;align-items:center;gap:10px}
    .search-link{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;color:var(--cyan);font-size:18px}
    .menu-toggle{display:none;background:none;border:1px solid var(--line);color:var(--cyan);padding:8px 11px;border-radius:7px}
    .button{display:inline-flex;align-items:center;justify-content:center;border-radius:7px;padding:.7em 1.15em;font-weight:700;line-height:1.3;transition:var(--ease);border:1px solid transparent}
    .button.primary{color:var(--ink);background:var(--lime)}
    .button.primary:hover{background:#e0ff98;color:var(--ink);transform:translateY(-2px);box-shadow:0 8px 22px rgba(201,239,114,.2)}
    .button.secondary{color:var(--cyan);background:transparent;border-color:rgba(121,228,209,.55)}
    .button.secondary:hover{background:rgba(121,228,209,.1);transform:translateY(-2px)}
    .button.plum{background:var(--plum);color:#fff}
    .button.plum:hover{background:var(--plum-light);transform:translateY(-2px)}
    .page-hero{position:relative;overflow:hidden;padding:88px 0 76px;background:linear-gradient(115deg,#17131c 0%,#211521 54%,#15151d 100%)}
    .page-hero:before{content:"";position:absolute;inset:0;opacity:.2;background:linear-gradient(125deg,transparent 0 40%,var(--cyan) 40.2% 40.45%,transparent 40.7% 71%,var(--plum-light) 71.2% 71.45%,transparent 71.7%)}
    .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:70px;align-items:center}
    .eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--cyan);font-size:12px;letter-spacing:.14em;font-weight:800}
    .eyebrow:before,.section-kicker:before{content:"";width:24px;height:2px;background:var(--lime)}
    h1,h2,h3{margin:0;color:#fff;line-height:1.2;letter-spacing:-.035em}
    h1{font-size:clamp(36px,5vw,62px);max-width:720px;margin:17px 0 22px}
    h2{font-size:clamp(28px,3.4vw,42px)}
    h3{font-size:19px}
    .hero-summary{max-width:680px;color:#d1ccd3;font-size:18px;line-height:1.9;margin:0 0 30px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap}
    .hero-meta{display:flex;gap:26px;flex-wrap:wrap;margin-top:38px}
    .hero-meta div{border-left:2px solid var(--plum-light);padding-left:13px}
    .hero-meta strong{display:block;color:var(--lime);font-size:20px;line-height:1.2}
    .hero-meta span{font-size:12px;color:var(--muted)}
    .update-orb{position:relative;min-height:355px;padding:30px;border:1px solid rgba(121,228,209,.35);background:rgba(21,21,29,.82);clip-path:polygon(8% 0,100% 0,100% 91%,91% 100%,0 100%,0 9%);box-shadow:var(--shadow),0 0 50px rgba(125,49,95,.28)}
    .orb-ring{width:142px;height:142px;margin:0 auto 22px;border-radius:50%;display:grid;place-items:center;border:8px solid rgba(121,228,209,.18);border-top-color:var(--lime);border-right-color:var(--plum-light);box-shadow:0 0 0 10px rgba(121,228,209,.04),0 0 30px rgba(121,228,209,.18)}
    .orb-ring strong{font-size:30px;color:var(--lime);line-height:1}
    .orb-ring small{display:block;font-size:11px;color:var(--muted);text-align:center;margin-top:5px}
    .orb-title{text-align:center;font-weight:700;color:#fff;margin-bottom:5px}
    .orb-copy{text-align:center;color:var(--muted);font-size:13px}
    .pulse-line{height:5px;background:var(--panel-2);margin:25px 0 17px;overflow:hidden}
    .pulse-line span{display:block;width:68%;height:100%;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}
    .orb-tags{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
    .tag,.status{display:inline-flex;align-items:center;padding:4px 9px;border:1px solid rgba(121,228,209,.3);background:rgba(121,228,209,.06);color:var(--cyan);font-size:12px;border-radius:4px}
    .status.ready{color:var(--lime);border-color:rgba(201,239,114,.45)}
    .status.wait{color:var(--orange);border-color:rgba(241,161,93,.45)}
    .section{padding:86px 0}
    .section.dark{background:var(--charcoal)}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:30px}
    .section-head p{max-width:540px;margin:0;color:var(--muted)}
    .filter-panel{display:grid;grid-template-columns:1.25fr .8fr .8fr auto;gap:12px;padding:18px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--plum-light);margin-bottom:25px}
    .filter-panel label{display:block;color:var(--muted);font-size:12px;margin-bottom:5px}
    .filter-panel input,.filter-panel select{width:100%;height:44px;padding:0 12px;color:var(--paper);background:#12121a;border:1px solid var(--line);border-radius:6px}
    .filter-panel .button{align-self:end;height:44px}
    .update-list{display:grid;gap:12px}
    .update-item{display:grid;grid-template-columns:78px 1fr auto;gap:20px;align-items:center;padding:20px 22px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);transition:var(--ease)}
    .update-item:hover{transform:translateX(4px);border-color:rgba(121,228,209,.45);box-shadow:0 12px 30px rgba(0,0,0,.18)}
    .item-index{color:var(--plum-light);font-size:24px;font-weight:900}
    .item-title{font-size:18px;font-weight:700;color:#fff;margin-bottom:5px}
    .item-copy{color:var(--muted);font-size:14px;margin:0}
    .item-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}
    .item-action{text-align:right;white-space:nowrap}
    .split-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:58px;align-items:start}
    .intro-note{color:#c9c4cc;font-size:17px;line-height:1.9;margin-top:20px}
    .path-list{display:grid;gap:13px}
    .path-step{display:grid;grid-template-columns:42px 1fr;gap:15px;align-items:start;padding:17px;border-bottom:1px solid var(--line)}
    .path-num{width:34px;height:34px;display:grid;place-items:center;background:var(--plum);color:var(--lime);font-weight:800;clip-path:polygon(0 0,100% 0,82% 100%,0 100%)}
    .path-step p{margin:5px 0 0;color:var(--muted);font-size:14px}
    .signal-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
    .signal-card{padding:24px;background:var(--panel-2);border:1px solid var(--line);min-height:150px}
    .signal-card strong{display:block;color:var(--lime);font-size:24px;margin-bottom:8px}
    .signal-card h3{font-size:17px;margin-bottom:7px}
    .signal-card p{margin:0;color:var(--muted);font-size:14px}
    .feedback{background:var(--paper);color:var(--ink)}
    .feedback h2,.feedback h3{color:var(--ink)}
    .quote{font-size:clamp(22px,3vw,34px);line-height:1.55;max-width:850px;margin:0 0 28px;font-weight:700}
    .quote:before{content:"“";color:var(--plum-light);font-size:62px;line-height:.5;vertical-align:-20px;margin-right:8px}
    .feedback-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
    .feedback-card{padding:20px;background:#fff;border:1px solid var(--line-dark);border-radius:10px}
    .feedback-card p{margin:0 0 13px;color:#4c4850;font-size:14px}
    .feedback-card span{font-size:12px;color:var(--plum)}
    .faq-list{max-width:850px;margin:0 auto}
    .accordion{background:transparent}
    .accordion-title{background:var(--panel);color:#fff;border:1px solid var(--line);margin-bottom:8px;border-radius:8px;font-weight:700}
    .accordion-title:hover,.accordion-title:focus{background:var(--panel-2);color:var(--cyan)}
    .accordion-content{background:#12121a;color:var(--muted);border:1px solid var(--line);border-top:0;margin-top:-8px;margin-bottom:8px;padding:18px 20px}
    .cta{padding:68px 0;background:linear-gradient(110deg,var(--plum) 0%,#552846 55%,#20202a 100%);position:relative;overflow:hidden}
    .cta:after{content:"";position:absolute;right:-5%;top:-70%;width:42%;height:240%;transform:rotate(22deg);border-left:2px solid rgba(121,228,209,.4);border-right:1px solid rgba(201,239,114,.3)}
    .cta-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:28px}
    .cta h2{max-width:650px}.cta p{color:#eadce5;max-width:650px;margin:14px 0 0}
    footer{padding:55px 0 24px;background:#101016;border-top:1px solid var(--line)}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px}
    .footer-brand{font-size:20px;font-weight:800;color:#fff;margin-bottom:12px}
    footer p{color:var(--muted);max-width:380px;margin:0}
    footer h3{font-size:15px;margin-bottom:14px}
    .footer-links{list-style:none;margin:0;padding:0;display:grid;gap:7px;color:var(--muted);font-size:14px}
    .footer-links a:hover{color:var(--cyan)}
    .copyright{display:flex;justify-content:space-between;gap:18px;border-top:1px solid var(--line);margin-top:40px;padding-top:18px;color:#77747d;font-size:12px}
    @media(max-width:1024px){.nav-wrap{gap:16px}.brand{min-width:220px}.hero-grid{gap:35px}.update-orb{width:100%}}
    @media(max-width:768px){.nav-menu{display:none;position:absolute;top:110px;left:20px;right:20px;padding:12px;flex-direction:column;align-items:stretch;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}.nav-menu.is-open{display:flex}.nav-menu a{padding:13px 15px}.menu-toggle{display:block}.nav-tools .button{display:none}.nav-wrap{min-height:70px}.hero-grid,.split-section{grid-template-columns:1fr}.page-hero{padding:65px 0}.update-orb{max-width:420px}.filter-panel{grid-template-columns:1fr 1fr}.filter-panel .button{width:100%}.update-item{grid-template-columns:55px 1fr}.item-action{grid-column:2;text-align:left}.feedback-row,.footer-grid{grid-template-columns:1fr 1fr}.cta-inner{align-items:flex-start;flex-direction:column}}
    @media(max-width:520px){.container{width:min(100% - 28px,1200px)}.notice-inner{padding:7px 0;align-items:flex-start;flex-wrap:wrap;gap:3px 12px}.notice-action{display:none}h1{font-size:36px}.hero-summary{font-size:16px}.section{padding:62px 0}.hero-meta{gap:16px}.filter-panel{grid-template-columns:1fr}.update-item{padding:16px;gap:12px}.item-index{font-size:19px}.item-title{font-size:16px}.signal-grid,.feedback-row,.footer-grid{grid-template-columns:1fr}.copyright{flex-direction:column;gap:4px}.cta{padding:54px 0}.cta h2{font-size:29px}.brand-text{font-size:13px}}
