/* roulang page: index */
:root{
  --bg-ink:#1C1A1F; --bg-ink-2:#262229; --panel:#F6F2EA; --panel-2:#EDE6DA;
  --primary:#4B2E63; --primary-ink:#2E1B3D; --accent:#E0913B; --jade:#3E8E7E; --danger:#B3453A;
  --line:#D8CFC0; --text:#262229; --text-inv:#F2EDE4;
  --ink-soft:rgba(242,237,228,.72); --ink-soft-2:rgba(242,237,228,.5);
  --text-soft:rgba(38,34,41,.65);
  --r-card:14px; --r-btn:12px; --r-input:10px; --r-tag:6px;
  --shadow-card:0 8px 22px rgba(28,26,31,.14);
  --font-cn:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --font-mono:ui-monospace,"SFMono-Regular","Roboto Mono",Menlo,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-cn);font-size:16px;line-height:1.8;color:var(--text);background:var(--bg-ink);padding-bottom:88px;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.site-section{padding:72px 0}
.site-section--ink{background:var(--bg-ink);color:var(--text-inv);--cut:var(--bg-ink)}
.site-section--ink-2{background:var(--bg-ink-2);color:var(--text-inv);--cut:var(--bg-ink-2)}
.site-section--panel{background:var(--panel);color:var(--text);--cut:var(--panel)}
.site-section--panel-2{background:var(--panel-2);color:var(--text);--cut:var(--panel-2)}
.site-round{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;margin-bottom:10px}
.site-round-num{color:var(--accent)}
.site-round-line{display:inline-block;width:26px;height:2px;background:var(--primary)}
.site-section--ink .site-round-line,.site-section--ink-2 .site-round-line{background:var(--accent)}
.site-h2{font-size:clamp(24px,2.6vw,34px);font-weight:800;line-height:1.3;letter-spacing:-.01em}
.site-lead{margin-top:14px;font-size:15px;line-height:1.85;color:var(--text-soft);max-width:66ch}
.site-section--ink .site-lead,.site-section--ink-2 .site-lead{color:var(--ink-soft)}
.site-head{margin-bottom:28px}
/* 按钮 */
.site-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:var(--r-btn);border:0;font-weight:700;font-size:15px;line-height:1.4;cursor:pointer;transition:transform .18s,box-shadow .18s,filter .18s,background-color .18s;white-space:nowrap}
.site-btn-primary{background:var(--accent);color:var(--primary-ink);border-bottom:4px solid #B4732A}
.site-btn-primary:hover{transform:translateY(-2px);border-bottom-width:2px;filter:brightness(1.04)}
.site-btn-primary:active{transform:translateY(2px);border-bottom-width:0}
.site-btn-ghost{background:transparent;color:var(--primary);border:1.5px solid var(--primary)}
.site-btn-ghost:hover{background:rgba(75,46,99,.08)}
.site-section--ink .site-btn-ghost,.site-section--ink-2 .site-btn-ghost{color:var(--text-inv);border-color:rgba(242,237,228,.5)}
.site-section--ink .site-btn-ghost:hover,.site-section--ink-2 .site-btn-ghost:hover{background:rgba(242,237,228,.1)}
.site-btn-sm{padding:9px 16px;font-size:14px}
/* 头部 */
.site-header{position:sticky;top:0;z-index:1030;background:var(--bg-ink)}
.site-topbar{background:var(--bg-ink);border-bottom:1px solid rgba(216,207,192,.15)}
.site-topbar .container{display:flex;align-items:center;gap:18px;height:64px}
.site-logo{font-size:19px;font-weight:900;letter-spacing:-.01em;color:var(--text-inv);display:flex;align-items:baseline;gap:4px}
.site-logo span{font-size:12px;font-weight:700;color:var(--accent);letter-spacing:.06em}
.site-nav-main{display:flex;align-items:center;gap:20px;margin-left:14px;flex:1 1 auto}
.site-nav-main a{font-size:14px;color:var(--ink-soft);padding:4px 0;border-bottom:2px solid transparent;transition:color .18s,border-color .18s}
.site-nav-main a:hover{color:var(--text-inv)}
.site-nav-main a.active{color:var(--text-inv);border-bottom-color:var(--accent)}
.site-topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.site-burger{display:none;width:40px;height:40px;border-radius:10px;background:rgba(242,237,228,.08);border:1px solid rgba(216,207,192,.22);color:var(--text-inv);align-items:center;justify-content:center;cursor:pointer}
.site-header.is-compact .site-nav-main a{display:none}
.site-header.is-compact .site-nav-main{flex:0 0 auto;margin-left:0}
.site-chipbar{background:var(--bg-ink);border-bottom:1px dashed rgba(216,207,192,.28)}
.site-chips{display:flex;align-items:center;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;height:52px}
.site-chips::-webkit-scrollbar{display:none}
.site-chip{scroll-snap-align:center;flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:10px;font-size:14px;color:var(--ink-soft);background:rgba(242,237,228,.05);border:1px solid rgba(216,207,192,.16);transition:transform .18s,background-color .18s,color .18s,border-color .18s}
.site-chip:hover{transform:translateY(-1px);color:var(--text-inv)}
.site-chip.is-active{background:var(--primary);color:var(--text-inv);border-color:var(--primary)}
.site-chip-num{font-family:var(--font-mono);font-size:12px;color:var(--accent)}
.site-chip.is-active .site-chip-num{color:#F6D7A8}
/* Hero */
.site-hero{position:relative;overflow:hidden;min-height:78vh;display:flex;align-items:center;padding:64px 0 72px;background-image:linear-gradient(100deg,rgba(28,26,31,.96) 0%,rgba(28,26,31,.9) 46%,rgba(38,34,41,.72) 100%),url('/assets/images/backpic/back-1.jpg');background-size:cover;background-position:center}
.site-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}
.site-tagline{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-family:var(--font-mono);letter-spacing:.08em;color:var(--accent);border:1px solid rgba(224,145,59,.4);border-radius:8px;padding:5px 12px;background:rgba(224,145,59,.08)}
.site-h1{font-size:clamp(30px,4.4vw,52px);font-weight:900;line-height:1.22;letter-spacing:-.01em;color:var(--text-inv);margin-top:18px;max-width:16ch}
.site-hero-sub{margin-top:16px;font-size:17px;color:var(--ink-soft);font-weight:600}
.site-hero-text{margin-top:16px;font-size:15px;line-height:1.9;color:var(--ink-soft);max-width:52ch}
.site-hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.site-stats{display:flex;flex-wrap:wrap;gap:26px;margin-top:30px;padding-top:22px;border-top:1px dashed rgba(216,207,192,.25)}
.site-stat-num{font-family:var(--font-mono);font-size:22px;font-weight:700;color:var(--accent)}
.site-stat-label{font-size:13px;color:var(--ink-soft-2);margin-top:2px}
.site-hero-side{position:relative}
.site-icon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.site-icon-cell{background:rgba(242,237,228,.06);border:1px solid rgba(216,207,192,.18);border-radius:12px;padding:14px 12px;text-align:center;transition:transform .2s,background-color .2s}
.site-icon-cell:hover{transform:translateY(-3px);background:rgba(242,237,228,.1)}
.site-icon-glyph{font-family:var(--font-mono);font-size:17px;color:var(--accent);font-weight:700}
.site-icon-name{font-size:12.5px;color:var(--ink-soft);margin-top:6px;line-height:1.5}
.site-status{margin-top:16px;background:rgba(28,26,31,.7);border:1px solid rgba(216,207,192,.2);border-radius:12px;padding:16px}
.site-status-row{display:flex;justify-content:space-between;font-size:13px;color:var(--ink-soft);margin-bottom:6px}
.site-status-row span:last-child{font-family:var(--font-mono);color:var(--accent)}
.site-bar{height:6px;border-radius:99px;background:rgba(242,237,228,.14);overflow:hidden;margin-bottom:14px}
.site-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--primary),var(--accent))}
.site-card-stack{position:relative;height:132px;margin-top:22px}
.site-mini{position:absolute;width:206px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;box-shadow:0 10px 0 -5px rgba(46,27,61,.8)}
.site-mini:nth-child(1){left:0;top:8px;transform:rotate(-3deg);z-index:3}
.site-mini:nth-child(2){left:96px;top:0;transform:rotate(1.5deg);z-index:2}
.site-mini:nth-child(3){left:196px;top:14px;transform:rotate(-1deg);z-index:1}
.site-mini-label{font-family:var(--font-mono);font-size:11px;color:var(--primary);letter-spacing:.08em}
.site-mini-title{font-size:14px;font-weight:700;margin-top:4px;line-height:1.45}
.site-mini-bar{height:5px;background:var(--panel-2);border-radius:99px;margin-top:9px;overflow:hidden}
.site-mini-bar i{display:block;height:100%;background:var(--accent)}
/* 卡片 */
.site-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-card);padding:22px;color:var(--text);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),var(--shadow-card);height:100%;transition:transform .24s,box-shadow .24s}
.site-card::after{content:"";position:absolute;top:-1px;right:-1px;width:16px;height:16px;background:linear-gradient(225deg,var(--cut,var(--panel)) 0 46%,var(--line) 46% 54%,transparent 54%);border-top-right-radius:var(--r-card)}
.site-card:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 14px 30px rgba(28,26,31,.2)}
.site-card--ink{background:var(--bg-ink-2);color:var(--text-inv);border-color:rgba(216,207,192,.18);box-shadow:0 10px 0 -5px rgba(46,27,61,.75)}
.site-card--ink .site-lead,.site-card--ink p{color:var(--ink-soft)}
.site-card--ink::after{background:linear-gradient(225deg,var(--cut,var(--bg-ink-2)) 0 46%,rgba(216,207,192,.3) 46% 54%,transparent 54%)}
.site-rarity{position:absolute;top:0;left:0;right:22px;height:3px;border-radius:3px 0 0 0;background:#9A9186}
.site-rarity--jade{background:var(--jade)}
.site-rarity--purple{background:var(--primary)}
.site-rarity--accent{background:var(--accent)}
.site-card-num{font-family:var(--font-mono);font-size:12px;color:var(--accent);letter-spacing:.1em}
.site-h3{font-size:19px;font-weight:700;line-height:1.45;margin-top:8px}
.site-h3-sm{font-size:17px;font-weight:700;line-height:1.5}
.site-card p{font-size:14.5px;line-height:1.8;color:var(--text-soft);margin-top:10px}
.site-tag{display:inline-flex;align-items:center;padding:3px 9px;border-radius:var(--r-tag);font-size:12px;font-weight:600;border:1px solid var(--line);background:var(--panel-2);color:var(--text-soft)}
.site-tag--jade{color:var(--jade);border-color:rgba(62,142,126,.4);background:rgba(62,142,126,.1)}
.site-tag--danger{color:var(--danger);border-color:rgba(179,69,58,.4);background:rgba(179,69,58,.08)}
.site-tag--accent{color:#8A5416;border-color:rgba(224,145,59,.45);background:rgba(224,145,59,.14)}
.site-tag-row{display:flex;flex-wrap:wrap;gap:7px}
.site-meta{display:flex;align-items:center;gap:12px;font-size:12.5px;color:var(--text-soft);font-family:var(--font-mono)}
.site-card--ink .site-meta{color:var(--ink-soft-2)}
.site-thumb{position:relative;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:linear-gradient(135deg,#3A3440,#221E27)}
.site-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.site-card:hover .site-thumb img{transform:scale(1.04)}
/* 卖点不对称 */
.site-feature-lg{padding:28px}
.site-feature-lg .site-h3{font-size:23px}
/* 场景演示 */
.site-scene{display:grid;grid-template-columns:1.2fr 1fr;gap:34px;align-items:start}
.site-steps{display:flex;position:relative;gap:12px}
.site-step{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 14px;cursor:pointer;position:relative;transition:transform .2s,box-shadow .2s,border-color .2s}
.site-step::after{content:"";position:absolute;right:-9px;top:50%;width:8px;border-top:2px dashed var(--line)}
.site-step:last-child::after{display:none}
.site-step:hover{transform:translateY(-3px)}
.site-step.is-on{border-color:var(--primary);box-shadow:0 8px 0 -4px rgba(75,46,99,.6)}
.site-step-num{font-family:var(--font-mono);font-size:12px;color:var(--accent)}
.site-step-name{font-size:15px;font-weight:700;margin-top:6px;line-height:1.5}
.site-scene-panel{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-card);padding:24px}
.site-scene-panel h3{font-size:19px;font-weight:700}
.site-scene-panel ul{margin-top:14px;display:grid;gap:9px}
.site-scene-panel li{font-size:14.5px;color:var(--text-soft);padding-left:18px;position:relative;line-height:1.75}
.site-scene-panel li::before{content:"";position:absolute;left:0;top:11px;width:7px;height:7px;border-radius:2px;background:var(--jade)}
/* 评价 */
.site-quote{font-family:"Noto Serif SC",Songti SC,serif;font-size:20px;line-height:1.75;font-weight:600}
.site-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--accent));flex:0 0 auto}
.site-person{display:flex;align-items:center;gap:12px;margin-top:18px}
.site-person-name{font-size:14.5px;font-weight:700}
.site-person-role{font-size:13px;color:var(--text-soft)}
.site-mini-review{background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:16px}
.site-mini-review p{font-size:14px;line-height:1.75;color:var(--text-soft);margin:0}
/* 对比 */
.site-compare{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.site-col{border-radius:var(--r-card);padding:24px}
.site-col--grey{background:var(--panel-2);border:1px solid var(--line);color:var(--text-soft)}
.site-col--mine{background:var(--panel);border:2px solid var(--primary);box-shadow:0 10px 0 -5px rgba(75,46,99,.55)}
.site-col h3{font-size:18px;font-weight:800;margin-bottom:14px;color:var(--text)}
.site-col--grey h3{color:var(--text-soft)}
.site-col li{display:flex;gap:10px;font-size:14.5px;line-height:1.7;padding:9px 0;border-bottom:1px dashed var(--line)}
.site-col li:last-child{border-bottom:0}
.site-col--mine li::before{content:"✓";color:var(--primary);font-weight:700}
.site-col--grey li::before{content:"—";color:#9A9186}
/* 资讯 */
.site-news-card{padding:0;overflow:hidden;display:flex;flex-direction:column}
.site-news-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:9px;flex:1}
.site-news-card .site-thumb{border-radius:0}
/* FAQ */
.site-faq .accordion-item{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden}
.site-faq .accordion-button{background:var(--panel);color:var(--text);font-size:17px;font-weight:700;line-height:1.6;padding:18px 22px;box-shadow:none;border-left:4px solid transparent}
.site-faq .accordion-button:not(.collapsed){color:var(--primary);border-left-color:var(--primary);background:var(--panel-2)}
.site-faq .accordion-button::after{content:"+";background-image:none;font-family:var(--font-mono);font-size:20px;font-weight:700;color:var(--primary);width:26px;height:26px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:6px;transform:none;line-height:1}
.site-faq .accordion-button:not(.collapsed)::after{content:"−";transform:none}
.site-faq .accordion-body{padding:6px 22px 20px;font-size:15px;line-height:1.8;color:var(--text-soft)}
/* 保障条 */
.site-assure{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.site-assure-item{border:1px solid rgba(216,207,192,.24);border-radius:12px;padding:16px 18px;background:rgba(242,237,228,.04)}
.site-assure-item strong{display:block;font-size:15px;color:var(--text-inv);font-weight:700}
.site-assure-item span{display:block;font-size:13px;color:var(--ink-soft-2);margin-top:6px;line-height:1.65}
/* 分类入口 */
.site-channel{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:20px}
.site-channel-main{padding:28px;background:linear-gradient(150deg,#2E1B3D,#1C1A1F 75%);color:var(--text-inv);border:1px solid rgba(224,145,59,.35)}
.site-channel-main p{color:var(--ink-soft)}
.site-anchor-card{display:block;text-decoration:none}
.site-anchor-card span.site-arrow{font-family:var(--font-mono);color:var(--accent);font-size:14px}
/* 图鉴 */
.site-atlas{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
/* 时间线 */
.site-timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;position:relative}
.site-tl-item{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 16px;position:relative}
.site-tl-item::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--accent);border-radius:12px 12px 0 0}
.site-tl-time{font-family:var(--font-mono);font-size:12px;color:var(--primary);letter-spacing:.06em}
.site-tl-title{font-size:15.5px;font-weight:700;margin-top:8px}
.site-tl-desc{font-size:13.5px;color:var(--text-soft);margin-top:7px;line-height:1.7}
/* 难度档位 */
.site-levels{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.site-level{border-radius:var(--r-card);padding:22px;border:1px solid var(--line);background:var(--panel)}
.site-level--1{border-top:3px solid #9A9186}
.site-level--2{border-top:3px solid var(--jade)}
.site-level--3{border-top:3px solid var(--primary)}
.site-level--4{border-top:3px solid var(--accent)}
.site-level h3{font-size:17px;font-weight:800;margin-top:6px}
.site-level dl{margin:14px 0 0;font-size:13.5px}
.site-level dt{color:var(--text-soft);font-weight:400;margin-top:9px}
.site-level dd{margin:2px 0 0;font-family:var(--font-mono);font-size:14px;color:var(--primary)}
/* 渠道卡 */
.site-channels{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.site-channel-card{display:flex;gap:18px;align-items:flex-start}
.site-channel-icon{width:46px;height:46px;flex:0 0 auto;border-radius:12px;background:var(--primary);color:var(--text-inv);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-weight:700}
/* 条件条列 */
.site-cond{display:grid;gap:14px}
.site-cond-item{display:flex;gap:16px;padding:18px 20px;border:1px solid rgba(216,207,192,.18);border-radius:12px;background:rgba(242,237,228,.04)}
.site-cond-num{font-family:var(--font-mono);font-size:15px;color:var(--accent);font-weight:700;min-width:34px}
.site-cond-item h3{font-size:16px;font-weight:700;color:var(--text-inv)}
.site-cond-item p{font-size:14px;color:var(--ink-soft);margin-top:5px;line-height:1.75}
/* 数据看板 */
.site-board{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.site-board-item{text-align:left}
.site-board-num{font-family:var(--font-mono);font-size:34px;font-weight:700;color:var(--primary)}
.site-board-label{font-size:14px;color:var(--text-soft);margin-top:6px}
.site-board .site-bar{background:var(--panel-2);margin:14px 0 0}
/* 资质 */
.site-qual{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.site-small-note{font-size:12.5px;color:var(--text-soft);margin-top:14px;line-height:1.7}
/* 风险提示 */
.site-warn{border:1px solid rgba(179,69,58,.35);background:rgba(179,69,58,.06);border-radius:12px;padding:20px 24px;font-size:14.5px;line-height:1.8;color:var(--text)}
.site-warn strong{color:var(--danger)}
/* 表单 */
.site-form-wrap{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-card);padding:28px;box-shadow:var(--shadow-card)}
.site-label{font-size:14px;font-weight:700;margin-bottom:7px;display:block}
.site-input{width:100%;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-input);padding:11px 14px;font-size:14.5px;transition:border-color .18s,box-shadow .18s}
.site-input:focus{border:1.5px solid var(--primary);box-shadow:0 0 0 3px rgba(75,46,99,.18);outline:none}
.site-input::placeholder{color:rgba(38,34,41,.42)}
.site-form-note{font-size:12.5px;color:var(--text-soft);margin-top:14px;line-height:1.7}
.site-form-side{background:var(--bg-ink-2);color:var(--text-inv);border-radius:var(--r-card);padding:26px;border:1px solid rgba(216,207,192,.18);height:100%}
.site-form-side li{font-size:14px;color:var(--ink-soft);padding:10px 0;border-bottom:1px dashed rgba(216,207,192,.2);line-height:1.7}
.site-form-side li:last-child{border-bottom:0}
/* 末尾 CTA */
.site-cta-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(120deg,#4B2E63,#2E1B3D);border-radius:var(--r-card);padding:30px 32px;color:var(--text-inv)}
.site-cta-band h2{font-size:clamp(20px,2.2vw,27px);font-weight:800;line-height:1.35}
.site-cta-band p{font-size:14.5px;color:rgba(242,237,228,.78);margin-top:8px;max-width:56ch}
/* 页脚 */
.site-footer{background:var(--bg-ink-2);color:var(--text-inv);padding:56px 0 0}
.site-footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:32px}
.site-footer h4{font-size:15px;font-weight:800;margin-bottom:14px}
.site-footer li{font-size:13.5px;color:var(--ink-soft);padding:6px 0}
.site-footer a:hover{color:var(--accent)}
.site-footer-brand{font-size:19px;font-weight:900}
.site-footer-brand span{font-size:12px;color:var(--accent);font-weight:700}
.site-footer p{font-size:13.5px;color:var(--ink-soft);line-height:1.8;margin-top:10px}
.site-footer-bottom{margin-top:40px;border-top:1px dashed rgba(216,207,192,.25);padding:20px 0 26px;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:13px;color:var(--ink-soft-2)}
/* 固定转化条 */
.site-sticky{position:fixed;left:0;right:0;bottom:0;z-index:1040;background:rgba(28,26,31,.9);backdrop-filter:blur(6px);border-top:1px solid rgba(216,207,192,.2)}
.site-sticky .container{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding-top:8px;padding-bottom:8px}
.site-sticky-text{font-size:14.5px;color:var(--text-inv);font-weight:600}
.site-sticky-text span{font-family:var(--font-mono);color:var(--accent);font-size:12.5px;display:block;font-weight:400}
/* 动画 */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .4s ease}
.reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.site-card:hover,.site-btn-primary:hover{transform:none}}
/* 响应式 */
@media(max-width:1199px){
  .site-atlas{grid-template-columns:repeat(2,1fr)}
  .site-timeline{grid-template-columns:repeat(3,1fr)}
  .site-levels{grid-template-columns:repeat(2,1fr)}
  .site-assure{grid-template-columns:repeat(2,1fr)}
  .site-board{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:991px){
  .site-nav-main{display:none}
  .site-burger{display:flex}
  .site-hero-grid{grid-template-columns:1fr;gap:36px}
  .site-h1{max-width:22ch}
  .site-scene{grid-template-columns:1fr}
  .site-steps{flex-direction:column}
  .site-step::after{right:auto;left:50%;top:auto;bottom:-10px;width:2px;height:9px;border-top:0;border-left:2px dashed var(--line)}
  .site-compare{grid-template-columns:1fr}
  .site-channel{grid-template-columns:1fr 1fr}
  .site-channel-main{grid-column:1/-1}
  .site-channels{grid-template-columns:1fr}
  .site-qual{grid-template-columns:1fr}
  .site-footer-grid{grid-template-columns:1fr 1fr}
  .site-mini{width:176px}
  .site-mini:nth-child(2){left:70px}
  .site-mini:nth-child(3){left:140px}
}
@media(max-width:767px){
  .site-section{padding:56px 0}
  .site-hero{min-height:auto;padding:44px 0 56px}
  .site-atlas{grid-template-columns:1fr}
  .site-timeline{grid-template-columns:1fr}
  .site-levels{grid-template-columns:1fr}
  .site-assure{grid-template-columns:1fr}
  .site-board{grid-template-columns:1fr}
  .site-card-stack{height:auto;display:grid;gap:12px}
  .site-mini{position:static;width:100%;transform:none!important}
  .site-sticky .container{min-height:62px}
  .site-sticky-text{font-size:13.5px}
  .site-stats{gap:18px}
  .site-cta-band{padding:24px 20px}
}
@media(max-width:575px){
  .container{padding:0 16px}
  body{font-size:15px;padding-bottom:82px}
  .site-hero-cta .site-btn{width:100%}
  .site-footer-grid{grid-template-columns:1fr}
  .site-card{padding:18px}
}

/* roulang page: category1 */
:root{
  --bg-ink:#1C1A1F; --bg-ink-2:#262229; --panel:#F6F2EA; --panel-2:#EDE6DA;
  --primary:#4B2E63; --primary-ink:#2E1B3D; --accent:#E0913B; --jade:#3E8E7E; --danger:#B3453A;
  --line:#D8CFC0; --text:#262229; --text-inv:#F2EDE4;
  --ink-soft:rgba(242,237,228,.72); --ink-soft-2:rgba(242,237,228,.5);
  --text-soft:rgba(38,34,41,.66);
  --r-card:14px; --r-btn:12px; --r-input:10px; --r-tag:6px;
  --shadow-card:0 8px 22px rgba(28,26,31,.14);
  --font-cn:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --font-mono:ui-monospace,"SFMono-Regular","Roboto Mono",Menlo,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--font-cn);font-size:16px;line-height:1.8;color:var(--text);background:var(--panel-2);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;font-weight:800;line-height:1.3;letter-spacing:-.01em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.site-section{padding:60px 0}
.site-section--ink{background:var(--bg-ink);color:var(--text-inv)}
.site-section--ink-2{background:var(--bg-ink-2);color:var(--text-inv)}
.site-section--panel{background:var(--panel)}
.site-section--panel-2{background:var(--panel-2)}
.site-section--ink .site-head h2,.site-section--ink-2 .site-head h2{color:var(--text-inv)}
.site-section--ink .site-lead,.site-section--ink-2 .site-lead{color:var(--ink-soft)}
.site-head{margin-bottom:26px}
.site-round-line{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;color:var(--accent);margin-bottom:10px}
.site-round-line::before{content:"";width:22px;height:2px;background:var(--accent)}
.site-head h2{font-size:clamp(22px,2.6vw,32px);font-weight:800;color:var(--primary-ink)}
.site-lead{margin-top:12px;font-size:15px;line-height:1.85;color:var(--text-soft);max-width:70ch}
/* 按钮 */
.site-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:var(--r-btn);border:0;font-weight:700;font-size:15px;line-height:1.4;cursor:pointer;transition:transform .18s,filter .18s,background-color .18s;white-space:nowrap}
.site-btn-primary{background:var(--accent);color:var(--primary-ink);border-bottom:4px solid #B4732A}
.site-btn-primary:hover{transform:translateY(-2px);border-bottom-width:2px;filter:brightness(1.04);color:var(--primary-ink)}
.site-btn-primary:active{transform:translateY(2px);border-bottom-width:0}
.site-btn-ghost{background:transparent;color:var(--primary);border:1.5px solid var(--primary)}
.site-btn-ghost:hover{background:rgba(75,46,99,.08);color:var(--primary-ink)}
.site-section--ink .site-btn-ghost,.site-section--ink-2 .site-btn-ghost{color:var(--text-inv);border-color:rgba(242,237,228,.5)}
.site-section--ink .site-btn-ghost:hover,.site-section--ink-2 .site-btn-ghost:hover{background:rgba(242,237,228,.1);color:var(--text-inv)}
.site-btn-sm{padding:9px 16px;font-size:14px}
/* 头部 */
.site-header{position:sticky;top:0;z-index:1030;background:var(--bg-ink)}
.site-topbar{border-bottom:1px solid rgba(216,207,192,.15);transition:padding .2s}
.site-topbar .container{display:flex;align-items:center;gap:18px;min-height:64px}
.site-logo{display:inline-flex;align-items:baseline;gap:4px;font-size:19px;font-weight:900;color:var(--text-inv);flex:0 0 auto}
.site-logo span{font-size:12px;font-weight:700;color:var(--accent);letter-spacing:.06em}
.site-nav-main{display:flex;align-items:center;gap:18px;flex:1 1 auto;overflow-x:auto;scrollbar-width:none}
.site-nav-main::-webkit-scrollbar{display:none}
.site-nav-main a{font-size:14px;color:var(--ink-soft);padding:4px 0;border-bottom:2px solid transparent;white-space:nowrap;transition:color .18s,border-color .18s}
.site-nav-main a:hover{color:var(--text-inv)}
.site-nav-main a.active{color:var(--text-inv);border-bottom-color:var(--accent)}
.site-topbar-right{margin-left:auto;flex:0 0 auto;display:flex;align-items:center;gap:10px}
.site-chipbar{border-bottom:1px dashed rgba(216,207,192,.28)}
.site-chips{display:flex;align-items:center;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;height:52px}
.site-chips::-webkit-scrollbar{display:none}
.site-chip{scroll-snap-align:center;flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:10px;font-size:14px;color:var(--ink-soft);background:rgba(242,237,228,.05);border:1px solid rgba(216,207,192,.16);transition:transform .18s,background-color .18s,color .18s,border-color .18s}
.site-chip:hover{transform:translateY(-1px);color:var(--text-inv)}
.site-chip.is-active{background:var(--primary);color:var(--text-inv);border-color:var(--primary)}
.site-chip-num{font-family:var(--font-mono);font-size:12px;color:var(--accent)}
.site-chip.is-active .site-chip-num{color:#F6D7A8}
/* 分类头 */
.cat-head{background:var(--panel);border-bottom:1px solid var(--line);padding:32px 0 36px}
.cat-head-inner{display:flex;flex-wrap:wrap;gap:26px;align-items:flex-end;justify-content:space-between}
.cat-head-main{flex:1 1 380px}
.site-crumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-soft);margin-bottom:12px}
.site-crumb a:hover{color:var(--primary);text-decoration:underline}
.cat-head h1{font-size:clamp(25px,3.2vw,38px);font-weight:900;color:var(--primary-ink);line-height:1.24}
.cat-head-sub{margin-top:12px;font-size:15px;color:var(--text-soft);max-width:56ch;line-height:1.8}
.cat-head-stat{display:flex;gap:28px;flex-wrap:wrap}
.stat-cell{display:flex;flex-direction:column}
.stat-num{font-family:var(--font-mono);font-size:23px;font-weight:700;color:var(--primary);line-height:1.25}
.stat-label{font-size:13px;color:var(--text-soft)}
/* 说明条 */
.cat-note{background:var(--panel-2);padding:34px 0}
.cat-note-text{font-size:15.5px;line-height:1.9;color:var(--text);max-width:82ch}
.cat-note-text + .cat-note-text{margin-top:12px}
.cat-note-tags{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px}
.site-tag{display:inline-flex;align-items:center;padding:4px 11px;border-radius:var(--r-tag);font-size:13px;line-height:1.5;background:var(--panel);border:1px solid var(--line);color:var(--primary)}
/* 筛选行 */
.cat-filter{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0}
.filter-row{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;padding-bottom:2px}
.filter-row::-webkit-scrollbar{display:none}
.filter-chip{flex:0 0 auto;scroll-snap-align:center;padding:8px 16px;border-radius:10px;font-size:14px;background:var(--panel-2);border:1px solid var(--line);color:var(--text-soft);cursor:pointer;transition:background-color .18s,color .18s,border-color .18s}
.filter-chip:hover{color:var(--primary);border-color:var(--primary)}
.filter-chip.is-active{background:var(--primary);border-color:var(--primary);color:var(--text-inv)}
/* 列表卡 */
.list-card{position:relative;height:100%;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),var(--shadow-card);transition:transform .24s,box-shadow .24s}
.list-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:#BFB4A2;z-index:2}
.list-card.r-2::before{background:var(--jade)}
.list-card.r-3::before{background:var(--primary)}
.list-card.r-4::before{background:var(--accent)}
.list-card:hover{transform:translateY(-4px);box-shadow:0 14px 0 -4px var(--primary-ink)}
.list-card-link{display:flex;flex-direction:column;height:100%}
.list-card-media{position:relative;aspect-ratio:16/9;background:#D9D0C2;overflow:hidden}
.list-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.list-card:hover .list-card-media img{transform:scale(1.04)}
.list-card-badge{position:absolute;left:12px;top:14px;font-size:12px;padding:3px 9px;border-radius:var(--r-tag);font-family:var(--font-mono)}
.badge-jade{background:rgba(62,142,126,.94);color:#F2EDE4}
.badge-warn{background:rgba(224,145,59,.95);color:#2E1B3D}
.badge-gray{background:rgba(38,34,41,.72);color:#F2EDE4}
.list-card-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1 1 auto}
.list-card-tags{display:flex;flex-wrap:wrap;gap:8px}
.list-card-tags .site-tag{background:var(--panel-2)}
.list-card-title{font-size:18px;font-weight:700;line-height:1.45;color:var(--primary-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.list-card-desc{font-size:14.5px;line-height:1.7;color:var(--text-soft);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.list-card-meta{margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--text-soft);font-family:var(--font-mono)}
.more-wrap{margin-top:34px;text-align:center}
/* 排行 */
.rank-list{display:flex;flex-direction:column;gap:14px;margin-top:28px}
.rank-item{display:flex;gap:20px;align-items:flex-start;background:rgba(246,242,234,.05);border:1px solid rgba(216,207,192,.18);border-radius:12px;padding:18px 22px;transition:background-color .2s,transform .2s}
.rank-item:hover{background:rgba(246,242,234,.09);transform:translateX(3px)}
.rank-num{font-family:var(--font-mono);font-size:29px;font-weight:700;color:var(--accent);line-height:1;min-width:52px}
.rank-body{flex:1 1 auto}
.rank-body h3{font-size:17px;font-weight:700;color:var(--text-inv)}
.rank-body p{font-size:14px;line-height:1.7;color:var(--ink-soft);margin-top:6px}
.rank-score{font-family:var(--font-mono);font-size:13px;color:var(--ink-soft-2);white-space:nowrap;padding-top:5px}
/* FAQ */
.site-accordion .accordion-item{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden}
.site-accordion .accordion-button{position:relative;background:transparent;box-shadow:none;border:0;font-size:17px;font-weight:700;color:var(--primary-ink);padding:18px 62px 18px 22px;line-height:1.5}
.site-accordion .accordion-button:not(.collapsed){color:var(--primary);background:var(--panel-2);box-shadow:inset 3px 0 0 var(--primary)}
.site-accordion .accordion-button::after{display:none}
.site-accordion .accordion-button::before{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);width:26px;height:26px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--r-tag);background:var(--panel);font-family:var(--font-mono);font-size:16px;color:var(--primary)}
.site-accordion .accordion-button:not(.collapsed)::before{content:"−"}
.site-accordion .accordion-button:focus{box-shadow:0 0 0 3px rgba(224,145,59,.35)}
.site-accordion .accordion-body{font-size:15px;line-height:1.75;color:var(--text-soft);padding:14px 22px 20px;background:var(--panel-2)}
/* 表单 */
.sub-strip{display:grid;grid-template-columns:1.05fr 1fr;gap:34px;align-items:center}
.sub-strip h2{font-size:clamp(21px,2.4vw,28px);color:var(--text-inv)}
.sub-strip .sub-desc{margin-top:12px;font-size:15px;line-height:1.8;color:var(--ink-soft);max-width:52ch}
.sub-form{display:flex;gap:12px;flex-wrap:wrap}
.site-input{width:100%;padding:12px 14px;border-radius:var(--r-input);background:var(--panel-2);border:1px solid var(--line);font-size:15px;color:var(--text);transition:border-color .18s,box-shadow .18s}
.site-input::placeholder{color:rgba(38,34,41,.5)}
.site-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(75,46,99,.18)}
.sub-form .site-input{flex:1 1 240px;width:auto}
.sub-note{margin-top:14px;font-size:13px;line-height:1.7;color:var(--ink-soft-2)}
.sub-note.is-ok{color:#8ED6C4}
/* 底部转化带 */
.cta-band{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.cta-card{display:flex;flex-direction:column;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-card);padding:28px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),var(--shadow-card);transition:transform .24s,box-shadow .24s}
.cta-card:hover{transform:translateY(-4px);box-shadow:0 14px 0 -4px var(--primary-ink)}
.cta-card h3{font-size:19px;font-weight:700;color:var(--primary-ink)}
.cta-card p{font-size:14.5px;line-height:1.75;color:var(--text-soft)}
.cta-card .site-btn{margin-top:auto;align-self:flex-start}
/* 页脚 */
.site-footer{background:var(--bg-ink-2);color:var(--ink-soft);padding:56px 0 26px;font-size:14px}
.site-footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:32px}
.site-footer-brand{display:flex;align-items:baseline;gap:4px;font-size:18px;font-weight:900;color:var(--text-inv);margin-bottom:12px}
.site-footer-brand span{font-size:12px;color:var(--accent);letter-spacing:.06em}
.site-footer h4{font-size:14px;font-weight:700;color:var(--text-inv);margin-bottom:14px;letter-spacing:.04em}
.site-footer li{margin-bottom:9px;line-height:1.7}
.site-footer a:hover{color:var(--accent)}
.site-footer-bottom{margin-top:36px;padding-top:18px;border-top:1px dashed rgba(216,207,192,.28);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--ink-soft-2)}
/* 动效 */
html.js .reveal{opacity:0;transform:translateY(12px)}
html.js .reveal.is-in{opacity:1;transform:none;transition:opacity .4s ease,transform .4s ease}
@media (prefers-reduced-motion: reduce){
  html.js .reveal{opacity:1;transform:none}
  html{scroll-behavior:auto}
}
/* 响应式 */
@media (min-width:992px){
  .site-section{padding:80px 0}
  .cat-head{padding:40px 0 44px}
}
@media (max-width:991.98px){
  .site-topbar .container{flex-wrap:wrap;padding-top:10px;padding-bottom:10px;gap:10px}
  .site-logo{order:1}
  .site-topbar-right{order:2}
  .site-nav-main{order:3;flex-basis:100%;width:100%;gap:16px}
  .site-footer-grid{grid-template-columns:1fr 1fr;gap:26px}
  .sub-strip{grid-template-columns:1fr;gap:24px}
}
@media (max-width:767.98px){
  body{font-size:15px}
  .site-section{padding:52px 0}
  .cat-head-inner{gap:20px;align-items:flex-start}
  .cat-head-stat{gap:20px}
  .stat-num{font-size:20px}
  .cta-band{grid-template-columns:1fr}
  .rank-item{flex-wrap:wrap;gap:12px;padding:16px 18px}
  .rank-score{margin-left:52px;padding-top:0}
  .list-card{border-radius:12px}
}
@media (max-width:575.98px){
  .container{padding:0 16px}
  .site-btn{padding:11px 18px;font-size:14px}
  .site-footer{padding:44px 0 22px}
  .site-footer-grid{grid-template-columns:1fr;gap:22px}
  .site-footer-bottom{flex-direction:column;gap:8px}
  .sub-form .site-input{flex-basis:100%}
  .sub-form .site-btn{width:100%}
  .rank-num{font-size:24px;min-width:42px}
  .rank-score{margin-left:42px}
}

/* roulang: framework shim */
/* 覆盖 Bootstrap 等对 a/btn 的全局默认，避免导航出现下划线/蓝链 */
.site-header a,.site-header a:hover,.navbar a,.navbar a:hover,.nav-links a,.nav-links a:hover,header nav a,header nav a:hover{text-decoration:none}
.site-header .btn,.navbar .btn,.nav-cta{text-decoration:none}