:root {
  color-scheme: dark;
  --ink: #f4f7f4;
  --muted: #89948f;
  --panel: rgba(20, 25, 27, .88);
  --line: rgba(255, 255, 255, .11);
  --green: #89f7b0;
  --red: #ff5d68;
  --amber: #ffd270;
  --black: #090c0d;
}

* { box-sizing: border-box; }
html { background: var(--black); }
body { margin: 0; min-width: 320px; color: var(--ink); background: radial-gradient(circle at 12% -12%, #26302c 0, transparent 38%), radial-gradient(circle at 88% 28%, #271b20 0, transparent 30%), #090c0d; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: 34px 34px; mask-image: linear-gradient(to bottom, black, transparent 85%); }
button, a { font: inherit; }
main { width: min(1600px, calc(100% - 44px)); margin: 0 auto; padding-bottom: 32px; }
.topbar { height: 82px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--green); color: var(--green); font-weight: 900; transform: rotate(-7deg); }
.brand div { display: flex; flex-direction: column; letter-spacing: .14em; }
.brand strong { font-size: 13px; }.brand small { color: var(--muted); font-size: 9px; margin-top: 4px; }
.provenance { padding: 9px 13px; border: 1px solid var(--line); border-radius: 99px; font: 700 10px/1 monospace; letter-spacing: .08em; color: #b8c0bc; }
.provenance span { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--amber); margin-right: 8px; box-shadow: 0 0 12px var(--amber); }
.provenance.live { color:var(--green); border-color:rgba(137,247,176,.35); }.provenance.live span { background:var(--green); box-shadow:0 0 12px var(--green); }
.experiment { justify-self: end; color: var(--muted); font: 10px/1.2 monospace; text-align: right; }.experiment strong { display:block; color: #cad0cd; margin-top: 5px; }
.story-intro { min-height:310px; display:grid; grid-template-columns:minmax(330px,.9fr) minmax(360px,1fr) minmax(250px,.6fr); gap:24px; align-items:center; margin:22px 0; padding:22px; border:1px solid var(--line); background:linear-gradient(110deg,rgba(137,247,176,.06),rgba(20,25,27,.9) 45%,rgba(255,210,112,.035)); }
.story-intro>img { display:block; width:100%; max-height:270px; object-fit:cover; border:1px solid rgba(137,247,176,.22); background:#0b1110; }
.story-copy>span,.upgrade-ticket>span,.incident-card>span { color:var(--green); font:700 9px/1 monospace; letter-spacing:.14em; }
.story-copy h1 { margin:14px 0; max-width:650px; font-size:clamp(24px,2.5vw,40px); line-height:1.06; letter-spacing:-.035em; }
.story-copy p { margin:0; color:#aab5b0; font-size:13px; line-height:1.6; }.story-copy p b{color:#eef3f0}
.upgrade-ticket { padding:20px; border:1px solid rgba(255,210,112,.28); background:rgba(7,10,10,.65); }
.upgrade-ticket b { display:block; margin-top:12px; padding:9px; border:1px solid var(--line); font:11px/1.2 monospace; }.upgrade-ticket i { display:block; margin:7px 0 0; color:var(--red); font-style:normal; }.upgrade-ticket p { color:#e3e8e5; font-size:12px; line-height:1.45; }.upgrade-ticket small { display:block; margin-top:14px; color:var(--green); font:8px/1.5 monospace; }
.decision-banner { margin: 22px 0; min-height: 130px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; border: 1px solid rgba(255,93,104,.28); background: linear-gradient(90deg, rgba(255,93,104,.15), rgba(255,93,104,.035)); padding: 20px 26px; position: relative; overflow: hidden; }
.decision-banner::after { content:""; position:absolute; right: 10%; top:-130%; width: 260px; height: 440px; transform: rotate(32deg); background: rgba(255,255,255,.025); }
.decision-word { color: var(--red); font-size: clamp(45px, 6vw, 84px); line-height: .85; font-weight: 950; letter-spacing: -.075em; display: flex; align-items:center; gap: 16px; }
.pulse { width: 11px; height: 11px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 8px rgba(255,93,104,.12), 0 0 25px var(--red); }
.decision-copy { border-left: 1px solid rgba(255,255,255,.13); padding-left: 28px; }.decision-copy div { color: #c0c6c3; font: 10px/1 monospace; letter-spacing: .14em; }.decision-copy span { color: var(--red); margin: 0 8px; }.decision-copy h1 { font-size: clamp(18px,2vw,30px); margin: 11px 0 0; letter-spacing: .06em; }
.coverage { text-align: right; position:relative; z-index:1; }.coverage strong { font: 700 28px/1 monospace; }.coverage span { display:block; color: var(--muted); font-size: 9px; margin-top:8px; letter-spacing:.15em; }
.workflow-impact { display:grid; grid-template-columns:minmax(260px,.85fr) minmax(320px,1.25fr) auto; align-items:center; gap:24px; margin-bottom:22px; padding:18px 22px; border:1px solid rgba(255,210,112,.22); background:rgba(255,210,112,.035); }
.workflow-impact span,.panel-label { color:var(--amber); font:700 9px/1 monospace; letter-spacing:.14em; }
.workflow-impact h2 { margin:7px 0 0; font-size:16px; line-height:1.2; }.workflow-impact p { margin:0; color:#b7c0bc; font-size:12px; line-height:1.55; }
.change-route { min-width:260px; display:grid; grid-template-columns:1fr auto 1fr; gap:7px; align-items:center; text-align:center; }.change-route b { padding:7px; border:1px solid var(--line); font:8px/1.2 monospace; }.change-route>span { color:var(--red); }.change-route small { grid-column:1/-1; color:var(--muted); font:8px/1.3 monospace; }
.incident-section { margin-bottom:22px; padding:20px; border:1px solid rgba(255,210,112,.2); background:rgba(20,25,27,.75); }.incident-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.incident-card{padding:17px;border:1px solid var(--line);background:rgba(7,10,10,.5)}.incident-card>span{color:var(--amber)}.incident-card h3{min-height:54px;margin:11px 0;font-size:13px;line-height:1.45}.incident-card a{display:block;color:var(--green);font:9px/1.3 monospace;text-decoration:none}.incident-card a:hover,.incident-card a:focus-visible{text-decoration:underline}.incident-card small{display:block;margin-top:9px;color:#69736f;font:8px/1.35 monospace}
.workspace { display: grid; grid-template-columns: minmax(0, 1.26fr) minmax(340px, .74fr); gap: 22px; }
.visual-column, .decision-column, .receipt { border: 1px solid var(--line); background: var(--panel); backdrop-filter: blur(20px); }
.visual-column { padding: 20px; }.section-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom: 18px; color:#dce1de; font: 700 10px/1 monospace; letter-spacing:.12em; }.section-heading span, .receipt-title>span { color: var(--green); margin-right: 8px; }.section-heading p { margin:0; color:var(--muted); font-weight:400; letter-spacing:0; }
.comparison { display:grid; grid-template-columns: 1fr 24px 1fr; align-items:center; max-width: 740px; margin: 0 auto; }
.versus { display:flex; align-items:center; height:100%; }.versus::before { content:""; width:1px; height:100%; background:var(--line); margin-left:11px; }.versus span { position:absolute; transform:translateX(-1px); background:#15191a; padding:8px 4px; color:var(--muted); font:9px monospace; }
.video-title { min-height:54px; display:flex; flex-direction:column; justify-content:center; border-bottom:2px solid var(--green); }.video-panel.fail .video-title { border-color:var(--red); }.video-title span { font:800 9px/1 monospace; color:var(--green); letter-spacing:.15em; }.video-panel.fail .video-title span { color:var(--red); }.video-title b { font:10px/1.5 monospace; color:#b6bfbb; }.video-title small { color:#68736f; font:8px/1.35 monospace; }
.portrait-wrap { position:relative; width:100%; aspect-ratio:9/16; background:#050607; overflow:hidden; }.portrait-video { display:block; width:100%; height:100%; object-fit:cover; }
.safe-area { position:absolute; left:8.333%; top:9.375%; width:83.333%; height:75.521%; border:1px dashed rgba(137,247,176,.9); box-shadow:inset 0 0 0 1px rgba(0,0,0,.35); pointer-events:none; }.safe-area span { position:absolute; top:-15px; left:-1px; font:700 7px monospace; color:var(--green); background:rgba(7,10,10,.75); padding:2px 4px; }
.measured-bbox { position:absolute; border:1.5px solid var(--green); pointer-events:none; }.video-panel.fail .measured-bbox { border-color:var(--red); box-shadow:0 0 14px rgba(255,93,104,.38); }.measured-bbox span { position:absolute; bottom:-14px; right:-1px; white-space:nowrap; color:var(--green); background:#090c0d; padding:2px 3px; font:700 6px monospace; }.video-panel.fail .measured-bbox span { color:var(--red); }
.play-toggle { position:absolute; right:10px; top:10px; width:30px; height:30px; border:1px solid rgba(255,255,255,.25); border-radius:50%; color:white; background:rgba(0,0,0,.65); cursor:pointer; font-size:10px; }
.video-result { height:34px; display:flex; align-items:center; gap:7px; color:#b9c3bf; font:9px monospace; }.video-result i { width:6px; height:6px; border-radius:50%; background:var(--green); }.video-panel.fail .video-result i { background:var(--red); }.video-panel.fail .video-result { color:#ff9299; }
.decision-column { display:flex; flex-direction:column; }.headline-block { padding:24px; border-bottom:1px solid var(--line); }.headline-block>span,.diagnosis>span,.action>span { color:var(--muted); font:700 9px monospace; letter-spacing:.15em; }.headline-block h2 { margin:12px 0 0; max-width:580px; font-size:clamp(20px,2vw,32px); line-height:1.1; letter-spacing:-.025em; }
.gates { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid var(--line); }.gate { padding:17px; display:flex; gap:11px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }.gate:nth-child(even){border-right:0}.gate:nth-child(n+3){border-bottom:0}.gate-icon { flex:0 0 25px; height:25px; display:grid; place-items:center; border-radius:50%; background:rgba(137,247,176,.11); color:var(--green); font-weight:900; }.gate.fail .gate-icon { background:rgba(255,93,104,.13); color:var(--red); }.gate div:last-child { min-width:0; }.gate span { display:block; color:var(--muted); font:8px/1.2 monospace; text-transform:uppercase; }.gate strong { display:block; margin:5px 0 3px; font:700 18px/1 monospace; }.gate small { color:#77817d; font:8px/1.2 monospace; }
.diagnosis,.action { padding:20px 24px; }.diagnosis { border-bottom:1px solid var(--line); }.diagnosis p,.action p { color:#c7cecb; font-size:12px; line-height:1.55; margin:9px 0 0; }.action { background:rgba(255,210,112,.035); }.action>span { color:var(--amber); }
.evidence-section { margin-top:22px; padding:20px; border:1px solid var(--line); background:var(--panel); backdrop-filter:blur(20px); }
.evidence-heading { margin-bottom:16px; }.evidence-heading p { max-width:52ch; text-align:right; }
.evidence-summary { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); }
.evidence-stat { min-width:0; padding:16px; border-right:1px solid var(--line); }.evidence-stat:last-child { border-right:0; }.evidence-stat>span { color:var(--muted); font:700 8px/1 monospace; letter-spacing:.12em; }.evidence-stat strong { display:block; margin:8px 0 5px; font:700 24px/1 monospace; }.evidence-stat p { margin:0; color:#77817d; font:8px/1.4 monospace; }.coverage-stat strong { color:var(--green); }
.evidence-grid { display:grid; grid-template-columns:.85fr 1fr 1.2fr; gap:14px; margin-top:14px; }.case-panel { min-width:0; padding:17px; border:1px solid var(--line); background:rgba(6,9,10,.3); }
.support-checks,.invariants { list-style:none; margin:14px 0 0; padding:0; }.support-checks li { display:grid; grid-template-columns:1fr auto; gap:3px 10px; padding:8px 0; border-bottom:1px solid rgba(255,255,255,.07); }.support-checks li:last-child { border:0; }.support-checks span { color:#bdc5c1; font:9px/1.2 monospace; text-transform:uppercase; }.support-checks b { color:var(--green); font:9px/1.2 monospace; }.support-checks li.contradicted b,.support-checks li.missing b { color:var(--amber); }.support-checks small { grid-column:1/-1; color:#69736f; font:8px/1.35 monospace; }
.check-grid { display:grid; grid-template-columns:1fr 1fr; margin:14px 0 0; }.check-grid>div { display:flex; justify-content:space-between; gap:8px; padding:9px 8px; border-bottom:1px solid rgba(255,255,255,.07); }.check-grid dt { color:#8f9995; font:9px/1.2 monospace; }.check-grid dd { margin:0; }.truth { font:800 8px/1 monospace; }.truth.yes { color:var(--green); }.truth.no { color:var(--red); }
.contradiction { margin-top:14px; padding:12px; border-left:2px solid var(--amber); background:rgba(255,210,112,.04); }.contradiction b { color:var(--amber); font:8px monospace; letter-spacing:.12em; }.contradiction p { margin:7px 0 0; color:#aeb7b3; font-size:10px; line-height:1.45; }
.invariants { display:grid; gap:8px; }.invariant { display:grid; grid-template-columns:24px 1fr; gap:9px; align-items:start; padding:9px; border:1px solid rgba(255,255,255,.07); }.status-dot { width:22px; height:22px; display:grid; place-items:center; border-radius:50%; color:var(--green); background:rgba(137,247,176,.1); font-size:10px; font-weight:900; }.invariant.fail .status-dot { color:var(--red); background:rgba(255,93,104,.13); }.invariant b,.invariant small,.invariant code { display:block; }.invariant b { font-size:10px; line-height:1.25; }.invariant small { margin-top:4px; color:#7f8985; font:8px/1.2 monospace; }.invariant code { margin-top:4px; color:#5e6864; font:7px/1.2 monospace; }.blocking-note { margin:12px 0 0; color:#939d99; font-size:10px; line-height:1.45; }.blocking-note b { color:var(--red); }
.evidence-details { margin-top:14px; border:1px solid var(--line); }.evidence-details summary { display:flex; justify-content:space-between; gap:12px; padding:15px 17px; cursor:pointer; color:var(--green); font:700 10px monospace; letter-spacing:.08em; list-style-position:inside; }.evidence-details summary:hover,.evidence-details summary:focus-visible { background:rgba(137,247,176,.05); outline:1px solid var(--green); outline-offset:-1px; }.evidence-details summary small { color:var(--muted); font-weight:400; letter-spacing:0; }.evidence-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:12px; border-top:1px solid var(--line); }
.evidence-row { min-width:0; padding:13px; border:1px solid rgba(137,247,176,.15); background:rgba(137,247,176,.025); }.evidence-row.contradicts { border-color:rgba(255,210,112,.24); background:rgba(255,210,112,.025); }.evidence-kind { display:flex; justify-content:space-between; gap:8px; }.evidence-kind span,.evidence-kind b { color:var(--green); font:700 8px monospace; text-transform:uppercase; }.evidence-row.contradicts .evidence-kind span,.evidence-row.contradicts .evidence-kind b { color:var(--amber); }.evidence-row p { color:#c0c8c4; font-size:10px; line-height:1.5; min-height:30px; }.evidence-row dl { display:grid; grid-template-columns:1fr 1fr 1fr; gap:7px; margin:0; }.evidence-row dt { color:#59635f; font:7px monospace; }.evidence-row dd { margin:3px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#8d9793; font:8px monospace; }.evidence-flags { display:flex; flex-wrap:wrap; gap:5px; margin-top:10px; }.evidence-flags span { padding:4px 5px; border:1px solid var(--line); color:#707a76; font:7px monospace; }
.receipt { margin-top:22px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:24px; padding:18px 20px; }.receipt-title { min-width:165px; display:flex; align-items:center; font:700 10px monospace; letter-spacing:.1em; }.receipt-title>span { font-size:18px; }.receipt-title div { display:flex; flex-direction:column; gap:5px; }.receipt-title small { color:var(--muted); font-size:8px; letter-spacing:0; }
.receipt dl { display:grid; grid-template-columns:repeat(3,minmax(130px,1fr)); gap:13px 20px; margin:0; }.receipt dl>div { min-width:0; }.receipt dt { color:var(--muted); font:8px/1 monospace; letter-spacing:.12em; }.receipt dd { margin:5px 0 2px; overflow:hidden; text-overflow:ellipsis; color:#d9dfdc; font:10px/1.2 monospace; }.receipt dl small { display:block; overflow:hidden; text-overflow:ellipsis; color:#6f7975; font:8px/1.2 monospace; white-space:nowrap; }
.receipt-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; max-width:360px; }.button { min-height:32px; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); background:#161b1c; color:#bfc7c3; text-decoration:none; cursor:pointer; padding:7px 10px; font:9px monospace; }.button.primary { background:var(--green); color:#07100a; border-color:var(--green); font-weight:800; }.button.disabled { opacity:.38; cursor:not-allowed; }
footer { display:flex; justify-content:space-between; padding:20px 3px 0; color:#6f7975; font:9px monospace; }
.loading-card { margin:12vh auto; max-width:720px; padding:48px; border:1px solid var(--line); background:var(--panel); }.loading-card h1 { font-size:42px; }.loading-card p,.loading-card small { color:var(--muted); }.eyebrow { color:var(--green); font:10px monospace; letter-spacing:.15em; }.loading-card.error .eyebrow { color:var(--red); } code { color:var(--green); }
@media (max-width: 1180px) { .story-intro{grid-template-columns:1fr 1fr}.upgrade-ticket{grid-column:1/-1}.evidence-grid{grid-template-columns:1fr 1fr}.invariant-panel{grid-column:1/-1}.workflow-impact{grid-template-columns:1fr 1fr}.change-route{grid-column:1/-1} }
@media (max-width: 1080px) { .workspace{grid-template-columns:1fr}.receipt{grid-template-columns:1fr}.receipt dl{grid-template-columns:repeat(3,1fr)}.receipt-actions{max-width:none}.decision-banner{grid-template-columns:1fr auto}.decision-copy{grid-column:1}.decision-word{grid-row:1}.coverage{grid-column:2;grid-row:1/3}.topbar{grid-template-columns:1fr 1fr}.provenance{display:none} }
@media (max-width: 720px) { .story-intro,.incident-grid{grid-template-columns:1fr}.upgrade-ticket{grid-column:auto}.story-intro>img{max-height:none}.evidence-summary{grid-template-columns:1fr 1fr}.evidence-stat:nth-child(2){border-right:0}.evidence-stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.evidence-grid,.evidence-list{grid-template-columns:1fr}.invariant-panel{grid-column:auto}.workflow-impact{grid-template-columns:1fr}.workflow-impact p,.change-route{grid-column:auto}.evidence-details summary{display:block}.evidence-details summary small{display:block;margin-top:6px} }
@media (max-width: 650px) { main{width:min(100% - 20px,1600px)}.topbar{height:68px}.experiment{display:none}.decision-banner{display:block}.decision-copy{margin-top:20px}.coverage{position:absolute;right:18px;top:20px}.workflow-impact,.evidence-section{padding:14px}.comparison{grid-template-columns:1fr 12px 1fr}.visual-column{padding:10px}.section-heading p{display:none}.gates{grid-template-columns:1fr}.gate{border-right:0!important;border-bottom:1px solid var(--line)!important}.receipt dl{grid-template-columns:1fr 1fr}.receipt-actions{grid-template-columns:1fr}.headline-block{padding:18px}footer{display:block;line-height:1.7} }
@media (max-width: 430px) { .evidence-summary,.receipt dl,.check-grid{grid-template-columns:1fr}.evidence-stat{border-right:0;border-bottom:1px solid var(--line)}.evidence-stat:last-child{border-bottom:0}.change-route{grid-template-columns:1fr auto 1fr;min-width:0}.decision-word{font-size:42px}.coverage{display:none} }