/* QCRACK: the night-shift cryptanalysis bench. Dark is the identity (brand-locked: light-scheme visitors get the same bench,
   color-scheme: dark). One accent (#FFB01F sodium amber) = ONE meaning: "the chip beat random". Radius 0 everywhere. */
@font-face { font-family: "Archivo"; src: url("/fonts/archivo-var.woff2") format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; }
@font-face { font-family: "JBMono"; src: url("/fonts/jbmono-var.woff2") format("woff2"); font-weight: 100 800; font-display: swap; }
:root {
  color-scheme: dark;
  --bench: #0d1114; --plate: #151b20; --plate-2: #1d252c; --hair: #26303a;
  --text-1: #e6ebee; --text-2: #9ba6ae; --text-3: #66717a; --accent: #ffb01f; --on-accent: #0d1114; --paper: #2a3138;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --gap: 144px; --gut: 24px;
  --mono: "JBMono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --sans: "Archivo", ui-sans-serif, system-ui, sans-serif;
}
/* brand-locked dark bench: the same tokens apply under every scheme (documented in /docs/legal) */
@media (prefers-color-scheme: light) { :root { color-scheme: dark; } }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 72px; }
body { margin: 0; background: var(--bench); color: var(--text-1); font: 400 16px/1.5 var(--sans); font-stretch: 100%; overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: var(--bench) url("/img/steel.webp") center top / cover no-repeat; }
@media (max-width: 767px) { body::before { background-image: url("/img/steel-1200.webp"); } }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--text-1); }
img, svg { display: block; max-width: 100%; }
:focus-visible { outline: 2px solid var(--text-1); outline-offset: 2px; }
.sr-only { position: absolute !important; left: 0; top: 0; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; font-feature-settings: "zero" 0; }
.wrap { width: min(1200px, 100% - 2 * var(--gut)); margin-inline: auto; }
.wrap-wide { width: min(1320px, 100% - 2 * var(--gut)); margin-inline: auto; }
.info { color: var(--text-2); font-size: 14px; margin: 4px 0; }
.small { font-size: 12px; }
.dim { color: var(--text-3); }
.acc { color: var(--accent); }
.empty { color: var(--text-2); font-size: 14px; }
.h1 { font-family: var(--sans); font-stretch: 75%; font-weight: 800; letter-spacing: -0.012em; word-spacing: .04em; line-height: 1.0; font-size: clamp(34px, 3.6vw, 52px); margin: 0; max-width: 1100px; }
.h1a { text-wrap: balance; }
.h1a, .h1b { display: block; }
.h2 { font-stretch: 75%; font-weight: 800; letter-spacing: -0.012em; word-spacing: .04em; line-height: 1.02; font-size: 36px; margin: 0; }
.h3 { font-stretch: 75%; font-weight: 800; letter-spacing: -0.015em; font-size: 26px; line-height: 1.1; margin: 0 0 8px; }
.h4 { font-size: 12px; font-weight: 500; color: var(--text-2); letter-spacing: 0.06em; margin: 28px 0 10px; }
.voice { font-size: 16px; color: var(--text-1); margin: 10px 0 0; }
.sub { color: var(--text-2); font-size: 18px; line-height: 1.45; margin: 14px 0 0; max-width: 40em; }
/* ---------- buttons: pressed panel keys ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 26px; font: 500 15px/1 var(--sans); border: 1px solid var(--text-1); border-radius: 0; background: transparent; color: var(--text-1); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background-color .18s var(--ease), color .18s var(--ease); }
.btn:active { transform: translateY(1px); }
.btn-fill { background: var(--text-1); color: var(--bench); }
.btn-fill:hover { background: #fff; color: var(--bench); }
.btn-out:hover { background: var(--plate-2); }
.btn-sm { min-height: 36px; padding: 0 16px; font-size: 14px; }
.btn[disabled] { opacity: .45; cursor: not-allowed; }
.icon-btn { background: none; border: 0; color: var(--text-2); padding: 4px; cursor: pointer; display: inline-grid; place-items: center; min-width: 32px; min-height: 32px; vertical-align: middle; }
.icon-btn:hover { color: var(--text-1); }
.ico { width: 20px; height: 20px; }
/* ---------- chips = the stamp system at small size ---------- */
.chip { display: inline-block; font: 500 13px/1 var(--mono); letter-spacing: .04em; padding: 6px 9px; text-transform: uppercase; }
.chip-rec { background: var(--accent); color: var(--on-accent); }
.chip-no { background: #3a444d; color: var(--text-1); }
.chip-pend { background: #4a555f; color: var(--text-1); }
.chip-err { border: 1px solid var(--text-2); color: var(--text-2); padding: 5px 8px; }
.chip-reg { border: 1px solid var(--text-1); color: var(--text-1); padding: 5px 8px; }
.chip-state { border: 1px solid var(--text-1); font-size: 16px; padding: 8px 12px; margin: 0 0 8px; }
/* ---------- section rhythm + divider (16 ticks on the left 96 px) ---------- */
.sec { padding-top: var(--gap); }
.divider { height: 13px; margin-bottom: 28px; background:
  linear-gradient(var(--hair), var(--hair)) left 6px / 100% 1px no-repeat,
  repeating-linear-gradient(90deg, var(--hair) 0 1px, transparent 1px 6px) left 0 / 96px 13px no-repeat; }
/* ---------- nav (on the page's own steel, never a black bar) ---------- */
.nav { position: relative; z-index: 20; }
.nav-in { height: 64px; display: flex; align-items: center; gap: 28px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; margin-right: auto; }
.wm { font: 800 30px/1 var(--sans); font-stretch: 75%; letter-spacing: -0.03em; color: var(--text-1); }
.mark .c { fill: var(--text-3); } .mark .k { fill: var(--accent); }
.nav-links { display: flex; gap: 30px; }
.nav-links a { text-decoration: none; color: var(--text-1); font-size: 15px; }
.nav-links a:hover { text-decoration: underline; }
.menu-btn { display: none; background: none; border: 0; color: var(--text-1); width: 44px; height: 44px; place-items: center; cursor: pointer; }
.menu-btn .ico { width: 26px; height: 26px; }
.sheet { position: fixed; inset: 0; z-index: 60; background: var(--bench); padding: 12px 20px; display: flex; flex-direction: column; }
.sheet[hidden] { display: none; }
.sheet-top { display: flex; align-items: center; gap: 10px; height: 52px; }
.sheet-top .menu-btn { display: grid; margin-left: auto; }
.sheet nav { display: flex; flex-direction: column; margin-top: 24px; }
.sheet nav a { font: 800 34px/1.1 var(--sans); font-stretch: 75%; text-decoration: none; padding: 14px 0; border-bottom: 1px solid var(--hair); }
.feed-line { margin: 0; text-align: center; font: 400 13px var(--mono); color: var(--text-2); }
/* ---------- hero ---------- */
.hero { padding-top: 28px; }
.hero-copy { max-width: 900px; }
.ctas { display: flex; gap: 20px; margin-top: 26px; flex-wrap: wrap; }
.plate { position: relative; margin: 30px 0 0; background: var(--plate); box-shadow: inset 0 1px 0 rgba(255,255,255,.05), inset 0 0 0 1px rgba(255,255,255,.035); }
.plate-hero { padding: 22px 46px 26px; }
.frosted::before, .frosted::after { content: ""; position: absolute; top: 0; width: 180px; height: 180px; pointer-events: none; opacity: .28; background: url("/img/frost.webp") 0 0 / 180px 180px no-repeat; }
.frosted::before { left: 0; } .frosted::after { right: 0; transform: scaleX(-1); }
.bolted { position: relative; }
.bolt { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #6b757e, #2b3238 62%, #161b1f); box-shadow: 0 1px 1px rgba(0,0,0,.6), inset 0 0 0 1px rgba(0,0,0,.4); }
.bolt::after { content: ""; position: absolute; left: 3px; right: 3px; top: 7px; height: 2px; background: #11161a; transform: rotate(-35deg); }
.b1 { left: 12px; top: 12px; } .b2 { right: 12px; top: 12px; } .b3 { left: 12px; bottom: 12px; } .b4 { right: 12px; bottom: 12px; }
.engr { display: flex; justify-content: space-between; align-items: center; gap: 12px; font: 400 14px var(--mono); color: var(--text-2); letter-spacing: .04em; text-shadow: 0 1px 0 rgba(0,0,0,.6); margin-bottom: 16px; }
.engr-r { display: flex; align-items: center; gap: 14px; }
.sample-chip { font: 500 12px var(--mono); color: var(--text-2); border: 1px solid var(--hair); padding: 4px 8px; cursor: help; letter-spacing: .03em; }
.halves { display: grid; grid-template-columns: 1fr 1px 1fr; gap: 40px; }
.seam { background: var(--hair); }
.half { min-width: 0; position: relative; }
.hl { margin: 0; font: 400 15px var(--mono); } .hl b { font-weight: 500; }
.yt { margin: 2px 0 -6px; font: 400 13px var(--mono); color: var(--text-2); }
.xl { margin: 0 0 0 44px; font: 400 13px var(--mono); color: var(--text-2); }
.hist { width: 100%; height: auto; aspect-ratio: 560 / 270; overflow: visible; }
.hist .grid { stroke: rgba(255,255,255,.06); stroke-dasharray: 2 4; }
.hist .axis { stroke: var(--hair); }
.hist .yl { fill: var(--text-2); font: 400 13px var(--mono); }
.hist .bar { transform-box: fill-box; transform-origin: 50% 100%; transition: transform 75ms linear, fill .25s var(--ease); }
.hist-qpu .bar { fill: rgba(230,235,238,.85); }
.hist-ur .bar { fill: var(--text-3); }
.hist .bar.lit { fill: var(--accent); }
.hist .bar.skel { fill: #2a333b; }
.hist .kcount, .hist .kbin { font: 500 14px var(--mono); fill: var(--text-1); }
.hist .kcount.lit, .hist .kbin.lit { fill: var(--accent); }
.hist-ur .kcount, .hist-ur .kbin { fill: var(--text-2); }
.hist .scan { stroke: var(--text-1); stroke-width: 1.5; opacity: 0; }
.is-pending .hist-qpu .scan { opacity: .9; animation: scan 4s linear infinite; }
@keyframes scan { from { transform: translateX(0); } to { transform: translateX(508px); } }
.plate-empty { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font: 400 15px var(--mono); color: var(--text-2); background: var(--plate); padding: 10px 14px; margin: 0; text-align: center; }
.halves { position: relative; }
.stamp-slot { position: absolute; left: 50%; top: -8px; transform: translateX(-50%); z-index: 3; pointer-events: none; }
.half-ur .hl, .half-ur .yt { padding-left: 190px; }
.share-btn { position: absolute; right: 46px; bottom: 26px; z-index: 4; background: var(--plate); }
.regstrip { position: absolute; left: 0; right: 0; bottom: -26px; z-index: 5; }
/* the STAMP: rubber ink, -4deg, uneven fill + edge bleed (ink mask), slams 1.35 -> 1 in 110 ms */
.stamp { display: inline-flex; flex-direction: column; align-items: flex-start; transform: rotate(-4deg); border: 4px solid currentColor; padding: 8px 16px 10px; line-height: 1; white-space: nowrap;
  -webkit-mask: url("/img/ink.webp") center / 260px 140px; mask: url("/img/ink.webp") center / 260px 140px; }
.st-rec { color: var(--accent); }
.st-no { color: var(--text-3); filter: contrast(1.1); }
.st-l1 { font: 900 40px/0.95 var(--sans); font-stretch: 62%; letter-spacing: .04em; text-transform: uppercase; }
.st-l2, .st-l3 { font: 500 17px/1.25 var(--mono); }
.st-l2 { margin-top: 6px; }
.stamp-card { color: var(--accent); opacity: .6; }
.stamp-card .st-l1 { font-size: 34px; }
.stamp-card.st-no { color: var(--text-3); }
.slam { animation: slam 110ms cubic-bezier(.2,.8,.3,1.2) both, settle 160ms 110ms ease-out both; }
@keyframes slam { from { transform: rotate(-4deg) scale(1.35); opacity: 0; } to { transform: rotate(-4deg) scale(1); opacity: 1; } }
@keyframes settle { 0% { translate: 0 0; } 40% { translate: 0 2px; } 100% { translate: 0 0; } }
.stamp-hidden { opacity: 0; }
/* under the plate: readout + ticket */
.under { display: grid; grid-template-columns: 1fr 470px; gap: 40px; align-items: start; margin-top: 30px; }
.readout .cols { display: flex; flex-wrap: wrap; gap: 8px 34px; font-size: 18px; margin: 0 0 6px; }
.ticket { position: relative; margin-top: -12px; background: #1a2026; padding: 26px 30px 26px; box-shadow: 0 10px 24px rgba(5,8,10,.35);
  --p: radial-gradient(circle at 8px 0, transparent 4px, #000 4.5px); -webkit-mask: var(--p) 0 0 / 16px 100%, linear-gradient(#000,#000) 0 6px / 100% 100% no-repeat; mask: var(--p) 0 0 / 16px 100%; clip-path: polygon(0 0,100% 0,100% calc(100% - 6px),96% 100%,92% calc(100% - 5px),87% 100%,81% calc(100% - 4px),75% 100%,70% calc(100% - 6px),63% 100%,57% calc(100% - 3px),51% 100%,45% calc(100% - 6px),38% 100%,32% calc(100% - 4px),26% 100%,20% calc(100% - 5px),14% 100%,8% calc(100% - 3px),3% 100%,0 calc(100% - 5px)); }
.ticket:focus { outline: 2px solid var(--text-1); outline-offset: 4px; }
.t-title { margin: 0 0 12px; color: var(--text-2); font-size: 15px; letter-spacing: .05em; display: flex; gap: 14px; align-items: center; }
.t-row { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; font-size: 17px; }
.t-row .clock { margin-left: auto; }
.t-q { display: flex; align-items: baseline; gap: 30px; margin: 10px 0 8px; font-size: 22px; color: var(--text-2); min-height: 56px; }
.qp { text-decoration-thickness: 2px; color: var(--text-2); }
.qbig { font: 800 52px/1 var(--sans); font-stretch: 75%; color: var(--text-1); }
.qbig.drop { animation: drop .5s var(--ease) both; }
@keyframes drop { from { transform: translateY(-14px); opacity: 0; } to { transform: none; opacity: 1; } }
.qsrc { font-size: 14px; }
.t-meta, .t-voice, .t-none { margin: 4px 0 0; color: var(--text-2); font-size: 15px; }
.t-voice { color: var(--text-1); }
/* ---------- logbook: tractor-feed sheet ---------- */
.sample-note { margin-top: 6px; }
.sheet-log { position: relative; margin-top: 30px; background: var(--plate); padding: 22px 28px 26px 74px; }
.sheet-log::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 44px; border-right: 1px dashed var(--hair);
  background: radial-gradient(circle, #0b0e11 0 5px, transparent 5.5px) 50% 14px / 44px 30px repeat-y; }
.lhead, .lr-btn { display: grid; grid-template-columns: 70px 100px 70px 120px 74px 90px minmax(170px,1fr) 70px 170px; gap: 0 14px; align-items: center; }
.lhead { color: var(--text-2); font-size: 14px; padding-bottom: 8px; }
.lrows { list-style: none; margin: 0; padding: 0; }
.lday { font-size: 19px; color: var(--text-1); padding: 12px 0 2px; }
.lr-btn { width: 100%; background: none; border: 0; color: var(--text-1); text-align: left; padding: 11px 0; font-size: 16px; cursor: pointer; }
.lr-btn:hover { background: rgba(255,255,255,.025); }
.lr-btn > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.c-vs { display: flex; align-items: flex-end; gap: 12px; }
.mb { display: inline-flex; align-items: flex-end; gap: 4px; height: 20px; }
.mb i { display: block; width: 6px; } .mb .q { background: rgba(230,235,238,.85); } .mb .q-rec { background: var(--accent); } .mb .u { background: var(--text-3); }
.rates { color: var(--text-2); }
.c-m.acc { color: var(--accent); }
.qx { margin-left: 10px; font-size: 14px; color: var(--text-1); }
.named { grid-column: 2 / -1; font-size: 13px; color: var(--text-2); }
.lx { padding: 4px 0 14px; }
.lx-dl { margin: 0; font-size: 13px; color: var(--text-2); display: grid; gap: 4px; }
.lx-dl div { display: grid; grid-template-columns: 110px 1fr; gap: 10px; }
.lx-dl dt { color: var(--text-3); } .lx-dl dd { margin: 0; overflow-wrap: anywhere; }
.lx-dl a { color: var(--text-1); }
.regrow { list-style: none; position: relative; margin: 6px -64px 6px -46px; }
.torn { position: relative; display: flex; align-items: center; gap: 30px; padding: 22px 30px 22px 90px; background: #222a31; box-shadow: 0 6px 18px rgba(5,8,10,.25);
  clip-path: polygon(0 4px,4% 0,9% 5px,15% 1px,22% 6px,29% 2px,36% 5px,44% 0,52% 4px,60% 1px,68% 6px,76% 2px,84% 5px,92% 0,100% 4px,100% calc(100% - 3px),94% 100%,87% calc(100% - 6px),80% calc(100% - 1px),71% calc(100% - 5px),63% 100%,55% calc(100% - 4px),47% calc(100% - 1px),38% calc(100% - 6px),30% 100%,21% calc(100% - 4px),13% calc(100% - 1px),6% calc(100% - 5px),0 100%);
  transform-origin: left center; }
.torn.tear-in { animation: tear .6s var(--ease) both; }
@keyframes tear { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
.rstamp { font: 900 44px/1 var(--sans); font-stretch: 62%; letter-spacing: .04em; color: var(--text-1); border: 3px solid var(--text-1); padding: 4px 12px; -webkit-mask: url("/img/ink.webp") center / 220px 120px; mask: url("/img/ink.webp") center / 220px 120px; }
.hatch { width: 170px; height: 34px; background: repeating-linear-gradient(-55deg, var(--text-3) 0 3px, transparent 3px 16px); opacity: .7; }
.rline { font-size: 18px; color: var(--text-1); }
.lfoot { display: flex; align-items: center; gap: 36px; margin-top: 22px; flex-wrap: wrap; }
.totals { color: var(--text-2); margin: 0; }
/* ---------- how ---------- */
.how-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 48px; align-items: start; }
.verbs { list-style: none; padding: 0; margin: 34px 0 0; display: grid; grid-template-columns: 1.15fr 1fr 1.1fr 1fr; gap: 28px; }
.verb h3 { font: 800 26px/1 var(--sans); font-stretch: 75%; margin: 0 0 8px; }
.verb > p { color: var(--text-2); font-size: 15px; margin: 0 0 14px; min-height: 3em; }
.code { margin: 0; padding: 2px 0 2px 16px; border-left: 1px solid var(--text-3); font-size: 14px; line-height: 1.6; white-space: pre; overflow-x: auto; color: var(--text-1); }
.more { font-size: 13px; color: var(--text-2); }
.mini-l { margin: 0; font-size: 13px; color: var(--text-2); }
.hist.mini { aspect-ratio: 560 / 270; margin-bottom: 6px; }
.check { font-size: 16px; padding-left: 16px; border-left: 1px solid var(--text-3); margin: 0 0 18px; }
.stamp-outline { display: inline-block; white-space: nowrap; font: 900 26px/1 var(--sans); font-stretch: 62%; letter-spacing: .04em; color: var(--text-2); border: 3px solid var(--text-2); padding: 6px 12px; transform: rotate(-2deg); -webkit-mask: url("/img/ink.webp") center / 200px 100px; mask: url("/img/ink.webp") center / 200px 100px; }
.reverify { display: grid; grid-template-columns: auto 1fr; gap: 26px; align-items: center; margin-top: 40px; }
.rv-out p { margin: 2px 0; font-size: 15px; color: var(--text-2); }
.rv-out .ok { color: var(--text-1); }
.threshold { margin-top: 26px; }
.how-card { position: relative; z-index: 6; margin-bottom: calc(-1 * var(--gap) - 48px); margin-top: -24px; }
.rcard { position: relative; background: #8a9096 linear-gradient(160deg, #a4aaaf, #7f868c 60%, #959ba0); color: #13181c; padding: 26px 26px 22px; transform: rotate(-2deg); box-shadow: 0 18px 40px rgba(5,8,10,.55); }
.rcard.flat { transform: none; }
.rc-sample { position: absolute; right: 18px; top: 18px; font-size: 12px; border: 1px solid #13181c; padding: 3px 6px; }
.rc-title { font: 500 40px/1 var(--mono); margin: 0 0 12px; }
.rc-rows, .rc-curve, .rc-named { margin: 0 0 8px; font-size: 16px; line-height: 1.35; }
.rc-stamp { margin: 14px 0 12px; }
.rc-stamp .stamp { transform: rotate(-3deg); }
.rcard .st-rec { color: #d58c00; opacity: .6; }
.rc-honest { font-size: 13px; margin: 0 0 12px; }
.rc-links { display: flex; gap: 18px; margin: 0 0 14px; font-size: 15px; }
.rcard .btn { border-color: #13181c; color: #13181c; background: transparent; }
.rcard .btn:hover { background: rgba(0,0,0,.08); }
.rc-url { font-size: 14px; margin: 14px 0 0; }
/* ---------- ladder rail ---------- */
.sec-ladder .h2, .sec-ladder .voice { max-width: 62%; }
.rail { margin-top: 32px; background: var(--plate); padding: 18px 40px 28px; }
.lad-head, .track { display: grid; grid-template-columns: 150px repeat(5, 1fr); gap: 0 10px; }
.lad-head { color: var(--text-3); font-size: 18px; text-align: center; padding: 6px 0 12px; }
.track { position: relative; padding: 14px 0 18px; }
.track::before { content: ""; position: absolute; left: 160px; right: 0; top: 30px; height: 2px; background: #2c353d; box-shadow: 0 1px 0 rgba(255,255,255,.04); }
.tname { margin: 4px 0 0; font-size: 19px; color: var(--text-2); }
.tcell { position: relative; text-align: center; min-width: 0; }
.mlab { display: none; }
.rc p { margin: 6px 0 0; font-size: 14px; color: var(--text-2); }
.rc .big { font-size: 20px; font-weight: 500; }
.notch { display: block; margin: 6px auto 8px; width: 20px; height: 20px; position: relative; z-index: 1; }
.n-held { background: var(--accent); }
.n-no { background: #4b555e; }
.n-reg { border: 2px solid var(--text-2); background: var(--plate); }
.n-not { border: 2px solid var(--text-3); background: var(--plate); }
.n-pend { display: inline-block; width: 18px; height: 18px; margin: 0 10px -4px 0; border: 2px dashed var(--text-2); }
.rc .chip { font-size: 13px; }
.pendl { color: var(--text-1) !important; }
.nextline { margin-top: 24px; } .nextline p { margin: 3px 0; }
/* ---------- fund ---------- */
.fund-grid { display: grid; grid-template-columns: 7fr 5fr; gap: 56px; margin-top: 34px; align-items: start; }
.split { display: flex; height: 8px; margin: 26px 0 8px; }
.split .s1 { background: var(--text-1); } .split .s2 { background: var(--text-2); } .split .s3 { background: var(--text-3); }
.split-l { display: flex; margin: 0 0 22px; font-size: 13px; color: var(--text-2); }
.fundbar { font-size: 19px; margin: 0 0 4px; }
.engine { color: var(--text-2); font-size: 14px; margin: 18px 0 0; }
.sweep { margin: 10px 0 0; font-size: 16px; line-height: 1.7; }
.tape { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.slip { display: grid; grid-template-columns: 96px 110px 1fr auto; gap: 12px; align-items: center; background: #1b2228; padding: 10px 16px; font-size: 15px;
  -webkit-mask: radial-gradient(circle at 0 50%, transparent 5px, #000 5.5px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 50%, transparent 5px, #000 5.5px) right / 51% 100% no-repeat; mask: radial-gradient(circle at 0 50%, transparent 5px, #000 5.5px) left / 51% 100% no-repeat, radial-gradient(circle at 100% 50%, transparent 5px, #000 5.5px) right / 51% 100% no-repeat; border-top: 1px dashed var(--hair); }
.slip.in { animation: slipin .6s var(--ease) both; }
@keyframes slipin { from { transform: translateY(-16px); opacity: 0; } to { transform: none; opacity: 1; } }
.burned { margin: 12px 0 0; font-size: 16px; }
.receipts { list-style: none; padding: 0; margin: 0; font-size: 14px; }
.receipts li { display: flex; gap: 18px; flex-wrap: wrap; padding: 6px 0; }
.fund-r { background: rgba(21,27,32,.82); padding: 30px 30px 26px; }
.hair { border: 0; border-top: 1px solid var(--hair); margin: 28px 0; }
.ex { list-style: none; padding: 0; margin: 16px 0; font-size: 15px; line-height: 1.8; white-space: pre-wrap; }
.flow { margin-top: 18px; display: grid; gap: 12px; }
.flow .row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.flow label { display: grid; gap: 6px; font-size: 13px; color: var(--text-2); }
.flow input, .flow select { font: 400 15px var(--mono); color: var(--text-1); background: var(--plate-2); border: 0; border-bottom: 1px solid var(--text-2); padding: 11px 12px; border-radius: 0; min-height: 44px; }
.flow input:focus-visible, .flow select:focus-visible { outline: 2px solid var(--text-1); outline-offset: 0; }
.quote, .txrev { background: var(--plate-2); padding: 16px; font-size: 14px; display: grid; gap: 4px; }
.txrev ol { margin: 6px 0; padding-left: 20px; }
.err { color: var(--text-1); border-left: 2px solid var(--text-2); padding-left: 10px; }
.wallets { display: grid; gap: 8px; }
.qr { width: 200px; height: 200px; background: #e6ebee; padding: 8px; }
.vopts { list-style: none; padding: 0; margin: 18px 0 8px; display: grid; gap: 16px; }
.vrow { display: grid; grid-template-columns: 1fr auto auto auto; gap: 16px; margin: 0 0 6px; font-size: 15px; }
.vbar { display: block; height: 6px; background: var(--text-2); min-width: 2px; }
.vopt.mine .vrow { color: var(--text-1); text-decoration: underline; text-underline-offset: 4px; }
/* ---------- buy ---------- */
.sec-buy { padding-top: calc(var(--gap) - 24px); padding-bottom: 120px; }
.buy-grid { display: grid; grid-template-columns: 150px 1fr; gap: 0 60px; }
.buy-grid > .divider { grid-column: 1 / -1; margin-bottom: 120px; }
.logo-plate { width: 150px; height: 150px; background: var(--plate); display: grid; place-items: center; }
.mark-big { width: 96px; height: 96px; }
.live { margin: 0 0 10px; color: var(--text-2); letter-spacing: .06em; font-size: 15px; }
.ca { font-size: 18px; margin: 14px 0 18px; display: flex; align-items: center; gap: 4px; }
.buy-btns { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.voice-s { color: var(--text-1); }
/* ---------- footer ---------- */
.foot { padding: 40px 0 64px; }
.endlog { font: 800 36px/1.05 var(--sans); font-stretch: 75%; letter-spacing: -0.02em; margin: 0 0 70px; }
.cursor { display: inline-block; width: .38em; height: .78em; margin-left: .18em; background: var(--text-1); vertical-align: -0.06em; animation: blink 1.1s steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }
.f-brand { display: flex; align-items: center; gap: 18px; margin-bottom: 28px; }
.wm-big { font-size: 64px; }
.f-links { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 14px; margin: 0 0 22px; }
.f-links nav { display: flex; gap: 52px; font-size: 18px; } .f-links nav a { text-decoration: none; } .f-links nav a:hover { text-decoration: underline; }
.f-ca { font-size: 18px; margin: 0; }
.cadence { font-size: 14px; margin-top: 6px; }
/* ---------- docs + receipt pages ---------- */
.docs { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 56px; padding: 40px 0 100px; }
.docs-rail { position: sticky; top: 20px; align-self: start; display: grid; gap: 2px; }
.docs-rail a { text-decoration: none; padding: 7px 0; color: var(--text-2); font-size: 15px; } .docs-rail a[aria-current] { color: var(--text-1); text-decoration: underline; }
.docs-sel { display: none; }
.prose { max-width: 760px; } .prose h1 { font: 800 44px/1.02 var(--sans); font-stretch: 75%; margin: 0 0 18px; } .prose h2 { font: 800 26px/1.1 var(--sans); font-stretch: 75%; margin: 36px 0 10px; }
.prose p, .prose li { color: #c4ccd2; font-size: 16px; line-height: 1.65; } .prose code, .prose pre { font-family: var(--mono); font-size: 14px; } .prose pre { background: var(--plate); padding: 14px 16px; overflow-x: auto; }
.prose table { border-collapse: collapse; width: 100%; font-family: var(--mono); font-size: 14px; display: block; overflow-x: auto; } .prose th, .prose td { text-align: left; padding: 8px 14px 8px 0; border-bottom: 1px solid var(--hair); white-space: nowrap; }
.rpage { padding: 40px 0 100px; display: grid; justify-items: center; gap: 24px; } .rpage .rcard { width: min(440px, 100%); }
.rp-links { display: flex; gap: 18px; flex-wrap: wrap; justify-content: center; }
/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .lhead, .lr-btn { grid-template-columns: 56px 86px 58px 104px 60px 76px minmax(140px,1fr) 58px 150px; gap: 0 10px; font-size: 15px; }
  .verbs { grid-template-columns: 1fr 1fr; }
  .how-grid { grid-template-columns: minmax(0, 1fr) 300px; }
  .under { grid-template-columns: 1fr 420px; }
}
@media (max-width: 1023px) {
  :root { --gap: 112px; }
  .nav-links { display: none; } .menu-btn { display: grid; } .nav-in { gap: 12px; }
  .how-grid { grid-template-columns: 1fr; } .how-card { margin: 40px 0 0; max-width: 440px; } .rcard { transform: none; }
  .sec-ladder .h2, .sec-ladder .voice { max-width: none; }
  .under { grid-template-columns: 1fr; }
  .lhead { display: none; }
  .sheet-log { padding: 16px 18px 20px 54px; } .sheet-log::before { width: 32px; background-size: 32px 30px; }
  .lr-btn { grid-template-columns: auto auto auto 1fr; grid-template-areas: "id v v v" "rung be utc utc" "vs vs m m"; gap: 6px 14px; }
  .c-id { grid-area: id; font-size: 18px; } .c-v { grid-area: v; justify-self: start; } .c-rung { grid-area: rung; } .c-be { grid-area: be; } .c-utc { grid-area: utc; } .c-vs { grid-area: vs; } .c-m { grid-area: m; } .c-shots, .c-qs { display: none; }
  .regrow { margin: 6px -18px 6px -36px; } .torn { flex-wrap: wrap; gap: 12px 18px; padding: 18px 18px 18px 50px; } .rstamp { font-size: 34px; } .hatch { width: 110px; height: 26px; }
  .fund-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  :root { --gap: 88px; --gut: 20px; }
  .h2 { font-size: 26px; } .h3 { font-size: 22px; } .voice { font-size: 15px; }
  .info { font-size: 13px; }
  .btn-nav { min-height: 40px; padding: 0 14px; font-size: 14px; }
  .wm { font-size: 26px; }
  .sub { font-size: 16px; }
  .ctas { display: grid; gap: 12px; } .ctas .btn { width: 100%; }
  .plate-hero { padding: 18px 16px 70px; }
  .frosted::before, .frosted::after { width: 110px; height: 110px; background-size: 110px; }
  .halves { grid-template-columns: 1fr; gap: 22px; } .seam { height: 1px; }
  .stamp-slot { top: auto; bottom: calc(50% - 40px); left: auto; right: 10px; transform: none; }
  .st-l1 { font-size: 32px; } .st-l2, .st-l3 { font-size: 14px; }
  .share-btn { right: 16px; bottom: 16px; }
  .readout { background: var(--plate); padding: 16px 18px; position: relative; }
  .readout .cols { font-size: 15px; gap: 4px 18px; }
  .ticket { padding: 22px 18px; margin-top: 0; } .t-row { font-size: 15px; gap: 4px 14px; } .t-row .clock { margin-left: 0; width: 100%; } .qbig { font-size: 44px; } .t-q { gap: 18px; }
  .verbs { grid-template-columns: 1fr; gap: 34px; }
  .verb .code, .verb .check { border-left: 1px solid var(--text-3); }
  .reverify { grid-template-columns: 1fr; } .btn-rv { background: transparent; color: var(--text-1); }
  .rail { padding: 18px 14px 24px; }
  .lad-head { display: none; }
  .rail { display: grid; grid-template-columns: repeat(var(--tracks, 2), 1fr); gap: 0 10px; }
  .track { display: flex; flex-direction: column-reverse; padding: 0; }
  .track::before { left: 50%; right: auto; top: 40px; bottom: 10px; width: 2px; height: auto; }
  .tname { order: 99; text-align: center; font-size: 15px; margin: 0 0 10px; }
  .tcell { padding: 12px 0; } .mlab { display: block; color: var(--text-3); font-size: 13px; }
  .rc p { font-size: 13px; } .rc .chip { font-size: 12px; }
  .slip { grid-template-columns: 1fr 1fr; -webkit-mask: none; mask: none; border-left: 1px solid var(--text-3); background: transparent; border-top: 0; }
  .fund-r { padding: 22px 18px; } .vrow { grid-template-columns: 1fr auto; } .vrow span:nth-child(3), .vrow span:nth-child(4) { font-size: 13px; color: var(--text-2); }
  .buy-grid { grid-template-columns: 1fr; gap: 24px; } .logo-plate { width: 120px; height: 120px; } .buy-grid > .divider { margin-bottom: 40px; }
  .buy-btns .btn { flex: 1 1 100%; }
  .endlog { font-size: 28px; margin-bottom: 48px; } .wm-big { font-size: 48px; } .f-links nav { gap: 28px; font-size: 16px; }
  .docs { grid-template-columns: minmax(0, 1fr); gap: 20px; } .docs-rail { display: none; } .docs-sel { display: block; } .prose h1 { font-size: 34px; }
}
@media (max-width: 400px) { .h1 { font-size: 34px; } .readout .cols { gap: 2px 14px; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .is-pending .hist-qpu .scan { opacity: .9; }
}

/* generated utility steps (CSP: no inline style attributes) */
.h-1{height:1px}.h-2{height:2px}.h-3{height:3px}.h-4{height:4px}.h-5{height:5px}.h-6{height:6px}.h-7{height:7px}.h-8{height:8px}.h-9{height:9px}.h-10{height:10px}.h-11{height:11px}.h-12{height:12px}.h-13{height:13px}.h-14{height:14px}.h-15{height:15px}.h-16{height:16px}.h-17{height:17px}.h-18{height:18px}.h-19{height:19px}.h-20{height:20px}
.w-0{width:0%}.w-1{width:1%}.w-2{width:2%}.w-3{width:3%}.w-4{width:4%}.w-5{width:5%}.w-6{width:6%}.w-7{width:7%}.w-8{width:8%}.w-9{width:9%}.w-10{width:10%}.w-11{width:11%}.w-12{width:12%}.w-13{width:13%}.w-14{width:14%}.w-15{width:15%}.w-16{width:16%}.w-17{width:17%}.w-18{width:18%}.w-19{width:19%}.w-20{width:20%}.w-21{width:21%}.w-22{width:22%}.w-23{width:23%}.w-24{width:24%}.w-25{width:25%}.w-26{width:26%}.w-27{width:27%}.w-28{width:28%}.w-29{width:29%}.w-30{width:30%}.w-31{width:31%}.w-32{width:32%}.w-33{width:33%}.w-34{width:34%}.w-35{width:35%}.w-36{width:36%}.w-37{width:37%}.w-38{width:38%}.w-39{width:39%}.w-40{width:40%}.w-41{width:41%}.w-42{width:42%}.w-43{width:43%}.w-44{width:44%}.w-45{width:45%}.w-46{width:46%}.w-47{width:47%}.w-48{width:48%}.w-49{width:49%}.w-50{width:50%}.w-51{width:51%}.w-52{width:52%}.w-53{width:53%}.w-54{width:54%}.w-55{width:55%}.w-56{width:56%}.w-57{width:57%}.w-58{width:58%}.w-59{width:59%}.w-60{width:60%}.w-61{width:61%}.w-62{width:62%}.w-63{width:63%}.w-64{width:64%}.w-65{width:65%}.w-66{width:66%}.w-67{width:67%}.w-68{width:68%}.w-69{width:69%}.w-70{width:70%}.w-71{width:71%}.w-72{width:72%}.w-73{width:73%}.w-74{width:74%}.w-75{width:75%}.w-76{width:76%}.w-77{width:77%}.w-78{width:78%}.w-79{width:79%}.w-80{width:80%}.w-81{width:81%}.w-82{width:82%}.w-83{width:83%}.w-84{width:84%}.w-85{width:85%}.w-86{width:86%}.w-87{width:87%}.w-88{width:88%}.w-89{width:89%}.w-90{width:90%}.w-91{width:91%}.w-92{width:92%}.w-93{width:93%}.w-94{width:94%}.w-95{width:95%}.w-96{width:96%}.w-97{width:97%}.w-98{width:98%}.w-99{width:99%}.w-100{width:100%}
.fx-1{flex:1 1 0}.fx-2{flex:2 1 0}.fx-3{flex:3 1 0}.fx-4{flex:4 1 0}.fx-5{flex:5 1 0}.fx-6{flex:6 1 0}.fx-7{flex:7 1 0}.fx-8{flex:8 1 0}.fx-9{flex:9 1 0}.fx-10{flex:10 1 0}.fx-11{flex:11 1 0}.fx-12{flex:12 1 0}.fx-13{flex:13 1 0}.fx-14{flex:14 1 0}.fx-15{flex:15 1 0}.fx-16{flex:16 1 0}.fx-17{flex:17 1 0}.fx-18{flex:18 1 0}.fx-19{flex:19 1 0}.fx-20{flex:20 1 0}.fx-21{flex:21 1 0}.fx-22{flex:22 1 0}.fx-23{flex:23 1 0}.fx-24{flex:24 1 0}.fx-25{flex:25 1 0}.fx-26{flex:26 1 0}.fx-27{flex:27 1 0}.fx-28{flex:28 1 0}.fx-29{flex:29 1 0}.fx-30{flex:30 1 0}.fx-31{flex:31 1 0}.fx-32{flex:32 1 0}.fx-33{flex:33 1 0}.fx-34{flex:34 1 0}.fx-35{flex:35 1 0}.fx-36{flex:36 1 0}.fx-37{flex:37 1 0}.fx-38{flex:38 1 0}.fx-39{flex:39 1 0}.fx-40{flex:40 1 0}.fx-41{flex:41 1 0}.fx-42{flex:42 1 0}.fx-43{flex:43 1 0}.fx-44{flex:44 1 0}.fx-45{flex:45 1 0}.fx-46{flex:46 1 0}.fx-47{flex:47 1 0}.fx-48{flex:48 1 0}.fx-49{flex:49 1 0}.fx-50{flex:50 1 0}.fx-51{flex:51 1 0}.fx-52{flex:52 1 0}.fx-53{flex:53 1 0}.fx-54{flex:54 1 0}.fx-55{flex:55 1 0}.fx-56{flex:56 1 0}.fx-57{flex:57 1 0}.fx-58{flex:58 1 0}.fx-59{flex:59 1 0}.fx-60{flex:60 1 0}.fx-61{flex:61 1 0}.fx-62{flex:62 1 0}.fx-63{flex:63 1 0}.fx-64{flex:64 1 0}.fx-65{flex:65 1 0}.fx-66{flex:66 1 0}.fx-67{flex:67 1 0}.fx-68{flex:68 1 0}.fx-69{flex:69 1 0}.fx-70{flex:70 1 0}.fx-71{flex:71 1 0}.fx-72{flex:72 1 0}.fx-73{flex:73 1 0}.fx-74{flex:74 1 0}.fx-75{flex:75 1 0}.fx-76{flex:76 1 0}.fx-77{flex:77 1 0}.fx-78{flex:78 1 0}.fx-79{flex:79 1 0}.fx-80{flex:80 1 0}.fx-81{flex:81 1 0}.fx-82{flex:82 1 0}.fx-83{flex:83 1 0}.fx-84{flex:84 1 0}.fx-85{flex:85 1 0}.fx-86{flex:86 1 0}.fx-87{flex:87 1 0}.fx-88{flex:88 1 0}.fx-89{flex:89 1 0}.fx-90{flex:90 1 0}.fx-91{flex:91 1 0}.fx-92{flex:92 1 0}.fx-93{flex:93 1 0}.fx-94{flex:94 1 0}.fx-95{flex:95 1 0}.fx-96{flex:96 1 0}.fx-97{flex:97 1 0}.fx-98{flex:98 1 0}.fx-99{flex:99 1 0}.fx-100{flex:100 1 0}
.docs-sel select{width:100%;min-height:44px;background:var(--plate-2);color:var(--text-1);border:0;border-bottom:1px solid var(--text-2);padding:8px}
.archive{padding:40px 0 80px}

.share-box { position: absolute; right: 46px; bottom: 80px; z-index: 7; display: flex; gap: 10px; background: var(--plate); padding: 10px; box-shadow: 0 10px 24px rgba(5,8,10,.45); }
.rcard .share-box, .rpage .share-box { position: static; box-shadow: none; background: transparent; padding: 10px 0 0; }
.flow fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: 8px; }
.flow fieldset label { display: flex; gap: 10px; align-items: center; font-size: 15px; color: var(--text-1); }
.flow input[type=radio] { min-height: 0; width: 18px; height: 18px; accent-color: var(--text-1); }
@media (max-width: 767px) { .share-box { right: 16px; bottom: 60px; } }

.totals, .nextline p, .fundbar, .readout .cols, .t-row { white-space: pre-wrap; }
.hist.mini text { display: none; }
.mini-l { white-space: nowrap; }
.rc p { white-space: nowrap; }
.ex li { display: grid; grid-template-columns: 1fr 64px auto; gap: 12px; }
.rail.t3 { --tracks: 3; } .rail.t1 { --tracks: 1; }
@media (max-width: 767px) {
  .engr { flex-wrap: wrap; row-gap: 6px; font-size: 13px; }
  .engr-r { width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 6px; }
  .sample-chip { font-size: 11px; }
  .half-ur .hl, .half-ur .yt { padding-left: 0; }
  .stamp-slot { top: 50%; left: auto; right: -4px; transform: translateY(-50%); }
  .lrows:not(.all) .xs-hide { display: none; }
  .track { justify-content: flex-end; }
  .rc p { white-space: normal; }
  .split-l { font-size: 12px; } .split-l span { padding-right: 6px; }
  .ex li { grid-template-columns: 1fr auto; } .ex li span:last-child { grid-column: 1 / -1; color: var(--text-2); }
  .vrow { font-size: 14px; }
}
@media (min-width: 1024px) {
  .how-card { align-self: end; margin-top: 0; margin-bottom: calc(-1 * var(--gap) - 48px); }
}
.hist.mini { aspect-ratio: 560 / 210; }
.vbar { min-width: 0; }
.vrow { font-size: 14px; gap: 12px; }
@media (max-width: 767px) {
  .stamp-slot { top: 50%; right: -6px; transform: translateY(-78%); }
  .stamp-hero { padding: 6px 10px 7px; border-width: 3px; }
  .stamp-hero .st-l1 { font-size: 27px; } .stamp-hero .st-l2, .stamp-hero .st-l3 { font-size: 12px; }
  .xl { margin-left: 30px; font-size: 12px; }
}

/* r3 QA fixes: stamp crosses the seam inside the empty top of the charts (labels stay clear); one shared y-axis (QPU side) */
.hl, .yt, .xl { display: inline-block; }
.yt { display: block; width: max-content; }
.half-ur .hl, .half-ur .yt { padding-left: 0; }
.hist-ur .yl { display: none; }
.stamp-slot { top: 64px; left: calc(50% - 70px); transform: none; }
.half table.sr-only { left: 0; top: 0; }
.lad-head { color: var(--text-2); }
.regrow { margin-right: -28px; }
@media (min-width: 1280px) { .regrow { margin-right: -64px; } }
@media (max-width: 1279px) { .stamp-hero .st-l1 { font-size: 32px; } .stamp-hero .st-l2, .stamp-hero .st-l3 { font-size: 14px; } .stamp-slot { left: calc(50% - 50px); } }
@media (max-width: 1023px) { .regrow { margin: 6px -18px 6px -36px; } }
@media (max-width: 767px) {
  .halves { gap: 0; }
  .seam { height: 1px; margin: 58px 0; }
  .stamp-slot { top: 50%; left: 50%; right: auto; transform: translate(-50%, -50%); }
  .hist-ur .yl { display: block; }
}
@media (max-width: 1023px) { .share-btn { position: static; display: flex; width: max-content; margin: 16px 0 0 auto; } .plate-hero { padding-bottom: 22px; } }
@media (max-width: 767px) {
  .stamp-hero .st-l1 { font-size: 26px; } .stamp-hero .st-l2, .stamp-hero .st-l3 { font-size: 12px; }
  .stamp-hero { padding: 5px 10px 6px; border-width: 3px; }
  .seam { margin: 66px 0; }
}
/* tablet (768-1023): the plate stacks like mobile so the charts stay readable and the stamp sits in the seam band */
@media (min-width: 768px) and (max-width: 1023px) {
  .engr { flex-wrap: wrap; row-gap: 6px; }
  .engr-r { width: 100%; justify-content: space-between; }
  .halves { grid-template-columns: 1fr; gap: 0; }
  .seam { height: 1px; margin: 74px 0; }
  .stamp-slot { top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .hist-ur .yl { display: block; }
  .hist { max-height: 300px; }
}
