:root{color-scheme:dark;--bg:#0b1018;--panel:#141e2b;--text:#edf3fb;--muted:#aebdd0;--accent:#9fc9ff;--border:#334356}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.65 system-ui,sans-serif}
header,main,footer{max-width:1180px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--border)}
a{color:var(--accent);text-underline-offset:3px}h1,h2,h3{line-height:1.2}h1{font-size:clamp(2rem,4.4vw,3.5rem);max-width:900px;margin:14px 0}h2{font-size:1.5rem}h3{font-size:1.1rem}
.hero{padding:28px 0}.eyebrow,.badge{color:var(--accent);font-size:.85rem}.eyebrow{letter-spacing:.08em}.lead{max-width:800px;font-size:1.15rem;color:var(--muted)}
.notice{border-left:3px solid var(--accent);background:var(--panel);padding:16px 20px;margin-bottom:28px}.layout{display:grid;grid-template-columns:minmax(280px,350px) minmax(0,1fr);gap:28px;align-items:start}
form,#results{background:var(--panel);padding:24px;border:1px solid var(--border);border-radius:12px;min-width:0}form h2,#results h2{margin-top:0}
label{display:block;font-weight:600;margin:18px 0 6px}input,select,button{width:100%;max-width:100%;font:inherit;border-radius:6px;padding:11px;background:var(--bg);border:1px solid var(--border);color:var(--text)}
.check{display:flex;align-items:flex-start;gap:10px;font-weight:400}.check input{width:auto;margin-top:6px;flex-shrink:0}fieldset{border:0;padding:0;margin:24px 0}legend{font-weight:700}
button{background:var(--accent);color:var(--bg);font-weight:750;cursor:pointer;margin-top:16px}button:disabled{opacity:.55;cursor:wait}
.hint{font-size:.88rem;color:var(--muted);margin-top:8px}details{border:1px solid var(--border);padding:12px;border-radius:7px;margin:16px 0}summary{cursor:pointer;font-weight:600}
.choice{border-left:3px solid var(--accent);padding:8px 16px;margin:20px 0}.candidate{border-top:1px solid var(--border);padding-top:16px;margin-top:20px}.candidate h3{margin-bottom:8px}
dl{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:7px 14px;margin-top:12px}dt{color:var(--muted)}dd{margin:0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.status{color:var(--accent)}.error,.exceeded{color:#ffc6a8}.limits{margin:36px 0;max-width:900px}.limits p{color:var(--muted)}footer{color:var(--muted);border-top:1px solid var(--border);font-size:.9rem}
#result-title{scroll-margin-top:20px}
#baseline-result:empty{display:none}#baseline-result{margin:24px 0;padding:16px;border:1px solid var(--border);border-radius:8px}
#chart-section{margin:28px 0}#chart svg{display:block;width:100%;max-width:560px;margin:auto;height:auto}.plot-grid{stroke:var(--border);stroke-width:1}.plot-axis{stroke:var(--muted);stroke-width:1.5}
.plot-label{fill:var(--muted);font:18px system-ui,sans-serif}.plot-number{fill:var(--text);font:bold 18px system-ui,sans-serif}.plot-pass{fill:#8de8bd}.plot-fail{fill:none;stroke:#ffc6a8;stroke-width:3}.plot-baseline{fill:none;stroke:var(--accent);stroke-width:2}
.chart-key{display:grid;grid-template-columns:1fr 1fr;gap:8px}.plot-key{margin:0;background:var(--bg);color:var(--text);text-align:left;font-size:.85rem;font-weight:500;padding:10px}
@media(max-width:600px){.chart-key{grid-template-columns:1fr}.plot-label{font-size:22px}.plot-number{font-size:24px}}
@media(max-width:900px){.layout{grid-template-columns:1fr}}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.skip{position:absolute;top:-100px;left:16px}.skip:focus{top:8px;background:var(--panel);padding:10px}
[hidden]{display:none!important}@media(max-width:760px){.layout{grid-template-columns:1fr}header,main,footer{padding:20px 16px}form,#results{padding:20px}.hero{padding:20px 0}}
