@font-face{font-family:"Barlow Gauge";src:url("./fonts/barlow-gauge.6553a31e71bb.woff2") format("woff2");font-style:normal;font-weight:900;font-display:swap}
@font-face{font-family:"Source Sans Panel";src:url("./fonts/source-panel.6fe94a56ef15.woff2") format("woff2");font-style:normal;font-weight:300 800;font-display:swap}
@font-face{font-family:"Plex Numeral";src:url("./fonts/plex-numeral.e23a5a2c0ada.woff2") format("woff2");font-style:normal;font-weight:600;font-display:swap}

:root{--paper:#f8f9fb;--ink:#101114;--muted:#5b6070;--grid:#dfe3ec;--blue:#153dff;--orange:#ff5a1f;--acid:#cfff33;--line:2px;--shell:min(1160px,calc(100vw - 40px));font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--paper);color:var(--ink)}
body{margin:0;font-family:"Source Sans Panel",system-ui,sans-serif;font-size:18px;line-height:1.55;background-color:var(--paper);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:24px 24px;background-position:-1px -1px}
a{color:inherit;text-decoration-thickness:2px;text-underline-offset:3px}
button,input,select{font:inherit}
button,select,input{border-radius:0}
button,a,select,input{touch-action:manipulation}
:focus-visible{outline:4px solid var(--orange);outline-offset:3px}
.shell{width:var(--shell);margin-inline:auto}
.sr-only,.skip-link{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link:focus{position:fixed;z-index:100;left:1rem;top:1rem;width:auto;height:auto;margin:0;padding:.7rem 1rem;clip:auto;background:var(--acid);color:var(--ink)}
.topbar{border-bottom:var(--line) solid var(--ink);background:rgba(248,249,251,.94);backdrop-filter:blur(8px)}
.topbar .shell{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand,.langnav{font-family:"Plex Numeral",monospace;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase}
.brand{text-decoration:none}
.langnav{display:flex;gap:.25rem;align-items:center}
.langnav a{min-width:44px;min-height:44px;display:grid;place-items:center;text-decoration:none;border:2px solid transparent}
.langnav a[aria-current="page"]{border-color:var(--ink);background:var(--acid)}
.sheet-id{margin:0;font-family:"Plex Numeral",monospace;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase}
.hero{border-bottom:4px solid var(--ink);background:var(--paper);min-height:min(840px,calc(100svh - 58px));display:grid;align-items:stretch}
.hero .shell{display:grid;grid-template-columns:minmax(0,7fr) minmax(280px,4fr);gap:0;border-inline:var(--line) solid var(--ink);background:var(--paper)}
.hero-copy{padding:clamp(2.5rem,6vw,6rem) clamp(1.25rem,4vw,4rem) 3rem;border-right:var(--line) solid var(--ink);display:flex;flex-direction:column}
.kicker{font-family:"Plex Numeral",monospace;font-size:.75rem;letter-spacing:.12em;margin:0 0 1.4rem;text-transform:uppercase}
h1,h2{font-family:"Barlow Gauge",Impact,sans-serif;text-transform:uppercase;line-height:.86;letter-spacing:-.025em;margin:0}
h1{font-size:clamp(4rem,10vw,8.8rem);max-width:8ch}
.h1-token{display:block;color:var(--blue);font-family:"Plex Numeral",monospace;letter-spacing:-.08em;font-size:.76em;margin-top:.12em}
.standfirst{max-width:42rem;margin:2rem 0 0;font-size:clamp(1.22rem,2vw,1.6rem);line-height:1.35}
.hero-calibration{display:grid;grid-template-rows:auto 1fr auto;background:var(--blue);color:white;min-width:0}
.hero-calibration .sheet-id{padding:1.1rem;border-bottom:var(--line) solid white}
.hero-readings{display:grid;align-content:center}
.reading{padding:1.4rem;border-bottom:var(--line) solid rgba(255,255,255,.72)}
.reading-tag{font-family:"Plex Numeral",monospace;font-size:.7rem;letter-spacing:.07em;text-transform:uppercase;margin:0}
.reading-value{font-family:"Plex Numeral",monospace;font-size:clamp(2rem,3.7vw,3.7rem);line-height:1;margin:.55rem 0;letter-spacing:-.04em}
.reading-words{margin:0;max-width:24ch;line-height:1.25}
.ratio{padding:1.4rem;background:var(--acid);color:var(--ink);display:flex;align-items:end;justify-content:space-between;gap:1rem}
.ratio span:first-child{font-family:"Plex Numeral",monospace;font-size:.7rem;letter-spacing:.08em}
.ratio strong{font-family:"Plex Numeral",monospace;font-size:clamp(1.8rem,4vw,3.2rem);line-height:1}
.section{border-bottom:4px solid var(--ink);background:rgba(248,249,251,.96)}
.section .shell{border-inline:var(--line) solid var(--ink)}
.section-grid{display:grid;grid-template-columns:minmax(230px,4fr) minmax(0,7fr)}
.section-title{padding:3rem 2rem;border-right:var(--line) solid var(--ink)}
h2{font-size:clamp(2.8rem,6vw,5.8rem);max-width:9ch}
.section-copy{padding:3rem clamp(1.4rem,4vw,4rem);max-width:54rem}
.section-copy p{margin:0 0 1.2rem}
.section-copy p:last-child{margin-bottom:0}
.place-board{margin-top:2.5rem;border:var(--line) solid var(--ink);font-family:"Plex Numeral",monospace;background:white}
.board-head,.board-row{display:grid;grid-template-columns:1fr 72px 1.3fr;align-items:stretch}
.board-head{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:white}
.board-head span,.board-row span{padding:.65rem;text-align:center;border-right:var(--line) solid currentColor}
.board-head span:last-child,.board-row span:last-child{border-right:0}
.board-row{font-size:clamp(1.5rem,4vw,3rem);line-height:1;border-top:var(--line) solid var(--ink)}
.board-row:first-of-type{border-top:0}
.board-row .mark{background:var(--orange);color:var(--ink);display:grid;place-items:center;position:relative}
.board-row .mark::after{content:attr(data-role);position:absolute;top:100%;z-index:2;background:var(--acid);font-family:"Source Sans Panel",sans-serif;font-size:.64rem;letter-spacing:.08em;line-height:1;padding:.35rem;text-transform:uppercase;white-space:nowrap;border:1px solid var(--ink)}
.lab{background:var(--ink);color:white}
.lab .shell{border-color:white}
.lab .section-title{border-color:white}
.lab h2{color:var(--acid)}
.lab-form{padding:3rem clamp(1.4rem,4vw,4rem)}
.lab-lead{font-size:1.2rem;max-width:45rem;margin:0 0 2rem}
.field-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(180px,.8fr) minmax(180px,.8fr);gap:1.3rem;align-items:end}
label{display:block;font-family:"Plex Numeral",monospace;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;margin-bottom:.5rem}
input,select{width:100%;min-height:54px;background:white;color:var(--ink);border:3px solid white;padding:.65rem .8rem}
input{font-family:"Plex Numeral",monospace;font-size:1.25rem}
.help{color:#c7cad3;font-size:.85rem;margin:.55rem 0 0}
.compare-button{margin-top:1.3rem;min-height:52px;border:3px solid var(--acid);padding:.6rem 1.2rem;background:var(--acid);color:var(--ink);font-family:"Plex Numeral",monospace;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.presets{display:flex;gap:.5rem;flex-wrap:wrap;margin:2rem 0 0}
.presets-label{width:100%;font-family:"Plex Numeral",monospace;font-size:.7rem;letter-spacing:.08em;color:#c7cad3;text-transform:uppercase}
.preset{min-height:44px;padding:.45rem .75rem;border:2px solid #7c8290;background:transparent;color:white;font-family:"Plex Numeral",monospace;cursor:pointer}
.preset:hover{border-color:var(--acid);color:var(--acid)}
.role-rail{position:relative;margin:2.4rem 0 1.5rem;border-top:2px solid #7c8290;display:grid;grid-template-columns:1fr 1fr;padding-top:.8rem;color:#c7cad3;font-family:"Plex Numeral",monospace;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}
.role-rail span:last-of-type{text-align:right}
.role-marker{position:absolute;top:-26px;left:0;width:50%;height:50px;display:grid;place-items:center;transition:transform .36s cubic-bezier(.2,.8,.2,1)}
.role-marker::after{content:"";position:absolute;bottom:0;width:2px;height:18px;background:var(--orange)}
.role-marker b{font-size:2.2rem;color:var(--orange);line-height:1}
.role-rail[data-position="decimal"] .role-marker{transform:translateX(100%)}
.results{display:grid;grid-template-columns:1fr 1fr;border:2px solid white;margin-top:1rem}
.result-panel{padding:1.2rem;min-height:190px}
.result-panel+ .result-panel{border-left:2px solid white}
.result-head{display:flex;align-items:start;justify-content:space-between;gap:1rem;font-size:.95rem}
.status{font-family:"Plex Numeral",monospace;font-size:.64rem;text-transform:uppercase;padding:.22rem .35rem;border:1px solid currentColor;white-space:nowrap}
.status.exact{color:var(--acid)}
.status.mismatch{color:#ff9a78}
.canonical-value{display:block;font-family:"Plex Numeral",monospace;font-size:clamp(2.8rem,6vw,5rem);line-height:1;margin:1.5rem 0 .7rem;overflow-wrap:anywhere}
.role-summary{font-size:.88rem;color:#c7cad3;margin:0}
.comparison{margin:0;padding:1rem;border:2px solid white;border-top:0;font-size:1.14rem;font-weight:700}
.comparison[data-kind="divergent"]{background:var(--orange);color:var(--ink)}
.comparison[data-kind="same"]{background:var(--acid);color:var(--ink)}
.atlas-intro{background:var(--blue);color:white}
.atlas-intro .section-title{border-color:white}
.atlas-band{padding:3rem clamp(1.4rem,4vw,4rem)}
.atlas-band>p{max-width:47rem;font-size:1.22rem;margin:0}
.atlas-live-wrap{padding:2.5rem clamp(1.4rem,4vw,4rem);border-top:2px solid var(--ink)}
.minor-heading{font-family:"Plex Numeral",monospace;font-size:.75rem;letter-spacing:.09em;text-transform:uppercase;margin:0 0 1rem}
.atlas-live{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));border-left:2px solid var(--ink);border-top:2px solid var(--ink)}
.atlas-group{padding:1rem;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);min-height:220px;background:white}
.atlas-value{font-family:"Plex Numeral",monospace;font-size:2.4rem;line-height:1;margin:0 0 .6rem;overflow-wrap:anywhere}
.atlas-count{font-family:"Plex Numeral",monospace;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;margin:0}
.atlas-group ul{padding-left:1.1rem;margin:1rem 0 0;font-size:.88rem;line-height:1.45}
.atlas-empty{padding:1rem;border:2px solid var(--ink);margin:0;background:white}
.stakes .section-title{background:var(--orange)}
.method{background:#e8ebf2}
.sources{display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--ink);border-left:2px solid var(--ink);margin-top:2rem}
.source{padding:1rem;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);background:var(--paper)}
.source a{font-family:"Plex Numeral",monospace;font-size:.8rem;font-weight:600}
.source p{font-size:.9rem;margin:.7rem 0 0}
.site-footer{border-top:0;background:var(--ink);color:white;padding:1.3rem 0;font-family:"Plex Numeral",monospace;font-size:.7rem;letter-spacing:.05em;text-transform:uppercase}
.site-footer .shell{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.totop{text-decoration:none}
.noscript{padding:1rem;background:var(--orange);color:var(--ink)}

@media(max-width:820px){
  :root{--shell:calc(100vw - 24px)}
  body{font-size:17px;background-size:20px 20px}
  .hero{min-height:auto}
  .hero .shell,.section-grid{grid-template-columns:1fr}
  .hero-copy,.section-title{border-right:0;border-bottom:var(--line) solid var(--ink)}
  .hero-copy{padding:2.8rem 1.1rem 2rem}
  h1{font-size:clamp(4rem,20vw,6.2rem)}
  .hero-calibration{min-height:560px}
  .section-title,.section-copy,.lab-form,.atlas-band,.atlas-live-wrap{padding:2.3rem 1.1rem}
  h2{font-size:clamp(3rem,14vw,5rem)}
  .lab .section-title,.atlas-intro .section-title{border-color:white}
  .field-grid{grid-template-columns:1fr}
  .results{grid-template-columns:1fr}
  .result-panel+ .result-panel{border-left:0;border-top:2px solid white}
  .sources{grid-template-columns:1fr}
}

@media(max-width:430px){
  .brand{font-size:.68rem}
  .topbar .shell{min-height:54px}
  .hero .shell,.section .shell{border-inline:0;width:100%}
  .hero-copy{padding-inline:16px}
  .section-title,.section-copy,.lab-form,.atlas-band,.atlas-live-wrap{padding-inline:16px}
  .standfirst{font-size:1.16rem}
  .reading-value{font-size:2.35rem}
  .board-head,.board-row{grid-template-columns:1fr 58px 1.2fr}
  .board-head span,.board-row span{padding:.55rem .25rem}
  .board-row .mark::after{font-size:.54rem}
  .result-head{display:block}
  .status{display:inline-block;margin-top:.45rem}
  .canonical-value{font-size:2.7rem}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
@media print{.topbar,.langnav,.compare-button,.presets,.site-footer{display:none}.hero{min-height:auto}.section,.hero{break-inside:avoid}body{background:white}}
