
:root{--bg:#0b0a0d;--panel:#141218;--panel2:#17151c;--ink:#ece7dd;--muted:rgba(236,231,221,.5);--faint:rgba(236,231,221,.32);--gold:#e3c07a;--gold2:#caa256;--line:rgba(227,192,122,.16);--line2:rgba(255,255,255,.06)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:var(--bg);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",sans-serif;overflow:hidden}
body{background:radial-gradient(1200px 700px at 78% -8%,rgba(227,192,122,.07),transparent 60%),radial-gradient(900px 600px at 110% 120%,rgba(120,180,140,.04),transparent 55%),var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
#bgfx{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.serif{font-family:"Noto Serif SC","Songti SC",serif}
.shell{display:flex;height:100vh;overflow:hidden;position:relative;z-index:1}
.sidebar{width:270px;flex-shrink:0;background:linear-gradient(180deg,rgba(20,18,24,.96),rgba(11,10,13,.96));border-right:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden;backdrop-filter:blur(4px)}
.sidebar-hdr{padding:20px 18px 12px;border-bottom:1px solid var(--line)}
.s-title{font-family:"Noto Serif SC","Songti SC",serif;color:#fff;font-size:15px;font-weight:700;margin-bottom:5px;line-height:1.4}
.s-sub{color:var(--faint);font-size:11px;margin-bottom:9px;letter-spacing:.3px}
.s-count{display:inline-block;background:rgba(227,192,122,.12);border:1px solid var(--line);color:var(--gold);font-size:11px;padding:3px 12px;border-radius:20px;letter-spacing:.5px}
.pri-stats{display:flex;gap:6px;flex-wrap:wrap;padding:12px 16px 4px}
.pri-stat{display:inline-flex;align-items:center;gap:0;border-radius:7px;overflow:hidden;border:1px solid var(--line2);font-family:"Space Grotesk",monospace;line-height:1}
.pri-stat-k{font-size:10px;font-weight:700;padding:4px 7px;letter-spacing:.3px}
.pri-stat-n{font-size:12px;font-weight:700;padding:4px 8px;background:rgba(0,0,0,.25);color:#fff;min-width:22px;text-align:center}
.pri-stat-hl{border-color:rgba(227,192,122,.45)} .pri-stat-hl .pri-stat-k{background:rgba(227,192,122,.16);color:var(--gold)}
.pri-stat-p0{border-color:rgba(216,99,99,.45)} .pri-stat-p0 .pri-stat-k{background:rgba(216,99,99,.18);color:#e08a8a}
.pri-stat-p1{border-color:rgba(214,158,86,.4)} .pri-stat-p1 .pri-stat-k{background:rgba(214,158,86,.16);color:#e0b06a}
.pri-stat-p2{border-color:rgba(227,192,122,.35)} .pri-stat-p2 .pri-stat-k{background:rgba(227,192,122,.14);color:var(--gold)}
.pri-stat-p3{border-color:rgba(160,160,150,.3)} .pri-stat-p3 .pri-stat-k{background:rgba(160,160,150,.12);color:#a9a499}
.pri-filter{display:flex;gap:5px;padding:11px 16px;border-bottom:1px solid var(--line2);flex-wrap:wrap}
.pri-btn{background:rgba(255,255,255,.04);border:1px solid var(--line2);color:var(--faint);font-size:10px;font-weight:700;padding:3px 11px;border-radius:20px;cursor:pointer;transition:all .15s;font-family:"Space Grotesk",monospace}
.pri-btn:hover{background:rgba(227,192,122,.1);color:var(--gold)}
.pri-btn.active{color:#fff}
.pri-btn.all.active{background:rgba(227,192,122,.16);border-color:var(--gold2);color:var(--gold)}
.pri-btn.hl.active{background:rgba(227,192,122,.18);border-color:rgba(227,192,122,.55);color:var(--gold)}
.pri-btn.p0.active{background:rgba(216,99,99,.2);border-color:rgba(216,99,99,.5);color:#e08a8a}
.pri-btn.p1.active{background:rgba(214,158,86,.16);border-color:rgba(214,158,86,.4);color:#e0b06a}
.pri-btn.p2.active{background:rgba(227,192,122,.14);border-color:rgba(227,192,122,.35);color:var(--gold)}
.pri-btn.p3.active{background:rgba(160,160,150,.1);border-color:rgba(160,160,150,.3);color:#a9a499}
.nav-list{flex:1;overflow-y:auto;padding:6px 0}
.nav-list::-webkit-scrollbar{width:3px}
.nav-list::-webkit-scrollbar-thumb{background:var(--line)}
.nav-item{display:flex;align-items:flex-start;gap:7px;padding:10px 14px;cursor:pointer;border-left:2px solid transparent;transition:all .15s}
.nav-item:hover{background:rgba(227,192,122,.05)}
.nav-item.active{background:rgba(227,192,122,.08);border-left-color:var(--gold)}
.nav-item.hidden{display:none}
.sec-divider{display:flex;align-items:baseline;gap:10px;margin:18px 0 8px;padding:7px 12px;border-radius:7px;font-size:13px}
.sec-divider b{font-weight:700;letter-spacing:.5px}
.sec-divider span{font-size:11px;opacity:.65;font-weight:400}
.sec-divider.sd-exp{background:rgba(96,170,255,.1);border-left:3px solid rgba(96,170,255,.6);color:#8ec5ff}
.sec-divider.sd-qc{background:rgba(229,198,138,.1);border-left:3px solid rgba(229,198,138,.6);color:#e5c68a}
.nav-cat-div{padding:13px 18px 5px;font-size:10.5px;font-weight:700;letter-spacing:1.5px;color:var(--gold);opacity:.75;display:flex;align-items:center;gap:7px}
.nav-cat-div::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(227,192,122,.25),transparent)}
.nav-cat-div.hidden{display:none}
.nav-item.nav-score{margin:6px 8px;padding:11px 12px;border-left:none;border:1px solid rgba(227,192,122,.35);border-radius:10px;background:linear-gradient(135deg,rgba(227,192,122,.12),rgba(227,192,122,.04));position:relative}
.nav-item.nav-score .nav-num{color:var(--gold);font-size:13px;text-shadow:0 0 8px rgba(227,192,122,.6)}
.nav-item.nav-score .nav-title{color:var(--gold);font-weight:700;letter-spacing:.5px}
.nav-item.nav-score .nav-go{flex-shrink:0;color:rgba(227,192,122,.55);font-size:11px;margin-top:1px;transition:transform .15s}
.nav-item.nav-score:hover{background:linear-gradient(135deg,rgba(227,192,122,.2),rgba(227,192,122,.08));border-color:rgba(227,192,122,.6);box-shadow:0 2px 12px rgba(227,192,122,.12)}
.nav-item.nav-score:hover .nav-go{transform:translateX(3px);color:var(--gold)}
.nav-item.nav-score.active{background:linear-gradient(135deg,rgba(227,192,122,.24),rgba(227,192,122,.1));border-color:var(--gold)}
.nav-num{flex-shrink:0;color:var(--faint);font-size:11px;font-weight:700;margin-top:1px;width:20px;font-family:"Space Grotesk",monospace}
.nav-item.active .nav-num{color:var(--gold)}
.nav-title{color:var(--muted);font-size:12px;line-height:1.5;flex:1}
.nav-item.active .nav-title{color:#fff}
.main{flex:1;overflow-y:auto;min-width:0;background:transparent}
.main::-webkit-scrollbar{width:5px}
.main::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.slide{display:none;padding:26px 30px 40px;max-width:1180px}
.slide.active{display:block}
.cover-slide{display:none;padding:0}
.cover-slide.active{display:flex;align-items:center;justify-content:center;min-height:100%}
.cover-inner{text-align:center;padding:60px 40px}
.cover-icon{font-size:52px;margin-bottom:20px;filter:drop-shadow(0 0 18px rgba(227,192,122,.4))}
.cover-logo{width:84px;height:84px;object-fit:contain;border-radius:16px;margin:0 auto 22px;display:block}
.cover-title{font-family:"Noto Serif SC","Songti SC",serif;font-weight:900;font-size:40px;margin-bottom:14px;line-height:1.2;background:linear-gradient(180deg,#f4e4bf 0%,#e3c07a 55%,#b5893f 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 50px rgba(227,192,122,.25)}
.cover-meta{color:var(--muted);font-size:13px;margin-bottom:24px;letter-spacing:2px;text-transform:uppercase;font-family:"Space Grotesk",monospace}
.cover-badge{display:inline-block;background:rgba(227,192,122,.1);border:1px solid var(--line);color:var(--gold);padding:8px 24px;border-radius:24px;font-size:13px;letter-spacing:1px}
.section-filter{display:grid;grid-template-columns:1fr;gap:7px;padding:10px 16px 8px;border-bottom:1px solid var(--line2,rgba(255,255,255,.07))}
.section-filter-children{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:7px;padding-left:13px}
.section-filter-children::before{content:'';position:absolute;left:4px;top:4px;bottom:4px;width:1px;background:linear-gradient(180deg,rgba(227,192,122,.42),rgba(227,192,122,.08))}
.section-filter-btn{border:1px solid var(--line2,rgba(255,255,255,.07));background:rgba(255,255,255,.035);color:var(--faint,rgba(236,231,221,.5));border-radius:8px;padding:7px 9px;font-size:11px;font-weight:700;cursor:pointer;text-align:left;transition:all .15s}
.section-filter-all{color:rgba(236,231,221,.78);background:rgba(255,255,255,.045)}
.section-filter-child{font-size:10.5px;padding-left:10px;background:rgba(255,255,255,.03);border-color:rgba(227,192,122,.12);color:rgba(236,231,221,.62)}
.section-filter-btn:hover{background:rgba(227,192,122,.08);color:var(--gold,#e3c07a)}
.section-filter-btn.active{background:rgba(227,192,122,.15);border-color:rgba(227,192,122,.45);color:var(--gold,#e3c07a)}
.nav-item.nav-section-cover{margin:6px 8px;padding:12px;border-left:none;border:1px solid rgba(227,192,122,.32);border-radius:9px;background:linear-gradient(135deg,rgba(227,192,122,.13),rgba(227,192,122,.035))}
.nav-section-cover .nav-num{width:38px;color:var(--gold,#e3c07a)}
.nav-section-cover .nav-title{font-weight:800;color:#fff}
.slide-hdr{margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.slide-hdr h2{font-family:"Noto Serif SC","Songti SC",serif;color:#fff;font-size:19px;font-weight:700;line-height:1.5}
.mod-tag{display:inline-block;background:rgba(227,192,122,.12);color:var(--gold);font-size:10px;font-weight:700;padding:3px 11px;border-radius:20px;border:1px solid var(--line);letter-spacing:1px;font-family:"Space Grotesk",monospace}
/* ── 评分总览 ── */
.rd-wrap{display:grid;grid-template-columns:minmax(0,470px) 1fr;gap:20px;align-items:start;margin-bottom:18px}
.rd-chart{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:12px;padding:10px}
.rd-chart svg{width:100%;height:auto;display:block}
.rd-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:9px;padding:0 4px}
.rd-leg{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted)}
.rd-leg-dot{display:inline-block;width:9px;height:9px;border-radius:3px;flex-shrink:0;margin-right:0;vertical-align:middle}
.rd-summary{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:12px;padding:18px}
.rd-name{font-family:"Noto Serif SC","Songti SC",serif;font-size:15px;font-weight:700;color:#fff;margin-bottom:12px}
.rd-score-line{display:flex;align-items:flex-end;gap:12px;margin-bottom:16px}
.rd-big{font-family:"Space Grotesk",monospace;font-size:38px;font-weight:700;line-height:1;background:linear-gradient(180deg,#f4e4bf 0%,#e3c07a 55%,#b5893f 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.rd-big small{font-size:14px;-webkit-text-fill-color:var(--faint)}
.rd-grade{display:inline-flex;align-items:center;justify-content:center;font-weight:800;border-radius:7px;padding:1px 9px;font-size:13px;font-family:"Space Grotesk",monospace}
.rdg-S{background:rgba(227,192,122,.16);color:var(--gold);border:1px solid rgba(227,192,122,.45)}
.rdg-A{background:rgba(96,170,124,.14);color:#84c79b;border:1px solid rgba(96,170,124,.4)}
.rdg-B{background:rgba(120,160,220,.13);color:#9db8e8;border:1px solid rgba(120,160,220,.38)}
.rdg-C{background:rgba(214,158,86,.14);color:#e0b06a;border:1px solid rgba(214,158,86,.4)}
.rdg-D{background:rgba(216,99,99,.14);color:#e08a8a;border:1px solid rgba(216,99,99,.4)}
.rd-sw{display:flex;align-items:flex-start;gap:9px;font-size:12.5px;color:var(--muted);margin-bottom:8px;line-height:1.7}
.rd-sw b{color:#fff;font-weight:700}
.rd-tag{flex-shrink:0;font-size:10px;font-weight:700;padding:2px 9px;border-radius:5px;margin-top:2px;font-family:"Space Grotesk",monospace}
.rd-tag-up{background:rgba(96,170,124,.13);color:#84c79b;border:1px solid rgba(96,170,124,.35)}
.rd-tag-dn{background:rgba(216,99,99,.12);color:#e08a8a;border:1px solid rgba(216,99,99,.35)}
.rd-hl-wrap{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
.rd-hl{border-radius:14px;padding:18px 20px;position:relative;overflow:hidden}
.rd-hl::before{content:'';position:absolute;inset:0;opacity:.6;pointer-events:none}
.rd-hl-up{background:linear-gradient(145deg,rgba(96,170,124,.1),rgba(96,170,124,.025));border:1px solid rgba(96,170,124,.32)}
.rd-hl-dn{background:linear-gradient(145deg,rgba(216,99,99,.09),rgba(216,99,99,.02));border:1px solid rgba(216,99,99,.3)}
.rd-hl-hdr{display:flex;align-items:center;gap:8px;font-family:"Noto Serif SC","Songti SC",serif;font-size:14.5px;font-weight:700;margin-bottom:12px;letter-spacing:.5px}
.rd-hl-up .rd-hl-hdr{color:#9bd4ae}
.rd-hl-dn .rd-hl-hdr{color:#e69c9c}
.rd-hl-ico{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;font-size:11px}
.rd-hl-up .rd-hl-ico{background:rgba(96,170,124,.18);border:1px solid rgba(96,170,124,.4)}
.rd-hl-dn .rd-hl-ico{background:rgba(216,99,99,.16);border:1px solid rgba(216,99,99,.38)}
.rd-hl-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.rd-hl-list li{position:relative;padding-left:18px;font-size:13.5px;line-height:1.75;color:rgba(240,243,248,.88)}
.rd-hl-list li::before{content:'';position:absolute;left:2px;top:11px;width:6px;height:6px;transform:rotate(45deg)}
.rd-hl-list li.up::before{background:#84c79b;box-shadow:0 0 6px rgba(96,170,124,.5)}
.rd-hl-list li.dn::before{background:#e08a8a;box-shadow:0 0 6px rgba(216,99,99,.45)}
@media(max-width:880px){.rd-hl-wrap{grid-template-columns:1fr}}
.rd-board-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.rd-board{width:100%;border-collapse:collapse;font-size:12.5px;min-width:600px}
.rd-board th,.rd-board td{padding:9px 11px;text-align:center;border-bottom:1px solid var(--line2);white-space:nowrap}
.rd-board thead th{background:rgba(227,192,122,.06);color:var(--gold);font-weight:700;font-size:11px;letter-spacing:.5px}
.rd-board tbody tr:last-child td{border-bottom:none}
.rd-board td:first-child,.rd-board th:first-child{text-align:left}
.rd-prod{color:#fff;font-weight:600}
.rd-prod .rd-leg-dot{margin-right:7px}
.rd-ver{margin-left:7px;font-size:10px;color:var(--faint);font-weight:400}
.rd-w{display:block;font-size:9px;color:var(--faint);font-weight:400;margin-top:2px}
.rd-max{background:rgba(96,170,124,.1);color:#84c79b;font-weight:700}
td.rd-total{font-weight:800;color:#fff;font-family:"Space Grotesk",monospace}
.rd-dims{margin-top:16px;background:rgba(255,255,255,.015);border:1px solid var(--line2);border-radius:12px;padding:14px 18px}
.rd-dims-hdr{font-size:11px;font-weight:700;letter-spacing:1.5px;color:var(--gold);margin-bottom:9px;font-family:"Space Grotesk",monospace}
.rd-dim{font-size:12px;color:var(--muted);line-height:1.8}
.rd-dim b{color:#fff}
@media(max-width:880px){.rd-wrap{grid-template-columns:1fr}}
.cat-badge{display:inline-block;font-size:10px;font-weight:700;padding:3px 10px;border-radius:20px}
.compare-block{margin-bottom:16px}
.pair-num{color:var(--faint);font-size:10px;font-weight:700;letter-spacing:.5px;margin-bottom:7px;padding-left:2px;font-family:"Space Grotesk",monospace}
.compare-row{display:grid;grid-template-columns:1fr 1px 1fr;align-items:start;background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.col-div{background:var(--line)}
.col{min-width:0;display:flex;flex-direction:column}
.col-hdr{font-size:11px;font-weight:700;letter-spacing:1.5px;text-align:center;padding:9px 0}
.hdr-before{background:rgba(200,84,84,.12);color:#dd8d8d}
.hdr-after{background:rgba(96,170,124,.12);color:#84c79b}
.img-area{padding:12px;background:rgba(255,255,255,.015);display:flex;justify-content:center}
.img-item{position:relative;border-radius:8px;overflow:hidden;background:rgba(0,0,0,.25);width:100%;display:flex;justify-content:center}
.img-item img{max-width:100%;width:auto;height:auto;display:block;margin:0 auto;cursor:zoom-in;object-fit:contain;max-height:78vh}
.no-img{color:var(--faint);font-size:12px;text-align:center;padding:40px 0;width:100%}
.text-area{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:12px 0 18px}
.text-col{border-radius:13px;overflow:hidden;display:flex;flex-direction:column;border:1px solid rgba(221,141,141,.26);background:linear-gradient(180deg,rgba(221,141,141,.06),rgba(221,141,141,.012) 55%,transparent)}
.text-col:last-child{border-color:rgba(96,170,124,.26);background:linear-gradient(180deg,rgba(96,170,124,.06),rgba(96,170,124,.012) 55%,transparent)}
.text-lbl{font-size:11px;font-weight:700;letter-spacing:2px;text-align:center;padding:10px 16px;margin:0;font-family:"Space Grotesk",monospace}
.prob-lbl{color:#dd8d8d;background:rgba(221,141,141,.09);border-bottom:1px solid rgba(221,141,141,.2)}
.sug-lbl{color:#84c79b;background:rgba(96,170,124,.09);border-bottom:1px solid rgba(96,170,124,.18)}
.text-body{padding:15px 20px 17px}
.text-body p{color:rgba(248,246,241,.93);font-size:14.5px;line-height:1.85;margin-bottom:8px}
.text-body p:last-child{margin-bottom:0}
.diam{color:var(--gold);margin-right:8px;font-size:10px;vertical-align:1.5px;text-shadow:0 0 6px rgba(227,192,122,.45)}
.text-slide .slide-hdr h2{font-size:19px}
.text-page-content{padding:4px 0;max-width:820px}
.text-page-content p{color:rgba(248,246,241,.93);font-size:14.5px;line-height:1.95;margin-bottom:9px}
.ti-grid{display:grid;gap:14px;margin-top:20px}
.ti-grid-1{grid-template-columns:1fr}
.ti-grid-2{grid-template-columns:1fr 1fr}
.ti-grid-3{grid-template-columns:1fr 1fr 1fr}
.ti-img-item{border-radius:12px;overflow:hidden;background:rgba(255,255,255,.02);border:1px solid var(--line);display:flex;justify-content:center;padding:10px}
.ti-img-item img{max-width:100%;height:auto;display:block;cursor:zoom-in;border-radius:6px}
.ti-grid-2 .ti-img-item img,.ti-grid-3 .ti-img-item img{width:100%;object-fit:contain;max-height:520px}
.lb{display:none;position:fixed;inset:0;background:rgba(8,7,9,.96);z-index:999;flex-direction:column}
.lb.on{display:flex}
.lb-bar{display:flex;align-items:center;justify-content:center;gap:10px;padding:11px;border-bottom:1px solid var(--line)}
.lb-bt{background:rgba(227,192,122,.1);border:1px solid var(--line);color:var(--gold);min-width:34px;height:32px;border-radius:8px;cursor:pointer;font-size:17px;line-height:1;padding:0 10px}
.lb-bt:hover{background:rgba(227,192,122,.22)}
.lb-bt.lb-x{font-size:20px}
#lb-pct{min-width:56px;text-align:center;color:var(--gold);font-size:13px;font-family:"Space Grotesk",monospace}
.lb-stage{flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:grab;touch-action:none}
.lb-stage img{max-width:90%;max-height:100%;border-radius:6px;transform-origin:center center;will-change:transform;user-select:none;-webkit-user-drag:none}
.mob-nav-btn{display:none;position:fixed;top:10px;left:10px;z-index:300;background:var(--panel);border:1px solid var(--line);color:var(--gold);width:40px;height:40px;border-radius:8px;font-size:20px;cursor:pointer;align-items:center;justify-content:center;line-height:1}
.mob-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:250}
@media(max-width:768px){
  html,body{overflow:auto;height:auto}
  .shell{flex-direction:column;height:auto;min-height:100vh;overflow:visible}
  .sidebar{width:280px;position:fixed;left:-280px;top:0;height:100%;z-index:260;transition:left .25s;overflow-y:auto}
  .sidebar.mob-open{left:0}
  .mob-nav-btn{display:flex}
  .mob-overlay.mob-open{display:block}
  .main{overflow:visible;min-height:100vh;padding-top:58px}
  .slide{padding:16px 14px 28px}
  .cover-inner{padding:40px 20px}
  .cover-title{font-size:28px}
  .cover-meta{font-size:11px}
  .slide-hdr h2{font-size:16px}
  .compare-row{grid-template-columns:1fr}
  .col-div{display:none}
  .text-area{grid-template-columns:1fr;gap:12px}
  .text-body p{font-size:14px;line-height:1.8}
  .ti-grid-2,.ti-grid-3{grid-template-columns:1fr}
  .text-page-content p{font-size:14px}
  .ti-grid-2 .ti-img-item img,.ti-grid-3 .ti-img-item img{max-height:300px}
  .img-item img{max-height:62vh}
}
