:root{
  --gabbro:#12171B;--whinstone:#1C2329;--chalk:#EFF0EE;--ash:#8E9BA3;
  --flint:#6B767E;--hair:#262E34;--beacon:#FFB020;--blue:#84B4FF;
  --sans:"IBM Plex Sans","Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  --cond:"IBM Plex Sans Condensed","Archivo Narrow","Arial Narrow","Roboto Condensed","Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"Cascadia Mono",Consolas,"SF Mono",Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--gabbro);color:var(--chalk);font-family:var(--sans);font-size:16.5px;line-height:1.68;-webkit-font-smoothing:antialiased}
.wrap{max-width:1200px;margin:auto;padding:0 32px}
header{border-bottom:1px solid var(--hair)}
.bar{display:flex;align-items:center;gap:16px;height:72px}
.brand{color:var(--chalk);font-family:var(--cond);font-size:24px;font-weight:700;letter-spacing:.04em;text-decoration:none;text-transform:uppercase}
nav{align-items:center;display:flex;gap:24px;margin-left:auto}
nav a,.footer-links a{color:var(--ash);font-family:var(--mono);font-size:12px;letter-spacing:.09em;text-decoration:none;text-transform:uppercase}
nav a:hover,.footer-links a:hover{color:var(--chalk)}
nav .get{background:var(--chalk);color:var(--gabbro);padding:8px 14px}
main{max-width:1040px;margin:auto;padding:48px 32px 80px}
.eyebrow{color:var(--beacon);font-family:var(--mono);font-size:12.5px;letter-spacing:.1em;margin-bottom:14px;text-transform:uppercase}
h1,h2{font-family:var(--cond);font-stretch:87.5%;font-weight:700;letter-spacing:.01em;text-transform:uppercase}
h1{font-size:clamp(34px,5vw,52px);line-height:1.03;margin-bottom:16px}
h2{font-size:24px;line-height:1.2;margin:2.3em 0 .65em}
h3{font-size:18px;margin:1.8em 0 .45em}
p{color:#C3CBD1;margin:0 0 1em}
.standfirst{font-size:20px;line-height:1.55;max-width:900px}
strong,b{color:var(--chalk)}
a{color:var(--beacon)}
ul,ol{margin:0 0 1.2em 1.35em}
li{color:#C3CBD1;margin-bottom:.48em}
.answer{background:var(--whinstone);border-left:4px solid var(--beacon);margin:28px 0;padding:22px 24px}
.answer p:last-child,.card p:last-child,.source p:last-child{margin-bottom:0}
.grid{background:var(--hair);border:1px solid var(--hair);display:grid;gap:1px;grid-template-columns:1fr 1fr;margin:24px 0}
.card{background:var(--gabbro);padding:20px 22px}
.card h3{font-family:var(--cond);margin:0 0 8px;text-transform:uppercase}
.card p{font-size:16px}
.toc{border-bottom:1px solid var(--hair);border-top:1px solid var(--hair);margin:28px 0;padding:18px 0}
.toc strong{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.09em;margin-bottom:8px;text-transform:uppercase}
.toc a{display:inline-block;margin:0 14px 6px 0}
.table-wrap{border:1px solid var(--hair);margin:24px 0;overflow-x:auto}
table{border-collapse:collapse;min-width:680px;width:100%}
th,td{border:1px solid var(--hair);color:#C3CBD1;padding:11px 13px;text-align:left;vertical-align:top}
th{background:var(--whinstone);color:var(--chalk)}
.source{border:1px solid var(--hair);margin:28px 0;padding:18px 20px}
.source-label{color:var(--ash);font-family:var(--mono);font-size:12px;letter-spacing:.09em;text-transform:uppercase}
.explainer-figure{background:var(--whinstone);border:1px solid var(--hair);margin:30px 0}
.explainer-figure:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.explainer-figure svg{display:block;height:auto;width:100%}
.explainer-figure figcaption{border-top:1px solid var(--hair);color:var(--ash);font-family:var(--mono);font-size:12px;letter-spacing:.04em;line-height:1.55;padding:11px 14px}
.explainer-figure .label{fill:var(--chalk);font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.08em}
.explainer-figure .small{fill:var(--ash);font-family:var(--mono);font-size:9px;letter-spacing:.05em}
.explainer-figure .line{fill:none;stroke:var(--blue);stroke-width:2}
.explainer-figure .accent{fill:var(--beacon)}
.explainer-figure .panel{fill:var(--gabbro);stroke:var(--hair)}
.cta{background:var(--whinstone);border-left:4px solid var(--beacon);margin:44px 0 24px;padding:26px}
.cta h2{font-size:28px;margin:0 0 10px}
.proof{color:var(--chalk);font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.buttons{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.button{align-items:center;background:var(--chalk);border:1px solid var(--chalk);color:var(--gabbro);display:inline-flex;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.07em;min-height:44px;padding:10px 16px;text-decoration:none;text-transform:uppercase}
.button.alt{background:transparent;border-color:var(--flint);color:var(--chalk)}
.related{border-top:1px solid var(--hair);margin-top:48px;padding-top:26px}
.related h2{margin-top:0}
footer{border-top:1px solid var(--hair);padding:56px 0 44px}
.footer-top{align-items:center;display:flex;gap:18px;flex-wrap:wrap}
.footer-links{display:flex;gap:22px;flex-wrap:wrap;margin-left:auto}
.legal{color:var(--ash);font-size:12.5px;line-height:1.7;margin-top:24px;max-width:90ch}
.meta{color:var(--ash);font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;margin-top:20px;text-transform:uppercase}
@media(max-width:760px){.wrap{padding:0 24px}main{padding:38px 24px 68px}.grid{grid-template-columns:1fr}nav a:not(.get){display:none}.standfirst{font-size:18px}.footer-links{margin-left:0;width:100%}}
@media(max-width:640px){
  .explainer-figure{overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
  .explainer-figure::before{background:var(--whinstone);border-bottom:1px solid var(--hair);color:var(--ash);content:"Swipe diagram \2192";display:block;font-family:var(--mono);font-size:12px;left:0;letter-spacing:.08em;padding:9px 12px;position:sticky;text-transform:uppercase;width:max-content;z-index:2}
  .explainer-figure svg{min-width:620px}
  .explainer-figure figcaption{left:0;max-width:calc(100vw - 48px);position:sticky}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}