/* roulang page: index */
:root{
      --bg:#07111f;
      --bg-deep:#040b15;
      --sidebar:#06101d;
      --panel:#0c1b2d;
      --panel-soft:rgba(16,35,57,.72);
      --panel-solid:#0d2034;
      --line:rgba(142,190,227,.16);
      --line-strong:rgba(108,210,239,.42);
      --text:#edf6fb;
      --muted:#91a8b8;
      --subtle:#6f8798;
      --cyan:#8ee8f4;
      --blue:#58a9ff;
      --violet:#9b83ff;
      --berry:#c26b9e;
      --success:#7bd8b0;
      --radius:18px;
      --shadow:0 20px 60px rgba(0,0,0,.28);
      --glow:0 0 28px rgba(88,169,255,.2);
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      background:
        radial-gradient(circle at 82% 4%,rgba(91,81,184,.18),transparent 27rem),
        radial-gradient(circle at 68% 45%,rgba(56,150,186,.08),transparent 30rem),
        var(--bg);
      color:var(--text);
      font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
      font-size:15px;
      line-height:1.75;
    }
    a{color:inherit;text-decoration:none;transition:.22s ease}
    img{max-width:100%;display:block}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:3px solid rgba(142,232,244,.7);outline-offset:3px}
    .app-shell{min-height:100vh}
    .side-nav{
      position:fixed;z-index:20;inset:0 auto 0 0;width:246px;
      padding:28px 18px 22px;
      background:
        linear-gradient(180deg,rgba(11,28,47,.94),rgba(4,12,22,.98)),
        var(--sidebar);
      border-right:1px solid var(--line);
      box-shadow:12px 0 40px rgba(0,0,0,.18);
      display:flex;flex-direction:column;
    }
    .side-nav:after{
      content:"";position:absolute;top:8%;left:0;width:170px;height:220px;
      background:radial-gradient(circle,rgba(92,155,255,.15),transparent 68%);
      pointer-events:none;
    }
    .brand{position:relative;z-index:1;padding:4px 12px 34px}
    .brand-mark{
      display:inline-flex;width:38px;height:38px;border-radius:12px;
      align-items:center;justify-content:center;margin-bottom:14px;
      color:#07111f;font-weight:900;background:linear-gradient(135deg,var(--cyan),var(--violet));
      box-shadow:0 0 24px rgba(142,232,244,.25)
    }
    .brand-name{font-weight:800;letter-spacing:.02em;font-size:18px;line-height:1.35}
    .brand-note{display:block;color:var(--subtle);font-size:11px;margin-top:7px}
    .nav-label{padding:0 12px 9px;color:#5f788b;font-size:11px;letter-spacing:.14em}
    .nav-list{list-style:none;margin:0;padding:0;position:relative;z-index:1}
    .nav-list li{margin:4px 0}
    .nav-link{
      display:flex;align-items:center;gap:12px;padding:12px 12px;
      color:var(--muted);border-left:2px solid transparent;border-radius:0 12px 12px 0;
    }
    .nav-link:hover{color:var(--text);background:rgba(105,171,225,.08)}
    .nav-link.active{color:var(--cyan);border-left-color:var(--cyan);background:rgba(91,173,221,.1);box-shadow:inset 14px 0 28px rgba(76,180,222,.05)}
    .nav-icon{width:21px;text-align:center;color:var(--blue);font-size:16px}
    .nav-footer{margin-top:auto;position:relative;z-index:1;padding:18px 12px 0;border-top:1px solid var(--line);color:var(--subtle);font-size:12px}
    .nav-footer a{display:block;margin-top:8px;color:#8298a7}
    .nav-footer a:hover{color:var(--cyan)}
    .mobile-bar{display:none}
    .main-content{margin-left:246px;min-height:100vh}
    .container{max-width:1400px;margin:0 auto;padding:0 48px}
    .hero{padding:68px 0 42px}
    .hero-grid{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);gap:28px;align-items:stretch}
    .hero-copy{padding:20px 0 18px}
    .eyebrow,.section-kicker{
      color:var(--cyan);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase
    }
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(34px,4.6vw,62px);line-height:1.15;letter-spacing:-.045em;margin:18px 0 20px;max-width:760px}
    h2{font-size:30px;line-height:1.3;letter-spacing:-.025em;margin:10px 0 12px}
    h3{font-size:19px;line-height:1.4;margin:0 0 8px}
    .hero-copy p{color:#b2c2cc;font-size:17px;max-width:700px;margin-bottom:28px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:25px}
    .button{
      min-height:46px;padding:10px 19px;border-radius:11px;border:1px solid transparent;
      display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;
    }
    .button.primary{color:#06121d;background:linear-gradient(105deg,var(--cyan),#71bfff 55%,var(--violet));box-shadow:0 8px 25px rgba(88,169,255,.24)}
    .button.primary:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 12px 34px rgba(88,169,255,.36)}
    .button.primary:active{transform:translateY(0);filter:brightness(.96)}
    .button.secondary{border-color:var(--line-strong);color:#c7e3ee;background:rgba(20,50,76,.35)}
    .button.secondary:hover{background:rgba(74,151,203,.15);border-color:var(--cyan);transform:translateY(-2px)}
    .hero-meta{display:flex;flex-wrap:wrap;gap:18px;color:var(--subtle);font-size:12px}
    .hero-meta span:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--success);margin-right:7px;box-shadow:0 0 10px var(--success)}
    .hero-visual{
      position:relative;min-height:315px;overflow:hidden;border:1px solid var(--line-strong);border-radius:24px;
      background:
        linear-gradient(145deg,rgba(63,127,183,.25),rgba(75,39,100,.18) 55%,rgba(8,18,32,.7)),
        #0a182a;box-shadow:var(--shadow),var(--glow);padding:24px;
    }
    .hero-visual:before,.hero-visual:after{content:"";position:absolute;border-radius:50%;filter:blur(4px)}
    .hero-visual:before{width:230px;height:230px;right:-50px;top:-70px;background:rgba(100,92,224,.28)}
    .hero-visual:after{width:180px;height:180px;left:-70px;bottom:-80px;background:rgba(53,188,207,.18)}
    .visual-top{position:relative;z-index:1;display:flex;justify-content:space-between;color:#a9c4d3;font-size:12px}
    .visual-title{position:relative;z-index:1;font-size:22px;font-weight:800;margin:70px 0 24px}
    .visual-lines{position:relative;z-index:1;display:grid;gap:11px}
    .visual-line{height:9px;border-radius:20px;background:rgba(181,229,240,.12);overflow:hidden}
    .visual-line i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--cyan),var(--violet))}
    .visual-line:nth-child(1) i{width:82%}.visual-line:nth-child(2) i{width:63%}.visual-line:nth-child(3) i{width:74%}
    .visual-tags{position:relative;z-index:1;display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}
    .tag{display:inline-flex;align-items:center;padding:4px 9px;border:1px solid var(--line-strong);border-radius:99px;color:#acd5df;background:rgba(45,112,145,.14);font-size:12px}
    .section{padding:55px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}
    .section-head p{color:var(--muted);max-width:620px;margin:0;font-size:14px}
    .metric-board{display:grid;grid-template-columns:1.35fr repeat(4,1fr);gap:13px}
    .metric-card,.glass-card{background:var(--panel-soft);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--shadow)}
    .metric-card{border-radius:15px;padding:20px;min-height:132px}
    .metric-card:first-child{background:linear-gradient(135deg,rgba(37,103,143,.35),rgba(34,28,72,.4));border-color:var(--line-strong)}
    .metric-label{color:var(--subtle);font-size:12px;margin-bottom:12px}
    .metric-value{font-size:30px;line-height:1;font-weight:800;color:var(--cyan);margin-bottom:10px}
    .metric-card p{color:#a1b4c0;font-size:12px;margin:0}
    .matrix{display:grid;grid-template-columns:1.4fr .8fr .8fr;gap:15px}
    .matrix-card{position:relative;min-height:205px;padding:23px;border:1px solid var(--line);border-radius:18px;background:var(--panel);overflow:hidden;transition:.25s ease}
    .matrix-card:hover{transform:translateY(-3px);border-color:var(--line-strong);box-shadow:var(--glow)}
    .matrix-card.main-card{grid-row:span 2;min-height:425px;background:linear-gradient(145deg,rgba(27,78,108,.65),rgba(23,24,57,.83))}
    .matrix-card.main-card:after{content:"";position:absolute;right:-50px;bottom:-75px;width:250px;height:250px;border-radius:50%;background:radial-gradient(circle,rgba(194,107,158,.3),transparent 67%)}
    .matrix-card p{color:var(--muted);font-size:13px;margin:12px 0 22px;max-width:460px}
    .matrix-card .button{min-height:38px;padding:7px 13px;font-size:12px}
    .card-foot{position:absolute;bottom:20px;left:23px;right:23px;display:flex;justify-content:space-between;align-items:center;color:var(--subtle);font-size:12px}
    .status{color:var(--success)}.status:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:6px}
    .comparison-panel{border:1px solid var(--line);border-radius:18px;background:#0a1727;overflow:auto}
    .comparison-table{width:100%;border-collapse:collapse;min-width:720px}
    .comparison-table th,.comparison-table td{text-align:left;padding:17px 20px;border-bottom:1px solid var(--line);vertical-align:top}
    .comparison-table th{color:#8da9b9;font-size:12px;font-weight:700;background:rgba(101,160,204,.06)}
    .comparison-table td{color:#c4d3db;font-size:13px}
    .comparison-table tr:last-child td{border-bottom:0}
    .comparison-table td:first-child{color:var(--text);font-weight:700;width:22%}
    .check{color:var(--success);font-weight:700}.neutral{color:#aab8c1}
    .faq-panel{max-width:920px}
    .accordion{background:transparent;margin:0}
    .accordion-item{border:1px solid var(--line);border-radius:13px;margin-bottom:10px;background:#0a1727;overflow:hidden}
    .accordion-title{border:0!important;color:var(--text);font-size:15px;font-weight:700;padding:19px 50px 19px 20px;background:transparent}
    .accordion-title:hover{background:rgba(95,174,219,.07);color:var(--cyan)}
    .accordion-content{border:0!important;background:#0c1d30;color:var(--muted);padding:0 20px 19px;font-size:14px}
    .accordion-item.is-active .accordion-title{color:var(--cyan)}
    .conversion-form{display:grid;grid-template-columns:.82fr 1.18fr;gap:35px;padding:32px;border:1px solid var(--line-strong);border-radius:22px;background:linear-gradient(130deg,rgba(27,74,102,.48),rgba(38,25,64,.36));box-shadow:var(--shadow)}
    .conversion-form h2{margin-top:0}
    .conversion-form .intro{color:var(--muted);font-size:14px}
    .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
    .field.full{grid-column:1/-1}
    label{display:block;color:#bed4df;font-size:13px;font-weight:700;margin-bottom:7px}
    input,select,textarea{width:100%;border:1px solid var(--line);border-radius:11px;background:#071524;color:var(--text);padding:11px 13px;min-height:44px;transition:.2s}
    textarea{min-height:100px;resize:vertical}
    input::placeholder,textarea::placeholder{color:#60798a}
    input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(142,232,244,.1);outline:0}
    .form-note{color:var(--subtle);font-size:11px;margin:12px 0 0}
    .assurance{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
    .assurance-item{padding:20px;border-left:2px solid var(--blue);background:rgba(14,32,51,.7);border-radius:0 13px 13px 0}
    .assurance-item strong{display:block;font-size:15px;margin-bottom:6px;color:#d8e9ef}
    .assurance-item span{display:block;color:var(--muted);font-size:12px}
    footer{margin-top:40px;padding:38px 0 24px;border-top:1px solid var(--line);background:rgba(3,10,18,.42)}
    .footer-grid{display:flex;justify-content:space-between;gap:30px;align-items:start}
    .footer-brand{font-weight:800;font-size:17px}
    .footer-brand small{display:block;color:var(--subtle);font-size:11px;font-weight:400;margin-top:8px}
    .footer-links{display:flex;flex-wrap:wrap;gap:18px;color:#91a8b8;font-size:13px}
    .footer-links a:hover{color:var(--cyan)}
    .copyright{border-top:1px solid var(--line);margin-top:28px;padding-top:18px;color:#627b8b;font-size:11px;display:flex;justify-content:space-between;gap:15px}
    .age-notice{padding:10px 14px;border:1px solid rgba(194,107,158,.35);border-radius:10px;color:#c9a1b9;background:rgba(108,42,82,.12);font-size:12px}
    @media(max-width:1199px){
      .container{padding:0 32px}.metric-board{grid-template-columns:repeat(3,1fr)}.metric-card:first-child{grid-column:span 3}
      .hero-grid{grid-template-columns:1fr  .75fr}.side-nav{width:220px}.main-content{margin-left:220px}
    }
    @media(max-width:767px){
      body{font-size:14px}.side-nav{display:none}.main-content{margin-left:0;padding-top:67px}
      .mobile-bar{display:flex;position:fixed;z-index:30;top:0;left:0;right:0;height:67px;padding:0 17px;align-items:center;justify-content:space-between;background:rgba(5,15,27,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
      .mobile-brand{font-weight:800;font-size:15px}.menu-button{width:42px;height:42px;border:1px solid var(--line-strong);border-radius:10px;background:rgba(72,145,194,.12);color:var(--cyan);font-size:20px}
      .container{padding:0 18px}.hero{padding:38px 0 25px}.hero-grid{display:block}.hero-copy{padding:0}
      h1{font-size:34px}.hero-copy p{font-size:15px}.hero-visual{margin-top:26px;min-height:270px}.section{padding:39px 0}.section-head{display:block}.section-head p{margin-top:10px}
      .metric-board{grid-template-columns:1fr 1fr}.metric-card:first-child{grid-column:span 2}.metric-card{min-height:120px;padding:16px}.metric-value{font-size:26px}
      .matrix{display:block}.matrix-card,.matrix-card.main-card{min-height:220px;margin-bottom:13px}.card-foot{bottom:17px;left:18px;right:18px}
      .conversion-form{display:block;padding:22px}.form-grid{display:block}.field{margin-bottom:14px}.assurance{display:block}.assurance-item{margin-bottom:10px}
      .footer-grid{display:block}.footer-links{margin-top:20px;gap:13px}.copyright{display:block}.copyright span{display:block;margin-top:7px}
    }
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* roulang page: category1 */
:root{
      --bg:#07111f;--bg-deep:#040b15;--sidebar:#06101d;--panel:#0c1b2d;
      --panel-soft:rgba(16,35,57,.72);--panel-solid:#0d2034;
      --line:rgba(142,190,227,.16);--line-strong:rgba(108,210,239,.42);
      --text:#edf6fb;--muted:#91a8b8;--subtle:#6f8798;--cyan:#8ee8f4;
      --blue:#58a9ff;--violet:#9b83ff;--berry:#c26b9e;--success:#7bd8b0;
      --danger:#e99aab;--radius:18px;--shadow:0 20px 60px rgba(0,0,0,.28);
      --glow:0 0 28px rgba(88,169,255,.2)
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{margin:0;background:radial-gradient(circle at 82% 4%,rgba(91,81,184,.18),transparent 27rem),radial-gradient(circle at 68% 45%,rgba(56,150,186,.08),transparent 30rem),var(--bg);color:var(--text);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:15px;line-height:1.75}
    a{color:inherit;text-decoration:none;transition:.22s ease}
    img{max-width:100%;display:block}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:3px solid rgba(142,232,244,.65);outline-offset:3px}
    .side-nav{position:fixed;z-index:20;inset:0 auto 0 0;width:246px;padding:28px 18px 22px;background:linear-gradient(180deg,rgba(11,28,47,.94),rgba(4,12,22,.98)),var(--sidebar);border-right:1px solid var(--line);box-shadow:12px 0 40px rgba(0,0,0,.18);display:flex;flex-direction:column}
    .side-nav:after{content:"";position:absolute;top:8%;left:0;width:170px;height:220px;background:radial-gradient(circle,rgba(92,155,255,.15),transparent 68%);pointer-events:none}
    .brand{position:relative;z-index:1;padding:4px 12px 34px}
    .brand-mark{display:inline-flex;width:38px;height:38px;border-radius:12px;align-items:center;justify-content:center;margin-bottom:14px;color:#07111f;font-weight:900;background:linear-gradient(135deg,var(--cyan),var(--violet));box-shadow:0 0 24px rgba(142,232,244,.25)}
    .brand-name{font-weight:800;letter-spacing:.02em;font-size:18px;line-height:1.35}
    .brand-note{display:block;color:var(--subtle);font-size:11px;margin-top:7px}
    .nav-label{padding:0 12px 9px;color:#5f788b;font-size:11px;letter-spacing:.14em}
    .nav-list{list-style:none;margin:0;padding:0;position:relative;z-index:1}
    .nav-list li{margin:4px 0}
    .nav-link{display:flex;align-items:center;gap:12px;padding:12px;color:var(--muted);border-left:2px solid transparent;border-radius:0 12px 12px 0}
    .nav-link:hover{color:var(--text);background:rgba(105,171,225,.08)}
    .nav-link.active{color:var(--cyan);border-left-color:var(--cyan);background:rgba(91,173,221,.1);box-shadow:inset 14px 0 28px rgba(76,180,222,.05)}
    .nav-icon{width:21px;text-align:center;color:var(--blue);font-size:16px}
    .nav-footer{margin-top:auto;position:relative;z-index:1;padding:18px 12px 0;border-top:1px solid var(--line);color:var(--subtle);font-size:12px}
    .nav-footer a{display:block;margin-top:8px;color:#8298a7}
    .nav-footer a:hover{color:var(--cyan)}
    .mobile-bar{display:none}
    .main-content{margin-left:246px;min-height:100vh}
    .container{max-width:1400px;margin:0 auto;padding:0 48px}
    .page-top{padding:46px 0 22px;border-bottom:1px solid var(--line)}
    .breadcrumbs{display:flex;gap:9px;align-items:center;color:var(--subtle);font-size:12px;margin-bottom:24px}
    .breadcrumbs a:hover{color:var(--cyan)}
    .page-heading{display:flex;justify-content:space-between;align-items:end;gap:30px}
    .eyebrow,.section-kicker{color:var(--cyan);font-size:12px;font-weight:700;letter-spacing:.16em}
    h1,h2,h3{margin-top:0;line-height:1.3}
    h1{font-size:clamp(30px,4vw,48px);margin-bottom:14px;letter-spacing:-.03em}
    h2{font-size:28px;margin-bottom:10px}
    h3{font-size:19px;margin-bottom:8px}
    .intro{max-width:700px;color:#b3c4ce;margin:0}
    .category-badge{display:inline-flex;padding:7px 12px;border:1px solid rgba(194,107,158,.42);border-radius:99px;color:#e4b0cb;background:rgba(194,107,158,.1);font-size:12px;white-space:nowrap}
    .filter-bar{margin:28px 0 10px;padding:15px;display:flex;gap:12px;flex-wrap:wrap;background:var(--panel-soft);border:1px solid var(--line);border-radius:15px;backdrop-filter:blur(12px)}
    .filter-bar label{color:var(--subtle);font-size:12px;display:flex;align-items:center;gap:9px}
    select,.search-input{min-height:42px;padding:8px 12px;color:var(--text);background:#091827;border:1px solid var(--line-strong);border-radius:10px}
    .search-input{min-width:220px}
    .section{padding:45px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:23px}
    .section-head p{color:var(--muted);max-width:620px;margin:0;font-size:14px}
    .content-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
    .content-list{display:grid;gap:16px}
    .feature-card,.content-row,.side-card,.faq-item,.feedback-box{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
    .feature-card{padding:24px;display:grid;grid-template-columns:230px 1fr;gap:24px;background:linear-gradient(135deg,rgba(38,83,123,.42),rgba(12,27,45,.94))}
    .cover{min-height:175px;border-radius:14px;background:linear-gradient(135deg,rgba(88,169,255,.48),rgba(155,131,255,.2) 48%,rgba(194,107,158,.35)),repeating-linear-gradient(135deg,rgba(255,255,255,.07) 0 2px,transparent 2px 12px);position:relative;overflow:hidden}
    .cover:after{content:"合规预览";position:absolute;left:15px;bottom:13px;color:#d6eff4;font-size:12px;padding:4px 8px;border:1px solid rgba(255,255,255,.25);border-radius:6px;background:rgba(4,12,22,.42)}
    .tag{display:inline-flex;align-items:center;padding:4px 9px;border:1px solid var(--line-strong);border-radius:99px;color:#acd5df;background:rgba(45,112,145,.14);font-size:12px}
    .card-meta{display:flex;gap:12px;flex-wrap:wrap;color:var(--subtle);font-size:12px;margin:12px 0}
    .card-text{color:var(--muted);font-size:14px;margin:0 0 18px}
    .button{min-height:44px;padding:9px 17px;border-radius:10px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
    .button.primary{color:#06121d;background:linear-gradient(105deg,var(--cyan),#71bfff 55%,var(--violet));box-shadow:0 8px 25px rgba(88,169,255,.24)}
    .button.primary:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 12px 34px rgba(88,169,255,.36)}
    .button.secondary{border-color:var(--line-strong);color:#c7e3ee;background:rgba(20,50,76,.35)}
    .button.secondary:hover{background:rgba(74,151,203,.15);border-color:var(--cyan);transform:translateY(-2px)}
    .content-row{padding:19px;display:grid;grid-template-columns:150px 1fr auto;gap:18px;align-items:center}
    .content-row .cover{min-height:108px}
    .content-row h3{margin-bottom:3px}
    .side-card{padding:21px;background:rgba(10,25,42,.86)}
    .side-card + .side-card{margin-top:16px}
    .side-card p{color:var(--muted);font-size:13px;margin:0}
    .status-list{list-style:none;margin:14px 0 0;padding:0}
    .status-list li{padding:11px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:13px}
    .status-list li:last-child{border-bottom:0}
    .status{color:var(--success);white-space:nowrap}
    .notice{padding:16px 19px;border-left:3px solid var(--cyan);background:rgba(53,145,173,.1);color:#b5d1da;border-radius:0 12px 12px 0;font-size:13px}
    .faq-list{display:grid;gap:10px;max-width:900px}
    .faq-item{overflow:hidden}
    .faq-question{width:100%;padding:18px 20px;background:none;border:0;color:var(--text);display:flex;justify-content:space-between;text-align:left;font-weight:700}
    .faq-question span:last-child{color:var(--cyan);font-size:21px;line-height:1}
    .faq-answer{display:none;padding:0 20px 18px;color:var(--muted);font-size:14px}
    .faq-item.open .faq-answer{display:block}
    .feedback-box{padding:28px;display:grid;grid-template-columns:.9fr 1.1fr;gap:35px;background:linear-gradient(120deg,rgba(35,74,107,.4),rgba(13,27,46,.9))}
    .feedback-box p{color:var(--muted);margin:0}
    .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .form-field.full{grid-column:1/-1}
    .form-field label{display:block;color:#c2d6df;font-size:13px;margin-bottom:6px}
    textarea{width:100%;min-height:100px;resize:vertical;padding:10px 12px;color:var(--text);background:#091827;border:1px solid var(--line-strong);border-radius:10px}
    .form-note{color:var(--subtle);font-size:12px;margin:10px 0 0}
    footer{padding:34px 0 24px;border-top:1px solid var(--line);background:rgba(4,11,21,.45)}
    .footer-grid{display:flex;justify-content:space-between;gap:30px;align-items:start}
    .footer-brand{font-weight:800;font-size:18px}.footer-brand small{display:block;color:var(--subtle);font-size:11px;font-weight:400;margin-top:6px}
    .footer-links{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:13px}.footer-links a:hover{color:var(--cyan)}
    .copyright{display:flex;justify-content:space-between;gap:20px;color:var(--subtle);font-size:11px;margin-top:28px;padding-top:17px;border-top:1px solid var(--line)}
    @media(max-width:1000px){.side-nav{width:210px}.main-content{margin-left:210px}.container{padding:0 28px}.content-layout{grid-template-columns:1fr}.side-panel{display:grid;grid-template-columns:1fr 1fr;gap:16px}.side-card+ .side-card{margin-top:0}}
    @media(max-width:767px){.side-nav{display:none}.mobile-bar{display:flex;position:sticky;top:0;z-index:30;padding:13px 18px;align-items:center;justify-content:space-between;background:rgba(5,15,27,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.mobile-brand{font-weight:800;font-size:16px}.menu-button{border:1px solid var(--line-strong);background:rgba(20,50,76,.45);color:var(--cyan);border-radius:9px;padding:7px 11px}.main-content{margin-left:0}.container{padding:0 18px}.page-top{padding:30px 0 17px}.page-heading{display:block}.category-badge{margin-top:18px}.filter-bar{display:grid}.search-input{width:100%;min-width:0}.content-layout{display:block}.side-panel{display:block;margin-top:18px}.side-card+ .side-card{margin-top:16px}.feature-card{grid-template-columns:1fr;padding:18px}.feature-card .cover{min-height:145px}.content-row{grid-template-columns:92px 1fr;padding:14px;gap:13px}.content-row .cover{min-height:88px}.content-row .button{grid-column:2;justify-self:start}.section{padding:34px 0}.section-head{display:block}.section-head p{margin-top:8px}.feedback-box{grid-template-columns:1fr;padding:21px;gap:22px}.form-grid{grid-template-columns:1fr}.form-field.full{grid-column:auto}.footer-grid,.copyright{display:block}.footer-links{margin-top:20px}.copyright span{display:block;margin-top:8px}}
    @media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* roulang page: category2 */
:root{
 --bg:#07111f;--bg-deep:#040b15;--sidebar:#06101d;--panel:#0c1b2d;
 --panel-soft:rgba(16,35,57,.72);--panel-solid:#0d2034;
 --line:rgba(142,190,227,.16);--line-strong:rgba(108,210,239,.42);
 --text:#edf6fb;--muted:#91a8b8;--subtle:#6f8798;--cyan:#8ee8f4;
 --blue:#58a9ff;--violet:#9b83ff;--berry:#c26b9e;--success:#7bd8b0;
 --radius:18px;--shadow:0 20px 60px rgba(0,0,0,.28);--glow:0 0 28px rgba(88,169,255,.2)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 82% 4%,rgba(91,81,184,.18),transparent 27rem),radial-gradient(circle at 68% 45%,rgba(56,150,186,.08),transparent 30rem),var(--bg);color:var(--text);font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-size:15px;line-height:1.75}
a{color:inherit;text-decoration:none;transition:.22s ease}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(32px,4.5vw,52px);line-height:1.2;letter-spacing:-.04em}
h2{font-size:clamp(24px,3vw,32px);line-height:1.3}
h3{font-size:19px;line-height:1.4}
.side-nav{position:fixed;z-index:20;inset:0 auto 0 0;width:246px;padding:28px 18px 22px;background:linear-gradient(180deg,rgba(11,28,47,.94),rgba(4,12,22,.98)),var(--sidebar);border-right:1px solid var(--line);box-shadow:12px 0 40px rgba(0,0,0,.18);display:flex;flex-direction:column}
.side-nav:after{content:"";position:absolute;top:8%;left:0;width:170px;height:220px;background:radial-gradient(circle,rgba(92,155,255,.15),transparent 68%);pointer-events:none}
.brand{position:relative;z-index:1;padding:4px 12px 34px}
.brand-mark{display:inline-flex;width:38px;height:38px;border-radius:12px;align-items:center;justify-content:center;margin-bottom:14px;color:#07111f;font-weight:900;background:linear-gradient(135deg,var(--cyan),var(--violet));box-shadow:0 0 24px rgba(142,232,244,.25)}
.brand-name{font-weight:800;letter-spacing:.02em;font-size:18px;line-height:1.35}
.brand-note{display:block;color:var(--subtle);font-size:11px;margin-top:7px}
.nav-label{padding:0 12px 9px;color:#5f788b;font-size:11px;letter-spacing:.14em}
.nav-list{list-style:none;margin:0;padding:0;position:relative;z-index:1}
.nav-list li{margin:4px 0}
.nav-link{display:flex;align-items:center;gap:12px;padding:12px;color:var(--muted);border-left:2px solid transparent;border-radius:0 12px 12px 0}
.nav-link:hover{color:var(--text);background:rgba(105,171,225,.08)}
.nav-link.active{color:var(--cyan);border-left-color:var(--cyan);background:rgba(91,173,221,.1);box-shadow:inset 14px 0 28px rgba(76,180,222,.05)}
.nav-icon{width:21px;text-align:center;color:var(--blue);font-size:16px}
.nav-footer{margin-top:auto;position:relative;z-index:1;padding:18px 12px 0;border-top:1px solid var(--line);color:var(--subtle);font-size:12px}
.nav-footer a{display:block;margin-top:8px;color:#8298a7}.nav-footer a:hover{color:var(--cyan)}
.mobile-bar{display:none}
.main-content{margin-left:246px;min-height:100vh}
.container{max-width:1400px;margin:0 auto;padding:0 48px}
.page-top{padding:42px 0 30px;border-bottom:1px solid var(--line)}
.breadcrumb{color:var(--subtle);font-size:13px;margin-bottom:22px}.breadcrumb a:hover{color:var(--cyan)}
.page-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:28px}
.page-heading p{max-width:670px;color:var(--muted);margin-bottom:0}
.kicker,.section-kicker{color:var(--cyan);font-size:12px;font-weight:700;letter-spacing:.16em}
.compact-hero{padding:30px 0 44px}
.summary-panel{display:grid;grid-template-columns:1.4fr .6fr;gap:20px}
.glass-card{background:var(--panel-soft);border:1px solid var(--line);backdrop-filter:blur(14px);box-shadow:var(--shadow);border-radius:var(--radius)}
.intro-card{padding:28px;position:relative;overflow:hidden}
.intro-card:after{content:"";position:absolute;width:220px;height:220px;right:-90px;top:-100px;background:radial-gradient(circle,rgba(155,131,255,.28),transparent 68%)}
.intro-card>*{position:relative;z-index:1}
.intro-card p{color:#b4c5cf;max-width:720px}
.age-note{display:flex;gap:10px;align-items:flex-start;color:#b8d0d9;font-size:13px;padding-top:8px}
.age-note strong{color:var(--cyan)}
.stats-card{padding:23px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(140deg,rgba(38,92,139,.32),rgba(51,28,73,.34))}
.stat-label{color:var(--muted);font-size:12px}.stat-value{font-size:38px;font-weight:800;color:var(--cyan);line-height:1.2;margin:4px 0}.stat-help{font-size:12px;color:var(--subtle)}
.filter-bar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:22px 0}
.filter-bar label{color:var(--subtle);font-size:12px}
.select-wrap{position:relative}.filter-select,.search-input{height:44px;border-radius:11px;border:1px solid var(--line-strong);background:#0a192b;color:var(--text);padding:0 14px;min-width:160px;outline:none}
.filter-select:focus,.search-input:focus,.form-control:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(142,232,244,.12)}
.search-input{min-width:240px}.search-input::placeholder,.form-control::placeholder{color:#6f8798}
.button{min-height:44px;padding:9px 18px;border-radius:11px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
.button.primary{color:#06121d;background:linear-gradient(105deg,var(--cyan),#71bfff 55%,var(--violet));box-shadow:0 8px 25px rgba(88,169,255,.24)}
.button.primary:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 12px 34px rgba(88,169,255,.36)}
.button.primary:active{transform:translateY(0)}
.button.secondary{border-color:var(--line-strong);color:#c7e3ee;background:rgba(20,50,76,.35)}
.button.secondary:hover{background:rgba(74,151,203,.15);border-color:var(--cyan);transform:translateY(-2px)}
.content-area{padding:12px 0 62px}.content-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:20px}.section-head p{color:var(--muted);max-width:560px;margin:0;font-size:14px}
.update-list{display:flex;flex-direction:column;gap:14px}
.update-item{display:grid;grid-template-columns:168px 1fr auto;gap:20px;align-items:center;padding:16px;border:1px solid var(--line);background:#0b1a2b;border-radius:16px;transition:.25s ease}
.update-item:hover{border-color:var(--line-strong);transform:translateY(-3px);box-shadow:var(--glow)}
.thumb{height:108px;border-radius:12px;overflow:hidden;position:relative;background:linear-gradient(135deg,#173e5c,#32244d 58%,#1a172d)}
.thumb:before{content:"";position:absolute;inset:18px 25px;background:linear-gradient(135deg,rgba(142,232,244,.45),rgba(194,107,158,.16));filter:blur(14px);border-radius:50%}
.thumb:after{content:"访问提示";position:absolute;left:12px;bottom:10px;color:#d5eef1;font-size:11px;letter-spacing:.08em}
.tag{display:inline-flex;align-items:center;padding:3px 9px;border:1px solid var(--line-strong);border-radius:99px;color:#acd5df;background:rgba(45,112,145,.14);font-size:12px}
.update-item h3{margin:8px 0 5px;font-size:18px}.update-item p{color:var(--muted);font-size:13px;margin:0}.time{color:var(--subtle);font-size:12px;white-space:nowrap}
.side-panel{padding:22px;height:max-content}.side-panel h3{margin-bottom:15px}.side-panel p{color:var(--muted);font-size:13px}
.side-list{list-style:none;margin:0;padding:0}.side-list li{padding:13px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px;font-size:13px;color:#b8cad3}.side-list li:last-child{border-bottom:0}.side-list span{color:var(--cyan)}
.empty-state{margin-top:18px;padding:18px;border:1px dashed var(--line-strong);border-radius:14px;color:var(--subtle);font-size:13px;text-align:center}
.faq-section{padding:38px 0 62px;border-top:1px solid var(--line)}
.accordion{background:transparent;margin:0;border:0}.accordion-item{border:1px solid var(--line);background:#0b192a;margin-bottom:10px;border-radius:13px;overflow:hidden}.accordion-title{color:var(--text);font-weight:700;border:0;background:transparent;padding:17px 20px;font-size:15px}.accordion-title:hover{background:rgba(88,169,255,.08);color:var(--cyan)}.accordion-content{border:0;background:#0a1727;color:var(--muted);padding:0 20px 18px;font-size:14px}.accordion-item.is-active .accordion-title{color:var(--cyan)}
.cta-section{padding:0 0 70px}.cta-panel{padding:30px;display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;background:linear-gradient(120deg,rgba(28,77,116,.55),rgba(54,31,78,.55));border:1px solid var(--line-strong);border-radius:20px;box-shadow:var(--shadow)}
.cta-panel p{color:#b7c9d1;margin-bottom:0}.feedback-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-control{width:100%;height:44px;border-radius:10px;border:1px solid var(--line);background:#081525;color:var(--text);padding:0 13px;outline:none}.feedback-form textarea{height:82px;padding-top:10px;resize:vertical;grid-column:1/-1}.feedback-form .button{grid-column:1/-1;width:max-content}.form-tip{font-size:11px;color:var(--subtle);grid-column:1/-1}
footer{background:#050d18;border-top:1px solid var(--line);padding:34px 0 22px}.footer-grid{display:flex;justify-content:space-between;gap:30px;align-items:flex-start}.footer-brand{font-weight:800;font-size:17px}.footer-brand small{display:block;color:var(--subtle);font-size:11px;font-weight:400;margin-top:5px}.footer-links{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:13px}.footer-links a:hover{color:var(--cyan)}.copyright{display:flex;justify-content:space-between;gap:20px;color:#62798a;font-size:11px;border-top:1px solid var(--line);margin-top:25px;padding-top:17px}
:focus-visible{outline:3px solid rgba(142,232,244,.55);outline-offset:3px}
@media(max-width:1050px){.container{padding:0 30px}.content-layout{grid-template-columns:1fr}.side-panel{order:-1}.summary-panel{grid-template-columns:1fr}.update-item{grid-template-columns:140px 1fr auto}}
@media(max-width:767px){.side-nav{display:none}.mobile-bar{display:flex;position:sticky;top:0;z-index:30;min-height:66px;padding:12px 18px;align-items:center;justify-content:space-between;background:rgba(5,15,27,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.mobile-brand{font-weight:800;color:var(--text)}.menu-button{background:transparent;border:1px solid var(--line-strong);color:var(--cyan);border-radius:9px;padding:7px 12px}.main-content{margin-left:0}.container{padding:0 18px}.page-top{padding:28px 0 24px}.page-heading{display:block}.page-heading p{margin-top:15px}.compact-hero{padding:22px 0 30px}.intro-card,.stats-card{padding:20px}.filter-bar{align-items:stretch}.filter-select,.search-input{width:100%;min-width:0}.filter-bar .button{width:100%}.update-item{grid-template-columns:1fr;gap:12px}.thumb{height:145px}.update-item .button{width:100%}.time{display:block;margin-top:5px}.feedback-form,.cta-panel{grid-template-columns:1fr}.feedback-form .button{width:100%}.footer-grid,.copyright{display:block}.footer-links{margin-top:20px;gap:12px 16px}.copyright span{display:block;margin-top:8px}h1{font-size:32px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

.mobile-menu{display:none}
@media(max-width:767px){
.mobile-menu.open{display:flex;position:fixed;z-index:25;top:66px;left:0;right:0;background:#071525;border-bottom:1px solid var(--line-strong);padding:12px 18px;flex-direction:column;box-shadow:var(--shadow)}
.mobile-menu a{padding:12px 4px;color:var(--muted);border-bottom:1px solid var(--line)}
.mobile-menu a:hover{color:var(--cyan)}
}
