/* Spend Guard demo page (Spanfold brand: paper, forest, ink; IBM Plex). The harness diagram is the centrepiece. */
@font-face{font-family:"IBM Plex Sans";src:url("/static/spanfold/ibm-plex-sans-var.woff2") format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/static/spanfold/ibm-plex-mono-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/static/spanfold/ibm-plex-mono-600.woff2") format("woff2");font-weight:600;font-display:swap}
:root{--paper:#F6F1E6;--surface:#FBF8F1;--sand:#EFE8D9;--sage-wash:#E3ECE5;--ink:#24221F;--ink-soft:#3A3732;--muted:#4D4840;--forest:#245A41;--forest-d:#1A4430;--sage:#7E9A8A;--line:#CBBFA6;--caution:#6E4508;--caution-w:#F1DFC0;--amber:#B8730E;--stop:#8A2A1F;--stop-w:#F3DCD6;--mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--forest)}
:focus-visible{outline:3px solid var(--forest);outline-offset:2px}
.skip{position:absolute;left:-999px;top:8px;padding:8px 12px;background:#fff;z-index:10}.skip:focus{left:8px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--muted)}
.small{font-size:14px;color:var(--muted);margin:8px 0}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1440px;margin:0 auto;padding:14px 24px}
.logo img{display:block;height:24px;width:auto}
.top nav{display:flex;gap:18px;flex-wrap:wrap}
.top nav a{font-size:15px;font-weight:600;text-decoration:none;color:var(--ink-soft)}
.top nav a:hover{color:var(--forest);text-decoration:underline}
.kicker{display:inline-block;margin:0 0 14px;padding:4px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font:600 13px/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--forest)}
.kicker span{color:var(--muted)}

.hero{padding:22px 24px 26px}
.hero-in{max-width:1040px;margin:0 auto;text-align:center}
.hero h1{margin:0 0 14px;text-wrap:balance;font-size:clamp(30px,4.4vw,50px);line-height:1.1;letter-spacing:-.02em}
.hero h1 em{font-style:normal;color:var(--forest)}
.lead{max-width:760px;margin:0 auto 18px;font-size:18px;color:var(--ink-soft)}
.proof{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 16px;padding:0;list-style:none;text-align:left}
.proof li{padding:12px 16px;background:var(--surface);border:1px solid var(--line);border-radius:14px;font-size:15px;color:var(--ink-soft)}
.proof b{display:block;margin-bottom:2px;color:var(--ink);font-size:16px}
.meter .sf-meter{background:var(--surface);border-color:var(--line);color:var(--ink-soft);font-family:inherit;justify-content:center}
.meter .sf-meter-bar i{background:var(--forest)}
.meter .sf-meter-l{color:var(--forest)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border:2px solid var(--forest);border-radius:999px;background:var(--forest);color:#fff;font:inherit;font-size:16px;font-weight:700;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--forest-d);border-color:var(--forest-d);color:#fff}
.btn-ghost{background:transparent;color:var(--forest)}
.btn-ghost:hover{background:var(--sage-wash);color:var(--forest-d)}
.btn-s{min-height:40px;padding:0 16px;font-size:15px}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;pointer-events:none}
.btn-pause{background:var(--ink);border-color:var(--ink)}
.btn-pause:hover{background:#000;border-color:#000}
.btn-pause.on{background:var(--caution-w);border-color:var(--amber);color:var(--caution)}

/* ---- incident ---- */
.incident{padding:8px 24px 40px}
.in{max-width:1360px;margin:0 auto}
.in.narrow{max-width:860px}
.hud{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:12px;margin-bottom:14px;padding:12px;background:rgba(246,241,230,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.hud>div{display:flex;flex-direction:column;gap:4px;padding:10px 14px;background:var(--surface);border:1px solid var(--line);border-radius:14px;min-width:0}
.hud-l{font:600 12px/1.3 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.clock,.cost{font:600 30px/1.1 var(--mono);font-variant-numeric:tabular-nums;color:var(--ink)}
.hud-s{display:flex;justify-content:space-between;gap:8px;font:12.5px/1.3 var(--mono);color:var(--muted)}
.tbar,.cbar{position:relative;display:block;height:8px;border-radius:4px;background:var(--sand);overflow:visible}
.tbar i,.cbar i{display:block;height:100%;width:0;border-radius:4px;background:var(--forest);transition:width .35s ease}
.cbar b{position:absolute;top:-4px;width:2px;height:16px;background:var(--stop);left:80%}
.cbar.over i{background:var(--stop)}
.chip{align-self:flex-start;padding:4px 12px;border-radius:999px;background:var(--sage-wash);color:var(--forest-d);font:600 15px/1.4 var(--mono)}
.chip.running{background:var(--sage-wash)}
.chip.paused,.chip.warn{background:var(--caution-w);color:var(--caution)}
.chip.stopped,.chip.fallback{background:var(--stop-w);color:var(--stop)}

.harness{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:10px;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 50px rgba(36,34,31,.08)}
.band-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.band-t{font:600 13px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--forest)}
.band-sub{font-size:13.5px;color:var(--muted)}
.control{grid-column:1/-1;margin-bottom:22px;padding:14px 16px;border:1px dashed var(--forest);border-radius:14px;background:#F3F8F4}
.ctl{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 12px;margin-top:10px}
.namef{display:flex;flex-direction:column;gap:3px;margin-left:auto;font-size:14px;font-weight:600;color:var(--ink-soft)}
.namef span{font-weight:400;color:var(--muted)}
input[type=text],input[type=email],input[type=number],select{min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit;font-size:16px;color:var(--ink)}
.namef input{width:240px}
.namef.need input{border-color:var(--stop);box-shadow:0 0 0 3px var(--stop-w)}
.ctl-rows{margin:6px 0 0;padding:0;list-style:none}
.ctl-rows li{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:6px;padding:8px 10px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--forest);border-radius:8px;font-size:14px;animation:rowin .35s ease}

.stage{position:relative;grid-row:2;display:flex;flex-direction:column;gap:4px;padding:12px 12px 10px;background:#fff;border:2px solid var(--line);border-radius:14px;transition:border-color .25s,background .25s,box-shadow .25s}
.stage .sn{font:600 12px/1 var(--mono);color:var(--muted)}
.stage h3{margin:0;font-size:16.5px;line-height:1.2}
.stage p{margin:0;font-size:13px;line-height:1.4;color:var(--muted)}
.stage .sc{margin-top:auto;padding-top:6px;font:600 13px/1.2 var(--mono);color:var(--ink-soft)}
.stage .sflag{font:600 12px/1.3 var(--mono);color:var(--caution)}
.stage.lit{border-color:var(--forest);background:var(--sage-wash);box-shadow:0 0 0 4px rgba(36,90,65,.15)}
.stage.done{border-color:var(--sage)}
.stage.amber{border-color:var(--amber);background:var(--caution-w)}
.stage.amber.lit{box-shadow:0 0 0 4px rgba(184,115,14,.22)}
.stage.stopx{border-color:var(--stop);background:var(--stop-w)}
.stage::after{content:"";position:absolute;top:50%;right:-11px;width:10px;height:2px;background:var(--line)}
.stage[data-stage="6"]::after{display:none}

.ledger-h{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;grid-column:1/-1;grid-row:3;margin:16px 0 0;padding:10px 6px 6px;border-top:2px solid var(--ink)}
.lcol{grid-row:4;display:flex;flex-direction:column;gap:6px;min-height:120px;padding:8px 6px;background:var(--paper);border-radius:0 0 10px 10px;border-top:3px solid transparent}
.lcol.amber{border-top-color:var(--amber);background:#F7EBD6}
.lcol .lh{display:none}
.lcol .lempty{font:12.5px/1.3 var(--mono);color:#8A8274}
.lrow{padding:7px 8px;background:#fff;border:1px solid var(--line);border-radius:8px;font-size:12.5px;line-height:1.35;animation:rowin .35s ease;overflow-wrap:anywhere}
.lrow .lt{display:flex;justify-content:space-between;gap:6px;font:12px/1.3 var(--mono);color:var(--muted)}
.lrow .lx{display:block;margin-top:3px;color:var(--ink-soft)}
.lrow .lu{display:flex;justify-content:space-between;gap:6px;margin-top:3px;font:600 12px/1.3 var(--mono);color:var(--ink)}
.lrow .lg{display:inline-block;margin-top:4px;padding:1px 7px;border-radius:999px;background:var(--caution-w);color:var(--caution);font:600 12px/1.4 var(--mono)}
.lrow .lhash{color:#8A8274}
.lrow.amber{border-color:var(--amber);background:#FDF6EA}
.lrow.stop{border-color:var(--stop);background:var(--stop-w)}
.dec{display:inline-block;padding:0 6px;border-radius:5px;background:var(--sage-wash);color:var(--forest-d);font:600 11.5px/1.5 var(--mono);text-transform:uppercase}
.dec.error,.dec.warn{background:var(--caution-w);color:var(--caution)}
.dec.stop,.dec.block{background:var(--stop-w);color:var(--stop)}
.dec.fallback,.dec.pause{background:var(--ink);color:#fff}
@keyframes rowin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(36,90,65,.5)}100%{box-shadow:0 0 0 14px rgba(36,90,65,0)}}

.marker{position:absolute;left:0;top:0;z-index:3;width:18px;height:18px;margin:-9px 0 0 -9px;border:3px solid #fff;border-radius:50%;background:var(--forest);box-shadow:0 2px 8px rgba(0,0,0,.25);opacity:0;transition:transform .32s cubic-bezier(.4,.1,.2,1),opacity .2s,background .2s;animation:pulse 1.4s infinite;pointer-events:none}
.marker.on{opacity:1}
.marker.amber{background:var(--amber)}
.marker.stop{background:var(--stop);animation:none}

/* ---- pause panel ---- */
.pause-panel{margin-top:16px;padding:18px;background:#fff;border:2px solid var(--amber);border-radius:18px;box-shadow:0 18px 50px rgba(36,34,31,.1)}
.pause-panel:focus{outline:none}
.pp-head h3{margin:0;font-size:22px}
.by-stage{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:12px 0 18px}
.bs{padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.bs b{display:block;font-size:13.5px}
.bs .bsn{font:600 11.5px/1 var(--mono);color:var(--muted)}
.bs .bsu{display:block;margin-top:4px;font:600 15px/1.2 var(--mono)}
.bs .bsr{font-size:12.5px;color:var(--muted)}
.bs .bsb{display:block;height:6px;margin-top:6px;border-radius:3px;background:var(--sand);overflow:hidden}
.bs .bsb i{display:block;height:100%;background:var(--forest)}
.opt-h{margin:0 0 10px;font-size:17px}
.opt-h span{display:block;font-size:14px;font-weight:400;color:var(--muted)}
.options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.opt{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.opt.def{border-color:var(--forest);background:#F3F8F4}
.opt.chosen{border:2px solid var(--forest);box-shadow:0 0 0 4px rgba(36,90,65,.15)}
.opt .ol{display:flex;align-items:center;gap:8px}
.opt .ol b{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--forest);color:#fff;font:600 14px var(--mono)}
.opt .ol .dtag{font:600 11px/1.4 var(--mono);text-transform:uppercase;color:var(--forest)}
.opt h5{margin:0;font-size:15.5px;line-height:1.25}
.opt p{margin:0;font-size:13.5px;line-height:1.4}
.opt .oc,.opt .ou{padding:6px 8px;border-radius:8px;font-size:13px}
.opt .oc{background:var(--sand)}
.opt .ou{background:var(--sage-wash)}
.opt .oc i,.opt .ou i{display:block;font:600 11px/1.3 var(--mono);font-style:normal;text-transform:uppercase;color:var(--muted)}
.opt label{display:flex;flex-direction:column;gap:2px;font-size:13px;font-weight:600}
.opt input,.opt select{min-height:38px;padding:5px 8px;font-size:15px;width:100%}
.opt .go{margin-top:auto}
.msg{min-height:1.2em;margin:10px 0 0;font-weight:600;color:var(--stop)}
.msg.ok{color:var(--forest)}

/* ---- side: customer + phone ---- */
.side{display:grid;grid-template-columns:1fr 1.25fr;gap:16px;margin-top:18px}
.side h3{margin:0 0 10px;font-size:19px}
.custpanel,.alertpanel{padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:18px}
.chatframe{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden}
.chat-top{display:flex;align-items:center;gap:8px;padding:9px 12px;background:#2F6F73;color:#fff;font-weight:600;font-size:14.5px}
.chat-top .dot{width:9px;height:9px;border-radius:50%;background:#9FE3B7}
.chat{display:flex;flex-direction:column;gap:8px;min-height:180px;margin:0;padding:12px;list-style:none}
.chat li{max-width:86%;padding:8px 12px;border-radius:14px;font-size:15px;animation:rowin .35s ease}
.chat .cu{align-self:flex-end;background:#2F6F73;color:#fff;border-bottom-right-radius:4px}
.chat .as{align-self:flex-start;background:#EEF2F1;border-bottom-left-radius:4px}
.chat .typing{align-self:flex-start;background:#EEF2F1;color:var(--muted);font-style:italic}
.chat .empty{align-self:center;max-width:none;background:none;color:var(--muted);font-size:14px}
.chat .meta{display:block;margin-top:2px;font:11.5px var(--mono);opacity:.75}
.alertpanel{display:grid;grid-template-columns:270px 1fr;gap:18px;align-items:start}
.alertpanel h3{grid-column:1/-1;margin:0}
.phone{position:relative;width:260px;min-height:520px;display:flex;flex-direction:column;padding:12px;border-radius:40px;background:#1d1c1a;box-shadow:0 18px 40px rgba(0,0,0,.25)}
.ph-notch{position:absolute;top:12px;left:50%;width:92px;height:22px;margin-left:-46px;border-radius:0 0 14px 14px;background:#1d1c1a;z-index:2}
.ph-screen{flex:1;padding:44px 12px 12px;border-radius:30px;background:linear-gradient(170deg,#2c4a3d,#132a20 70%);color:#fff;overflow:hidden;text-align:center}
.ph-time{font:300 56px/1 "IBM Plex Sans",system-ui,sans-serif;letter-spacing:-.02em}
.ph-date{margin:4px 0 18px;font-size:14px;opacity:.85}
.ph-quiet{margin-top:40px;font-size:13.5px;opacity:.7}
.ph-note{padding:10px;border-radius:16px;background:rgba(255,255,255,.93);color:var(--ink);text-align:left;font-size:13.5px;animation:rowin .4s ease}
.ph-app{display:flex;align-items:center;gap:6px;margin-bottom:4px;font-size:11.5px;color:var(--muted)}
.ph-ico{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:5px;background:var(--forest);color:#fff;font:600 11px var(--mono)}
.ph-note p{margin:3px 0 8px;line-height:1.35}
.ph-btns{display:grid;gap:5px}
.ph-btns button{min-height:34px;padding:4px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit;font-size:13px;font-weight:600;text-align:left;color:var(--forest-d);cursor:pointer}
.ph-btns button:first-child{background:var(--forest);border-color:var(--forest);color:#fff}
.ph-btns button:hover{border-color:var(--forest)}
.ph-done{margin:8px 0 0;padding:6px 8px;border-radius:8px;background:var(--sage-wash);font-size:12.5px;font-weight:600;color:var(--forest-d)}
.mailf{display:flex;flex-direction:column;gap:8px}
.mailf h4{margin:0;font-size:17px}
.mailf label{display:flex;flex-direction:column;gap:3px;font-size:14px;font-weight:600}
.mailf .tick{flex-direction:row;align-items:flex-start;gap:8px;font-weight:400}
.mailf .tick input{width:20px;height:20px;margin:1px 0 0;flex:none}
.mailf .btn{align-self:flex-start}
.mailres pre{max-height:240px;overflow:auto;margin:6px 0;padding:10px;background:#fff;border:1px solid var(--line);border-radius:10px;font:12.5px/1.45 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere}
.mailres .st{font-weight:700}
.mailres .st.sent{color:var(--forest)}
.mailres .st.refused{color:var(--stop)}

/* ---- bands below ---- */
.band2{padding:48px 24px;border-top:1px solid var(--line)}
.band2.alt{background:var(--surface)}
.band2 h2{margin:0 0 8px;font-size:clamp(25px,3vw,34px);line-height:1.15;letter-spacing:-.01em}
.lead2{max-width:760px;margin:0 0 20px;font-size:17px;color:var(--ink-soft)}
.vs{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.vs-card{position:relative;padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff}
.vs-card.un{border-top:5px solid var(--stop)}
.vs-card.gu{border-top:5px solid var(--forest)}
.vs-card h3{margin:6px 0 10px;font-size:21px}
.tag{display:inline-block;padding:2px 10px;border-radius:999px;background:var(--sand);font:600 12px/1.5 var(--mono);color:var(--ink-soft)}
.nums{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 12px}
.nums div{padding:8px 10px;border-radius:10px;background:var(--surface)}
.nums dt{font-size:12.5px;color:var(--muted)}
.nums dd{margin:2px 0 0;font:600 20px/1.2 var(--mono);font-variant-numeric:tabular-nums}
.un .nums dd{color:var(--stop)}
.gu .nums dd{color:var(--forest)}
.said{margin:0 0 12px;font-size:15px}
.said span{display:block;font-size:12.5px;color:var(--muted)}
.said q{font-style:italic}
.chart{margin:18px 0 0;padding:14px;border:1px solid var(--line);border-radius:18px;background:#fff}
.chart figcaption{margin-bottom:6px;font-weight:600;font-size:15px}
.chart svg{display:block;width:100%;height:auto}
.chart text{font:12.5px "IBM Plex Mono",monospace;fill:var(--muted)}
.mode2{display:none}
.verdict{margin:16px 0 0;padding:14px 16px;border-left:5px solid var(--forest);background:var(--sage-wash);border-radius:0 12px 12px 0;font-size:17px;font-weight:600}

.report-wrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:start}
.paper{max-width:760px;padding:30px 34px;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 18px 50px rgba(36,34,31,.12)}
.paper h3{margin:0;font-size:24px}
.paper .rmeta{margin:2px 0 16px;font:13px var(--mono);color:var(--muted)}
.paper h4{margin:18px 0 4px;font:600 12.5px/1.3 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--forest)}
.paper p,.paper li{margin:4px 0;font-size:15.5px}
.paper ul{margin:0;padding-left:20px}
.paper .rcost{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0}
.paper .rcost div{flex:1 1 140px;padding:8px 12px;border-radius:10px;background:var(--surface)}
.paper .rcost b{display:block;font:600 20px var(--mono)}
.paper .rec{padding:10px 14px;border-left:4px solid var(--forest);background:var(--sage-wash)}
.report-act{display:flex;flex-direction:column;gap:10px;position:sticky;top:120px}

.gw{display:grid;grid-template-columns:minmax(0,1.4fr) 1fr;gap:16px;align-items:start;margin-bottom:16px}
.code{margin:0;padding:14px 16px;border-radius:14px;background:#1F2421;color:#E6EFE9;font:13.5px/1.6 var(--mono);overflow-x:auto}
.code .c{color:#8FB39E}
.dash{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.tile{padding:16px;border:1px solid var(--line);border-radius:16px;background:#fff;min-width:0}
.tile h3{margin:0 0 10px;font-size:16.5px}
.tile .big{font:600 26px/1.1 var(--mono)}
.hb{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1.6fr) auto;align-items:center;gap:8px;margin:7px 0;font-size:14px}
.hb span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb .tr{height:10px;border-radius:5px;background:var(--sand);overflow:hidden}
.hb .tr i{display:block;height:100%;background:var(--forest)}
.hb .v{font:12.5px var(--mono);color:var(--ink-soft);white-space:nowrap}
.mock{display:inline-block;margin-left:4px;padding:0 6px;border-radius:5px;background:var(--caution-w);color:var(--caution);font:600 11px/1.6 var(--mono);text-transform:uppercase}
.days{display:flex;align-items:flex-end;gap:6px;height:120px;padding-top:10px}
.days div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;font:11px var(--mono);color:var(--muted)}
.days i{display:block;width:100%;max-width:34px;min-height:2px;border-radius:4px 4px 0 0;background:var(--forest)}
.evals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ev{padding:16px;border:1px solid var(--line);border-radius:16px;background:#fff}
.ev h3{margin:0 0 4px;font-size:17px}
.ev .res{display:inline-block;margin-bottom:8px;padding:2px 10px;border-radius:999px;font:600 12.5px/1.5 var(--mono)}
.ev .res.ok{background:var(--sage-wash);color:var(--forest-d)}
.ev .res.miss{background:var(--stop-w);color:var(--stop)}
.ev p{margin:4px 0;font-size:14.5px}
.misses{margin-top:14px}
.misses li{margin:4px 0}
.limits li{margin:6px 0}
.next{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.foot{padding:20px 24px 34px;border-top:1px solid var(--line)}
.foot>div{max-width:900px;margin:0 auto}

@media (min-width:861px){.stage[data-stage="1"],.lcol[data-stage="1"]{grid-column:1}.stage[data-stage="2"],.lcol[data-stage="2"]{grid-column:2}.stage[data-stage="3"],.lcol[data-stage="3"]{grid-column:3}.stage[data-stage="4"],.lcol[data-stage="4"]{grid-column:4}.stage[data-stage="5"],.lcol[data-stage="5"]{grid-column:5}.stage[data-stage="6"],.lcol[data-stage="6"]{grid-column:6}}
/* ---- phones: each stage sits directly above its own ledger rows ---- */
@media (max-width:1100px){
  .options{grid-template-columns:repeat(2,minmax(0,1fr))}
  .side{grid-template-columns:1fr}
  .dash,.evals{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .harness{grid-template-columns:minmax(0,1fr);padding:10px 10px 10px 30px}
  .control{grid-row:auto;margin-bottom:12px}
  .stage,.lcol{grid-row:auto}
  .stage::after{display:none}
  .ledger-h{grid-row:2;margin:0 0 8px;padding:6px 0;border-top:0;border-bottom:1px solid var(--line)}
  .lcol{min-height:0;margin-bottom:12px;padding:6px 6px 8px;border-radius:0 0 12px 12px}
  .lcol .lh{display:block;font:600 11px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
  .lcol .lempty{display:none}
  .lrow .lhash{display:none}
  .stage{border-radius:14px 14px 0 0}
  .harness::before{content:"";position:absolute;left:14px;top:150px;bottom:20px;width:2px;background:var(--line)}
  .hud{grid-template-columns:1fr 1fr 1fr;padding:6px 0;gap:6px}
  .hud>div{padding:6px 8px;gap:3px;border-radius:10px}
  .hud-l{font-size:10px;letter-spacing:.02em}
  .hud .hud-s{display:none}
  .clock,.cost{font-size:18px}
  .chip{padding:2px 8px;font-size:12px;line-height:1.3}
  .mode2{display:block;margin:0 0 8px}
  .proof{grid-template-columns:1fr}
  .by-stage{grid-template-columns:repeat(2,minmax(0,1fr))}
  .options{grid-template-columns:1fr}
  .alertpanel{grid-template-columns:1fr;justify-items:center}
  .alertpanel .mailf{justify-self:stretch}
  .vs{grid-template-columns:1fr}
  .nums{grid-template-columns:1fr 1fr}
  .report-wrap,.gw{grid-template-columns:1fr}
  .report-act{position:static}
  .paper{padding:20px 18px}
  .dash,.evals{grid-template-columns:1fr}
  .namef{margin-left:0;width:100%}
  .namef input{width:100%}
  .ctl .btn{flex:1 1 auto}
  .top nav{display:none}
  .incident,.hero,.band2{padding-left:14px;padding-right:14px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}