:root {
  --bg:#080b0d; --paper:#10161a; --paper2:#151d21; --ink:#e7eee9; --dim:#99aaa2;
  --line:#29363a; --mint:#79e0b0; --amber:#ffc768; --red:#ff907d; --blue:#7bc8ff;
  --violet:#c5a7ff; --shadow:#0009;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--bg); color:var(--ink); font-family:"Fraunces",Georgia,serif; line-height:1.58; }
main { width:min(76rem,100%); margin:0 auto; padding:4.5rem clamp(1rem,3vw,2rem) 5rem; }
.prose { max-width:49rem; }
h1 { max-width:16ch; font-size:clamp(2.45rem,7vw,5.5rem); line-height:.94; letter-spacing:-.035em; margin:0 0 1rem; }
h2 { font-size:clamp(1.45rem,3.6vw,2.1rem); line-height:1.12; margin:4rem 0 1rem; }
h3 { font-size:1.05rem; margin:1.8rem 0 .7rem; }
p { margin:0 0 1.05rem; }
a { color:var(--amber); }
button,input,select { font:inherit; }
code,.mono,.metric .value,.pill,.byte-axis,.field-table,.check-list,.ledger,.eyebrow,.section-label,.small-label { font-family:"Martian Mono",ui-monospace,SFMono-Regular,Menlo,monospace; }
.eyebrow { margin:0 0 1.1rem; color:var(--mint); text-transform:uppercase; letter-spacing:.17em; font-size:.68rem; }
.dek { max-width:56rem; color:var(--dim); font-size:clamp(1.08rem,2vw,1.28rem); margin-bottom:2rem; }
.lead { font-size:1.12rem; }
.quiet,.note { color:var(--dim); }
.note { font-size:.9rem; }
.section-label { color:var(--blue); font-size:.67rem; letter-spacing:.13em; text-transform:uppercase; margin-bottom:.45rem; }
.instrument { margin:2rem 0; border:1px solid var(--line); background:linear-gradient(160deg,var(--paper),#0d1215); border-radius:.75rem; box-shadow:0 1rem 3rem var(--shadow); overflow:hidden; }
.instrument-head { padding:1rem 1.1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; border-bottom:1px solid var(--line); }
.instrument-head p { margin:0; }
.instrument-body { padding:1.1rem; }
.drop { min-height:11rem; display:grid; grid-template-columns:minmax(0,1fr); place-items:center; text-align:center; border:1px dashed #496269; border-radius:.6rem; padding:1.4rem; background:#0b1013; transition:border-color .15s,background .15s; }
.drop.drag { border-color:var(--mint); background:#0c1814; }
.drop strong { display:block; font-size:1.2rem; max-width:100%; overflow-wrap:anywhere; }
.drop input { max-width:100%; margin:.8rem auto 0; color:var(--dim); }
.actions { display:flex; flex-wrap:wrap; align-items:center; gap:.55rem; margin:.9rem 0; }
button,.button-link { appearance:none; border:1px solid #3b4e54; border-radius:.4rem; padding:.58rem .78rem; background:var(--paper2); color:var(--ink); cursor:pointer; text-decoration:none; font:600 .74rem/1.2 "Martian Mono",ui-monospace,monospace; }
button:hover,.button-link:hover { border-color:var(--amber); color:var(--amber); }
button:disabled { opacity:.45; cursor:default; }
button[aria-pressed="true"] { color:var(--amber); border-color:var(--amber); background:#211b0d; }
:focus-visible { outline:2px solid var(--amber); outline-offset:3px; }
label { font:600 .7rem/1.5 "Martian Mono",ui-monospace,monospace; color:var(--dim); letter-spacing:.04em; text-transform:uppercase; }
select,input[type=number] { max-width:100%; min-width:0; border:1px solid #3b4e54; background:#0b1013; color:var(--ink); border-radius:.35rem; padding:.45rem; }
.controls { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr)); gap:.85rem; margin:1rem 0; }
.control label,.control select,.control input { display:block; width:100%; }
.control input[type=checkbox] { display:inline; width:auto; margin-right:.35rem; }
.status { min-height:1.6rem; color:var(--amber); overflow-wrap:anywhere; }
.summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(8rem,1fr)); gap:1px; border:1px solid var(--line); background:var(--line); border-radius:.6rem; overflow:hidden; margin:1rem 0; }
.metric { min-width:0; padding:.75rem; background:var(--paper2); }
.metric .key { color:var(--dim); font:600 .58rem/1.35 "Martian Mono",ui-monospace,monospace; text-transform:uppercase; letter-spacing:.08em; }
.metric .value { margin-top:.2rem; font-size:1rem; overflow-wrap:anywhere; }
.metric.good .value,.good { color:var(--mint); }
.metric.bad .value,.bad { color:var(--red); }
.metric.warn .value,.warn { color:var(--amber); }
.verdict { padding:.85rem 1rem; border-left:3px solid var(--mint); background:#0b1913; border-radius:0 .4rem .4rem 0; }
.verdict.fail { border-color:var(--red); background:#1b100f; }
.verdict.neutral { border-color:var(--blue); background:#0c151c; }
.byte-map { display:flex; width:100%; height:5.5rem; border:1px solid var(--line); border-radius:.4rem; overflow:hidden; background:#050708; }
.byte-segment { min-width:2px; flex:1 1 0; position:relative; border-right:1px solid #0008; }
.byte-segment.local { background:#4a85a8; }
.byte-segment.data { background:#315e4d; }
.byte-segment.descriptor { background:#84642e; }
.byte-segment.central { background:#69518b; }
.byte-segment.eocd { background:#9e5147; }
.byte-segment.gap { background:#242b2d; }
.byte-segment:focus-visible { z-index:2; outline-offset:-3px; }
.legend { display:flex; flex-wrap:wrap; gap:.65rem 1rem; margin:.6rem 0; color:var(--dim); font-size:.78rem; }
.legend span::before { content:""; display:inline-block; width:.7rem; height:.7rem; margin-right:.3rem; border-radius:2px; background:var(--swatch); }
.legend-local { --swatch:#4a85a8; } .legend-data { --swatch:#315e4d; }
.legend-descriptor { --swatch:#84642e; } .legend-central { --swatch:#69518b; }
.legend-eocd { --swatch:#9e5147; } .legend-gap { --swatch:#242b2d; }
.byte-axis { display:flex; justify-content:space-between; color:var(--dim); font-size:.64rem; }
.entries { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,23rem),1fr)); gap:.8rem; }
details.entry,details.box { border:1px solid var(--line); border-radius:.45rem; background:#0c1114; min-width:0; overflow:hidden; }
details.entry summary,details.box summary { cursor:pointer; padding:.75rem .85rem; overflow-wrap:anywhere; }
details.entry[open] summary,details.box[open] summary { border-bottom:1px solid var(--line); }
.entry-body { padding:.75rem; }
.pill { display:inline-block; margin:.15rem .25rem .15rem 0; padding:.16rem .38rem; border:1px solid var(--line); border-radius:999px; font-size:.59rem; color:var(--dim); }
.pill.good { border-color:#315e4d; color:var(--mint); }
.pill.bad { border-color:#734038; color:var(--red); }
.pill.warn { border-color:#735d30; color:var(--amber); }
.scroll { overflow-x:auto; max-width:100%; -webkit-overflow-scrolling:touch; }
.field-table { width:100%; min-width:38rem; border-collapse:collapse; font-size:.67rem; }
.field-table th,.field-table td { padding:.35rem .45rem; text-align:left; vertical-align:top; border-bottom:1px solid #1d282b; overflow-wrap:anywhere; }
.field-table th { color:var(--dim); font-size:.58rem; text-transform:uppercase; letter-spacing:.05em; }
.field-table td:last-child { white-space:nowrap; }
.field-table .status-match,.field-table .status-expected-bit-3,.field-table .status-zip64-resolved { color:var(--mint); }
.field-table .status-unexplained-difference,.field-table .status-out-of-range { color:var(--red); }
.field-table .status-not-comparable { color:var(--dim); }
.raw { white-space:pre-wrap; word-break:break-all; color:var(--dim); font-size:.72rem; max-height:12rem; overflow:auto; }
.graph { display:grid; gap:.45rem; margin:.8rem 0; }
.edge { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:.45rem; padding:.55rem; border:1px solid var(--line); border-radius:.35rem; font-family:"Martian Mono",ui-monospace,monospace; font-size:.67rem; overflow-wrap:anywhere; }
.edge .arrow { color:var(--blue); }
.external { color:var(--amber); }
.sets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:.45rem; overflow:hidden; }
.set { background:var(--paper2); padding:.75rem; min-width:0; }
.set h4 { color:var(--dim); margin:0 0 .4rem; font:600 .62rem/1.4 "Martian Mono",ui-monospace,monospace; text-transform:uppercase; }
.set code { display:block; overflow-wrap:anywhere; color:var(--mint); }
.check-panel { margin:3.5rem 0; border:1px solid #315e4d; border-radius:.7rem; overflow:hidden; background:#0a1410; }
.check-panel header { padding:1rem 1.1rem; border-bottom:1px solid #284a3d; }
.check-panel header h2 { margin:0 0 .35rem; }
.check-panel header p { margin:0; }
.check-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(17rem,.8fr); }
.check-grid > div { padding:1rem; min-width:0; }
.check-grid > div + div { border-left:1px solid #284a3d; }
.check-list { list-style:none; margin:0; padding:0; font-size:.68rem; max-height:32rem; overflow:auto; }
.check-list li { padding:.3rem 0; border-bottom:1px solid #182a22; overflow-wrap:anywhere; }
.check-list .pass::before { content:"PASS "; color:var(--mint); }
.check-list .fail::before { content:"FAIL "; color:var(--red); }
.choices { padding-left:1.15rem; color:var(--dim); font-size:.89rem; }
.choices li { margin:.42rem 0; }
.ledger { display:grid; grid-template-columns:repeat(auto-fit,minmax(10rem,1fr)); gap:.45rem; font-size:.67rem; }
.ledger div { border:1px solid var(--line); border-radius:.35rem; padding:.55rem; overflow-wrap:anywhere; }
.ledger b { display:block; color:var(--dim); font-size:.58rem; text-transform:uppercase; margin-bottom:.22rem; }
.privacy { border-left:3px solid var(--blue); background:#0b141a; padding:1rem; margin:1rem 0; }
.privacy h3 { margin:0 0 .5rem; }
.refusal { border:1px solid #684036; background:#180f0d; border-radius:.55rem; padding:1rem; }
.refusal strong { color:var(--red); }
.source-list { padding-left:1.15rem; }
.source-list li { margin:.8rem 0; overflow-wrap:anywhere; }
.apparatus { max-width:49rem; margin-top:4rem; border-top:1px solid var(--line); padding-top:1.4rem; color:var(--dim); }
.apparatus h2 { color:var(--ink); margin-top:2.5rem; }
.back { margin-top:2rem; }
[hidden] { display:none !important; }
@media (max-width:760px) {
  main { padding-top:3.5rem; }
  .check-grid { grid-template-columns:1fr; }
  .check-grid > div + div { border-left:0; border-top:1px solid #284a3d; }
  .sets { grid-template-columns:1fr; }
  .edge { grid-template-columns:1fr; }
  .edge .arrow { transform:rotate(90deg); justify-self:start; }
}
@media (max-width:420px) {
  .instrument-body,.instrument-head { padding:.8rem; }
  .summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .actions > * { width:100%; text-align:center; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  * { transition:none !important; animation:none !important; }
}