* { box-sizing:border-box; }
body { background:var(--bg); color:var(--text); font:14px/1.5 -apple-system,"Segoe UI",Roboto,Helvetica,sans-serif; margin:0; padding:18px 0 40px; }
a { text-decoration:none; color:var(--link); }

/* ── Nav ── */
.site-nav { display:flex; align-items:center; gap:10px; padding:10px 18px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.site-nav .nav-logo { font-weight:800; font-size:15px; color:var(--text); text-decoration:none; }
.site-nav .nav-links { display:flex; gap:8px; flex-wrap:wrap; flex:1; }
.site-nav .nav-links a { font-size:13px; color:var(--muted); padding:4px 8px; border-radius:7px; }
.site-nav .nav-links a:hover { color:var(--text); background:var(--panel); }
.nav-ctrls { display:flex; align-items:center; gap:8px; margin-left:auto; }
.theme-switch { background:none; border:1px solid var(--line); border-radius:20px; padding:4px 8px; cursor:pointer; font-size:14px; color:var(--text); display:flex; align-items:center; gap:4px; }
.theme-switch .sun,.theme-switch .moon { display:none; }
[data-theme="dark"] .theme-switch .sun { display:inline; }
[data-theme="light"] .theme-switch .moon { display:inline; }
:not([data-theme]) .theme-switch .moon { display:inline; }
.theme-switch .knob { display:none; }
.lang-toggle { display:flex; gap:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; font-size:12px; font-weight:700; }
.lang-toggle .opt { padding:3px 9px; cursor:pointer; color:var(--muted); }
.lang-toggle .opt.active,.lang-toggle .opt:hover { background:var(--link); color:#fff; }

/* ── Wrap ── */
.wrap { padding:18px 20px; max-width:1360px; margin:0 auto; }
@media (min-width:1100px) { .wrap { padding:20px max(28px,calc((100vw - 1360px)/2)); } }

/* ── Header ── */
.sot-head { display:flex; flex-wrap:wrap; align-items:flex-start; gap:12px 20px; margin-bottom:14px; }
.sot-title { margin:0; font-size:22px; font-weight:800; letter-spacing:-.02em; }
.sot-asof { font-size:12px; color:var(--muted); margin-top:3px; }
.sot-chips { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-left:auto; }

/* header summary chips */
.hchip { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:20px; border:1px solid var(--line); background:var(--panel); font-size:12px; font-weight:600; }
.hchip-val { font-weight:800; font-size:14px; }
.hchip.alert { border-color:color-mix(in srgb,var(--down) 40%,var(--line)); }
.hchip.alert .hchip-val { color:var(--down); }

/* ── Filter chips ── */
.filter-row { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.fchip { padding:6px 14px; border-radius:20px; border:1.5px solid var(--line); background:var(--panel); font-size:13px; font-weight:600; cursor:pointer; color:var(--muted); transition:all .15s; user-select:none; }
.fchip:hover { border-color:var(--link); color:var(--text); }
.fchip.on { border-color:var(--link); background:color-mix(in srgb,var(--link) 12%,var(--panel)); color:var(--link); }
.fchip.disabled { opacity:.45; cursor:default; pointer-events:none; }
.fchip .fc-n { font-weight:400; color:var(--muted); font-size:12px; margin-left:3px; }
.fchip.on .fc-n { color:var(--link); }

/* ── Legend ── */
.legend-row { display:flex; flex-wrap:wrap; gap:12px 20px; margin-bottom:14px; font-size:11.5px; color:var(--muted); align-items:center; }
.leg-item { display:flex; align-items:center; gap:5px; }
.dot { display:inline-block; width:11px; height:11px; border-radius:50%; flex:none; }
/* Valence-based dot classes (polarity-correct per leg) */
.dot.fav  { background:color-mix(in srgb,var(--up) 60%,transparent); border:1px solid color-mix(in srgb,var(--up) 80%,transparent); }
.dot.mid  { background:color-mix(in srgb,var(--warn) 70%,transparent); border:1px solid color-mix(in srgb,var(--warn) 80%,transparent); }
.dot.caut { background:color-mix(in srgb,var(--down) 70%,transparent); border:1px solid color-mix(in srgb,var(--down) 80%,transparent); }
.dot.neut { background:color-mix(in srgb,var(--muted) 35%,transparent); border:1px solid color-mix(in srgb,var(--muted) 50%,transparent); }
.dot.null { background:transparent; border:1.5px dashed var(--muted); opacity:.55; }
.stage-pill { display:inline-block; padding:1px 7px; border-radius:8px; font-size:10.5px; font-weight:700; letter-spacing:.03em; }

/* ── Matrix table ── */
.matrix-wrap { overflow-x:auto; border-radius:10px; border:1px solid var(--line); background:var(--panel); }
.matrix { width:100%; border-collapse:collapse; font-size:13px; }
.matrix th { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); padding:8px 10px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; cursor:pointer; user-select:none; }
.matrix th:hover { color:var(--text); }
.matrix th.sorted-asc::after { content:" ▲"; font-size:9px; }
.matrix th.sorted-desc::after { content:" ▼"; font-size:9px; }
.matrix td { padding:9px 10px; border-bottom:1px solid color-mix(in srgb,var(--line) 50%,transparent); vertical-align:middle; }
.matrix tr:last-child td { border-bottom:none; }
.matrix tr.hidden { display:none; }
.matrix tbody tr { cursor:pointer; transition:background .1s; }
.matrix tbody tr:hover td { background:color-mix(in srgb,var(--link) 5%,transparent); }
.matrix tbody tr.expanded td { background:color-mix(in srgb,var(--link) 7%,transparent); }

/* theme name cell */
.theme-name { font-weight:700; font-size:13.5px; }
.theme-zh { font-size:11px; color:var(--muted); display:block; margin-top:1px; }
.l-zh .theme-zh { display:block; }
.l-en .theme-zh { display:none; }

/* stage chips */
.stage-WATCH { background:color-mix(in srgb,var(--muted) 20%,var(--panel2)); color:var(--muted); }
.stage-BROADENING { background:color-mix(in srgb,var(--up) 18%,var(--panel2)); color:color-mix(in srgb,var(--up) 90%,var(--text)); }
.stage-RE-RATING { background:color-mix(in srgb,var(--link) 18%,var(--panel2)); color:var(--link); }
.stage-PRECIPICE { background:color-mix(in srgb,var(--warn) 20%,var(--panel2)); color:var(--warn); }
.stage-ACCELERATING { background:color-mix(in srgb,var(--up) 25%,var(--panel2)); color:var(--up); }
.stage-CORRECTING { background:color-mix(in srgb,var(--down) 18%,var(--panel2)); color:var(--down); }

/* leg dots row */
.legs-row { display:flex; gap:5px; align-items:center; }

/* falsifier badge */
.falsbadge { font-size:11.5px; font-weight:700; padding:2px 7px; border-radius:7px; white-space:nowrap; }
.falsbadge.fired { background:color-mix(in srgb,var(--down) 18%,var(--panel2)); color:var(--down); }
.falsbadge.clean { background:color-mix(in srgb,var(--up) 12%,var(--panel2)); color:color-mix(in srgb,var(--up) 90%,var(--text)); }
.falsbadge.null { color:var(--muted); background:var(--panel2); }

/* divergence label */
.divlabel { font-size:11.5px; color:var(--muted); white-space:nowrap; }
.divlabel.opp { color:var(--up); font-weight:600; }
.divlabel.crowd { color:var(--warn); font-weight:600; }

/* ── Drawer ── */
.drawer-row td { padding:0; }
.drawer { padding:14px 16px 18px; border-top:1px solid var(--line); background:color-mix(in srgb,var(--panel2) 60%,var(--panel)); }
.drawer-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 20px; }
@media (max-width:720px) { .drawer-grid { grid-template-columns:1fr; } }
.drawer-sec h4 { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:0 0 5px; font-weight:700; }
.drawer-sec p { margin:0; font-size:13px; line-height:1.6; color:var(--text); }
.drawer-sec.full { grid-column:1/-1; }

/* pathway flow */
.pathway-flow { display:flex; flex-wrap:wrap; align-items:center; gap:5px; font-size:12.5px; }
.pnode { padding:3px 9px; border-radius:8px; border:1px solid var(--line); background:var(--panel); font-weight:600; white-space:nowrap; }
.pnode.driver { border-color:color-mix(in srgb,var(--link) 40%,var(--line)); color:var(--link); }
.pnode.bottleneck { border-color:color-mix(in srgb,var(--warn) 40%,var(--line)); color:var(--warn); }
.pnode.winner { border-color:color-mix(in srgb,var(--up) 40%,var(--line)); color:color-mix(in srgb,var(--up) 90%,var(--text)); }
.pnode.avoid { border-color:color-mix(in srgb,var(--down) 40%,var(--line)); color:var(--down); }
.parrow { color:var(--muted); font-size:15px; }

/* falsifier table */
.fals-table { width:100%; border-collapse:collapse; font-size:12px; margin-top:4px; }
.fals-table th { text-align:left; color:var(--muted); font-weight:600; font-size:10.5px; text-transform:uppercase; padding:4px 6px; border-bottom:1px solid var(--line); }
.fals-table td { padding:5px 6px; border-bottom:1px solid color-mix(in srgb,var(--line) 40%,transparent); vertical-align:top; line-height:1.45; }
.fals-table tr:last-child td { border-bottom:none; }
.fals-state { font-size:10.5px; font-weight:700; padding:1px 6px; border-radius:5px; white-space:nowrap; }
.fals-state.FIRED { background:color-mix(in srgb,var(--down) 20%,var(--panel2)); color:var(--down); }
.fals-state.ARMED { background:color-mix(in srgb,var(--warn) 20%,var(--panel2)); color:var(--warn); }
.fals-state.qualitative { background:var(--panel); color:var(--muted); }
.fals-state.data_missing { background:var(--panel); color:var(--muted); }

/* evidence refs */
.evid-list { font-size:12px; color:var(--muted); margin:4px 0 0; padding:0; list-style:none; }
.evid-list li::before { content:"· "; }

/* ── Weekly delta strip ── */
.delta-strip { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin-bottom:16px; }
.delta-strip h3 { font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin:0 0 8px; font-weight:700; }
.delta-items { display:flex; flex-wrap:wrap; gap:8px; }
.delta-item { font-size:12.5px; padding:4px 10px; border-radius:8px; border:1px solid var(--line); background:var(--panel2); }
.delta-item.transition { border-color:color-mix(in srgb,var(--link) 35%,var(--line)); }
.delta-item.fired { border-color:color-mix(in srgb,var(--down) 35%,var(--line)); color:var(--down); }
.delta-none { font-size:12.5px; color:var(--muted); font-style:italic; }

/* ── Collision footnote ── */
.collision-note { font-size:11.5px; color:var(--muted); margin-top:14px; padding-top:10px; border-top:1px solid var(--line); line-height:1.6; }

/* ── Context drawer sections ── */
.ctx-row { display:flex; justify-content:space-between; align-items:baseline; gap:8px; padding:3px 0; border-bottom:1px solid color-mix(in srgb,var(--line) 30%,transparent); font-size:12.5px; line-height:1.5; }
.ctx-row:last-child { border-bottom:none; }
.ctx-row-label { color:var(--muted); flex:0 0 auto; max-width:55%; }
.ctx-row-value { font-weight:600; text-align:right; }
.ctx-stance { font-size:12.5px; color:var(--text); margin:0 0 6px; padding:4px 0; border-bottom:1px solid color-mix(in srgb,var(--line) 40%,transparent); font-weight:600; }
.ctx-plain { font-size:12.5px; color:var(--text); margin:0; line-height:1.6; }
.ctx-page-note { font-size:11.5px; color:var(--muted); margin-top:10px; padding-top:10px; border-top:1px solid var(--line); line-height:1.6; font-style:italic; }
.ctx-h4-wrap { display:flex; align-items:center; gap:6px; margin:0 0 5px; }
.ctx-h4-wrap h4 { margin:0; }
.ctx-tip-icon { font-size:11px; color:var(--muted); cursor:default; border:1px solid var(--line); border-radius:50%; width:14px; height:14px; display:inline-flex; align-items:center; justify-content:center; flex:none; }

/* ── Bilingual toggle ── */
[data-lang="zh"] .l-en { display:none; }
[data-lang="zh"] .l-zh { display:inline; }
.l-zh { display:none; }
.l-en { display:inline; }

/* ── Empty state ── */
.empty-state { text-align:center; padding:48px 20px; color:var(--muted); }
.empty-state h2 { font-size:17px; margin:0 0 8px; }