/* ACLS Scenarios — choose (cases | stem | how it works), run (monitor | action panel), debrief.
   Tokens match the Simulator (site/junkers-app.css); shared header/footer come from /site-navigation.css. */
:root{
  --navy-950:#071a36;--navy-900:#0b2a5b;--navy-800:#143766;--navy-700:#1d4a80;--navy-100:#e8eef7;
  --teal-600:#08808b;--teal-500:#0a9aa6;--teal-50:#e5f5f6;
  --ink:#172536;--ink-2:#3a4b5f;--muted:#5b6a7c;
  --line:#dde3ea;--line-2:#c6d0db;--bg:#f4f6f9;--surface:#fff;--surface-2:#f6f8fb;--segment:#e9eef4;
  --danger:#b42318;--danger-bg:#fdecea;--ok:#146c43;--ok-bg:#e6f4ec;--warn-bg:#fff4dc;--warn-ink:#7a5a1c;--na-bg:#eef1f5;
  --device:#0c1824;--device-line:#1e3142;--trace:#5aef9b;--trace-dim:#7fae95;
  --radius:10px;
  font-family:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  font-size:14px;line-height:1.45;color:var(--ink);background:var(--bg);color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:var(--bg);-webkit-font-smoothing:antialiased}
a{color:var(--navy-700);text-underline-offset:2px}
button,input,select{font:inherit;color:inherit}
.skip-link{position:fixed;left:12px;top:-80px;z-index:50;background:#fff;padding:10px 14px;border:2px solid var(--teal-500);border-radius:8px}
.skip-link:focus{top:10px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Controls (same look as the Simulator) */
.acls-main button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:6px 13px;border:1px solid var(--line-2);border-radius:8px;background:var(--surface);color:var(--navy-900);font-weight:500;cursor:pointer}
.acls-main button:hover{background:var(--surface-2);border-color:#aebccb}
.acls-main button:disabled{opacity:.45;cursor:default}
.acls-main .btn-primary{background:var(--navy-900);border-color:var(--navy-900);color:#fff}
.acls-main .btn-primary:hover{background:var(--navy-800);border-color:var(--navy-800)}
.acls-main select{min-height:32px;padding:4px 8px;border:1px solid var(--line-2);border-radius:7px;background:var(--surface);color:var(--ink)}
.acls-main :is(button,select,input,summary,a):focus-visible{outline:2px solid var(--teal-500);outline-offset:2px}

.acls-main{max-width:1440px;margin:0 auto;padding:16px 20px 32px}
.acls-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin:0 0 14px}
.acls-head h1{margin:0;font-size:24px;line-height:1.2;color:var(--navy-900)}
.acls-head .lead{margin:0;flex:1 1 420px;color:var(--ink-2);font-size:14.5px}
.draft-tag{display:inline-block;margin:0;padding:2px 9px;border:1px solid #e9d98f;border-radius:6px;background:var(--warn-bg);color:var(--warn-ink);font-size:12.5px;font-weight:600}
.draft-inline{margin-top:12px}
.acls-load{padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.small{font-size:12.5px;color:var(--muted)}
.chip{display:inline-flex;align-items:center;gap:4px;font-size:12px;padding:2px 8px;border-radius:999px;background:var(--segment);color:var(--ink-2)}

.acls-view{display:grid;gap:16px;align-items:start}
.acls-choose{grid-template-columns:250px minmax(0,1fr) 300px}
.acls-run{grid-template-columns:minmax(0,1fr) 390px}
.acls-debrief{grid-template-columns:minmax(0,1fr) 360px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);min-width:0}
.panel-h{padding:12px 14px;border-bottom:1px solid var(--line);display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.panel-h h2{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0;font-weight:600}
.panel-b{padding:14px}

/* Choose */
.case-list{list-style:none;margin:0;padding:6px}
.case-list button{width:100%;justify-content:flex-start;text-align:left;border-color:transparent;background:none;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 10px}
.case-list button[aria-pressed=true]{background:var(--navy-100);border-color:#c9d6ea}
.case-list .t{font-weight:600;color:var(--ink)}
.case-list .m{font-size:12px;color:var(--muted)}
.stem .meta{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.stem-title{font-size:22px;margin:0 0 6px;color:var(--navy-900);text-wrap:balance}
.stem-text{font-size:15.5px;max-width:62ch;margin:0 0 16px}
.start{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.start-notice{margin:16px 0 0;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;color:var(--ink-2);max-width:70ch}
.side dl{margin:0;display:grid;gap:10px}
.side dt{font-size:12px;color:var(--muted);font-weight:600}
.side dd{margin:0}
.side .small{margin:6px 0 0}
/* P1: one "Show rhythm names" switch next to Start and in the case bar. */
.switch{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2);cursor:pointer;min-height:36px}
.switch input{appearance:none;width:34px;height:20px;border-radius:999px;background:#c6d0db;position:relative;margin:0;cursor:pointer;flex:none;transition:background-color .12s}
.switch input::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .12s}
.switch input:checked{background:var(--navy-900)}
.switch input:checked::after{transform:translateX(14px)}
.names-note{color:var(--warn-ink)}
.start-help{margin:8px 0 0}
.how{margin:0;padding-left:18px;display:grid;gap:6px}
.more{margin-top:10px}
.more summary{cursor:pointer;font-weight:600;color:var(--navy-900)}
.more p{margin:6px 0 0;font-size:13px;color:var(--ink-2)}

/* Run: monitor column */
.stage{min-width:0}
.casebar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.casebar .ct{font-weight:600;color:var(--navy-900);font-size:15px}
.casebar .grow{flex:1}
.device{background:var(--device);border-radius:var(--radius);padding:10px 12px 12px;color:#cfe3ea}
.mon-h{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px;min-height:40px}
.status{display:flex;align-items:center;gap:8px;font-size:12.5px}
.dot{width:8px;height:8px;border-radius:50%;background:#5d6f7d;flex:none}
.dot[data-live=true]{background:var(--trace)}
.guided-rhythm{margin:0;flex:1;text-align:center;font-size:13px;color:#e4f1f5;font-weight:600;min-width:0}
.hr{display:flex;align-items:baseline;gap:6px;color:var(--trace)}
.hr small{font-size:11px;color:var(--trace-dim)}
.hr strong{font-size:34px;line-height:1;font-weight:600;font-variant-numeric:tabular-nums;min-width:2.2ch;text-align:right}
.screen{position:relative;display:grid;border:1px solid var(--device-line);border-radius:6px;overflow:hidden}
.screen>*{grid-area:1/1;min-width:0}
#ecg{display:block;width:100%;height:auto;aspect-ratio:16/6;background:#071410;align-self:start}
.mask,.screen-note{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;text-align:center;padding:16px;min-height:100%}
.mask button,.screen-note button{min-height:44px;flex:none}
.mask{background:rgba(12,24,36,.97)}
.screen-note{background:rgba(12,24,36,.98);z-index:2}
.mask b,.screen-note b{color:#fff;font-size:18px}
.mask span,.screen-note span{color:#a8c3cf;font-size:13px;max-width:56ch}
.mask .mask-script{color:#e4f1f5}
/* Situation, case findings and code timer are the key reading on each check (owner 2026-10-23: larger). */
.findings,.timer{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:baseline;padding:11px 14px;background:var(--surface);border:1px solid var(--line);border-radius:8px;margin-top:10px}
.findings .lab,.timer .lab{font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-right:2px;font-weight:600}
.kv{display:inline-flex;gap:7px;align-items:baseline}
.kv span{color:var(--ink-2);font-size:14px}
.kv b{font-size:16.5px;font-variant-numeric:tabular-nums}
.kv b.unk{color:var(--muted);font-weight:500;font-style:italic}
.kv b.rev{color:var(--navy-900);font-weight:700}
.row-note{color:var(--ink-2)}
.findings-note{flex-basis:100%;font-size:11.5px}
.timer{background:var(--surface-2)}
.timer b{font-family:ui-monospace,"Cascadia Mono",Consolas,monospace;font-size:18px}
.dock{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-top:10px;font-size:13px;color:var(--ink-2)}
.dock label{display:inline-flex;align-items:center;gap:6px}
.dock .check input{width:16px;height:16px;accent-color:var(--navy-900)}
.dock-more>summary{cursor:pointer;display:inline-flex;align-items:center;min-height:32px;color:var(--navy-900);font-weight:600}
.dock-more[open]{flex-basis:100%}
.dock-more-body{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-top:6px}
body[data-view=run] .acls-head{display:none}
.monitor-notice{font-size:12px;color:var(--muted);margin:8px 0 0}

/* Run: action panel */
.ap{display:flex;flex-direction:column}
.stepline strong{font-size:15px;color:var(--navy-900)}
.stepline strong:focus{outline:none}
.prog{display:flex;gap:4px;flex:none}
.prog i{width:22px;height:5px;border-radius:3px;background:var(--segment)}
.prog i.on{background:var(--teal-500)}
.waiting{padding:22px 14px;text-align:center;color:var(--muted)}
.waiting b{display:block;color:var(--ink);font-size:15px;margin-bottom:4px}
.questions{margin:0}
.situ{margin:0;padding:13px 14px;border-bottom:1px solid var(--line);font-size:16.5px;line-height:1.45;font-weight:500;color:var(--ink);background:var(--surface-2)}
.q{margin:0;padding:12px 14px;border:0;border-bottom:1px solid var(--line);min-width:0}
.q h3{margin:0 0 8px;font-size:13.5px;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.q h3 .n{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--navy-900);color:#fff;font-size:11.5px;flex:none}
.q h3 small{color:var(--muted);font-weight:400}
.opts{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.opt{display:grid;grid-template-columns:auto 22px minmax(0,1fr);gap:8px;align-items:start;padding:7px 8px;border:1px solid var(--line);border-radius:8px;cursor:pointer;background:var(--surface);min-height:40px}
.opt:hover{border-color:var(--line-2);background:var(--surface-2)}
.opt:has(input:checked){border-color:var(--navy-900);box-shadow:inset 0 0 0 1px var(--navy-900)}
.opt input{margin:2px 0 0;accent-color:var(--navy-900);width:16px;height:16px}
.opt .num{font:600 12px/20px ui-monospace,"Cascadia Mono",Consolas,monospace;color:var(--muted);text-align:right}
.opt .txt{min-width:0}
.opt .badge,.opt .why{display:none}
.opt .odetail{display:block;font-size:12.5px;line-height:1.4;color:var(--ink-2);margin-top:2px}
.graded .opt{cursor:default}
.graded .opt .badge{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.03em;padding:1px 6px;border-radius:5px;margin-left:6px;white-space:nowrap;text-transform:uppercase}
.graded .opt .badge:empty{display:none}
.graded .opt .why{display:block;font-size:12.5px;color:var(--ink-2);margin-top:3px}
.graded .opt:has(input:checked){box-shadow:none}
/* Three families: green (Correct, Correct answer), red (Wrong, Missed, Critical miss — the strongest), grey (Later). */
.fam-green{border-color:#a9d6bd;background:var(--ok-bg)}
.fam-green .badge{background:#cfeadb;color:var(--ok)}
.g-answer{background:var(--surface);border:2px solid #4f9e76}
.fam-red .badge{background:#f7d0cb;color:#8f1c13}
.g-wrong{border-color:#e7b0aa;background:var(--danger-bg)}
.g-missed{border-color:#e7b0aa;border-style:dashed;background:var(--surface)}
.g-critical-miss{border:2px solid var(--danger);background:var(--danger-bg)}
.g-critical-miss .badge{background:var(--danger);color:#fff}
.fam-grey.g-not-now{background:var(--na-bg)}
.fam-grey .badge{background:#dde3ea;color:var(--ink-2)}
.g-neutral,.g-either,.g-acceptable{opacity:.82}
.graded .opt.why-extra .why{display:none}
.all-reasons .graded .opt.why-extra .why{display:block}
.reasons-row{margin:0;padding:8px 14px;border-bottom:1px solid var(--line)}
.acls-main .reasons-row button{min-height:32px;font-size:12.5px;padding:3px 10px}
.group-line{margin:8px 0 0;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:12.5px;color:var(--ink-2)}
.group-line.fam-green{border-color:#a9d6bd;background:var(--ok-bg)}
.group-line.fam-red{border-color:#e7b0aa;background:var(--danger-bg)}
.group-line.crit{border:2px solid var(--danger)}
.group-line b{color:var(--ink)}
.rhythm-info{margin:0;padding:8px 14px;border-bottom:1px solid var(--line);font-size:13px;font-weight:600;color:var(--navy-900);background:var(--navy-100)}
.summary{padding:10px 14px;background:var(--surface-2);border-bottom:1px solid var(--line);font-size:13.5px;scroll-margin-top:8px}
.summary b.crit,.debrief-critical.crit{color:var(--danger)}
.ap-foot #continue{order:3;margin-left:auto}
.foot-count{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.foot-count[data-state=exact]{color:var(--ok);font-weight:600}
.foot-count[data-state=over]{color:var(--danger);font-weight:700}
.summary:focus{outline:2px solid var(--teal-500);outline-offset:-2px}
.ap-foot{padding:12px 14px;border-top:1px solid var(--line);display:flex;gap:8px;align-items:center;flex-wrap:wrap;position:sticky;bottom:0;background:var(--surface);border-radius:0 0 var(--radius) var(--radius);margin-top:auto}

/* Debrief */
table{border-collapse:collapse;width:100%;font-size:13.5px}
th,td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
.tbl{overflow-x:auto}
.org{font-size:11px;padding:1px 6px;border-radius:5px;background:var(--segment);color:var(--ink-2);white-space:nowrap}
.org-engine{background:var(--teal-50);color:#05636b}
.debrief-note{margin:12px 0 0}
.debrief-critical{margin-top:0;font-weight:600}
.debrief-actions{display:flex;gap:8px;flex-wrap:wrap}

.acls-about{max-width:880px;margin:22px 0 0;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink-2)}
.acls-about summary{cursor:pointer;font-weight:600;color:var(--navy-900)}
.acls-about p{margin:8px 0 0;max-width:80ch}

@media(max-width:1099.98px){
  .acls-choose{grid-template-columns:230px minmax(0,1fr)}
  .acls-choose .side{grid-column:1/-1}
  .acls-run{grid-template-columns:minmax(0,1fr) 340px}
}
@media(max-width:959.98px){
  .acls-main{padding:12px 16px 28px}
  .acls-choose,.acls-run,.acls-debrief{grid-template-columns:minmax(0,1fr)}
  .acls-choose .side{grid-column:auto}
  /* The monitor column dissolves into the page grid so the monitor can stay sticky above the action panel. */
  .acls-run{gap:8px}
  .acls-run .stage{display:contents}
  .acls-run .casebar{order:1;margin:0}.acls-run .device{order:2}.acls-run .monitor-notice{order:3}.acls-run .findings{order:4}
  .acls-run .timer{order:5}.acls-run .ap{order:6}.acls-run .dock{order:7}
  .acls-run :is(.findings,.timer,.dock,.monitor-notice){margin:0}
  .acls-main select{font-size:16px;min-height:40px}
  .acls-main button{min-height:44px}
  .opt{min-height:44px}
  /* Touch targets ≥ 40 px (t2-10). */
  .acls-main .algo-links button,.acls-main .reasons-row button{min-height:40px}
  .switch{min-height:40px}
  .dock-more>summary{min-height:40px}
  .dock label.check{min-height:40px}
  .algo>summary,.acls-about summary{min-height:40px;align-items:center}
}
/* While answering, a compact monitor stays in view above the questions — only when the screen is tall enough;
   short and landscape screens scroll normally so every option can be reached (t2-2). */
@media(max-width:959.98px) and (min-height:600px){
  .acls-run.answering .device{position:sticky;top:0;z-index:5;padding:6px 8px 8px;box-shadow:0 2px 6px rgba(7,26,54,.18)}
  .acls-run.answering #ecg{aspect-ratio:16/4.5}
  .acls-run.answering .mon-h{min-height:30px;margin-bottom:4px}
  .acls-run.answering .hr strong{font-size:24px}
  .acls-run.answering .hr strong.none{font-size:16px}
  .acls-run.answering .rhythm-info{display:none}
}
html{scroll-padding-top:var(--acls-sticky,0px);scroll-padding-bottom:var(--acls-foot,0px)}
.ap{scroll-padding-top:8px;scroll-padding-bottom:var(--acls-foot-h,64px)}
.timer .held{font-size:12px;color:var(--muted);font-style:italic}
.row-note.crit{color:var(--danger);font-weight:600}
.acls-main #continue.holding{opacity:.55;cursor:wait}
/* A new step scrolls the run view to the top without hiding it under a sticky site header (U1). */
#view-run{scroll-margin-top:var(--acls-header,0px)}
#debrief-title,#view-choose,#view-debrief{scroll-margin-top:calc(var(--acls-header,0px) + 8px)}
@media(max-width:480px){
  .mon-h{flex-wrap:wrap;row-gap:2px}
  .mon-h .guided-rhythm{order:3;flex-basis:100%;text-align:left;font-size:12.5px}
}
/* Desktop: the action panel keeps its own scroll so answering never scrolls the monitor away (t1-6). */
@media(min-width:960px) and (min-height:700px){
  /* The monitor column is at least a window tall so the panel can dock under the header; its height is set from
     its live position (--ap-max) so Submit is fully visible even at scrollY 0. */
  .acls-run .stage{min-height:calc(100dvh - var(--acls-header,0px) - 16px + var(--acls-dock-gap,0px))}
  .acls-run .stage .acls-about{margin-top:16px}
  .acls-run .ap{position:sticky;top:calc(var(--acls-header,0px) + 8px);max-height:var(--ap-max,calc(100dvh - var(--acls-header,0px) - 16px));overflow:auto}
  /* The step title stays at the top of the panel's own scroll box. */
  .acls-run .ap .stepline{position:sticky;top:0;z-index:2;background:var(--surface);border-radius:var(--radius) var(--radius) 0 0}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.q.post{background:var(--surface-2)}
.summary p{margin:0 0 4px}
/* Algorithm map: our own drawing (site tokens). Actions are rounded boxes, decisions are pills, drugs and
   checks carry a small grey text tag. Teal means only "you are here"; navy = visited / case path;
   red outline + "✕ step" tag = critical miss. */
.algo{margin-top:10px;background:var(--surface);border:1px solid var(--line);border-radius:8px}
.algo>summary{cursor:pointer;padding:9px 12px;display:flex;gap:8px;align-items:baseline;list-style-position:inside}
.algo-h{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:600}
.algo-body{padding:0 12px 12px}
.algo-label{margin:0 0 8px;font-size:11.5px;color:var(--muted)}
.algo-map{max-height:62vh;overflow:auto;border:1px solid var(--line);border-radius:6px;background:var(--surface-2)}
.algo-svg{display:block;width:100%;max-width:420px;height:auto;margin:0 auto;font:12px/1 "Segoe UI Variable Text","Segoe UI",system-ui,sans-serif}
.algo-svg .node rect.box{fill:#fff;stroke:#9fb0c3;stroke-width:1.2}
.algo-svg .node text{fill:var(--ink);font-size:12px}
.algo-svg .kind-decision rect.box{fill:#eef1f5;stroke:#9fb0c3}
.algo-svg .kind-end rect.box{fill:var(--navy-100)}
.algo-svg .kind-tag{font-size:9px;font-weight:700;letter-spacing:.05em;fill:var(--muted);text-transform:uppercase}
.algo-svg .is-here .kind-tag,.algo-svg .is-visited .kind-tag{fill:#d5dee8}
.algo-svg.wide{max-width:760px}
.algo-svg .group rect{fill:#fff;stroke:var(--line-2);stroke-width:1}
.algo-svg .group-title{font-size:11px;font-weight:700;letter-spacing:.06em;fill:var(--ink-2);text-transform:uppercase}
.algo-svg .side rect{fill:#f1f3f6;stroke:#c6d0db;stroke-width:1}
.algo-svg .side text{font-size:11px;fill:var(--ink-2)}
.algo-svg .side .spine{stroke:#b8c4d1;stroke-width:1.2}
.algo-svg .side.is-visited rect.box{fill:var(--navy-900);stroke:var(--navy-900)}
.algo-svg .side.is-here rect.box{fill:var(--teal-600);stroke:var(--teal-600)}
.algo-svg .side.is-visited text,.algo-svg .side.is-here text{fill:#fff}
.algo-svg .side.is-missed rect.box{stroke:var(--danger);stroke-width:2.2}
.algo-svg .side text.miss-tag{fill:var(--danger)}
.algo-svg .is-visited rect.box{fill:var(--navy-900);stroke:var(--navy-900)}
.algo-svg .is-visited text{fill:#fff}
.algo-svg .is-here rect.box{fill:var(--teal-600);stroke:var(--teal-600)}
.algo-svg .is-here text{fill:#fff}
.algo-svg .is-missed>rect.box{stroke:var(--danger);stroke-width:2.6}
.algo-svg .node rect.miss-pill{fill:#fff;stroke:var(--danger);stroke-width:1.2}
.algo-svg .node text.miss-tag{font-size:10px;font-weight:700;fill:var(--danger)}
.algo-svg .edge path{stroke:#9fb0c3;stroke-width:1.3}
.algo-svg .edge path.tip{fill:#9fb0c3;stroke:none}
.algo-svg .edge.loop path{stroke-dasharray:4 3}
.algo-svg .edge.loop path.tip{stroke-dasharray:none}
.algo-svg .edge.on-path path{stroke:var(--navy-700);stroke-width:2}
.algo-svg .edge.on-path path.tip{fill:var(--navy-700)}
.algo-svg .edge-label{font-size:10.5px;fill:var(--muted)}
.algo-legend{display:flex;flex-wrap:wrap;gap:4px 14px;list-style:none;margin:8px 0 0;padding:0;font-size:12px;color:var(--ink-2)}
.algo-legend .sw{display:inline-block;width:14px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.sw.here{background:var(--teal-600)}.sw.visited{background:var(--navy-900)}.sw.missed{background:#fff;border:2px solid var(--danger)}
.algo-links{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;justify-content:space-between;margin:8px 0 0;font-size:12.5px}
.algo-links a{color:var(--teal-600)}
.acls-main .algo-links button{min-height:30px;padding:3px 10px;font-size:12.5px}
.algo-list{margin:8px 0 0;padding-left:20px;font-size:12.5px}
.algo-note{margin:6px 0 0}
.acls-debrief>.debrief-maps{grid-column:1/-1;order:2}
.debrief-maps .algo-map{max-height:none}
.algo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:16px;margin-top:10px}
.algo-figure{margin:0}
.algo-figure figcaption{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin-bottom:6px;font-size:13px}
.algo-figure figcaption a{color:var(--teal-600);font-size:12.5px}
@media(max-width:959.98px){
  .acls-run .algo{order:7;margin:0}.acls-run .dock{order:8}
  .algo-map{max-height:none}
}
.map-opened{color:var(--warn-ink);font-size:12.5px}
/* "Select N" and the selection counter (owner 2026-10-21). Over N warns; Submit waits for exactly N. */
.q h3 .select-n{font-weight:400;color:var(--ink-2)}
.q h3 .select-n b{font-weight:700;color:var(--navy-900)}
.sel-count{margin:8px 0 0;font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.sel-count[data-state=exact]{color:var(--ok);font-weight:600}
.sel-count[data-state=over]{color:var(--danger);font-weight:700}
.q.graded .sel-count{display:none}
.foot-count{margin:0;align-self:center}
.algo-svg .side rect.miss-pill{fill:#fff;stroke:var(--danger);stroke-width:1.2}
@media(max-width:959.98px){.acls-main .algo-links button{min-height:40px}}
@media(max-width:959.98px){.acls-run .acls-about{order:9;margin:8px 0 0}}

/* B10: on phones the verdict badge starts the reason line. */
@media(max-width:600px){
  .graded .opt .otext{display:block}
  .graded .opt .badge{margin:4px 6px 0 0}
  .graded .opt .why{display:inline}
  .graded .opt.why-extra .why{display:none}
  .all-reasons .graded .opt.why-extra .why{display:inline}
}
/* P8: debrief rows become cards on phones. */
.row-missed{display:block;margin-top:4px;color:var(--danger);font-size:12.5px}
.debrief-table td .org{margin-left:4px}
@media(max-width:599.98px){
  .debrief-table thead{display:none}
  .debrief-table tr{display:block;border:1px solid var(--line);border-radius:8px;padding:6px 10px;margin-bottom:8px}
  .debrief-table td{display:block;border:0;padding:3px 0}
  .debrief-table td::before{content:attr(data-label);display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600}
  .debrief-table td[data-label=Check]::before{content:none}
  .debrief-table td[data-label=Check]{font-weight:700;color:var(--navy-900);font-size:14px}
  .debrief-table .card-only{display:inline}
  .tbl{overflow-x:visible}
}
/* P10: wide screens (≥1600 px) grow smoothly from the 1600 px layout — no jump at the boundary. */
@media(min-width:1600px){
  .acls-main{max-width:min(1840px,calc(1440px + (100vw - 1600px)))}
  .acls-run{grid-template-columns:minmax(0,1fr) clamp(390px,calc(390px + (100vw - 1600px) * .4),540px)}
  .acls-run .opt,.acls-run .situ,.acls-run .summary{font-size:clamp(14px,calc(14px + (100vw - 1600px) * .005),16px)}
}
.ap-foot .foot-count{margin:0}
.foot-count.jump{color:var(--navy-700);font-weight:600;text-decoration:underline;cursor:pointer}
.hr strong.none{font-size:18px}
.card-only{display:none}
