@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/jetbrains-mono-400.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jetbrains-mono-500.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/jetbrains-mono-700.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/space-grotesk-400.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/space-grotesk-500.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/space-grotesk-600.woff2) format("woff2")}
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/space-grotesk-700.woff2) format("woff2")}
:root{--bg:#0a0a0c;--panel:#0e0e12;--panel-2:#121218;--line:#20202a;--line-bright:#45454f;--ink:#eae7df;--muted:#8a8a97;--fox:#e8482b;--jade:#5fb89a;--amber:#d6a44e;--display:"Space Grotesk",var(--mono);--mono:"JetBrains Mono",ui-monospace,"SF Mono","Menlo","Consolas","Liberation Mono",monospace;--fs-xs:.68rem;--fs-sm:.78rem;--fs-base:.84rem;--fs-md:.92rem;--fs-lg:1.05rem;--fs-xl:1.4rem;--fs-2xl:2rem}
*{box-sizing:border-box}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--fox);outline-offset:2px;border-radius:2px}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--fox);color:var(--bg);padding:.5rem .9rem;z-index:100;font-weight:700}
.skip-link:focus{left:.5rem;top:.5rem}
abbr[title]{text-decoration:underline dotted;text-underline-offset:2px;cursor:help}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--mono);
  font-size: 13.5px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 0.01em;
}

main,
footer {
  max-width: 64rem;
  margin: 0 auto;
  padding: 0 1.5rem;
}

footer a {
  color: var(--fox);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
footer a:hover {
  border-bottom-color: var(--fox);
}

main {
  padding-top: 1.25rem;
  padding-bottom: 2rem;
}


/* Section labels — "§ TITLE ────" with a hairline filling the row. */
h2 {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink);
  margin: 2rem 0 0.85rem;
}
h2::before {
  content: "§";
  color: var(--fox);
}
h2::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--line);
}
h2 .note {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
}
h3 {
  font-size: 0.74rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 1.25rem 0 0.4rem;
}
h3 .count {
  color: var(--muted);
  font-weight: 400;
}

.note {
  color: var(--muted);
  font-size: 0.78rem;
}

/* Verdict — a bordered forensic stamp, colour = result. */
/* Hero capability banner — leads the page with the full detection breadth (the MVP value prop). */
.hero {
  border: 1.5px solid var(--line-bright);
  background: var(--panel-2);
  padding: 1.25rem 1.5rem;
  margin: 1.5rem 0;
  display: flex;
  align-items: flex-end;
  gap: 2rem;
  flex-wrap: wrap;
}
.hero-stat {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}
.hero-stat strong {
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--fox);
}
.hero-stat span {
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
}
.hero-note {
  flex: 1 1 14rem;
  margin: 0;
  color: var(--muted);
  font-size: 0.76rem;
  align-self: center;
}

/* === Terminal Forensics verdict hero (the main-page redesign) === */
.display{font-family:"Space Grotesk",var(--mono);font-weight:700;letter-spacing:-.01em}
.eyebrow{color:var(--muted);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:1rem}
.vhero{display:grid;grid-template-columns:1.35fr 1fr;border:1.5px solid var(--line-bright);background:var(--panel);margin:1.25rem 0 0}
.vh-main{padding:2.2rem 1.9rem;border-right:1px solid var(--line);position:relative;overflow:hidden}
.vh-main::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(80% 120% at 12% 0%,rgba(232,72,43,.1),transparent 60%)}
.vh-main>*{position:relative}
.vh-big{display:flex;align-items:baseline;gap:1.1rem;flex-wrap:wrap;min-height:3.2rem}
.vh-label{font-size:clamp(3.2rem,7.5vw,5.4rem);line-height:.86;text-transform:uppercase;color:var(--vcol,var(--muted))}
.vh-score{font-size:clamp(1rem,2.4vw,1.6rem);line-height:1;color:var(--muted);font-variant-numeric:tabular-nums}
.vh-reason{margin:1.2rem 0 0;color:var(--ink);font-size:.86rem;line-height:1.6;max-width:34rem}
.vh-stats{display:flex;gap:1.6rem;margin-top:1.3rem;flex-wrap:wrap}
.vstat{display:flex;flex-direction:column;gap:.2rem}
.vstat .vk{color:var(--muted);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase}
.vstat .vv{font-size:1.1rem;font-weight:700;font-variant-numeric:tabular-nums}
.vh-spine{padding:1.9rem 1.7rem}
.spine-row{display:grid;grid-template-columns:6.5rem 1fr;align-items:center;gap:.8rem;padding:.65rem 0;border-bottom:1px solid var(--line)}
.spine-layer{color:var(--ink);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}
.spine-meter{display:flex;align-items:center;gap:.7rem}
.spine-dot{width:9px;height:9px;border-radius:50%;flex:none}
.spine-trk{flex:1;height:1px;background:var(--line);position:relative}
.spine-trk i{position:absolute;left:0;top:0;height:1px}
.spine-state{width:4.4rem;text-align:right;font-size:.7rem}
.coh-strip{display:flex;justify-content:space-between;align-items:center;gap:.7rem;margin-top:1rem;padding:.7rem .8rem;border:1px solid var(--line);flex-wrap:wrap}
.coh-strip .cl{font-size:.72rem}.coh-strip .cl .k{color:var(--muted)}
.coh-strip .cv{font-weight:700;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}
@media (max-width:720px){.vhero{grid-template-columns:1fr}.vh-main{border-right:0;border-bottom:1px solid var(--line)}}
@media (prefers-reduced-motion:reduce){.fdet-dot{animation:none}}
/* Fired-detections spotlight */
.fired-spot{margin:1.5rem 0 0}
.fdet-row{display:grid;grid-template-columns:16px 1fr 8rem 3.2rem;align-items:center;gap:.9rem;padding:.75rem 0;border-bottom:1px solid var(--line)}
.fdet-dot{width:9px;height:9px;border-radius:50%;background:var(--fox);animation:ksPulse 2s infinite}
.fdet-title{color:var(--ink);font-size:.82rem;margin-top:.15rem}
.fdet-cat{color:var(--muted);font-size:.74rem}
.fdet-weight{text-align:right;color:var(--muted);font-size:.8rem;font-variant-numeric:tabular-nums}
@keyframes ksPulse{0%,100%{opacity:1}50%{opacity:.35}}

.verdict {
  border: 1.5px solid var(--line-bright);
  padding: 1.25rem 1.5rem;
  margin: 1.5rem 0;
  display: flex;
  align-items: baseline;
  gap: 1.25rem;
  flex-wrap: wrap;
}
.verdict .label {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.verdict-bot {
  border-color: var(--fox);
}
.verdict-bot .label {
  color: var(--fox);
}
.verdict-suspicious {
  border-color: var(--amber);
}
.verdict-suspicious .label {
  color: var(--amber);
}
.verdict-human {
  border-color: var(--jade);
}
.verdict-human .label {
  color: var(--jade);
}
.verdict-verified {
  border-color: var(--jade);
}
.verdict-verified .label {
  color: var(--jade);
}
.verdict .score {
  font-size: 0.95rem;
}
.verdict .sub {
  color: var(--muted);
  font-size: 0.76rem;
  margin-left: auto;
}

/* Coherence banner — feature-prediction vs the claimed UA (the thesis, up front). */
.coherence {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0.75rem;
  align-items: stretch;
  margin: 1rem 0 1.5rem;
  border: 1px solid var(--line);
}
.coherence .side {
  padding: 0.85rem 1.1rem;
}
.coherence .side .cap {
  display: block;
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
}
.coherence .side .val {
  font-size: 1rem;
  font-weight: 700;
}
.coherence .verdict-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 1.25rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.8rem;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
}
.coherence.match .verdict-cell {
  color: var(--jade);
}
.coherence.mismatch {
  border-color: var(--fox);
}
.coherence.mismatch .verdict-cell {
  color: var(--fox);
}

/* Predicted-browser detail grid. */
.predict-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
}
.kv {
  background: var(--panel);
  padding: 0.6rem 0.8rem;
}
.kv .k {
  display: block;
  color: var(--muted);
  font-size: 0.66rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.kv .v {
  font-size: 1.05rem;
  font-weight: 700;
}
details.ev {
  margin-top: 0.6rem;
}
details.ev summary {
  color: var(--muted);
  font-size: 0.78rem;
  cursor: pointer;
}
details.ev ul {
  color: var(--muted);
  font-size: 0.78rem;
  margin: 0.4rem 0;
}

/* Fingerprint surfaces — value + hash + tamper status, per surface. */
.surfaces {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
}
.surface {
  background: var(--panel);
  padding: 0.75rem 0.9rem;
  border-top: 2px solid var(--jade);
}
.surface.tampered {
  border-top-color: var(--fox);
}
.surface .top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.surface .sname {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
}
.surface .chip {
  font-size: 0.62rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--jade);
}
.surface.tampered .chip {
  color: var(--fox);
}
.surface .sval {
  font-size: 0.82rem;
  word-break: break-all;
  margin-top: 0.3rem;
}
.surface .shash {
  color: var(--muted);
  font-size: 0.72rem;
  margin-top: 0.2rem;
}
.surface .stells {
  color: var(--fox);
  font-size: 0.72rem;
  margin-top: 0.3rem;
}
.surface .srow {
  margin-top: 0.4rem;
}
.surface .srow .sk {
  display: block;
  color: var(--muted);
  font-size: 0.6rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.surface .srow .sv {
  font-size: 0.82rem;
  word-break: break-all;
}

/* Per-layer score bars — hairline, no gradient. */
.bar {
  display: grid;
  grid-template-columns: 7rem 1fr 3rem;
  align-items: center;
  gap: 0.6rem;
  margin: 0.3rem 0;
}
.bar-label {
  color: var(--muted);
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
}
.bar-track {
  background: var(--panel-2);
  height: 0.55rem;
  overflow: hidden;
  border: 1px solid var(--line);
}
.bar-fill {
  display: block;
  height: 100%;
  background: var(--fox);
}
.bar-val {
  text-align: right;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

/* Detection tables. */
table.detections {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1rem;
  font-size: 0.82rem;
}
table.detections th,
table.detections td {
  text-align: left;
  padding: 0.4rem 0.5rem;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
table.detections th {
  color: var(--muted);
  font-weight: 600;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
td.mark {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
tr.fired td.mark {
  color: var(--fox);
  font-weight: 700;
}
tr.clear td.mark {
  color: var(--muted);
}
tr.clear {
  opacity: 0.5;
}
code {
  font-family: var(--mono);
  color: var(--fox);
}
.title {
  color: var(--ink);
  font-size: 0.8rem;
}
.exp {
  font-size: 0.62rem;
  color: var(--amber);
  border: 1px solid var(--amber);
  background: transparent;
  padding: 0 0.3rem;
  letter-spacing: 0.05em;
}
td.weight {
  font-variant-numeric: tabular-nums;
  color: var(--muted);
}

.na {
  border-left: 2px solid var(--jade);
  padding-left: 0.85rem;
  margin: 1rem 0;
}
.na-list,
.edge-list {
  font-size: 0.78rem;
  color: var(--muted);
  margin: 0.4rem 0;
}
.na-list code {
  color: var(--jade);
}
.edge-list {
  columns: 2;
  column-gap: 2rem;
}
.layers {
  color: var(--line-bright);
}

footer {
  color: var(--muted);
  font-size: 0.78rem;
  border-top: 1px solid var(--line);
  margin-top: 2.5rem;
  padding-top: 1rem;
  padding-bottom: 2.5rem;
}

/* Buttons — the one interactive-control style (re-run, share, post-verdict CTA links). */
.ks-btn {
  font-family: var(--mono);
  font-size: 0.78rem;
  color: var(--ink);
  background: var(--panel);
  border: 1px solid var(--line-bright);
  padding: 0.45rem 0.8rem;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ks-btn:hover {
  border-color: var(--fox);
  color: var(--fox);
}
.ks-btn.primary {
  border-color: var(--fox);
  color: var(--fox);
}
.ks-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 1rem 0 0.5rem;
}
/* Post-verdict next-step block — what the visitor does after seeing the result. */
.ks-cta {
  border-left: 2px solid var(--fox);
  background: var(--panel-2);
  padding: 0.8rem 1rem;
  margin: 1.25rem 0;
}
.ks-cta p {
  margin: 0 0 0.6rem;
  color: var(--ink);
  font-size: 0.9rem;
}

/* Progressive disclosure — the dense evidence panels collapse so the verdict leads. */
.ks-disclose {
  margin: 1.1rem 0;
  border-top: 1px solid var(--line);
}
.ks-disclose > summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink);
  padding: 0.85rem 0;
}
.ks-disclose > summary::-webkit-details-marker {
  display: none;
}
.ks-disclose > summary::before {
  content: "\\25b8";
  color: var(--fox);
}
.ks-disclose[open] > summary::before {
  content: "\\25be";
}
.ks-disclose > summary:hover {
  color: var(--fox);
}
.ks-disclose > summary .note {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--muted);
}

/* Scanning stepper — perceived progress while collecting; hidden once scored. */
.ks-scan {
  display: flex;
  gap: 0.5rem;
  margin: 0.5rem 0;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.ks-scan .ks-step {
  color: var(--muted);
  border: 1px solid var(--line-bright);
  padding: 0.2rem 0.55rem;
}
.ks-scan .ks-step.run {
  color: var(--amber);
  border-color: var(--amber);
}
.ks-scan .ks-step.done {
  color: var(--jade);
  border-color: var(--jade);
}
body.ks-done .ks-scan {
  display: none;
}

/* --- demo-page specifics: status line, result container, server-scored behavioral panel --- */
#ks-status{color:var(--amber);font-size:.82rem;border-left:2px solid var(--amber);padding-left:.75rem;margin:1rem 0}
#ks-result{margin-top:.5rem;min-height:8.5rem}/* reserve verdict height to cut layout shift (CLS) */
#ks-coherence{min-height:2.5rem}
#ks-detections{overflow-x:auto}/* keep all columns on mobile; scroll rather than hide data */
.layer-bars{margin:1rem 0 1.25rem}
.bar-clean .bar-val{color:var(--jade)}.bar-clean .bar-label{color:var(--muted)}
/* The shared evidence-panel language: same bordered box as the verdict hero + behavioral layer, so the
   whole page reads as one cohesive stack of panels (no dropdown affordances). */
#ks-bio,.panel{border:1.5px solid var(--line-bright);background:var(--panel);padding:1.4rem 1.5rem;margin:1.5rem 0}
#ks-bio>h2,.panel>h2{margin-top:0}
.panel .predict-grid,.panel .surfaces{margin-bottom:0}
.fired-spot{margin-top:1.5rem}
.panel:empty{display:none}  /* the fired-detections panel stays hidden until the verdict fills it */
.bio-grid{display:grid;grid-template-columns:1fr 1.35fr;gap:1.6rem;align-items:start}
.bio-controls .bio-note{color:var(--muted);font-size:.72rem;margin:.6rem 0 0}
.bio-grid .bio-metrics{grid-template-columns:1fr;margin:0}
@media(max-width:720px){.bio-grid{grid-template-columns:1fr}}
.bio-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:.6rem 0}
.bio-row{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem;background:var(--panel);padding:.5rem .7rem;font-size:.8rem}
.bio-row span{color:var(--muted)}.bio-row b{font-variant-numeric:tabular-nums;font-weight:700}
.bio-row i{font-style:normal;font-size:.66rem;text-transform:uppercase;letter-spacing:.08em}
.bm-human{color:var(--jade)}.bm-bot{color:var(--fox);font-weight:700}.bm-collecting,.bm-more,.bm-ok,.bm-measured,.bm-na{color:var(--muted)}
.bio-head{grid-column:1/-1;background:var(--bg);color:var(--fox);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;padding:.55rem .7rem .3rem}
.bio-help{color:var(--muted);font-size:.78rem;margin:.3rem 0 .6rem}
#ks-bio-text{width:100%;box-sizing:border-box;padding:.5rem;margin:.3rem 0 .6rem;border:1px solid var(--line-bright);background:var(--panel);color:inherit;border-radius:4px;font:inherit}
/* --- landing nav --- */
nav.top{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap;max-width:64rem;margin:0 auto;padding:.9rem 1.5rem;border-bottom:1px solid var(--line)}
nav.top a{color:var(--muted);text-decoration:none;font-size:.78rem;letter-spacing:.06em}
nav.top a:hover{color:var(--fox)}
nav.top a.brand{display:flex;align-items:center;gap:.5rem;color:var(--ink);font-weight:700;letter-spacing:.22em;text-transform:uppercase;font-size:.95rem}
nav.top a.brand::before{content:"";width:.5rem;height:1.1rem;background:var(--fox)}
nav.top .spacer{flex:1}
/* --- landing prose + faq --- */
h1.page{font-family:var(--display);font-size:2.15rem;font-weight:700;letter-spacing:-.015em;line-height:1.08;margin:.4rem 0 0;color:var(--ink)}
.lead{font-size:1.05rem;color:var(--ink);max-width:46rem;margin:.6rem 0 .25rem}
.prose{color:var(--muted);font-size:.88rem;max-width:48rem}
.prose p{margin:.7rem 0}.prose strong{color:var(--ink)}
.faq details{border-bottom:1px solid var(--line);padding:.65rem 0}
.faq summary{cursor:pointer;color:var(--ink);font-size:.88rem;font-weight:600;list-style:none;display:flex;gap:.5rem;align-items:baseline}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"\\25b8";color:var(--fox);font-size:.8em}
.faq details[open] summary::before{content:"\\25be"}
.passed-toggle summary{list-style:none}
.passed-toggle summary::-webkit-details-marker{display:none}
.passed-toggle summary::before{content:"\\25b8\\A0";color:var(--jade)}
.passed-toggle details[open] summary::before,details[open]>.passed-toggle summary::before{content:"\\25be\\A0"}
.faq details p{color:var(--muted);font-size:.84rem;margin:.5rem 0 0;max-width:48rem}
/* --- composite fingerprint ID + per-layer detection groups --- */
.fpid{border:1px solid var(--line);background:var(--panel-2);padding:.6rem .9rem;margin:.7rem 0;font-size:.82rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:.4rem 1.5rem}
.fpid .id-k{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.66rem}
.fpid b{color:var(--fox);font-variant-numeric:tabular-nums;font-weight:700}
.layer-group{margin:.5rem 0 1rem}
.layer-group .lg-head{display:flex;align-items:baseline;gap:.6rem;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:.6rem 0 .3rem}
.layer-group .lg-head .lg-fired{color:var(--fox);font-weight:700}
.passed-toggle{cursor:pointer;color:var(--muted);font-size:.76rem}
.passed-toggle summary{color:var(--jade)}
.passed-list{font-size:.74rem;color:var(--muted);columns:2;column-gap:2rem;margin:.3rem 0}
.passed-list code{color:var(--jade)}
.rule-link{text-decoration:none}.rule-link:hover code{text-decoration:underline}
.surface.pending{border-top-color:var(--line)}
.surface.pending .chip{color:var(--muted)}
.surface.pending .sval{color:var(--muted)}
/* --- overflow safety: let flex/grid children shrink + wrap long tokens (JA4/UA/hashes) --- */
html,body{overflow-x:hidden;max-width:100%}
.verdict,.coherence,.fpid,.bar,.hero,.layer-group{min-width:0}
.verdict>*,.coherence>*,.coherence .side,.fpid>*,.bar>*{min-width:0}
code,.sval,.shash,.title,.kv .v,.bar-label,.coherence .val,.fpid b{overflow-wrap:anywhere}
/* --- mobile (<=640px) --- */
@media (max-width:640px){
  nav.top,main,footer{padding-left:1rem;padding-right:1rem}
  nav.top{gap:.5rem .9rem}
  nav.top a{font-size:.72rem;min-height:44px;display:inline-flex;align-items:center}
  nav.top a.brand{font-size:.85rem;letter-spacing:.16em}
  h1.page{font-size:1.6rem;letter-spacing:-.01em}
  .lead{font-size:.95rem}
  .hero{gap:.9rem 1.5rem;padding:1rem}
  .hero-stat strong{font-size:1.8rem}
  .verdict{padding:1rem;gap:.5rem 1rem}
  .verdict .label{font-size:1.5rem}
  .verdict .sub{margin-left:0}
  .surfaces,.predict-grid,.bio-metrics{grid-template-columns:1fr}
  .coherence{grid-template-columns:1fr}
  .coherence .verdict-cell{border-left:0;border-right:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:.5rem}
  .bar{grid-template-columns:5rem 1fr 2.25rem;gap:.5rem}
  .edge-list,.passed-list{columns:1}
  /* Detections: a 4-col table with a long "why" sentence can't fit a phone width — the signal column
     (long rule ids) forces width and collapses "why" to one-char-per-line. Stack each row into a card:
     rule id on its own line (wrapping), then category + weight as a small meta line, then the why text. */
  table.detections{font-size:.82rem}
  table.detections,table.detections tbody,table.detections tr,table.detections td{display:block;width:auto}
  table.detections th{display:none}
  table.detections tr{padding:.55rem 0;border-bottom:1px solid var(--line)}
  table.detections td{border:0;padding:0}
  table.detections td.mark{white-space:normal;overflow-wrap:anywhere;font-weight:600;margin-bottom:.15rem}
  table.detections td:nth-child(2),table.detections td.weight{display:inline-block;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em}
  table.detections td.weight{margin-left:.7rem;text-transform:none;letter-spacing:0}
  table.detections td.weight::before{content:"w "}
  table.detections td.title{margin-top:.2rem;color:var(--ink)}
  .fpid{gap:.3rem .9rem}
}