/* roulang page: index */
:root{
      --ink:#100d15;
      --panel:#19131f;
      --panel-2:#211a29;
      --paper:#f5eee8;
      --cream:#fff9f4;
      --muted:#aaa0b1;
      --muted-2:#756c7b;
      --line:rgba(255,255,255,.12);
      --coral:#ff795f;
      --rose:#dd5479;
      --amber:#e9ad65;
      --violet:#a978d4;
      --shadow:0 18px 50px rgba(0,0,0,.28);
      --radius:16px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--cream);
      background:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
      line-height:1.75;
      padding-bottom:78px;
    }
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input{font:inherit}
    button{cursor:pointer}
    .container{width:min(1180px,calc(100% - 40px));margin:0 auto}
    .site-header{
      position:sticky;top:0;z-index:30;
      background:rgba(16,13,21,.96);
      border-bottom:1px solid var(--line);
      box-shadow:0 8px 24px rgba(0,0,0,.16);
      backdrop-filter:blur(14px);
    }
    .nav-wrap{height:74px;display:flex;align-items:center;gap:28px}
    .brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:-.03em;white-space:nowrap}
    .brand-mark{
      width:33px;height:33px;border:1px solid var(--coral);border-radius:9px;
      display:grid;place-items:center;color:var(--coral);font-size:17px;
      box-shadow:0 0 18px rgba(255,121,95,.2);
    }
    .brand-name{font-size:16px}
    .nav-links{display:flex;align-items:center;gap:7px;margin-left:auto}
    .nav-link{
      position:relative;padding:10px 15px;color:var(--muted);font-size:14px;
      transition:.2s ease;border-radius:8px
    }
    .nav-link:hover,.nav-link:focus-visible{color:var(--cream);background:rgba(255,255,255,.06)}
    .nav-link.active{color:var(--cream)}
    .nav-link.active:after{
      content:"";position:absolute;left:15px;right:15px;bottom:1px;height:2px;
      background:var(--coral);box-shadow:0 0 10px var(--coral)
    }
    .nav-cta,.btn-primary{
      display:inline-flex;align-items:center;justify-content:center;gap:8px;
      min-height:44px;padding:0 19px;border-radius:9px;border:1px solid transparent;
      background:var(--coral);color:#210f12;font-weight:800;font-size:14px;
      transition:transform .2s,background .2s,box-shadow .2s
    }
    .nav-cta:hover,.btn-primary:hover{background:#ff947d;transform:translateY(-2px);box-shadow:0 10px 24px rgba(255,121,95,.2)}
    .menu-btn{display:none;background:none;border:1px solid var(--line);color:var(--cream);width:43px;height:43px;border-radius:8px}
    .hero{
      position:relative;overflow:hidden;min-height:610px;display:flex;align-items:center;
      background:
        radial-gradient(circle at 82% 22%,rgba(221,84,121,.18),transparent 29%),
        radial-gradient(circle at 14% 80%,rgba(169,120,212,.12),transparent 25%),
        #17111d;
      border-bottom:1px solid var(--line)
    }
    .hero:before{
      content:"";position:absolute;inset:0;opacity:.19;
      background-image:radial-gradient(rgba(255,255,255,.24) .7px,transparent .7px);
      background-size:8px 8px;pointer-events:none
    }
    .hero-inner{position:relative;z-index:1;padding:82px 0 70px}
    .hero-copy{max-width:720px}
    .eyebrow,.section-kicker{
      display:inline-flex;align-items:center;gap:9px;color:var(--amber);font-size:12px;
      letter-spacing:.16em;font-weight:800
    }
    .eyebrow:before,.section-kicker:before{content:"";width:27px;height:1px;background:var(--amber)}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(40px,6vw,78px);line-height:1.14;letter-spacing:-.065em;margin:20px 0 24px;font-weight:850}
    .hero-lead{max-width:650px;color:#c9bfca;font-size:18px;line-height:1.9;margin-bottom:31px}
    .hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:55px}
    .btn-secondary{
      display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 19px;
      border:1px solid rgba(255,255,255,.22);border-radius:9px;color:var(--cream);font-weight:700;
      transition:.2s
    }
    .btn-secondary:hover,.btn-secondary:focus-visible{border-color:var(--coral);background:rgba(255,121,95,.09);transform:translateY(-2px)}
    .hero-meta{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--line);padding-top:22px}
    .meta-item{padding-right:35px;margin-right:35px;border-right:1px solid var(--line)}
    .meta-item:last-child{border:0}
    .meta-value{display:block;font-size:15px;color:var(--cream);font-weight:800}
    .meta-label{display:block;font-size:12px;color:var(--muted-2)}
    .hero-art{
      position:absolute;right:-5%;bottom:-35px;width:43%;height:490px;
      transform:rotate(4deg);opacity:.92
    }
    .poster{position:absolute;width:190px;height:315px;border:1px solid rgba(255,255,255,.2);box-shadow:var(--shadow);border-radius:12px;overflow:hidden}
    .poster:after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 20%,rgba(8,5,12,.9))}
    .poster span{position:absolute;z-index:2;left:19px;bottom:19px;font-weight:800;font-size:18px;line-height:1.35}
    .poster-a{left:10%;top:70px;background:linear-gradient(145deg,#3f2737 4%,#cc6b64 52%,#252033 53%,#17121c)}
    .poster-b{left:36%;top:18px;background:linear-gradient(145deg,#382852,#b45e86 42%,#17152a 43%,#d69a72)}
    .poster-c{left:64%;top:100px;background:linear-gradient(145deg,#1e2937,#84637c 43%,#e0a76f 44%,#2a1728)}
    section{padding:105px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:38px}
    .section-head h2{font-size:clamp(28px,3.5vw,43px);line-height:1.25;letter-spacing:-.04em;margin:13px 0 0}
    .section-desc{max-width:580px;color:var(--muted);font-size:15px;line-height:1.9;margin:12px 0 0}
    .index-band{background:var(--paper);color:var(--ink)}
    .index-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:0;border-top:1px solid rgba(16,13,21,.18);border-bottom:1px solid rgba(16,13,21,.18)}
    .index-item{padding:29px 30px 32px;border-right:1px solid rgba(16,13,21,.18)}
    .index-item:last-child{border:0}
    .index-num{color:var(--rose);font-size:12px;letter-spacing:.12em;font-weight:900}
    .index-item h3{font-size:22px;letter-spacing:-.03em;margin:17px 0 9px}
    .index-item p{color:#635967;font-size:14px;line-height:1.8;margin-bottom:18px}
    .tag{display:inline-flex;align-items:center;min-height:26px;padding:0 9px;border:1px solid currentColor;border-radius:5px;font-size:11px;line-height:1;color:inherit;margin:3px 4px 3px 0}
    .tag.coral{color:var(--rose)}.tag.dark{color:#736677}.tag.amber{color:#b2753c}
    .scene{background:#211a29}
    .filter-box{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:14px;border:1px solid var(--line);background:#17121d;border-radius:12px;margin-bottom:26px}
    .filter-label{font-size:12px;color:var(--muted-2);margin-right:3px}
    .filter-btn{min-height:35px;padding:0 13px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:6px;font-size:13px;transition:.2s}
    .filter-btn:hover,.filter-btn:focus-visible,.filter-btn.selected{color:var(--cream);border-color:var(--coral);background:rgba(255,121,95,.12)}
    .scene-layout{display:grid;grid-template-columns:1.3fr .7fr;gap:24px}
    .feature-card{min-height:365px;border-radius:var(--radius);padding:30px;display:flex;align-items:end;position:relative;overflow:hidden;background:linear-gradient(145deg,#4c2b3b,#9c5a63 48%,#221927 49%,#17111d)}
    .feature-card:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,7,14,.9),transparent 65%)}
    .feature-content{position:relative;z-index:1;max-width:520px}
    .feature-content h3{font-size:31px;line-height:1.3;margin:11px 0}
    .feature-content p{color:#d0c5ce;font-size:14px;margin:0}
    .content-list{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#17121d}
    .list-row{display:flex;gap:17px;padding:21px 20px;border-bottom:1px solid var(--line);transition:.2s}
    .list-row:last-child{border:0}.list-row:hover{background:rgba(255,255,255,.045);padding-left:25px}
    .list-index{color:var(--coral);font-weight:900;font-size:13px;padding-top:3px}
    .list-row h4{font-size:16px;margin:0 0 4px;line-height:1.45}.list-row p{color:var(--muted);font-size:12px;line-height:1.6;margin:0}
    .dark-section{background:#120e17}
    .rank-layout{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:start}
    .rank-list{border-top:1px solid var(--line)}
    .rank-item{display:grid;grid-template-columns:40px 1fr auto;gap:15px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
    .rank-no{font-size:20px;font-weight:900;color:var(--amber)}.rank-title{font-weight:750}.rank-sub{font-size:12px;color:var(--muted)}
    .trend{color:#e58b87;font-size:12px;white-space:nowrap}
    .quote{border-left:3px solid var(--coral);padding:11px 0 11px 23px;color:#d8ccd8;font-size:19px;line-height:1.8;margin:22px 0 30px}
    .quote-note{color:var(--muted-2);font-size:13px}
    .category-strip{background:var(--paper);color:var(--ink)}
    .category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
    .category-card{min-height:150px;padding:22px;border:1px solid rgba(16,13,21,.17);border-radius:11px;position:relative;transition:.2s}
    .category-card:hover{background:#fffaf5;transform:translateY(-4px);box-shadow:0 12px 24px rgba(28,16,28,.09)}
    .category-card h3{font-size:19px;margin:26px 0 5px}.category-card p{font-size:12px;color:#756978;margin:0}
    .arrow{position:absolute;right:18px;top:17px;color:var(--rose);font-size:18px}
    .editorial{background:#1b1422}
    .editorial-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:50px}
    .article-list{border-top:1px solid var(--line)}
    .article-row{display:flex;justify-content:space-between;gap:18px;padding:19px 0;border-bottom:1px solid var(--line)}
    .article-row h3{font-size:16px;margin:0 0 4px}.article-row p{color:var(--muted);font-size:13px;margin:0;line-height:1.6}.article-date{font-size:12px;color:var(--muted-2);white-space:nowrap}
    .faq-section{background:var(--paper);color:var(--ink)}
    .faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}
    .faq-list{border-top:1px solid rgba(16,13,21,.2)}
    details{border-bottom:1px solid rgba(16,13,21,.2);padding:20px 0}
    summary{cursor:pointer;font-weight:800;list-style:none;padding-right:25px;position:relative}
    summary::-webkit-details-marker{display:none}summary:after{content:"＋";position:absolute;right:0;color:var(--rose)}details[open] summary:after{content:"－"}
    details p{color:#625666;font-size:14px;line-height:1.85;margin:12px 0 0;max-width:680px}
    .final-cta{padding:80px 0;background:linear-gradient(105deg,#2b1727,#21152a 55%,#38222e);border-top:1px solid var(--line)}
    .cta-box{display:flex;justify-content:space-between;align-items:center;gap:30px}
    .cta-box h2{font-size:clamp(27px,4vw,44px);line-height:1.3;margin:0 0 12px}.cta-box p{color:var(--muted);margin:0;max-width:650px}
    .site-footer{background:#0d0a10;padding:58px 0 25px;border-top:1px solid var(--line)}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:45px;padding-bottom:45px}
    .footer-title{font-size:17px;font-weight:800;margin-bottom:17px}.footer-copy{color:var(--muted);font-size:13px;max-width:350px;line-height:1.9}
    .footer-links{display:grid;gap:9px;color:var(--muted);font-size:13px}.footer-links a:hover{color:var(--coral)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:20px;color:var(--muted-2);font-size:12px}
    .fixed-cta{position:fixed;z-index:40;bottom:0;left:0;right:0;background:rgba(13,10,16,.97);border-top:1px solid rgba(255,121,95,.55);box-shadow:0 -8px 25px rgba(0,0,0,.25)}
    .fixed-inner{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px}.fixed-inner p{font-size:13px;color:var(--muted);margin:0}.fixed-inner strong{color:var(--cream)}
    .focus-ring:focus-visible,.nav-link:focus-visible,.btn-primary:focus-visible,.btn-secondary:focus-visible,.filter-btn:focus-visible,summary:focus-visible{outline:3px solid rgba(233,173,101,.7);outline-offset:3px}
    @media(max-width:900px){
      .hero-art{right:-13%;width:48%;opacity:.55}.scene-layout,.rank-layout,.editorial-layout{grid-template-columns:1fr;gap:28px}.faq-grid{grid-template-columns:1fr;gap:30px}.category-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:700px){
      body{padding-bottom:116px}.container{width:min(100% - 30px,1180px)}.nav-wrap{height:65px}.brand-name{font-size:14px}.nav-links{display:none;position:absolute;left:15px;right:15px;top:73px;padding:10px;background:#17111d;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-link{padding:13px 15px}.nav-link.active:after{left:15px;right:auto;width:35px;bottom:5px}.nav-cta{display:none}.menu-btn{display:block;margin-left:auto}.hero{min-height:650px}.hero-inner{padding:65px 0 55px}.hero-art{width:100%;right:-35%;bottom:-15px;opacity:.33}.hero-copy{position:relative;z-index:2}.hero-lead{font-size:16px}.meta-item{padding-right:17px;margin-right:17px;margin-bottom:12px}.index-grid{grid-template-columns:1fr}.index-item{border-right:0;border-bottom:1px solid rgba(16,13,21,.18);padding:24px 20px}.index-item:last-child{border-bottom:0}section{padding:72px 0}.section-head{display:block;margin-bottom:27px}.category-grid{grid-template-columns:1fr 1fr;gap:9px}.category-card{min-height:135px;padding:16px}.category-card h3{font-size:16px;margin-top:23px}.cta-box{display:block}.cta-box .btn-primary{margin-top:23px}.footer-grid{grid-template-columns:1fr 1fr;gap:30px}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:7px}.fixed-inner{min-height:94px}.fixed-inner p{max-width:190px;line-height:1.5}.fixed-inner .btn-primary{padding:0 13px;white-space:nowrap}
    }
    @media(max-width:390px){.category-grid{grid-template-columns:1fr}.hero-actions a{width:100%}.footer-grid{grid-template-columns:1fr}}
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

/* roulang page: category1 */
:root{
      --ink:#100d15;
      --panel:#19131f;
      --panel-2:#211a29;
      --paper:#f5eee8;
      --cream:#fff9f4;
      --muted:#aaa0b1;
      --muted-2:#756c7b;
      --line:rgba(255,255,255,.12);
      --coral:#ff795f;
      --rose:#dd5479;
      --amber:#e9ad65;
      --violet:#a978d4;
      --shadow:0 18px 50px rgba(0,0,0,.28);
      --radius:16px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--cream);
      background:var(--ink);
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
      line-height:1.75;
      padding-bottom:78px;
    }
    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%}
    button,input{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:2px solid var(--amber);outline-offset:3px}
    .container{width:min(1180px,calc(100% - 40px));margin:0 auto}
    .site-header{
      position:sticky;top:0;z-index:30;
      background:rgba(16,13,21,.96);
      border-bottom:1px solid var(--line);
      box-shadow:0 8px 24px rgba(0,0,0,.16);
      backdrop-filter:blur(14px)
    }
    .nav-wrap{height:74px;display:flex;align-items:center;gap:28px}
    .brand{display:flex;align-items:center;gap:11px;font-weight:800;letter-spacing:-.03em;white-space:nowrap}
    .brand-mark{
      width:33px;height:33px;border:1px solid var(--coral);border-radius:9px;
      display:grid;place-items:center;color:var(--coral);font-size:17px;
      box-shadow:0 0 18px rgba(255,121,95,.2)
    }
    .brand-name{font-size:16px}
    .nav-links{display:flex;align-items:center;gap:7px;margin-left:auto}
    .nav-link{
      position:relative;padding:10px 15px;color:var(--muted);font-size:14px;
      transition:.2s ease;border-radius:8px
    }
    .nav-link:hover,.nav-link:focus-visible{color:var(--cream);background:rgba(255,255,255,.06)}
    .nav-link.active{color:var(--cream)}
    .nav-link.active:after{
      content:"";position:absolute;left:15px;right:15px;bottom:1px;height:2px;
      background:var(--coral);box-shadow:0 0 10px var(--coral)
    }
    .nav-cta,.btn-primary{
      display:inline-flex;align-items:center;justify-content:center;gap:8px;
      min-height:44px;padding:0 19px;border-radius:9px;border:1px solid transparent;
      background:var(--coral);color:#210f12;font-weight:800;font-size:14px;
      transition:transform .2s,background .2s,box-shadow .2s
    }
    .nav-cta:hover,.btn-primary:hover{background:#ff947d;transform:translateY(-2px);box-shadow:0 10px 24px rgba(255,121,95,.2)}
    .menu-btn{display:none;background:none;border:1px solid var(--line);color:var(--cream);width:43px;height:43px;border-radius:8px}
    .page-hero{
      position:relative;overflow:hidden;
      padding:82px 0 68px;
      background:
        radial-gradient(circle at 88% 20%,rgba(221,84,121,.19),transparent 28%),
        radial-gradient(circle at 12% 75%,rgba(169,120,212,.1),transparent 27%),
        #17111d;
      border-bottom:1px solid var(--line)
    }
    .page-hero:after{
      content:"";position:absolute;inset:0;opacity:.16;pointer-events:none;
      background-image:radial-gradient(rgba(255,255,255,.3) .7px,transparent .7px);
      background-size:8px 8px
    }
    .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.4fr .8fr;gap:70px;align-items:end}
    .eyebrow,.section-kicker{
      display:inline-flex;align-items:center;gap:9px;color:var(--amber);
      font-size:12px;letter-spacing:.16em;font-weight:800
    }
    .eyebrow:before,.section-kicker:before{content:"";width:27px;height:1px;background:var(--amber)}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(36px,5vw,64px);line-height:1.18;letter-spacing:-.055em;margin:18px 0 18px;max-width:760px}
    .hero-text{max-width:710px;color:#c9bfca;font-size:17px;line-height:1.9;margin:0}
    .hero-note{margin-top:27px;color:var(--muted-2);font-size:13px}
    .stat-board{
      border:1px solid var(--line);border-radius:var(--radius);background:rgba(33,26,41,.9);
      box-shadow:var(--shadow);padding:24px
    }
    .board-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:15px;margin-bottom:5px}
    .board-title{font-size:14px;font-weight:800}
    .live-dot{font-size:11px;color:var(--coral);display:flex;align-items:center;gap:6px}
    .live-dot:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--coral);box-shadow:0 0 9px var(--coral)}
    .rank-row{display:grid;grid-template-columns:30px 1fr auto;gap:10px;align-items:center;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.08)}
    .rank-row:last-child{border-bottom:0}
    .rank-no{font-size:13px;color:var(--amber);font-weight:800}
    .rank-name{font-size:14px;font-weight:700}
    .rank-meta{display:block;color:var(--muted-2);font-size:11px;margin-top:2px}
    .rank-tag{font-size:11px;color:var(--rose);border:1px solid rgba(221,84,121,.5);padding:2px 7px;border-radius:4px}
    section{padding:88px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:32px}
    .section-head h2{font-size:clamp(27px,3.5vw,42px);line-height:1.25;letter-spacing:-.04em;margin:12px 0 0}
    .section-desc{max-width:580px;color:var(--muted);font-size:15px;line-height:1.9;margin:10px 0 0}
    .filter-panel{
      background:var(--paper);color:var(--ink);padding:25px 28px;border-radius:var(--radius);
      box-shadow:var(--shadow);margin-bottom:34px
    }
    .filter-line{display:flex;align-items:center;gap:13px;flex-wrap:wrap;border-bottom:1px solid rgba(16,13,21,.12);padding-bottom:18px;margin-bottom:18px}
    .filter-line:last-child{border:0;margin:0;padding:0}
    .filter-label{width:55px;color:#756c7b;font-size:12px;font-weight:800;letter-spacing:.08em}
    .filter-btn{
      min-height:35px;padding:0 13px;border:1px solid rgba(16,13,21,.16);background:transparent;
      color:#635967;border-radius:6px;font-size:13px;transition:.2s
    }
    .filter-btn:hover,.filter-btn:focus-visible,.filter-btn.selected{color:#32151b;border-color:var(--coral);background:rgba(255,121,95,.15)}
    .search-box{margin-left:auto;display:flex;min-width:240px}
    .search-box input{
      width:100%;height:38px;border:1px solid rgba(16,13,21,.18);border-right:0;
      border-radius:7px 0 0 7px;padding:0 12px;background:#fffaf6;color:var(--ink)
    }
    .search-box button{border:0;background:var(--ink);color:var(--cream);padding:0 14px;border-radius:0 7px 7px 0;font-size:13px}
    .content-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:32px;align-items:start}
    .index-list{border-top:1px solid var(--line)}
    .index-row{
      display:grid;grid-template-columns:62px 1fr auto;gap:18px;align-items:center;
      padding:24px 0;border-bottom:1px solid var(--line);transition:.2s
    }
    .index-row:hover{padding-left:8px;background:rgba(255,255,255,.025)}
    .row-number{font-size:25px;color:var(--coral);font-weight:800;font-family:Georgia,serif}
    .row-title{font-size:19px;font-weight:800;letter-spacing:-.025em;margin-bottom:5px}
    .row-summary{color:var(--muted);font-size:13px;line-height:1.75;margin:0;max-width:650px}
    .row-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
    .tag{display:inline-flex;align-items:center;min-height:25px;padding:0 8px;border:1px solid currentColor;border-radius:5px;font-size:11px;line-height:1}
    .tag.coral{color:var(--rose)} .tag.amber{color:var(--amber)} .tag.violet{color:var(--violet)}
    .row-link{color:var(--coral);font-size:13px;font-weight:800;white-space:nowrap}
    .side-index{position:sticky;top:100px;border-left:1px solid var(--line);padding-left:22px}
    .side-index h3{font-size:17px;margin:0 0 16px}
    .side-index a{display:block;color:var(--muted);font-size:13px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08);transition:.2s}
    .side-index a:hover{color:var(--cream);padding-left:5px}
    .side-index a span{color:var(--muted-2);float:right;font-size:11px}
    .topic-strip{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
    .topic-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
    .topic-card{display:flex;gap:20px;padding:24px;background:var(--panel-2);border-radius:12px;border:1px solid transparent;transition:.2s}
    .topic-card:hover{border-color:rgba(255,121,95,.55);transform:translateY(-3px)}
    .topic-cover{width:105px;min-width:105px;height:125px;border-radius:9px;background:linear-gradient(145deg,#542b43,#c16b66 48%,#282033 49%,#17111d);position:relative;overflow:hidden}
    .topic-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,7,14,.75),transparent 60%)}
    .topic-card h3{font-size:17px;margin:4px 0 7px}
    .topic-card p{color:var(--muted);font-size:13px;line-height:1.75;margin:0 0 12px}
    .read-link{color:var(--coral);font-size:13px;font-weight:800}
    .notice{display:flex;gap:16px;align-items:flex-start;padding:22px 24px;border:1px solid rgba(233,173,101,.32);background:rgba(233,173,101,.07);border-radius:12px;color:#d7c5b6;font-size:14px}
    .notice-mark{color:var(--amber);font-size:20px;line-height:1}
    .faq-wrap{max-width:820px;border-top:1px solid var(--line)}
    details{border-bottom:1px solid var(--line);padding:20px 0}
    summary{cursor:pointer;list-style:none;font-size:16px;font-weight:800;padding-right:30px;position:relative}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"＋";position:absolute;right:2px;color:var(--coral);font-size:20px;top:-3px}
    details[open] summary:after{content:"−"}
    details p{color:var(--muted);font-size:14px;line-height:1.85;margin:12px 28px 0 0}
    .cta-panel{display:flex;align-items:center;justify-content:space-between;gap:28px;background:linear-gradient(100deg,#2a1928,#211a29);border:1px solid rgba(255,121,95,.28);border-radius:var(--radius);padding:35px 38px}
    .cta-panel h2{font-size:28px;margin:0 0 7px}
    .cta-panel p{color:var(--muted);font-size:14px;margin:0}
    .site-footer{background:#0c0a10;border-top:1px solid var(--line);padding:58px 0 24px}
    .footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:50px}
    .footer-copy{max-width:370px;color:var(--muted);font-size:13px;line-height:1.85;margin:17px 0 0}
    .footer-title{font-size:13px;font-weight:800;color:var(--cream);margin-bottom:13px}
    .footer-links{display:flex;flex-direction:column;gap:9px;color:var(--muted);font-size:13px}
    .footer-links a:hover{color:var(--coral)}
    .footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:40px;padding-top:18px;color:var(--muted-2);font-size:11px}
    .fixed-cta{position:fixed;z-index:25;bottom:0;left:0;right:0;background:rgba(16,13,21,.97);border-top:1px solid rgba(255,121,95,.45);box-shadow:0 -8px 25px rgba(0,0,0,.25)}
    .fixed-inner{height:70px;display:flex;align-items:center;justify-content:space-between;gap:20px}
    .fixed-copy{font-size:13px;color:var(--muted)}
    .fixed-copy strong{display:block;color:var(--cream);font-size:14px}
    @media(max-width:900px){
      .hero-grid{grid-template-columns:1fr;gap:34px}
      .stat-board{max-width:540px}
      .content-layout{grid-template-columns:1fr}
      .side-index{position:static;border-left:0;border-top:1px solid var(--line);padding:22px 0 0}
      .side-index a{display:inline-block;width:48%;margin-right:1%}
    }
    @media(max-width:700px){
      body{padding-bottom:92px}
      .container{width:min(100% - 28px,1180px)}
      .nav-wrap{height:66px;gap:12px}
      .brand-name{font-size:14px}
      .nav-links,.nav-cta{display:none}
      .menu-btn{display:block;margin-left:auto}
      .nav-links.open{display:flex;position:absolute;top:66px;left:0;right:0;margin:0;padding:12px 14px;flex-direction:column;align-items:stretch;background:var(--panel);border-bottom:1px solid var(--line)}
      .nav-links.open .nav-link{padding:13px 15px}
      .page-hero{padding:58px 0 48px}
      h1{font-size:38px}
      .hero-text{font-size:15px}
      section{padding:65px 0}
      .filter-panel{padding:19px 16px}
      .filter-line{align-items:flex-start;gap:8px}
      .filter-label{width:100%;margin-bottom:2px}
      .search-box{width:100%;margin-top:7px}
      .index-row{grid-template-columns:35px 1fr;gap:12px;padding:20px 0}
      .row-link{grid-column:2}
      .row-title{font-size:17px}
      .topic-grid{grid-template-columns:1fr}
      .topic-card{padding:18px}
      .cta-panel{display:block;padding:27px 22px}
      .cta-panel .btn-primary{margin-top:20px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
      .footer-grid>div:first-child{grid-column:1/-1}
      .footer-bottom{display:block;line-height:2}
      .fixed-inner{height:82px}
      .fixed-copy{font-size:12px}
      .fixed-copy strong{font-size:13px}
      .fixed-inner .btn-primary{padding:0 13px;font-size:12px;white-space:nowrap}
    }
    @media(max-width:420px){
      .footer-grid{grid-template-columns:1fr}
      .footer-grid>div:first-child{grid-column:auto}
      .fixed-copy{max-width:190px}
    }
    @media(prefers-reduced-motion:reduce){
      *{scroll-behavior:auto!important;transition:none!important}
    }
