:root {
  --paper: #f4f6f5;
  --panel: #ffffff;
  --ink: #171b1a;
  --muted: #66706c;
  --rule: #cbd1ce;
  --rule-strong: #8b9590;
  --red: #b3261e;
  --yellow: #f1c84b;
  --green: #32735d;
  --blue: #4072a8;
  --soft: #e9eeeb;
  color-scheme: light;
  font-family: "Microsoft YaHei UI", "PingFang SC", sans-serif;
}

:root[data-theme="dark"] { --paper:#111514; --panel:#191e1c; --ink:#eef2ef; --muted:#9da8a3; --rule:#39413d; --rule-strong:#68736e; --soft:#232a27; color-scheme:dark; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); letter-spacing: 0; }
button, input { font: inherit; }
button:focus-visible, input:focus-visible, a:focus-visible { outline: 3px solid color-mix(in srgb, var(--yellow) 70%, transparent); outline-offset: 2px; }
.topbar { min-height: 64px; padding: 10px max(20px, calc((100vw - 1440px)/2)); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--ink); background:var(--panel); position:sticky; top:0; z-index:20; }
.brand { color:inherit; text-decoration:none; display:flex; align-items:center; gap:12px; }
.brand-mark { width:34px; height:34px; display:grid; grid-template-columns:1fr 1fr; border:1px solid var(--ink); gap:3px; padding:4px; transform:rotate(45deg); }
.brand-mark i { background:var(--ink); opacity:.16; } .brand-mark i:first-child { background:var(--red); opacity:1; }
.brand b { display:block; font-family:"SimSun", serif; font-size:16px; } .brand small { display:block; margin-top:3px; font:9px Consolas, monospace; color:var(--muted); }
.top-actions { display:flex; align-items:center; gap:16px; }.status-dot { font-size:12px; color:var(--green); }.status-dot::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--green); display:inline-block; margin-right:7px; }
.icon-button { width:36px;height:36px;border:1px solid var(--rule);background:var(--panel);color:var(--ink);cursor:pointer;font-size:18px; }
main { max-width:1440px; margin:auto; padding:0 20px 72px; }
.intro { min-height:360px; display:grid; grid-template-columns:1.35fr .65fr; align-items:end; gap:40px; padding:64px 0 42px; border-bottom:1px solid var(--ink); }
.kicker,.eyebrow { margin:0 0 16px; color:var(--red); font:11px Consolas,"Microsoft YaHei UI",sans-serif; text-transform:uppercase; }
.intro h1 { margin:0; max-width:760px; font-family:"SimSun","Songti SC",serif; font-size:clamp(48px,7vw,98px); font-weight:700; line-height:.98; }
.intro-meta>p { margin:0 0 28px; color:var(--muted); line-height:1.8; font-size:14px; max-width:500px; }
.intro-meta dl { display:grid; grid-template-columns:repeat(3,1fr); margin:0; border-top:1px solid var(--ink); }
.intro-meta dl div { padding:12px 8px 0 0; }.intro-meta dt { color:var(--muted); font-size:10px; }.intro-meta dd { margin:7px 0 0; font:700 16px Consolas,monospace; }
.workbench { display:grid; grid-template-columns:320px minmax(0,1fr); border:1px solid var(--ink); border-top:0; background:var(--panel); }
.zone-panel { border-right:1px solid var(--ink); min-width:0; }.panel-heading,.block-title { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 18px;border-bottom:1px solid var(--rule); }
.panel-heading>div,.block-title>div { display:flex;align-items:center;gap:12px; }.panel-heading h2,.block-title h3 { margin:0;font:700 15px "SimSun",serif; }.panel-heading span,.block-title span:first-child { font:10px Consolas,monospace;color:var(--red); }.panel-heading>span,.block-title small { color:var(--muted);font:10px Consolas,monospace; }
.search-box { margin:14px; height:42px; display:grid;grid-template-columns:24px 1fr auto;align-items:center;border:1px solid var(--rule-strong);padding:0 10px;gap:5px;background:var(--paper); }
.search-box input { min-width:0;border:0;outline:0;background:transparent;color:var(--ink);font-size:13px; }.search-box kbd { border:1px solid var(--rule);padding:2px 6px;color:var(--muted);font:10px Consolas,monospace; }
.zone-list { max-height:870px;overflow:auto;border-top:1px solid var(--rule); }.region-group { border-bottom:1px solid var(--rule); }.region-name { padding:12px 14px 6px;color:var(--muted);font:10px Consolas,monospace;text-transform:uppercase; }
.zone-button { width:100%;border:0;border-top:1px solid color-mix(in srgb,var(--rule) 55%,transparent);background:transparent;color:var(--ink);padding:11px 14px;text-align:left;cursor:pointer;display:flex;justify-content:space-between;gap:8px;font-size:13px; }.zone-button:hover { background:var(--soft); }.zone-button.active { background:var(--ink);color:var(--paper); }.zone-button small { font:9px Consolas,monospace;opacity:.65; }
.result-panel { min-width:0;padding:26px; }.result-head { display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-bottom:24px;border-bottom:1px solid var(--ink); }.result-head h2 { margin:0;font:700 clamp(42px,6vw,74px)/1 "SimSun",serif; }.period-stamp { margin:10px 0 0;color:var(--muted);font:11px Consolas,"Microsoft YaHei UI",sans-serif; }.result-actions { display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end; }
.button { min-height:38px;border:1px solid var(--ink);padding:8px 14px;cursor:pointer;font-size:12px;color:var(--ink);background:var(--panel); }.button.primary { background:var(--ink);color:var(--paper); }.button:hover { opacity:.78; }
.metric-strip { display:grid;grid-template-columns:repeat(3,1fr);margin:20px 0;gap:1px;background:var(--rule);border:1px solid var(--rule); }.metric { background:var(--paper);padding:15px; }.metric span { color:var(--muted);font-size:10px; }.metric strong { display:block;margin-top:7px;font:700 24px Consolas,monospace; }.metric small { font-size:10px;color:var(--muted); }
.data-block { border:1px solid var(--rule-strong);margin-top:18px; }.table-scroll { overflow:auto; } table { width:100%;border-collapse:collapse;min-width:620px; } th,td { padding:14px 16px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);text-align:left;font-size:13px; } th:last-child,td:last-child { border-right:0; } th { background:var(--soft);color:var(--muted);font:10px Consolas,"Microsoft YaHei UI",sans-serif;text-transform:uppercase; } th small { font-size:9px;font-weight:400; } td:not(:first-child) { font-family:Consolas,monospace; } tr:last-child td { border-bottom:0; }.active-row td { background:color-mix(in srgb,var(--yellow) 16%,var(--panel)); }.note { margin:0;padding:13px 16px;color:var(--muted);font-size:11px;line-height:1.7;border-top:1px solid var(--rule); }
.badge { padding:4px 7px!important;border:1px solid var(--green);color:var(--green)!important;font-size:9px!important; }.badge.sample { border-style:dashed;border-color:var(--red);color:var(--red)!important; }
.tou-head { padding:16px;display:flex;justify-content:space-between;gap:18px; }.tou-head strong { font-family:"SimSun",serif; }.tou-head p { margin:7px 0 0;color:var(--muted);font-size:11px;max-width:620px;line-height:1.6; }.legend { display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end; }.legend-item { display:flex;align-items:center;gap:5px;font:10px Consolas,monospace; }.swatch { width:10px;height:10px;border:1px solid var(--rule); }
.timeline-list { padding:0 16px 14px; }.timeline { margin-top:12px; }.timeline-label { margin-bottom:5px;color:var(--muted);font:10px Consolas,monospace; }.hour-strip { display:grid;grid-template-columns:repeat(24,1fr);height:30px;border:1px solid var(--rule); }.hour { position:relative;border-right:1px solid color-mix(in srgb,var(--panel) 45%,transparent); }.hour:hover::after { content:attr(data-title);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:5px 7px;white-space:nowrap;font:10px Consolas,monospace;z-index:3; }.axis { display:flex;justify-content:space-between;margin-top:4px;color:var(--muted);font:9px Consolas,monospace; }.level-S{background:var(--red)}.level-P{background:#e59045}.level-F{background:var(--yellow)}.level-V{background:var(--green)}.level-D{background:var(--blue)}
.callout { margin:0 16px 16px;border-left:3px solid var(--yellow);background:var(--soft);padding:12px 14px;color:var(--muted);font-size:11px;line-height:1.7; }.callout p { margin:0 0 5px; }.callout p:last-child { margin:0; }
.compare-section,.source-section { padding:56px 0;border-bottom:1px solid var(--ink); }.section-head { display:flex;justify-content:space-between;align-items:end;margin-bottom:20px; }.section-head h2,.source-section>div>h2 { margin:0;font:700 38px "SimSun",serif; }
.source-section { display:grid;grid-template-columns:260px 1fr;gap:50px; }.source-grid { display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--ink); }.source-grid article { padding:20px;border-right:1px solid var(--rule); }.source-grid article:last-child { border-right:0; }.source-grid span { color:var(--red);font:10px Consolas,monospace; }.source-grid h3 { margin:30px 0 12px;font:700 17px "SimSun",serif; }.source-grid p { color:var(--muted);font-size:12px;line-height:1.8; }.source-grid a { color:var(--ink);font-size:12px;text-underline-offset:4px; }
footer { max-width:1440px;margin:auto;border-top:1px solid var(--ink);padding:20px;display:flex;justify-content:space-between;color:var(--muted);font:10px Consolas,"Microsoft YaHei UI",sans-serif; }.toast { position:fixed;right:20px;bottom:20px;background:var(--ink);color:var(--paper);padding:12px 16px;font-size:12px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s;z-index:50; }.toast.show { opacity:1;transform:none; }
@media (max-width:900px){.intro{grid-template-columns:1fr;min-height:auto}.workbench{grid-template-columns:1fr}.zone-panel{border-right:0;border-bottom:1px solid var(--ink)}.zone-list{max-height:320px}.source-section{grid-template-columns:1fr}.source-grid{grid-template-columns:1fr}.source-grid article{border-right:0;border-bottom:1px solid var(--rule)}.source-grid article:last-child{border-bottom:0}}
@media (max-width:620px){main{padding-inline:12px}.topbar{padding-inline:14px}.status-dot{display:none}.intro{padding:40px 0 28px;gap:26px}.intro h1{font-size:47px}.intro-meta dl{grid-template-columns:1fr 1fr}.intro-meta dl div:last-child{display:none}.result-panel{padding:14px}.result-head{align-items:flex-start;flex-direction:column}.result-actions{justify-content:flex-start}.metric-strip{grid-template-columns:1fr}.metric{display:flex;justify-content:space-between;align-items:end}.metric strong{margin-top:0}.tou-head{flex-direction:column}.legend{justify-content:flex-start}footer{flex-direction:column;gap:8px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.toast{transition:none}}