/* ============================================================
   PONSCRACK — "THE GRADING BENCH" redesign layer (v1)
   Loaded AFTER style.css so it wins. Concept: optical inspection
   bench / calibration terminal. Real slab art is the centrepiece.
   Self-hosted fonts (Newsreader = editorial serif display, DM Sans = body,
   Space Mono = OCR/cert figures). Palette measured from robinhood.com. No AI-slop:
   no animated grid, no radial glow, no gradient text.
   ============================================================ */

/* Display = editorial serif (Robinhood uses Martina Plantijn; Newsreader is the
   closest OFL match). Body = DM Sans (clean geometric grotesque). Readout figures
   stay Space Mono — a real data instrument sets numbers in mono. */
@font-face{font-family:'RHSerif';src:url('fonts/Newsreader-Display.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'RHSerifText';src:url('fonts/Newsreader-Text.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'PCSans';src:url('fonts/DMSans-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'PCSans';src:url('fonts/DMSans-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'PCSans';src:url('fonts/DMSans-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'PCMono';src:url('fonts/SpaceMono-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'PCMono';src:url('fonts/SpaceMono-Bold.woff2') format('woff2');font-weight:700;font-display:swap}

/* Override the BASE tokens too, so the whole page inherits Robinhood DNA —
   not just the hero. Base style.css was already warm (#0d0d0b), so we only
   need to retune the accent + deepen the ground toward measured #110E08. */
:root{
  --ink:#110E08!important;
  --panel:#181509!important;
  --panel2:#211d10!important;
  --line:#332d1c!important;
  --bone:#f2efe6!important;
  --muted:#928a72!important;
  --amber:#ccff00!important;   /* base accent -> Robinhood acid lime */
  --green:#ccff00!important;
  --rust:#e0663a!important;
}

:root{
  /* Robinhood DNA, measured from robinhood.com (not guessed):
     body bg rgb(17,14,8)=#110E08 warm near-black, accent rgb(204,255,0)=#CCFF00 acid lime */
  --bench-steel:#110E08;
  --bench-panel:#181509;
  --bench-panel2:#211d10;
  --bench-line:#332d1c;
  --bench-line2:#4a4327;
  --lime:#ccff00;      /* THE Robinhood accent — rationed ~1%, actions/active only */
  --amber:#ccff00;     /* alias so legacy amber refs inherit the lime */
  --cyan:#ccff00;      /* calibration accent folds into the single brand accent */
  --bone:#f2efe6;
  --muted:#928a72;
  --pos:#ccff00;       /* positive move uses the brand lime */
  --neg:#e0663a;
}

/* live feed: kill the stray cool-blue event colour + amber flash (bypass tokens) */
.ev-vaulted{color:var(--muted)!important}
.livebar,.live-track{background:transparent!important}

/* ACCENT DISCIPLINE (Robinhood rule): lime = actions + active selection ONLY.
   Data figures render bone, never accent — otherwise the accent stops meaning
   "you can act here" and becomes decoration. */
.live-stream .ev-val,.live-stream b{color:var(--bone)!important}
.q-head b{color:var(--muted)!important}
.r-val{color:var(--bone)!important}

/* ============================================================
   TYPE ROLES — mono is OPT-IN, never the page voice.
   Base style.css set body{font-family:'DejaVu Sans Mono'}, so EVERY element
   inherited monospace. Measured result: 71.5% of visible text rendered mono
   and the page read as terminal output = the "stiff" complaint. Mono is now
   restricted to genuine data roles (figures, IDs, cert numbers, clocks).
   ============================================================ */
body,body *{font-family:'PCSans',system-ui,-apple-system,sans-serif}
/* prose reads optically smaller in sans than mono — nudge up */
body{font-size:15px;line-height:1.6}
/* base style.css crammed the registry/coverage/feed at 9px — a swarm of
   sub-10px text reads as cold/technical/stiff. Lift the data-dense rows to a
   humane floor. Measured: 53% of text elements were <10px. */
/* !important + descendant reach: base style.css rules are more specific
   (.card-row .asset small etc) and otherwise win. */
.card-row small,.card-row b,.card-row i,.card-row span,
.card-row .metric small,.card-row .asset small,
.coverage-grid small,.coverage-grid i,.coverage-grid span,
.live-stream small,.live-stream i,.live-stream span,
.cat-bar span,.cat-bar b,
#introChart small,#introChart i,#introChart span,
.tok-tag,.tok-note{font-size:11px!important}
.card-row .mini-slab small{font-size:9.5px!important}
.card-row .asset .name{font-size:13.5px!important}
h1,h2,h3,.section-title h2,.method h2,.intro-content h2{
  font-family:'RHSerif',Georgia,serif!important;font-weight:500!important;
  letter-spacing:-.01em!important;
}
/* MONO ALLOWLIST — data roles only: cert numbers, figures, clocks, addresses.
   Everything else stays sans. Labels/captions moved OFF mono deliberately:
   uppercase micro-mono labels were the single biggest source of stiffness. */
.live-clock,code,kbd,
.r-val,.r-sub .row b,.stat-val,.metric b,
.card-row .cert,.r-cert,.q-head b,
.statline span{font-family:'PCMono',ui-monospace,monospace!important}

/* ---- typography roles ---- */
body{
  font-family:'PCSans',system-ui,sans-serif;
  background:var(--bench-steel);
  color:var(--bone);
  letter-spacing:.005em;
}
/* kill the animated grid + swap for a static engineering-paper texture
   (fine ruled lines + faint blueprint tint), no motion */
body:before{
  animation:none!important;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(rgba(204,255,0,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(204,255,0,.035) 1px,transparent 1px)!important;
  background-size:26px 26px,26px 26px,130px 130px,130px 130px!important;
  background-position:0 0!important;
  opacity:.85;
}
/* a faint top calibration bar so the page reads as an instrument surface */
body:after{
  content:'';position:fixed;left:0;right:0;top:0;height:3px;z-index:20;pointer-events:none;
  background:repeating-linear-gradient(90deg,var(--amber) 0 2px,transparent 2px 12px);
  opacity:.5;
}

h1,h2,h3,.brand,.arena-head h2,.section-title h2,.method h2,.intro-content h2{
  font-family:'RHSerif',Georgia,serif!important;
  font-weight:500!important;
}
/* mono for anything technical: nav, labels, numbers, ticker, readouts */
nav,.eyebrow,.section-title p,.statline,.register-head,.card-row,.toolbar,
.livebar,.intro-benefits b,.intro-stats span,.tok,.method ol,.coverage .field i,
input,select,button,footer p,.intro-chart h4,.cat-bar{
  font-family:'PCMono','Space Mono',ui-monospace,monospace;
}

/* ---- header / brand ---- */
.brand{gap:11px;font-size:19px;letter-spacing:.02em}
.brand-icon{
  border:1.5px solid var(--amber);color:var(--amber);
  padding:2px 6px;border-radius:2px;font-size:15px;line-height:1;
  box-shadow:inset 0 0 0 3px rgba(255,176,0,.08);
}
.brand b{letter-spacing:.04em}
header{height:72px;background:rgba(11,13,14,.92)}
nav{font-size:11.5px;letter-spacing:.04em}
nav button{border-radius:999px;border-color:var(--lime);color:var(--lime);letter-spacing:.06em;padding:9px 16px}
nav button:hover{background:var(--lime);color:#110E08}

/* ============================================================
   HERO — text left, INSPECTION BENCH right (real slab art)
   ============================================================ */
.hero{grid-template-columns:1.02fr .98fr;min-height:600px;border-bottom:1px solid var(--bench-line)}
.hero-copy{border-right:1px solid var(--bench-line);padding:96px 5vw 72px 7vw}
.hero .eyebrow{color:var(--muted);letter-spacing:.16em;font-size:10.5px}
/* editorial serif at magazine scale: tight leading, near-zero tracking, NO lime.
   Robinhood keeps zero accent colour in the headline — the accent is action-only. */
.hero h1{
  font-family:'RHSerif',Georgia,serif!important;
  font-weight:500!important;
  font-size:clamp(46px,5.6vw,86px)!important;
  letter-spacing:-.012em!important;
  line-height:.96!important;
  text-shadow:none;
  color:var(--bone);
}
.hero h1 em{color:var(--bone);font-style:italic;opacity:.72}
.lede{font-family:'PCSans',sans-serif;color:var(--muted);line-height:1.7;font-size:14.5px}
.hero-copy form{
  display:flex;gap:0;margin:32px 0 28px;max-width:560px;
  border:1px solid var(--bench-line2);border-radius:999px;overflow:hidden;
  background:var(--bench-panel);box-shadow:0 10px 30px #0006;
}
.hero-copy form input{
  flex:1;background:transparent;border:0;color:var(--bone);
  padding:15px 22px;font-size:13px;letter-spacing:.02em;font-family:'PCSans',sans-serif;
}
.hero-copy form input::placeholder{color:#61686e}
.hero-copy form button{
  background:var(--lime);color:#110E08;border:0;
  padding:0 26px;font-weight:700;letter-spacing:.08em;font-size:11.5px;cursor:pointer;
  border-radius:999px;min-width:0;margin:4px;font-family:'PCSans',sans-serif;
}
.hero-copy form button:hover{background:#dbff4d;transform:none}
.statline{display:flex;flex-wrap:wrap;gap:26px 34px}
.statline span{display:flex;flex-direction:column;gap:3px}
.statline b{font-family:'RHSerif',Georgia,serif;font-size:30px;color:var(--bone);font-weight:500;font-variant-numeric:tabular-nums;line-height:1}
/* sentence-case, looser tracking: all-caps micro-labels were a stiffness source.
   Uppercase stays a device for codes/tags, not for every descriptor. */
.statline span{font-size:11.5px;color:var(--muted);letter-spacing:.04em;text-transform:none}

/* the bench itself (populated by bench.js) */
aside.bench{
  padding:32px 5vw 32px 4vw;display:flex;flex-direction:column;justify-content:center;gap:0;
  background:
    linear-gradient(180deg,#0e1113,#0b0d0e);
}
.bench-rig{
  border:1px solid var(--bench-line2);border-radius:6px;overflow:hidden;
  background:var(--bench-panel);
  box-shadow:0 24px 60px -20px #000, inset 0 1px 0 rgba(255,255,255,.03);
}
.bench-top{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 16px;border-bottom:1px solid var(--bench-line);
  font-family:'PCMono',monospace;font-size:10px;letter-spacing:.14em;color:var(--muted);
  background:linear-gradient(180deg,#14181b,#0f1214);
}
.bench-top b{color:var(--amber);font-weight:700;display:inline-flex;align-items:center;gap:7px}
.bench-top b:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px var(--amber);animation:benchBlink 1.4s ease-in-out infinite}
@keyframes benchBlink{0%,100%{opacity:1}50%{opacity:.25}}
.bench-stage{display:grid;grid-template-columns:1fr 1fr;gap:0}
@media(max-width:1080px){.bench-stage{grid-template-columns:1fr}}

/* left: the physical slab holder mounting REAL card art */
.holder-wrap{
  position:relative;padding:34px 20px;display:flex;align-items:center;justify-content:center;
  border-right:1px solid var(--bench-line);
  background:
    radial-gradient(120% 90% at 50% 0%,#181d21,#0c0f11 72%);
  overflow:hidden;min-height:392px;
}
/* faint dimension line down the left gutter — reads as a measurement rig */
.holder-wrap:before{
  content:'';position:absolute;left:16px;top:34px;bottom:34px;width:1px;
  background:repeating-linear-gradient(180deg,var(--bench-line2) 0 6px,transparent 6px 12px);
}
.holder{
  position:relative;width:212px;border-radius:7px;padding:5px 5px 16px;
  background:linear-gradient(158deg,#f6f4ee,#d7d3c9 46%,#b3aea3);
  box-shadow:0 14px 34px -6px #000c, inset 0 0 0 1px #ffffff66;
  transition:transform .5s cubic-bezier(.2,.8,.2,1);
}
.holder .grade-flag{
  display:flex;align-items:center;justify-content:space-between;
  height:22px;padding:0 6px;margin-bottom:4px;border-radius:4px 4px 1px 1px;
  background:#fbfaf7;border-top:4px solid var(--amber);
  font-family:'PCMono',monospace;font-size:10px;color:#15140f;letter-spacing:.02em;
}
.holder .grade-flag b{font-family:'RHSerif',Georgia,serif;font-weight:700;font-size:14px;color:#15140f}
.holder .slab-art{
  display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:2px;
  background:#0c0f11;box-shadow:inset 0 0 0 1px #0006;
}
.holder .slab-cert{
  position:absolute;left:0;right:0;bottom:3px;text-align:center;
  font-family:'PCMono',monospace;font-size:10.5px;letter-spacing:.12em;color:#4a463d;
}
/* registration brackets CLAMP the slab itself (not the stage), so they read as
   measurement jaws rather than decoration. Wrapper is sized to the holder. */
.clamp{position:relative;display:inline-block;flex:none}
.clamp:before,.clamp:after{
  content:'';position:absolute;width:20px;height:20px;pointer-events:none;z-index:5;
  border:1.5px solid var(--cyan);opacity:.9;
}
.clamp:before{left:-9px;top:-9px;border-right:0;border-bottom:0}
.clamp:after{right:-9px;bottom:-9px;border-left:0;border-top:0}
/* second pair, opposite corners */
.clamp>.jaw:before,.clamp>.jaw:after{
  content:'';position:absolute;width:20px;height:20px;pointer-events:none;z-index:5;
  border:1.5px solid var(--cyan);opacity:.55;
}
.clamp>.jaw:before{right:-9px;top:-9px;border-left:0;border-bottom:0}
.clamp>.jaw:after{left:-9px;bottom:-9px;border-right:0;border-top:0}
.clamp>.jaw{position:absolute;inset:0;pointer-events:none}

/* sweeping scan bar travels across the SLAB */
.scanbar{
  position:absolute;left:-4px;right:-4px;height:2px;top:0;pointer-events:none;z-index:6;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  box-shadow:0 0 14px 2px rgba(204,255,0,.45);
  animation:benchScan 2.8s ease-in-out infinite;
}
@keyframes benchScan{0%{top:2%;opacity:.15}48%{opacity:1}100%{top:96%;opacity:.15}}
.crosshair{position:absolute;inset:0;pointer-events:none;z-index:4;opacity:.45}
.crosshair:before,.crosshair:after{content:'';position:absolute;background:rgba(204,255,0,.30)}
.crosshair:before{left:50%;top:4%;bottom:4%;width:1px;transform:translateX(-.5px)}
.crosshair:after{top:50%;left:4%;right:4%;height:1px;transform:translateY(-.5px)}

/* right: OCR readout — real cert/grade/subscore data */
.readout{padding:16px 18px;display:flex;flex-direction:column;gap:0}
.readout .r-subject{
  font-family:'RHSerif',Georgia,serif;font-weight:700;font-size:17px;line-height:1.1;color:var(--bone);
  margin-bottom:2px;
}
.readout .r-set{font-family:'PCMono',monospace;font-size:11px;color:var(--muted);letter-spacing:.03em;margin-bottom:12px;line-height:1.4}
.readout .r-line{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:6px 0;border-top:1px solid var(--bench-line);
  font-family:'PCMono',monospace;font-size:10px;
}
.readout .r-line:first-of-type{border-top:0}
.readout .r-line span{color:var(--muted);letter-spacing:.08em}
.readout .r-line b{color:var(--bone);font-weight:700;font-variant-numeric:tabular-nums}
.readout .r-line b.hi{color:var(--amber)}
/* subscore meters */
.r-sub{margin-top:12px;display:grid;gap:7px}
.r-sub .row{display:grid;grid-template-columns:64px 1fr 30px;gap:9px;align-items:center;font-family:'PCMono',monospace;font-size:10.5px}
.r-sub .row span{color:var(--muted);letter-spacing:.06em}
.r-sub .row .meter{height:5px;background:var(--bench-panel2);border-radius:3px;overflow:hidden;position:relative}
/* subscores are DATA, not actions — neutral bone fill so lime stays action-only */
.r-sub .row .meter i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#b8b09a,#8a836d);border-radius:3px;transition:width .6s cubic-bezier(.2,.8,.2,1)}
.r-sub .row b{text-align:right;color:var(--bone);font-variant-numeric:tabular-nums}
.bench-foot{
  display:flex;gap:0;border-top:1px solid var(--bench-line);
  font-family:'PCMono',monospace;font-size:10px;letter-spacing:.1em;color:var(--muted);
}
.bench-foot span{flex:1;padding:9px 6px;text-align:center;border-right:1px solid var(--bench-line)}
.bench-foot span:last-child{border-right:0}
.bench-foot span.on{color:var(--cyan)}

/* inspection queue: real thumbnails of the slabs waiting on the bench.
   Fills the column honestly instead of leaving dead space. */
.bench-queue{margin-top:14px;border:1px solid var(--bench-line);border-radius:5px;background:var(--bench-panel);overflow:hidden}
.q-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;border-bottom:1px solid var(--bench-line);
  font-family:'PCMono',monospace;font-size:10.5px;letter-spacing:.14em;color:var(--muted);
}
.q-head b{color:var(--amber);font-weight:700}
.q-strip{display:flex;gap:1px;background:var(--bench-line)}
.q-item{
  margin:0;flex:1;min-width:0;background:#0c0f11;padding:7px 5px 5px;
  display:flex;flex-direction:column;align-items:center;gap:5px;
  opacity:.42;transition:opacity .3s ease,background .3s ease;
}
.q-item img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:2px;display:block;filter:grayscale(.55)}
.q-item figcaption{font-family:'PCMono',monospace;font-size:11px;letter-spacing:.05em;color:var(--muted);white-space:nowrap}
.q-item.on{opacity:1;background:var(--bench-panel2)}
.q-item.on img{filter:none;box-shadow:0 0 0 1.5px var(--cyan)}
.q-item.on figcaption{color:var(--cyan)}
@media(max-width:640px){
  .q-item:nth-child(n+7){display:none}
  .q-item figcaption{font-size:10.5px}
}

/* ============================================================
   INTRO / DISTRIBUTION
   ============================================================ */
.intro-panel{background:linear-gradient(180deg,var(--bench-panel),transparent 90%)}
.intro-content h2{letter-spacing:.005em!important;line-height:1.02!important}
.intro-content .intro-lead{font-family:'PCSans',sans-serif}
.intro-benefits{border-color:var(--bench-line);background:var(--bench-line)}
.intro-benefits div{background:var(--bench-panel)}
.intro-benefits b{color:var(--amber)}
.intro-stats b{font-family:'RHSerif',Georgia,serif;color:var(--amber)}
.intro-chart{border-color:var(--bench-line2);border-radius:6px;background:var(--bench-steel)}
.cat-bar .track i{background:linear-gradient(90deg,var(--amber),#d98e00)}
.spark polyline{stroke:var(--cyan)}

/* ============================================================
   ARENA — kill gradient text, make it a "head-to-head bench"
   ============================================================ */
.arena{background:linear-gradient(180deg,#0c0f11,transparent 70%)!important}
.arena-head h2{
  font-family:'RHSerif',Georgia,serif!important;letter-spacing:.01em!important;
}
.arena-head h2 em{
  -webkit-background-clip:initial!important;background-clip:initial!important;
  background:none!important;color:var(--amber)!important;-webkit-text-fill-color:var(--amber)!important;
}
.vs-mark{
  font-family:'RHSerif',Georgia,serif;font-style:normal;font-size:34px;color:var(--amber);
  text-shadow:none;border:1px solid var(--bench-line2);border-radius:50%;
  width:56px;height:56px;display:flex;align-items:center;justify-content:center;
}
.tok{border-color:var(--bench-line);border-radius:6px;background:var(--bench-panel)}
.tok-price b{font-family:'RHSerif',Georgia,serif}
.tok-chart{border-color:var(--bench-line);border-radius:4px;background:#0c0f11}
.buy{background:var(--pos);color:#06210f;border-radius:4px}
.vault{border-radius:4px}
.tf button,.tok-actions button{border-radius:3px}
.tf button.on{border-color:var(--amber);color:var(--amber)}

/* ============================================================
   REGISTRY LIST
   ============================================================ */
.toolbar{background:rgba(11,13,14,.96)}
.toolbar select{background:var(--bench-panel);border:1px solid var(--bench-line2);color:var(--bone);border-radius:3px;padding:6px 8px}
.toolbar b{font-family:'RHSerif',Georgia,serif;color:var(--amber)}
.register-head{color:var(--muted)}
.card-row{border-bottom:1px solid var(--bench-line)}
.card-row:hover{background:var(--bench-panel)}
.asset b{font-family:'RHSerif',Georgia,serif;font-weight:600}

/* ============================================================
   COVERAGE — break the flat 8-cell uniform grid into a
   calibration-report spec sheet: 2 wide feature rows + a
   6-up compact index. Not equal boxes.
   ============================================================ */
.coverage{background:linear-gradient(180deg,transparent,#0c0f11)}
.coverage .section-title p{color:var(--amber)}
.coverage .section-title h2{font-family:'RHSerif',Georgia,serif!important;letter-spacing:.01em!important}
.coverage-grid{
  display:grid!important;
  grid-template-columns:repeat(6,1fr);
  gap:1px!important;background:var(--bench-line);border:1px solid var(--bench-line);border-radius:6px;overflow:hidden;
}
.coverage-grid .field{
  background:var(--bench-panel);padding:22px 20px!important;margin:0!important;
  border:0!important;grid-column:span 2;position:relative;
  transition:background .18s ease;
}
.coverage-grid .field:hover{background:var(--bench-panel2)}
/* first two modules span 3 = emphasised feature rows */
.coverage-grid .field:nth-child(1),
.coverage-grid .field:nth-child(2){grid-column:span 3;padding:30px 26px!important;background:var(--bench-panel2)}
.coverage-grid .field:nth-child(1):after,
.coverage-grid .field:nth-child(2):after{
  content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber);
}
.coverage-grid .field i{color:var(--amber);letter-spacing:.14em;font-size:10.5px}
.coverage-grid .field h3{font-family:'RHSerif',Georgia,serif!important;font-weight:600;margin:10px 0 8px}
.coverage-grid .field:nth-child(1) h3,
.coverage-grid .field:nth-child(2) h3{font-size:22px}
.coverage-grid .field p{color:var(--muted);font-family:'PCSans',sans-serif;line-height:1.55;font-size:12px}

/* ============================================================
   METHOD
   ============================================================ */
.method{background:var(--bench-panel)}
.method h2{font-family:'RHSerif',Georgia,serif!important;letter-spacing:.01em!important}
.method ol li b{color:var(--amber);font-family:'RHSerif',Georgia,serif}
.method ol li{border-color:var(--bench-line)}

/* footer */
footer{border-top:1px solid var(--bench-line);background:var(--bench-steel)}
footer b{font-family:'RHSerif',Georgia,serif}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1080px){
  .hero{grid-template-columns:1fr}
  .hero-copy{border-right:0;border-bottom:1px solid var(--bench-line);padding:88px 7vw 56px}
  aside.bench{padding:28px 7vw 40px}
  .coverage-grid{grid-template-columns:repeat(4,1fr)}
  .coverage-grid .field{grid-column:span 2}
  .coverage-grid .field:nth-child(1),.coverage-grid .field:nth-child(2){grid-column:span 4}
}
@media(max-width:640px){
  .hero h1{font-size:clamp(38px,11vw,56px)!important}
  .statline{gap:20px 26px}
  .statline b{font-size:19px}
  .bench-stage{grid-template-columns:1fr}
  .holder-wrap{border-right:0;border-bottom:1px solid var(--bench-line);min-height:0;padding:26px 20px}
  .holder{width:150px}
  .coverage-grid{grid-template-columns:1fr;gap:1px}
  .coverage-grid .field,
  .coverage-grid .field:nth-child(1),.coverage-grid .field:nth-child(2){grid-column:span 1;padding:20px!important}
  .coverage-grid .field:nth-child(1) h3,.coverage-grid .field:nth-child(2) h3{font-size:18px}
  .bench-foot{flex-wrap:wrap}
  .bench-foot span{flex:1 1 33%;border-bottom:1px solid var(--bench-line)}
}
@media(max-width:360px){
  /* registry rows: confidence metric overran at 320px — clamp the row grid */
  .register{overflow-x:clip}
  .card-row .metric.confidence{min-width:0;overflow:hidden}
  .card-row{max-width:100%}
  /* footer BACK TO REGISTRY link ran 21px past the viewport at 320px */
  footer{flex-wrap:wrap;row-gap:14px}
  footer>*{max-width:100%}
  footer a[href="#registry"]{margin-left:0;white-space:normal}
}
@media(prefers-reduced-motion:reduce){
  .scanbar,.bench-top b:before{animation:none}
  .scanbar{top:50%!important;opacity:.6}
}

/* ============================================================
   DE-BOX PASS — replace the hairline grid-cell system entirely.
   Measured before: dominant border-radius 0px/2px, 353 elements at r=0,
   every panel = 1px hairline box + filled bg (box-in-box dashboard cells).
   That cell grid IS the rigidity. New system: no dividing lines, content
   floats on the warm ground with generous space; surfaces are soft, tinted
   and rounded instead of outlined. Content architecture untouched.
   ============================================================ */

/* --- 1. kill the structural grid lines --- */
.coverage-grid{border:0!important;background:transparent!important;
  grid-template-columns:repeat(auto-fit,minmax(258px,1fr))!important;gap:14px!important}
.field{
  border:0!important;border-radius:16px!important;
  background:linear-gradient(168deg,#1a1710 0%,#151208 100%)!important;
  padding:26px 24px 28px!important;min-height:auto!important;
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset;
}
.field i{color:var(--lime)!important;opacity:.75}
.field h3{margin:12px 0 8px!important}

/* method: was a hairline-topped 2-col slab */
.method{border:0!important;background:transparent!important;padding:96px 7vw!important;
  gap:6vw!important;align-items:start!important}
.method ol{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:2px}
.method ol li{
  border:0!important;border-radius:14px!important;padding:16px 18px!important;
  background:#17140d!important;display:grid!important;
  grid-template-columns:34px 96px 1fr!important;gap:14px!important;align-items:center!important;
}
.method ol li b{color:var(--lime)!important;font-family:'PCMono',monospace!important;font-size:11px!important}

/* toolbar / header / footer: drop the hard rules */
.toolbar{border:0!important;background:transparent!important;padding:26px 4vw 6px!important;
  flex-wrap:wrap!important;gap:16px 22px!important}
header{border:0!important;background:rgba(17,14,8,.82)!important;backdrop-filter:blur(14px)}
footer{border:0!important;background:transparent!important;padding-top:56px!important}

/* selects/inputs: outlined chips -> soft filled pills */
select,.toolbar select{
  border:0!important;border-radius:999px!important;
  background:#1d1a11!important;padding:9px 16px!important;
  color:var(--bone)!important;font-size:11.5px!important;cursor:pointer;
}
select:hover{background:#242015!important}

/* intro: 1px-gap grid of cells -> spaced soft cards */
.intro-benefits{
  border:0!important;background:transparent!important;gap:10px!important;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr))!important;
}
.intro-benefits > div{
  background:#17140d!important;border-radius:14px!important;padding:18px 18px 20px!important;
}
.intro-benefits b{color:var(--lime)!important}
.intro-chart{border:0!important;border-radius:18px!important;background:#161309!important;padding:28px!important}

/* registry rows: hairline dividers -> hover-lift cards with breathing room */
.register-head{border:0!important;opacity:.5;padding-bottom:10px!important}
#cardList{display:flex;flex-direction:column;gap:8px}
.card-row{
  border:0!important;border-radius:14px!important;
  background:#17140d!important;min-height:auto!important;
  padding:16px 18px!important;align-items:center!important;
  transition:background .18s ease,transform .18s ease!important;
}
.card-row:hover{background:#1f1b11!important;transform:translateX(3px)!important}
.card-row:focus-visible{outline:2px solid var(--lime);outline-offset:2px}

/* detail modal cells */
.module{border:0!important;border-radius:14px!important;background:#17140d!important;
  min-height:auto!important;padding:20px 20px 22px!important}
.detail-grid{gap:10px!important}
.kv{border:0!important;padding:7px 0!important}
.kv + .kv{box-shadow:0 -1px 0 rgba(255,255,255,.045)}
.bar{border-radius:99px!important;overflow:hidden}
.bar i{border-radius:99px!important}

/* bench rig + queue: outlined instrument boxes -> soft surfaces */
.bench-rig{border:0!important;border-radius:20px!important;background:#161309!important}
.bench-queue{border:0!important;border-radius:16px!important;background:#15120a!important}
.q-item{border-radius:10px!important;overflow:hidden}
.q-item img{border-radius:8px!important}
.tok,.tok-chart{border:0!important;border-radius:16px!important;background:#17140d!important}
img,.slab-art{border-radius:10px!important}

/* soften remaining generic hairlines that read as cell walls */
section{border-top:0!important}
.section-title{border:0!important}

@media(max-width:700px){
  .method{padding:64px 6vw!important;grid-template-columns:1fr!important;gap:34px!important}
  .method ol li{grid-template-columns:28px 1fr!important;row-gap:4px!important}
  .method ol li span{grid-column:2}
  .method ol li small{grid-column:2}
  .card-row{padding:14px!important}
}

/* --- de-box fix pass (measured, not guessed) ---
   1) .card-row was width:1440 flush to the viewport with no gutter, so the
      trailing Buy/Sell anchors overflowed the row's right edge by 38px while
      document.scrollWidth stayed 1440 (page-level probe missed it).
   2) fill #17140d sat too close to the ground to read as a floating card. */
#cardList{box-sizing:border-box}
.card-row{
  background:#1c1810!important;               /* lifted off the ground */
  box-shadow:0 1px 2px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.035) inset!important;
  overflow:hidden!important;                   /* nothing escapes the radius */
}
.card-row:hover{background:#241f14!important}
/* keep the trailing action cluster inside the rounded row */
.card-row .detail-trade,.card-row .t-buy,.card-row .t-sell{max-width:100%}

/* the base grid keeps padding:14px 4vw and a trailing 40px watch column; that
   4vw internal inset is enough — do NOT add an outer gutter too. Just make the
   row padding uniform and let the grid breathe. */
.card-row{padding:18px 4vw!important}

/* gutter via MARGIN (not padding) so the base grid's own 4vw inset and its
   trailing 40px watch track stay intact — padding-based gutters double up and
   pushed the last column 38px past the row edge. */
#cardList{margin:0 clamp(14px,3vw,44px)!important}
.register-head{margin:0 clamp(14px,3vw,44px)!important}

/* last square surfaces that still read as cells (measured via r=0 + has-bg scan).
   Section wrappers stay square on purpose — they're full-bleed ground, not cards. */
.card-row .grade{background:transparent!important;border-radius:8px!important}
.q-strip{border-radius:12px!important}
.holder-wrap{border-radius:14px!important}