/* ==========================================================================
   RECHT//LAB — Neon-Brass screen layer (sits on top of neon-brass.css)
   Dark only. Everything here is for screens; base tokens come from neon-brass.css
   ========================================================================== */
:root{ --hdr:68px; --maxw:1180px; }
html{ scroll-behavior:smooth; scroll-padding-top:88px; background:var(--bg); }
body{ min-height:100vh; font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; }
a{ border-bottom:1px dashed rgba(25,240,255,.5); }
button{ font-family:inherit; }
::selection{ background:var(--or); color:#0a0a0c; }
.page{ max-width:var(--maxw); margin:0 auto; padding:32px 16px 56px; }
.tw{ overflow-x:auto; }
.hintline{ color:var(--mute); font-size:14px; }

/* ---------- screen scaling of print-sized base components ---------- */
p{ margin:0 0 12px; }
ul,ol{ margin:0 0 12px; padding-left:22px; }
li{ margin:0 0 5px; }
ul.sq>li{ padding-left:20px; } ul.sq>li::before{ width:7px; height:7px; top:.62em; }
ol.steps>li{ padding-left:38px; } ol.steps>li::before{ font-size:12px; padding:2px 6px; top:2px; }
h3{ font-size:21px; margin:36px 0 12px; gap:10px; }
h3 .n{ font-size:12px; padding:3px 8px; }
h4{ font-size:15px; margin:22px 0 8px; }
.lbl{ font-size:11px; }
.chip{ font-size:11px; padding:2px 8px; margin:0 6px 6px 0; }
.box{ margin:24px 0; padding:18px 20px 10px; }
.box>.tag{ font-size:11px; top:-9px; left:14px; padding:0 8px; }
.res{ box-shadow:0 0 0 1px rgba(25,240,255,.25), 0 0 14px rgba(25,240,255,.12); }
.err{ border-left-width:5px; } .fix{ border-left-width:5px; }
table{ font-size:14.5px; margin:14px 0 22px; min-width:480px; }
th{ font-size:11px; padding:8px 11px; } td{ padding:9px 11px; } td.k{ font-size:12.5px; }
.fig{ margin:22px 0; padding:14px; }
.fig .cap{ font-size:11px; margin-top:10px; }
.hatch{ padding:18px 22px; }
.brk::before,.brk::after,.brk .c3,.brk .c4{ width:14px; height:14px; border-width:1.5px; }
.case-top{ padding:7px 0; margin-bottom:22px; gap:12px; flex-wrap:wrap; }
.case-title{ gap:18px; margin-bottom:26px; }
.case-id{ font-size:34px; padding:12px 16px; min-width:104px; }
.case-id small{ font-size:10px; }
.case-title h2{ font-size:clamp(24px,4vw,36px); }
.case-title h2 span{ font-size:12px; margin-top:8px; }
.pts{ font-size:48px; } .pts small{ font-size:10px; }
.q{ padding:9px 16px; margin:14px 0; }
.sv p{ font-size:15.5px; } .sv{ margin-bottom:18px; }
.two{ gap:18px; } .three{ gap:14px; }
.two>*,.three>*,.cols2>*,.cols3>*,.mod>*,.mtab>*,.bins>*,.cards>*,.vcards>*,.sumgrid>*{ min-width:0; }
.mod{ min-width:0; } .wg,.wb,.fig,.hatch,.box{ min-width:0; max-width:100%; }
.hatch table,.box table{ min-width:0; }
@media (max-width:700px){ .nrm{ white-space:normal; } table{ min-width:420px; } .case-id{ min-width:84px; font-size:28px; } }

/* ---------- header ---------- */
#top{ position:sticky; top:0; z-index:60; background:#17171a; border-bottom:1px dashed var(--or); }
#top .bar{ max-width:var(--maxw); margin:0 auto; height:var(--hdr); display:grid; grid-template-columns:1fr 76px 1fr; align-items:center; padding:0 16px; gap:10px; }
#top nav{ display:flex; gap:2px; align-items:center; }
#top nav.l{ justify-content:flex-start; } #top nav.r{ justify-content:flex-end; }
#top nav a,#mobmenu a{ font-family:'Chakra Petch',sans-serif; font-weight:700; letter-spacing:.07em; color:var(--or); font-size:14px; padding:9px 12px; border:0; text-transform:uppercase; white-space:nowrap; }
#top nav a:hover,#mobmenu a:hover{ color:#fff; }
#top nav a.on{ color:#0a0a0c; background:var(--or); }
.logo-sq{ width:76px; height:var(--hdr); background:var(--or); display:flex; align-items:center; justify-content:center; border:0 !important; position:relative; align-self:start; margin-top:0; }
.logo-sq:hover{ filter:brightness(1.12); }
.menu-btn{ display:none; background:transparent; border:1px solid var(--or); color:var(--or); font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.12em; padding:8px 10px; cursor:pointer; }
#mobmenu{ display:flex; flex-direction:column; background:#17171a; border-top:1px dashed #3a2a1c; padding:6px 16px 12px; }
#mobmenu[hidden]{ display:none; }
@media (max-width:860px){
  #top nav a{ display:none; } .menu-btn{ display:block; }
  #top .bar{ grid-template-columns:1fr 76px 1fr; }
  #top nav.l{ justify-content:flex-start; }
}
@media (min-width:861px){ #mobmenu{ display:none !important; } }

/* ---------- hero ---------- */
.hero{ position:relative; overflow:hidden; background:#0a0a0c; border-bottom:1px dashed var(--or); }
.hero .grid{ position:absolute; inset:0; background:
   repeating-linear-gradient(0deg, rgba(25,240,255,.05) 0 1px, transparent 1px 38px),
   repeating-linear-gradient(90deg, rgba(25,240,255,.05) 0 1px, transparent 1px 38px); }
.hero .scan{ position:absolute; inset:0; background:repeating-linear-gradient(0deg, rgba(0,0,0,.28) 0 1px, transparent 1px 3px); pointer-events:none; z-index:3; }
.hero .ticker{ position:relative; top:auto; left:auto; right:auto; z-index:2; border-top:1px dashed var(--or); border-bottom:1px dashed var(--or); height:42px; display:flex; align-items:center; justify-content:space-around; font-family:'Chakra Petch',sans-serif; font-weight:600; font-size:14px; color:var(--steel); letter-spacing:.08em; overflow:hidden; gap:12px; padding:0 8px; white-space:nowrap; }
.ticker i{ font-style:normal; color:var(--or); font-size:11px; }
.hero .stage{ position:relative; z-index:1; max-width:var(--maxw); margin:0 auto; padding:18px 16px 0; }
.hero .stage svg{ width:100%; height:auto; display:block; max-height:520px; }
.hero .copy{ position:relative; z-index:2; max-width:var(--maxw); margin:0 auto; padding:6px 16px 34px; }
.hero .glitch{ font-size:clamp(54px,11vw,118px); height:clamp(60px,12vw,126px); margin-top:6px; letter-spacing:.02em; }
.glitch .g1{ transform:translate(4px,1px); } .glitch .g2{ transform:translate(-4px,-1px); }
.hero .sub{ font-family:'Chakra Petch',sans-serif; font-weight:700; font-size:clamp(20px,4vw,38px); color:var(--or); letter-spacing:.04em; line-height:1.05; margin-top:4px; text-transform:uppercase; }
.hero .tag{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.14em; color:var(--steel); margin-top:12px; text-transform:uppercase; }
.hero .cta{ margin-top:22px; display:flex; gap:14px; flex-wrap:wrap; }

/* ---------- LED tiles / bars ---------- */
.ledrow{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:28px 0; }
@media (max-width:860px){ .ledrow{ grid-template-columns:repeat(2,1fr); } }
.ledtile{ background:#050506; border:1px solid #26262c; padding:14px 18px; position:relative; }
.ledtile .d{ font-family:'VT323',monospace; font-size:56px; line-height:.95; color:var(--led); text-shadow:0 0 10px rgba(255,43,43,.65); }
.ledtile .d small{ font-size:26px; opacity:.8; }
.ledtile .t{ font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.12em; color:var(--led); text-shadow:0 0 6px rgba(255,43,43,.4); text-transform:uppercase; margin-top:6px; }
.ledbar{ height:10px; background:#050506; border:1px solid #26262c; position:relative; overflow:hidden; }
.ledbar>i{ position:absolute; inset:0 auto 0 0; width:calc(var(--p,0)*1%); background:repeating-linear-gradient(90deg,var(--led) 0 8px,transparent 8px 10px); box-shadow:0 0 8px rgba(255,43,43,.6); transition:width .6s; }
.ledbar.gr>i{ background:repeating-linear-gradient(90deg,var(--gr) 0 8px,transparent 8px 10px); box-shadow:0 0 8px rgba(57,255,136,.5); }
.ledbar.cy>i{ background:repeating-linear-gradient(90deg,var(--cy) 0 8px,transparent 8px 10px); box-shadow:0 0 8px rgba(25,240,255,.5); }

/* ---------- section headline ---------- */
.sec{ display:flex; align-items:center; gap:14px; margin:44px 0 18px; border-top:1px dashed var(--or); border-bottom:1px dashed var(--or); padding:8px 0; }
.sec h2{ font-size:22px; color:#fff; } .sec h2 .or{ color:var(--or); }
.sec .lbl{ margin-left:auto; text-align:right; }

/* ---------- grids / module cards ---------- */
.cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:20px; }
a.mcard{ display:block; color:inherit; border:0; transition:transform .15s, box-shadow .15s; padding:18px 20px 16px; }
a.mcard:hover{ transform:translateY(-3px); box-shadow:0 0 0 1px var(--or), 0 0 22px rgba(255,98,0,.2); }
a.mcard h3{ margin:8px 0 4px; font-size:19px; display:block; }
a.mcard p{ color:#b9bfc4; font-size:14px; margin:8px 0 12px; }
.mc-top{ display:flex; justify-content:space-between; align-items:center; }
.mc-id{ font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.12em; color:#0a0a0c; background:var(--or); padding:2px 8px; }
.mc-glyph{ font-family:'Chakra Petch',sans-serif; font-weight:700; font-size:28px; color:var(--cy); text-shadow:0 0 10px rgba(25,240,255,.5); line-height:1; }
.mc-foot{ display:flex; justify-content:space-between; margin-top:8px; }
.star{ color:var(--ye); }

/* ---------- buttons ---------- */
.btn{ font-family:'Chakra Petch',sans-serif; font-weight:700; letter-spacing:.07em; text-transform:uppercase; font-size:14px; color:#0a0a0c; background:var(--or); border:0; padding:11px 20px; cursor:pointer; display:inline-block; text-align:center;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px)); }
a.btn{ border:0; color:#0a0a0c; } a.btn:hover,.btn:hover{ filter:brightness(1.15); }
.btn.cy{ background:var(--cy); } .btn.gr{ background:var(--gr); } .btn.ye{ background:var(--ye); } .btn.st{ background:var(--steel); }
.btn.ghost{ background:transparent; color:var(--or); clip-path:none; border:1px solid var(--or); }
a.btn.ghost{ color:var(--or); }
.btn.ghost.cy{ color:var(--cy); border-color:var(--cy); } .btn.ghost.mg{ color:var(--mg); border-color:var(--mg); } .btn.ghost.st{ color:var(--steel); border-color:#4b4b56; }
.btn:disabled{ opacity:.35; cursor:not-allowed; filter:none; }
.btn.sm{ font-size:12px; padding:7px 12px; }
.btnrow{ display:flex; flex-wrap:wrap; gap:12px; margin:16px 0; align-items:center; }

/* ---------- module page ---------- */
.tabs{ display:flex; border-bottom:1px solid var(--line); margin:0 0 28px; overflow-x:auto; }
.tabs a{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--mute); padding:12px 18px; border:0; border-bottom:2px solid transparent; white-space:nowrap; }
.tabs a b{ color:var(--or); margin-right:6px; }
.tabs a:hover{ color:#fff; }
.tabs a.on{ color:#fff; border-bottom-color:var(--or); background:rgba(255,98,0,.07); }
.mod{ display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:36px; align-items:start; }
.mod aside{ position:sticky; top:92px; }
.toc-s{ border:1px solid var(--line); background:var(--bg2); padding:14px 16px; }
.toc-s a{ display:flex; gap:8px; border:0; color:var(--steel); font-size:13.5px; padding:5px 0; line-height:1.35; }
.toc-s a:hover{ color:var(--cy); }
.toc-s a i{ font-style:normal; font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--or); min-width:20px; }
.toc-s a.seen i{ color:var(--gr); }
.toc-s .lbl{ display:block; margin-bottom:6px; }
@media (max-width:1020px){ .mod{ grid-template-columns:1fr; } .mod aside{ display:none; } }
.pager{ display:flex; justify-content:space-between; gap:14px; margin:44px 0 0; border-top:1px dashed var(--or); padding-top:18px; flex-wrap:wrap; }

/* ---------- widget frame ---------- */
.wg{ background:var(--bg2); border:1px solid var(--line); margin:22px 0 34px; position:relative; }
.wg>.wh{ display:flex; justify-content:space-between; align-items:center; gap:10px; background:#17171a; border-bottom:1px solid var(--line); padding:8px 16px; }
.wg>.wh .t{ font-family:'Chakra Petch',sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#fff; font-size:15px; }
.wg>.wb{ padding:18px 20px; }
.wg .intro{ color:#b9bfc4; font-size:15px; margin-bottom:14px; }
.crumbs{ display:flex; flex-direction:column; gap:6px; margin-bottom:12px; }
.crumb{ font-size:14px; border-left:3px solid var(--line); padding:3px 12px; color:var(--mute); }
.crumb b{ color:var(--cy); font-weight:600; }
.node{ border:1px solid var(--or); background:#1d1410; padding:16px 18px; margin:8px 0; }
.node .q{ background:none; border:0; padding:0; margin:0 0 12px; font-size:17px; }
.node .hint{ color:var(--mute); font-size:13.5px; margin:-4px 0 12px; }
.optb{ display:block; width:100%; text-align:left; background:#121215; border:1px solid #3a3a44; color:var(--ink); padding:11px 14px; margin:7px 0; cursor:pointer; font:inherit; font-size:15px; transition:border-color .1s, background .1s; }
.optb:hover{ border-color:var(--or); background:#1a1510; }
.optb .k{ font-family:'JetBrains Mono',monospace; color:var(--or); margin-right:8px; font-size:12px; }
.verdict{ border:1px solid var(--cy); background:linear-gradient(90deg,rgba(25,240,255,.09),rgba(25,240,255,.02)); padding:16px 18px; margin:8px 0; }
.verdict.gr{ border-color:var(--gr); background:linear-gradient(90deg,rgba(57,255,136,.09),rgba(57,255,136,.02)); }
.verdict.led{ border-color:var(--led); background:linear-gradient(90deg,rgba(255,43,43,.1),rgba(255,43,43,.02)); }
.verdict.ye{ border-color:var(--ye); background:linear-gradient(90deg,rgba(255,212,0,.09),rgba(255,212,0,.02)); }
.verdict .vt{ font-family:'Chakra Petch',sans-serif; font-weight:700; font-size:20px; text-transform:uppercase; letter-spacing:.04em; }
.verdict.gr .vt{ color:var(--gr); } .verdict.led .vt{ color:var(--led); } .verdict.ye .vt{ color:var(--ye); } .verdict .vt{ color:var(--cy); }
.verdict p{ margin:6px 0 0; font-size:15px; }
.sortpool{ display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; min-height:40px; padding:12px; border:1px dashed #3a3a44; }
.pill{ background:#121215; border:1px solid #4b4b56; color:var(--ink); padding:7px 12px; cursor:pointer; font-size:14px; transition:all .1s; }
.pill:hover{ border-color:var(--or); } .pill.sel{ border-color:var(--cy); box-shadow:0 0 0 1px var(--cy), 0 0 12px rgba(25,240,255,.35); color:#fff; }
.pill.ok{ border-color:var(--gr); color:var(--gr); background:#0f1a13; cursor:default; }
.pill.shake{ animation:shake .35s; border-color:var(--led); }
@keyframes shake{ 0%,100%{transform:none} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }
.bins{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; }
.bin{ border:1px solid var(--line); background:#121215; padding:10px 12px 12px; min-height:110px; cursor:pointer; transition:border-color .1s, box-shadow .1s; }
.bin:hover,.bin.hot{ border-color:var(--cy); box-shadow:0 0 14px rgba(25,240,255,.2); }
.bin h5{ margin:0 0 8px; font-family:'Chakra Petch',sans-serif; font-weight:700; font-size:14px; text-transform:uppercase; letter-spacing:.05em; color:var(--or); }
.bin .pill{ display:block; margin:5px 0; font-size:13px; padding:5px 9px; }
.tog{ display:flex; gap:12px; align-items:flex-start; padding:10px 12px; border:1px solid var(--line); margin:7px 0; cursor:pointer; background:#121215; user-select:none; }
.tog:hover{ border-color:#4b4b56; }
.tog .sw{ flex:none; width:38px; height:20px; border:1px solid #4b4b56; background:#0a0a0c; position:relative; margin-top:3px; }
.tog .sw::after{ content:""; position:absolute; top:2px; left:2px; width:14px; height:14px; background:#4b4b56; transition:all .15s; }
.tog.on{ border-color:var(--gr); background:#0f1a13; } .tog.on .sw{ border-color:var(--gr); } .tog.on .sw::after{ left:20px; background:var(--gr); box-shadow:0 0 8px var(--gr); }
.tog.bad.on{ border-color:var(--led); background:#1c1012; } .tog.bad.on .sw{ border-color:var(--led); } .tog.bad.on .sw::after{ background:var(--led); box-shadow:0 0 8px var(--led); }
.tog b{ display:block; color:#fff; font-weight:600; } .tog span.s{ color:var(--mute); font-size:13.5px; }
.fld{ display:flex; flex-direction:column; gap:5px; margin:10px 0; }
.fld label{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--steel); }
.fld input[type=number],.fld input[type=date],.fld input[type=text],.fld select,.fld textarea,.inp{ background:#0a0a0c; border:1px solid #3a3a44; color:#fff; padding:9px 12px; font:inherit; font-size:15px; width:100%; }
.fld input:focus,.fld select:focus,.fld textarea:focus,.inp:focus{ outline:none; border-color:var(--cy); box-shadow:0 0 0 1px var(--cy); }
.fld textarea{ min-height:84px; resize:vertical; line-height:1.5; }
input[type=range]{ width:100%; accent-color:var(--or); }
.cols2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; } .cols3{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media (max-width:760px){ .cols2,.cols3{ grid-template-columns:1fr; } }
.bigled{ font-family:'VT323',monospace; color:var(--led); font-size:76px; line-height:.9; text-shadow:0 0 14px rgba(255,43,43,.65); }
.mtab{ display:grid; grid-template-columns:1fr 1fr; gap:10px 22px; }
@media (max-width:700px){ .mtab{ grid-template-columns:1fr; } }
.mcol .pill{ display:block; width:100%; text-align:left; margin:6px 0; }

/* grundbuch mock */
.gbcols{ display:grid; grid-template-columns:1.25fr 1fr; gap:18px; align-items:start; }
.gbcols>*{ min-width:0; }
@media (max-width:760px){ .gbcols{ grid-template-columns:1fr; } .gbcols .hatch{ position:static !important; } }
.gb{ background:#0b0b0d; border:1px solid #3a3a44; font-family:'JetBrains Mono',monospace; font-size:12.5px; }
.gb .gbh{ padding:10px 14px; border-bottom:1px solid #3a3a44; color:var(--steel); letter-spacing:.08em; display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px; }
.gb .blk{ border-bottom:1px dashed #3a3a44; }
.gb .blk>.bt{ padding:6px 14px; background:#17171a; color:var(--or); font-weight:700; letter-spacing:.1em; }
.gb .row{ display:grid; grid-template-columns:58px 1fr; gap:10px; padding:8px 14px; cursor:pointer; border-left:3px solid transparent; }
.gb .row:hover{ background:rgba(25,240,255,.06); border-left-color:var(--cy); }
.gb .row.on{ background:rgba(255,98,0,.12); border-left-color:var(--or); }
.gb .row .no{ color:var(--mute); } .gb .row .tx{ color:var(--ink); line-height:1.5; }
.gb .row .tx b{ color:var(--ye); font-weight:700; }

/* quiz / cards */
.qbar{ display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.qbar .ledbar{ flex:1; }
.qcase{ border-left:4px solid var(--or); background:#1d1712; padding:12px 16px; margin:0 0 14px; color:#d8dcdf; font-size:15.5px; }
.qq{ font-family:'IBM Plex Sans',sans-serif; font-size:19px; font-weight:500; color:#fff; line-height:1.4; margin:6px 0 14px; }
.opt{ display:block; width:100%; text-align:left; background:var(--bg2); border:1px solid var(--line); color:var(--ink); padding:12px 14px 12px 50px; margin:8px 0; cursor:pointer; position:relative; font:inherit; font-size:15.5px; line-height:1.45; }
.opt::before{ content:attr(data-k); position:absolute; left:12px; top:12px; font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; color:#0a0a0c; background:var(--steel); padding:1px 7px; }
.opt:hover:not(:disabled){ border-color:var(--or); }
.opt.ok{ border-color:var(--gr); background:#0f1a13; } .opt.ok::before{ background:var(--gr); }
.opt.bad{ border-color:var(--led); background:#1c1012; } .opt.bad::before{ background:var(--led); }
.opt.dim{ opacity:.5; }
.opt:disabled{ cursor:default; }
.tfrow{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.tfrow .opt{ text-align:center; padding:16px 14px 16px 14px; font-family:'Chakra Petch',sans-serif; font-weight:700; font-size:18px; text-transform:uppercase; letter-spacing:.06em; }
.tfrow .opt::before{ display:none; }
.why{ margin-top:14px; }
.score{ text-align:center; padding:24px 0; }
.score .bigled{ font-size:110px; }
.rev{ border:1px solid var(--line); background:var(--bg2); padding:12px 16px; margin:10px 0; }
.rev .rq{ color:#fff; font-weight:500; } .rev .ra{ font-size:14.5px; color:#b9bfc4; margin-top:6px; }
.fc{ perspective:1400px; height:280px; cursor:pointer; margin:14px 0; }
.fc .in{ position:relative; width:100%; height:100%; transition:transform .55s; transform-style:preserve-3d; }
.fc.flip .in{ transform:rotateY(180deg); }
.fc .f,.fc .b{ position:absolute; inset:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:26px 30px; }
.fc .f{ background:repeating-linear-gradient(135deg, rgba(173,179,183,.10) 0 2px, transparent 2px 9px), #18181c; border:1px solid #3a3a44; }
.fc .b{ transform:rotateY(180deg); background:repeating-linear-gradient(135deg, rgba(255,98,0,.20) 0 2px, transparent 2px 9px), #1d1410; border:1px solid var(--or); }
.fc .f .tx{ font-family:'Chakra Petch',sans-serif; font-weight:700; font-size:clamp(20px,3vw,28px); color:#fff; text-transform:uppercase; letter-spacing:.03em; line-height:1.2; }
.fc .b .tx{ font-size:17px; line-height:1.55; color:#f1f3f4; }
.fc .hn{ position:absolute; bottom:10px; right:14px; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--mute); letter-spacing:.1em; }
.boxes{ display:flex; gap:10px; margin:6px 0 14px; flex-wrap:wrap; }
.boxes .bx{ flex:1; min-width:90px; border:1px solid var(--line); padding:8px 10px; background:#121215; }
.boxes .bx .d{ font-family:'VT323',monospace; font-size:30px; color:var(--led); line-height:1; text-shadow:0 0 8px rgba(255,43,43,.5); }

/* ---------- video player ---------- */
.vp{ background:#050506; border:1px solid #2b2b33; margin:18px 0; }
.vp .scr{ position:relative; aspect-ratio:500/260; background:radial-gradient(ellipse at 50% 100%, rgba(255,42,109,.10), transparent 60%), #08080a; overflow:hidden; }
.vp .scr svg{ position:absolute; inset:0; width:100%; height:100%; }
.vp .scr::after{ content:""; position:absolute; inset:0; background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px); pointer-events:none; }
.vp .scr .hud{ position:absolute; z-index:2; left:10px; top:8px; font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.12em; color:var(--steel); text-transform:uppercase; }
.vp .scr .hud b{ color:var(--led); } .vp .scr .rec{ position:absolute; z-index:2; right:10px; top:8px; font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--led); letter-spacing:.14em; }
.vp .scr .rec::before{ content:"● "; animation:blink 1.1s infinite; }
@keyframes blink{ 50%{ opacity:.2; } }
.vp .sub{ padding:14px 18px; min-height:84px; border-top:1px solid #1e1e24; font-size:16.5px; color:#eef0f1; line-height:1.55; }
.vp .sub .sc{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.12em; color:var(--or); display:block; margin-bottom:4px; }
.vp .ctl{ display:flex; align-items:center; gap:10px; padding:10px 14px; border-top:1px solid #1e1e24; flex-wrap:wrap; }
.vp .ctl button{ background:#121215; border:1px solid #3a3a44; color:var(--steel); font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.08em; padding:7px 11px; cursor:pointer; }
.vp .ctl button:hover{ border-color:var(--or); color:#fff; } .vp .ctl button.on{ border-color:var(--cy); color:var(--cy); }
.vp .ctl button.play{ background:var(--or); color:#0a0a0c; border-color:var(--or); font-weight:700; min-width:76px; }
.vp .seg{ display:flex; gap:3px; flex:1; min-width:140px; }
.vp .seg i{ flex:1; height:10px; background:#1b1b20; cursor:pointer; position:relative; overflow:hidden; }
.vp .seg i b{ position:absolute; inset:0 auto 0 0; width:0; background:var(--or); }
.vp .seg i.done b{ width:100%; background:#7a3a10; }
.vcards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px; }
.vcard{ display:block; border:0; color:inherit; }
.vcard .th{ aspect-ratio:500/260; background:#08080a; border:1px solid #2b2b33; position:relative; overflow:hidden; }
.vcard .th svg{ width:100%; height:100%; display:block; }
.vcard .th .play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.25); }
.vcard .th .play i{ width:58px; height:58px; border:2px solid var(--or); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--or); font-style:normal; font-size:22px; text-shadow:0 0 10px var(--or); background:rgba(10,10,12,.7); padding-left:4px; }
.vcard:hover .th{ border-color:var(--or); } .vcard h3{ margin:12px 0 2px; font-size:17px; display:block; }
.fx{ opacity:0; animation:fxin .55s ease-out forwards; animation-delay:calc(var(--i,0)*.32s); }
@keyframes fxin{ from{ opacity:0; transform:translateY(8px);} to{ opacity:1; transform:none; } }
.fx.draw .ln{ stroke-dasharray:1; stroke-dashoffset:1; animation:dr .8s ease-out forwards; animation-delay:calc(var(--i,0)*.32s); }
@keyframes dr{ to{ stroke-dashoffset:0; } }
.fig .fx,.vcard .fx{ opacity:1; animation:none; transform:none; }
.fig .fx.draw .ln,.vcard .fx.draw .ln{ stroke-dasharray:none; stroke-dashoffset:0; animation:none; }

/* ---------- probe / cases ---------- */
.stn{ margin:26px 0 38px; }
.stn .shead{ display:flex; justify-content:space-between; align-items:flex-end; border-bottom:1px solid var(--steel); padding-bottom:6px; margin-bottom:12px; gap:10px; flex-wrap:wrap; }
.stn .shead h3{ margin:0; font-size:22px; }
.stn .pt{ font-family:'VT323',monospace; color:var(--led); font-size:38px; text-shadow:0 0 8px rgba(255,43,43,.5); line-height:.9; }
.qa{ margin:16px 0; border-left:3px solid var(--or); padding-left:14px; }
.qa .qt{ font-weight:600; color:#fff; } .qa .qt .p{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--or); letter-spacing:.1em; margin-left:6px; }
.rub{ margin-top:12px; border:1px solid var(--gr); background:#0f1a13; padding:10px 14px; }
.rub label{ display:flex; gap:10px; align-items:flex-start; padding:5px 0; cursor:pointer; font-size:15px; }
.rub input{ accent-color:var(--gr); width:18px; height:18px; margin-top:3px; flex:none; }
.rub .pp{ font-family:'JetBrains Mono',monospace; color:var(--gr); font-size:12px; margin-left:auto; padding-left:8px; flex:none; }
.model{ margin-top:12px; }
.abtn{ display:grid; grid-template-columns:44px 1fr 1fr; gap:10px; align-items:start; }
.arow{ border-bottom:1px solid var(--line); padding:12px 0; }
.arow .st{ display:flex; gap:10px; margin:8px 0; }
.arow .st button{ flex:0 0 auto; min-width:100px; background:#121215; border:1px solid #3a3a44; color:var(--ink); padding:8px 14px; cursor:pointer; font-family:'Chakra Petch',sans-serif; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.arow .st button.sel{ border-color:var(--cy); color:var(--cy); box-shadow:0 0 0 1px var(--cy); }
.arow .st button.ok{ border-color:var(--gr); color:var(--gr); background:#0f1a13; } .arow .st button.bad{ border-color:var(--led); color:var(--led); background:#1c1012; }
.arow .nr{ font-family:'JetBrains Mono',monospace; color:var(--or); font-weight:700; margin-right:8px; }
.timer{ position:fixed; right:14px; bottom:14px; z-index:70; background:#050506; border:1px solid var(--led); padding:6px 14px; box-shadow:0 0 18px rgba(255,43,43,.25); }
.timer .d{ font-family:'VT323',monospace; font-size:36px; color:var(--led); text-shadow:0 0 8px rgba(255,43,43,.6); line-height:1; }
.timer .lbl{ color:var(--led); }
.sumgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin:16px 0; }

/* lookup */
.res-row{ display:grid; grid-template-columns:190px 1fr auto; gap:14px; padding:10px 4px; border-bottom:1px solid var(--line); align-items:baseline; }
.res-row .k{ font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--or); font-weight:700; }
.res-row .v{ color:#d5d9dc; font-size:15px; } .res-row .go{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.1em; border:0; color:var(--cy); white-space:nowrap; }
@media (max-width:760px){ .res-row{ grid-template-columns:1fr; gap:3px; } }
.srch{ width:100%; font-size:18px; padding:14px 16px; background:#0a0a0c; border:1px solid var(--or); color:#fff; font-family:'JetBrains Mono',monospace; }
.srch:focus{ outline:none; box-shadow:0 0 0 1px var(--or), 0 0 22px rgba(255,98,0,.3); }
.sch-row{ border:1px solid var(--line); background:var(--bg2); margin:10px 0; }
.sch-row summary{ cursor:pointer; padding:12px 16px; display:flex; gap:14px; align-items:center; list-style:none; }
.sch-row summary::-webkit-details-marker{ display:none; }
.sch-row summary .th{ font-family:'Chakra Petch',sans-serif; font-weight:700; text-transform:uppercase; color:var(--or); letter-spacing:.05em; min-width:200px; }
.sch-row[open]{ border-color:var(--or); }
.flow{ display:flex; flex-wrap:wrap; gap:6px 4px; align-items:center; padding:6px 16px 16px; }
.flow .st{ border:1px solid var(--cy); color:var(--cy); background:#101c1f; padding:6px 12px; font-size:14px; }
.flow .ar{ color:var(--or); font-family:'JetBrains Mono',monospace; }

#foot{ border-top:1px dashed var(--or); background:#0a0a0c; }
#foot .page{ padding:18px 16px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; }
@media print{ #top,#foot{ display:none; } }
@media (prefers-reduced-motion:reduce){ .fx,.fx.draw .ln{ animation:none; opacity:1; stroke-dasharray:none; stroke-dashoffset:0; } html{ scroll-behavior:auto; } }

/* ---------- safe areas / gutters (phone app, notches) ---------- */
.page,#top .bar,.hero .stage,.hero .copy{ padding-left:max(16px,env(safe-area-inset-left,0px)); padding-right:max(16px,env(safe-area-inset-right,0px)); }
#top{ top:env(safe-area-inset-top,0px); }
body::before{ content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:80; background:#17171a; }
.timer{ right:calc(14px + env(safe-area-inset-right,0px)); bottom:calc(14px + env(safe-area-inset-bottom,0px)); }
.mod aside{ top:calc(92px + env(safe-area-inset-top,0px)); }