:root{
--canvas:#0a0e13;--bg-2:#0e141b;--surface:#131a23;--surface-2:#19222d;--raise:#212d3a;
--ink:#eef3f8;--sub:#abb7c4;--mute:#7b8896;--faint:#566472;--hair:#1e2731;--hair-2:#2a3540;
--rail-1:#090d12;--rail-2:#0c131b;--rail-ink:#aebac7;--rail-ink-2:#5c6979;
--accent:#24c9a0;--accent-d:#15a886;--accent-2:#5fe6c1;--accent-ink:#012018;
--teal:var(--accent);--teal-d:var(--accent-d);
--good:#2ed196;--ok:#37b07a;--mid:#eaa83e;--warn:#eaa83e;--risk:#f15a48;--null:#566472;
--sh:inset 0 1px 0 rgba(255,255,255,.045),0 1px 2px rgba(2,6,11,.5),0 5px 16px rgba(2,6,11,.4);--sh-lg:inset 0 1px 0 rgba(255,255,255,.05),0 26px 64px rgba(2,6,11,.62),0 8px 22px rgba(2,6,11,.46);--r:14px}
/* ---- color schemes (rail stays dark in every theme) ---- */
html[data-theme="ocean"]{--canvas:#080d14;--bg-2:#0c131c;--surface:#101a26;--surface-2:#162232;--raise:#1d2f43;
 --ink:#e9f1f9;--sub:#a6b8c8;--mute:#73879b;--faint:#506376;--hair:#1a2836;--hair-2:#253749;
 --rail-1:#070c14;--rail-2:#0a121d;--rail-ink:#a6b8c8;--rail-ink-2:#556a7d;
 --accent:#2bb6ec;--accent-d:#1f96c9;--accent-2:#7ad7f7;--accent-ink:#02202d}
html[data-theme="violet"]{--canvas:#0b0a11;--bg-2:#13111c;--surface:#181624;--surface-2:#201d30;--raise:#2a2640;
 --ink:#f0edf8;--sub:#b7b0cc;--mute:#857d9c;--faint:#5c556f;--hair:#231f30;--hair-2:#312b44;
 --rail-1:#0a0812;--rail-2:#100d1b;--rail-ink:#b7b0cc;--rail-ink-2:#645b7a;
 --accent:#8f7cf2;--accent-d:#7560e4;--accent-2:#b9acff;--accent-ink:#160f30}
html[data-theme="light"]{--canvas:#eceff3;--bg-2:#ffffff;--surface:#ffffff;--surface-2:#f3f6f9;--raise:#e7edf2;
 --ink:#13202b;--sub:#44525e;--mute:#67747f;--faint:#93a0aa;--hair:#e3e9ef;--hair-2:#d2dbe2;
 --accent:#0c8e72;--accent-d:#0a7a62;--accent-2:#2fc4ac;--accent-ink:#02231d;
 --good:#0a9a55;--ok:#2f9e5c;--mid:#bd7e1c;--warn:#bd7e1c;--risk:#d6452a;
 --sh:0 1px 2px rgba(13,30,45,.07),0 5px 16px rgba(13,30,45,.08);--sh-lg:0 22px 50px rgba(13,30,45,.16)}
*{box-sizing:border-box}html,body{margin:0;height:100%}
body{background:var(--canvas);color:var(--ink);font:14px/1.5 'Plus Jakarta Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.mono{font-family:inherit;font-feature-settings:"tnum";letter-spacing:0}
button{font-family:inherit;cursor:pointer;color:inherit}::selection{background:color-mix(in srgb,var(--accent) 25%,transparent)}
.faint{color:var(--faint)}.muted{color:var(--mute)}.sm{font-size:11.5px}.teal{color:var(--teal)}
.app{display:grid;grid-template-columns:236px 1fr;min-height:100%;transition:grid-template-columns .2s ease}
.navtoggle{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;color:var(--sub);cursor:pointer;flex:none;padding:0}
.navtoggle:hover{color:var(--ink);border-color:var(--accent)}
.navscrim{display:none}
@media(min-width:761px){body.navcollapse .app{grid-template-columns:0 1fr}body.navcollapse .rail{border-right:0;overflow:hidden}}
.rail{background:linear-gradient(178deg,var(--rail-1),var(--rail-2));color:var(--rail-ink);position:sticky;top:0;height:100vh;display:flex;flex-direction:column;overflow:hidden;border-right:1px solid var(--hair)}
.brand{padding:20px 20px 15px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #ffffff10}
.logo{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;flex:none;box-shadow:0 4px 16px color-mix(in srgb,var(--accent) 33%,transparent)}
.logo svg{width:22px;height:22px}.brand h1{font-size:15px;font-weight:800;letter-spacing:-.2px;margin:0;color:#fff}
.brand small{display:block;font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--rail-ink-2);margin-top:2px}
.nav{padding:10px 12px;overflow-y:auto;flex:1}.grp{font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--rail-ink-2);padding:13px 12px 6px}
.nav button{width:100%;display:flex;align-items:center;gap:11px;background:none;border:0;color:var(--rail-ink);padding:9px 12px;border-radius:9px;font-size:13.5px;font-weight:500;text-align:left;transition:.13s}
.nav button svg{width:17px;height:17px;flex:none;opacity:.8}.nav button:hover{background:#ffffff0d;color:#fff}
.nav button.on{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 18%,transparent),color-mix(in srgb,var(--accent) 3%,transparent));color:#fff;box-shadow:inset 2px 0 0 var(--accent)}.nav button.on svg{opacity:1;color:var(--accent)}
.foot{padding:13px 18px;border-top:1px solid #ffffff10;font-size:11px;color:var(--rail-ink-2)}.foot b{color:var(--rail-ink)}
.main{min-width:0;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:40;background:var(--bg-2);border-bottom:1px solid var(--hair);padding:0 22px;height:60px;display:flex;align-items:center;gap:14px}
.backbtn{display:none;align-items:center;gap:6px;background:var(--surface-2);border:1px solid var(--hair);color:var(--sub);border-radius:9px;padding:7px 11px;font-size:12.5px;font-weight:700;margin-right:2px;flex:none}
.backbtn:hover{color:var(--ink);border-color:var(--accent)}
.crumbs{display:flex;align-items:center;gap:6px;font-size:14px;min-width:0;font-weight:800;flex-wrap:wrap}.crumbs .cur{color:var(--ink)}
.crumb{background:none;border:0;color:var(--mute);font-size:13.5px;font-weight:700;padding:0}.crumb:hover{color:var(--accent)}
.csep{color:var(--faint);font-weight:400}
.themesel{background:var(--surface-2);color:var(--sub);border:1px solid var(--hair);border-radius:9px;padding:7px 10px;font-size:12.5px;font-weight:600;font-family:inherit;cursor:pointer}
.themesel:hover{border-color:var(--accent);color:var(--ink)}
.spacer{flex:1}.wave{height:22px;width:74px}
.pill{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:600;padding:5px 11px;border-radius:999px;white-space:nowrap;border:1px solid transparent}
.pill.demo{background:#eaa83e18;color:#f3cb82;border-color:#eaa83e33}.pill.live{background:#2ed1961a;color:#7ce8c2;border-color:#2ed19640}
.pill.course{background:#ffffff0a;color:var(--sub);border-color:var(--hair)}.pill .dot{width:6px;height:6px;border-radius:50%;background:var(--teal)}
.topbtn{display:inline-flex;align-items:center;gap:7px;background:var(--accent);color:var(--accent-ink);border:0;border-radius:9px;padding:8px 13px;font-size:13px;font-weight:800;box-shadow:0 2px 12px color-mix(in srgb,var(--accent) 25%,transparent)}
.topbtn:hover{background:var(--accent-2)}.topbtn svg{width:15px;height:15px}
.content{padding:16px;max-width:1340px;width:100%;margin:0 auto;animation:f .3s ease}@keyframes f{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ph{display:flex;align-items:flex-end;gap:14px;margin-bottom:8px;flex-wrap:wrap}.ph-split{justify-content:space-between}
.ph h2{font-size:20px;font-weight:800;letter-spacing:-.4px;margin:0}.who>div{min-width:0}.who h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lede{color:var(--mute);font-size:12.5px;margin-top:2px;max-width:62ch}
.eye{font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--teal);margin-bottom:3px}
.eyebrow-row{font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--sub);margin:2px 0 7px;display:flex;align-items:center;gap:10px}
.eyebrow-row:before{content:"";width:14px;height:2px;background:var(--teal);border-radius:2px}
.who{display:flex;align-items:center;gap:15px;flex:1 1 auto;min-width:0}.bigscore{flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px 10px;max-width:470px}.bigscore .mono{font-size:38px;font-weight:600;line-height:1;letter-spacing:-1px}.bigscore .repbtn{margin:0!important}
.grid{display:grid;gap:10px}.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:1fr 1fr 1fr}.g4{grid-template-columns:repeat(4,1fr)}.g2-13{grid-template-columns:1.35fr 1fr}
.mb{margin-bottom:9px}.mt{margin-top:9px}.mt-s{margin-top:9px}.m0{margin:0 0 4px}.stackcol{display:flex;flex-direction:column;gap:16px}
.card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r);box-shadow:var(--sh)}
.ch{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--hair)}
.ch h3{font-size:13px;font-weight:700;margin:0}.ch .meta{font-size:11.5px;color:var(--faint);font-weight:600}
.pad{padding:13px}.pad-b{padding:5px 14px 9px}
.click,.rowlink{cursor:pointer;transition:.14s}
.click:hover,.card.rowlink:hover{border-color:color-mix(in srgb,var(--accent) 40%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 13%,transparent),0 12px 30px color-mix(in srgb,var(--accent) 10%,transparent);transform:translateY(-2px)}
.click:focus-visible,.rowlink:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.kpi{padding:12px 14px}.kpi .lab{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--faint)}
.kpi .val{font-family:inherit;font-size:32px;font-weight:600;letter-spacing:-1px;margin-top:7px;line-height:1;color:var(--ink)}
.kpi .val .u{font-size:15px;color:var(--faint);margin-left:2px}.kpi .sub{font-size:12px;color:var(--mute);margin-top:8px}
.bar{height:7px;border-radius:5px;background:var(--surface-2);overflow:hidden;position:relative}.bar>i{display:block;height:100%;border-radius:5px}
.bar.thr{overflow:visible}.tmark{position:absolute;top:-2px;height:11px;width:2px;background:var(--ink);opacity:.5;border-radius:2px}
.brow{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}.bl{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.br{display:flex;align-items:center;gap:8px;flex:none}.br em{font-style:normal;font-size:11px;color:var(--faint);font-weight:600}.br b{font-family:inherit;font-size:13px}
.pad-b>div{padding:8px 0;border-bottom:1px solid var(--hair)}.pad-b>div:last-child{border-bottom:0}
.list{padding:6px 10px 8px}.list.scroll{max-height:430px;overflow:auto}
.li{display:flex;align-items:center;gap:11px;padding:9px 8px;border-bottom:1px solid var(--hair);border-radius:8px}.li:last-child{border-bottom:0}
.li:hover{background:var(--surface-2)}.lg{flex:1;min-width:0}.lg b{display:block;font-weight:600;font-size:13.5px}.lg span{font-size:12px;color:var(--mute)}
.li .rt{text-align:right;flex:none}.li .rt b{font-size:16px}.li .rt span{display:block;font-size:11px;color:var(--faint)}.gap{color:var(--risk)!important}
.av{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-size:11px;font-weight:700;color:#fff;flex:none}
.av.sm{width:26px;height:26px;font-size:10px;border-radius:7px}.av.xs{width:22px;height:22px;font-size:9px;border-radius:6px}.av.lg{width:56px;height:56px;border-radius:14px;font-size:20px}
.chip{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px}.tag{display:inline-flex;align-items:center;font-size:11px;font-weight:600;font-family:inherit;padding:3px 8px;border-radius:6px;background:var(--surface-2);color:var(--sub);border:1px solid var(--hair)}
.tw{overflow:auto;max-height:72vh;border-radius:0 0 var(--r) var(--r);scrollbar-width:thin;scrollbar-color:var(--hair-2) transparent}
*::-webkit-scrollbar{width:11px;height:11px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:var(--hair-2);border-radius:9px;border:3px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:var(--faint)}
*::-webkit-scrollbar-corner{background:transparent}
html{scrollbar-width:thin;scrollbar-color:var(--hair-2) transparent}
.itemwrap{max-width:100%}
.itemwrap .tw{max-height:none;overflow-x:auto;overflow-y:visible;max-width:100%}
.itemwrap .stem{max-width:360px;white-space:normal;color:var(--mute);line-height:1.45}
table{width:100%;border-collapse:collapse}
th{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--faint);text-align:left;padding:11px 14px;border-bottom:1px solid var(--hair);position:sticky;top:0;z-index:3;background:var(--bg-2);white-space:nowrap;cursor:pointer}
th.sortable:hover{color:var(--teal)}th.r{text-align:right}th .ar{opacity:.7;font-size:9px}
td{padding:11px 14px;border-bottom:1px solid var(--hair);font-size:13.5px;vertical-align:middle;color:var(--ink);box-sizing:border-box}td.r{text-align:right}
@media(min-width:761px){.tw tbody tr:hover>td{background:color-mix(in srgb,var(--accent) 8%,transparent)}}
tbody tr.rowlink:hover{background:var(--surface-2)}.cellname{display:flex;align-items:center;gap:10px}.cellname b{font-weight:600}
.cellbar{display:flex;align-items:center;gap:8px}.cellbar .bar{width:54px}.minib{display:inline-flex;align-items:center;gap:8px;justify-content:flex-end}.minib .bar{width:70px}
.stem{max-width:460px;white-space:normal;overflow-wrap:anywhere;color:var(--mute);line-height:1.45}
.donut-c{position:absolute;inset:0;display:grid;place-items:center;text-align:center}.donut-wrap{position:relative;display:inline-flex;flex:none}.donut-wrap svg{display:block}.donut-c b{font-family:inherit;font-size:24px;font-weight:600}.donut-c span{display:block;font-size:9px;color:var(--faint);text-transform:uppercase;letter-spacing:.1em;font-weight:700}
.row-mid{display:flex;gap:18px;align-items:center}.legrow{display:flex;align-items:center;gap:9px;padding:5px 0}.legrow i{width:8px;height:8px;border-radius:50%;flex:none}.legrow b{width:16px}.legrow .bar{flex:1}.legrow .mono{width:24px;text-align:right;font-weight:600}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--mute);font-weight:500}.legend span{display:inline-flex;align-items:center;gap:6px}.legend i{width:10px;height:10px;border-radius:3px}
.hstrip{display:flex;flex-wrap:wrap;gap:6px}.hcell{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;cursor:pointer;transition:.12s}.hcell span{font-size:10px;font-weight:700;color:#04251a}.hcell:hover{transform:scale(1.1);box-shadow:var(--sh-lg)}
.cardtop{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:11px}.cardtop b{font-family:inherit;font-size:20px;font-weight:600}.cardtop .rt{text-align:right}.cardtop .rt b{font-size:24px;display:block}.cardtop .rt span{font-size:11px;color:var(--faint)}
.cn{font-weight:700;font-size:15px;margin-top:7px}.dn{font-weight:800;font-size:17px;margin:5px 0}.big{font-size:30px;font-weight:600;margin:9px 0}.big span{font-size:15px;color:var(--faint)}
.cardfoot{display:flex;justify-content:space-between;margin-top:9px;font-size:12px;color:var(--mute)}.sub-s{font-size:12px;color:var(--mute);margin-top:8px}.sub-txt{font-size:13.5px;line-height:1.6;color:var(--sub)}
.bigq{font-size:15px;line-height:1.5;font-weight:500;overflow-wrap:anywhere}.bigq.sm{font-size:14px}
.opt{display:flex;align-items:center;gap:11px;padding:11px 14px;border:1px solid var(--hair);border-radius:10px;margin-top:8px;font-size:13.5px}
.opt.correct{border-color:#2ed19655;background:#2ed1960f}.opt .mk{width:22px;height:22px;border-radius:6px;background:var(--surface-2);display:grid;place-items:center;font-weight:700;font-size:11px;flex:none;color:var(--sub)}.opt.correct .mk{background:var(--good);color:#04251a}
.optlist{margin-top:4px}.qhead{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}
.statline{display:flex;gap:22px;flex-wrap:wrap}.statline .k{font-size:11px;color:var(--faint);font-weight:700;text-transform:uppercase}.statline .v{font-family:inherit;font-size:19px;font-weight:600;margin-top:3px}
.flagbox{margin-top:14px;background:#f15a4815;border:1px solid #f15a4840;border-radius:9px;padding:10px 12px;font-size:12.5px;color:#f6a08c}
.taglist{display:grid;gap:10px}.tagrow{display:flex;align-items:center;justify-content:space-between}.tagrow span:first-child{color:var(--mute);font-size:12.5px;font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:8px}.schip{display:inline-flex;align-items:center;gap:7px;background:var(--surface-2);border:1px solid var(--hair);border-radius:999px;padding:4px 11px 4px 4px;font-size:12.5px;font-weight:500}
.note{background:#2ed1960d;border:1px solid #2ed19630;border-radius:10px;padding:11px 14px;font-size:13px;color:#7ce8c2}
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap}.input{display:flex;align-items:center;gap:8px;background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:8px 12px;flex:1;min-width:180px}
.input input{border:0;outline:0;font-size:13.5px;width:100%;background:none;font-family:inherit;color:var(--ink)}.input svg{width:15px;height:15px;color:var(--faint)}
.seg{display:flex;background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:3px;gap:2px;flex-wrap:wrap}.seg button{border:0;background:none;padding:6px 12px;border-radius:7px;font-size:12.5px;font-weight:600;color:var(--mute)}.seg button.on{background:var(--raise);color:var(--ink)}
.okbar{display:flex;gap:14px;align-items:center;background:#2ed1960c;border:1px solid #2ed19640;border-radius:12px;padding:14px 16px;margin-bottom:16px}.okbar.info{background:#eaa83e10;border-color:#eaa83e33}.okdot{width:38px;height:38px;border-radius:10px;background:var(--good);display:grid;place-items:center;flex:none}.okdot svg{width:20px;height:20px;stroke:#04251a}.okbar .sp{flex:1}
.btn-ghost{background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:8px 14px;font-weight:600}.fld{display:block;font-size:12px;font-weight:700;color:var(--mute);text-transform:uppercase;letter-spacing:.04em;margin:14px 0 0}.fld input{display:block;width:100%;margin-top:6px;border:1px solid var(--hair);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;text-transform:none;letter-spacing:0;color:var(--ink);background:var(--surface-2)}
.drop{display:block;border:2px dashed var(--hair-2);border-radius:12px;padding:28px 18px;text-align:center;cursor:pointer;transition:.15s;margin-top:14px;background:var(--surface-2)}.drop.over{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}.db{font-weight:700;margin-bottom:4px}.ds{font-size:12.5px;color:var(--faint)}
.tpls{display:grid;gap:10px;margin-top:4px}.tpl{border:1px solid var(--hair);border-radius:10px;padding:12px 14px}.tprow{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}.tprow b{font-size:13.5px}.btn-sm{background:var(--surface-2);border:1px solid var(--hair);border-radius:8px;padding:6px 12px;font-weight:600;font-size:12px}
.flist{margin-top:12px}.fl{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--hair)}.fl b{font-size:13px}
.okbox{margin-top:12px;background:#2ed1960f;border:1px solid #2ed19644;border-radius:10px;padding:12px 14px;font-size:13px}.btn-go{display:block;width:100%;margin-top:10px;background:var(--accent);color:var(--accent-ink);border:0;border-radius:9px;padding:11px;font-weight:800;font-size:14px}
.warnbox{margin-top:12px;background:#f15a4812;border:1px solid #f15a4838;border-radius:10px;padding:11px 13px;font-size:13px;color:#f6a08c}
.empty{padding:40px;text-align:center;color:var(--faint)}
.opt .otext{flex:1}.opt .ocount{display:flex;align-items:center;gap:8px;flex:none;min-width:60px;justify-content:flex-end}
.pickbad{font-family:inherit;font-weight:700;color:#2a0d05;background:var(--risk);border-radius:5px;padding:1px 6px;font-size:12px}
.pickgood{font-family:inherit;font-weight:700;color:#04251a;background:var(--good);border-radius:5px;padding:1px 6px;font-size:12px}
.seg.traj{display:inline-flex;margin-bottom:4px}
.agrid{font-size:11px;min-width:max-content;padding:4px 2px}
.agrow{display:flex;align-items:center;gap:3px;padding:3px 0;border-bottom:1px solid var(--hair);border-radius:6px}
.agrow:not(.ahead):hover{background:var(--surface-2)}
.aname{width:118px;flex:none;font-weight:600;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:6px}
.acell{width:20px;height:20px;border-radius:4px;flex:none;background:var(--surface-2);display:grid;place-items:center}
.acell.pres{background:var(--good)}.acell.abs{background:var(--risk)}.acell.na{background:var(--hair-2)}
.acell.head{background:none;color:var(--faint);font-weight:700;font-size:9px}
.ahead{border-bottom:1px solid var(--hair-2)}.apct{width:50px;flex:none;text-align:right;font-weight:600;padding-right:6px}
.astrip{display:flex;flex-wrap:wrap;gap:5px}.astrip .acell{width:30px;height:26px;border-radius:6px}.astrip .acell span{font-size:9px;font-weight:700;color:#04251a;opacity:.7}.astrip .acell.abs span{color:#2a0d05}.astrip .acell.na span{color:var(--faint)}
.acell.hol{background:repeating-linear-gradient(45deg,var(--hair-2),var(--hair-2) 3px,var(--surface-2) 3px,var(--surface-2) 6px)}
.acell.head.hol{background:none;opacity:.55}
.legend i.hatch{display:inline-block;width:10px;height:10px;border-radius:3px;background:repeating-linear-gradient(45deg,var(--hair-2),var(--hair-2) 2px,var(--surface-2) 2px,var(--surface-2) 4px)}
.astrip .acell.hol span{color:var(--faint)}
.ohform{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:12px;align-items:end}
.ohform label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:var(--mute);text-transform:uppercase;letter-spacing:.03em}
.ohform label.wide{grid-column:1/-1}
.ohform input,.ohform select{border:1px solid var(--hair);background:var(--surface-2);color:var(--ink);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;text-transform:none;letter-spacing:0}
.ohform .btn-go{grid-column:1/-1;margin-top:2px}
.ohlist{display:flex;flex-direction:column}
.ohitem{display:flex;align-items:center;gap:12px;padding:11px 14px;border-bottom:1px solid var(--hair);flex-wrap:wrap}
.ohitem:last-child{border-bottom:0}.ohwhen{width:80px;flex:none}.ohwhen b{display:block;font-size:13px}.ohwhen span{font-size:11px;color:var(--faint)}
.ohwho{display:flex;align-items:center;gap:10px;flex:1;min-width:150px}.ohwho .lg b{display:block;font-size:13.5px}.ohwho .lg span{font-size:12px;color:var(--mute)}
.ohbtns{display:flex;gap:6px;flex-wrap:wrap}
.ohb{background:var(--surface-2);border:1px solid var(--hair);color:var(--sub);border-radius:7px;padding:5px 9px;font-size:11.5px;font-weight:600}
.ohb.good:hover{border-color:var(--good);color:var(--good)}.ohb.risk:hover{border-color:var(--risk);color:var(--risk)}.ohb.del{color:var(--faint)}.ohb:hover{border-color:var(--teal)}
@media(max-width:760px){.ohform{grid-template-columns:1fr 1fr}.ohform label.wide,.ohform label:first-child{grid-column:1/-1}.ohwhen{width:100%}}
.rep-toolbar{display:flex;gap:10px;align-items:center;justify-content:flex-start;margin-bottom:14px;flex-wrap:wrap}
.rep-toolbar .btn-go{display:inline-flex;align-items:center;justify-content:center;width:auto;margin-top:0;padding:8px 18px;font-size:13px;border-radius:8px}
.rep-sel{background:var(--surface-2);color:var(--ink);border:1px solid var(--hair);border-radius:8px;padding:8px 11px;font-size:13px;font-family:inherit;margin-right:auto;max-width:60%}
/* modals */
#modalRoot:empty{display:none}
.modal-bg{position:fixed;inset:0;background:#000b;z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:34px 16px;overflow-y:auto;animation:fade .16s ease;backdrop-filter:blur(3px)}
@keyframes fade{from{opacity:0}to{opacity:1}}@keyframes pop{from{transform:translateY(12px) scale(.99);opacity:0}to{transform:none;opacity:1}}
.modal{background:var(--surface);border:1px solid var(--hair-2);border-radius:var(--r);max-width:900px;width:100%;box-shadow:var(--sh-lg);animation:pop .2s cubic-bezier(.2,.8,.2,1);margin-bottom:34px}
.modal-h{display:flex;align-items:center;gap:11px;padding:13px 16px;border-bottom:1px solid var(--hair);position:sticky;top:0;background:var(--surface);z-index:6;border-radius:var(--r) var(--r) 0 0}
.mtitle{font-weight:800;font-size:14px;flex:1;min-width:0;color:var(--sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mback,.mclose{background:var(--surface-2);border:1px solid var(--hair);color:var(--sub);height:32px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;padding:0 10px}
.mclose{width:32px;padding:0}.mclose:hover,.mback:hover{color:var(--ink);border-color:var(--teal)}
.modal-b{padding:18px}.modal-b .ph{margin-bottom:16px}.modal-b .content{padding:0}
@media(max-width:760px){
 .app{grid-template-columns:1fr}
 .rail{position:fixed;left:0;top:0;bottom:auto;height:100dvh;width:250px;max-width:84vw;flex-direction:column;transform:translateX(-100%);transition:transform .24s ease;z-index:90;border-top:0;border-right:1px solid var(--hair)}
 body.navopen .rail{transform:none;box-shadow:0 0 44px rgba(0,0,0,.5)}
 body.navopen .navscrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:85}
 .main{margin-left:0;padding-bottom:0}.topbar{padding:8px 14px;gap:8px;height:auto;min-height:54px;flex-wrap:wrap}.wave{display:none}
 .content{padding:11px 11px 18px}.grid{grid-template-columns:1fr!important;gap:9px}.grid.g4{grid-template-columns:1fr 1fr!important}
 .ph h2{font-size:21px}.ph{margin-bottom:9px}.kpi .val{font-size:26px}.tw{max-height:none}.stem{max-width:100%}.bigscore .mono{font-size:30px}
 .modal-bg{padding:0}.modal{border-radius:0;min-height:100vh;margin-bottom:0;max-width:100%;width:100%}.modal-h{border-radius:0}
}

/* --- overflow containment (fixes off-page tables on mobile) --- */
.main{min-width:0;overflow-x:clip}.content{overflow-x:clip;max-width:100vw}
 .main{overflow-x:clip;max-width:100vw;min-width:0}
.grid>*{min-width:0}.stackcol{min-width:0}
.card{overflow:hidden}
.modal{overflow:hidden}.modal-b{overflow-x:hidden;min-width:0}.modal-b>*{min-width:0}
.tw{max-width:100%}
table{min-width:0;width:100%}
/* name + id no longer cramped */
.cellname{align-items:center}.nmwrap{display:flex;flex-direction:column;gap:2px;min-width:0;line-height:1.15}
.nmwrap b{font-weight:600}.idtag{font-family:inherit;font-size:10.5px;color:var(--faint);font-weight:500;letter-spacing:.02em}
/* crisper bars */
.bar{height:8px;border-radius:5px}.bar>i{border-radius:5px}.cellbar .bar{width:62px}.legrow .bar{height:8px}
.donut-c b{font-size:26px}
/* trajectory filter buttons: tighter, scrollable on small screens */
.seg.traj{flex-wrap:wrap;gap:3px;background:var(--surface-2);padding:4px}
.seg.traj button{padding:6px 13px;font-size:13px;border-radius:8px}
.seg.traj button.on{background:var(--raise);color:var(--ink);box-shadow:inset 0 0 0 1px var(--hair)}
@media(max-width:760px){.seg.traj{flex-wrap:nowrap;overflow-x:auto}.seg.traj button{flex:none}.bigscore .mono{font-size:26px}.who .av.lg{width:46px;height:46px;font-size:17px}.ph h2{font-size:20px}}
/* ---- responsive scaling polish ---- */
.ph h2{font-size:clamp(18px,calc(0.9rem + 0.7vw),20px)}
.kpi .val{font-size:clamp(25px,calc(1.2rem + 1.1vw),32px)}
.bigscore .mono{font-size:clamp(28px,calc(1.5rem + 1.4vw),38px)}
@media(min-width:761px) and (max-width:1180px){.app{grid-template-columns:210px 1fr}.g4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:761px) and (max-width:1024px){.content{padding:20px}.g3{grid-template-columns:1fr 1fr}.g2-13{grid-template-columns:1fr}.who{gap:12px}}
@media(max-width:860px){.g2{grid-template-columns:1fr}}
@media(max-width:760px){.app{grid-template-columns:1fr!important}.ch{flex-direction:column;align-items:flex-start;gap:3px}.ch .meta{white-space:normal}
 .topbar{padding:7px 12px;gap:6px;min-height:48px;row-gap:6px}
 .backbtn{order:0;flex:none}
 .crumbs{order:1;flex:1 1 auto;min-width:54px;font-size:13px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
 .topbar .spacer{display:none}
 .pill.demo{order:2}.pill.course{order:3}.themesel{order:4;font-size:11.5px;padding:5px 8px}
 .topbar .pill{font-size:10.5px;padding:4px 9px}}
@media(max-width:420px){.content{padding:12px 11px 22px}}
.distchips{margin-bottom:2px}
.distchip{cursor:pointer;border:1px solid var(--hair);background:var(--surface-2);color:var(--mute);padding:4px 10px;font-size:11.5px;font-weight:600;border-radius:999px}
.distchip.on{background:color-mix(in srgb,var(--accent) 16%,transparent);border-color:color-mix(in srgb,var(--accent) 45%,transparent);color:var(--ink)}
.distchip:hover{border-color:var(--accent)}
.astrip.fill{display:flex;flex-wrap:nowrap;gap:5px}
.astrip.fill .acell{flex:1 1 0;min-width:0;width:auto;max-width:none;height:34px;border-radius:7px;display:grid;place-items:center}
@media(max-width:430px){.astrip.fill .acell{max-width:34px;height:30px}}
.chartlegend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:9px;font-size:11.5px;color:var(--mute);font-weight:600}
.chartlegend b{font-weight:700}
.chartlegend .sw{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.chartlegend .sw.ln{height:3px;width:16px;border-radius:2px}
.chartlegend .sw.tri{width:0;height:0;background:none!important;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:8px solid var(--accent);border-radius:0;margin-right:6px}
.chartlegend .lspacer{flex:1 1 auto;min-width:8px}
.chartlegend .mute{color:var(--faint);font-weight:500}
.matrixwrap{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;border:1px solid var(--hair);border-radius:10px;background:var(--surface);position:relative;width:100%;max-width:100%}
.matrixwrap .agrid{min-width:max-content;padding:2px}
.matrixwrap .agrow{border-bottom:1px solid var(--hair)}
.matrixwrap .agrow:not(.ahead):nth-child(even){background:var(--surface-2)}
.matrixwrap .aname,.matrixwrap .apct{position:sticky;z-index:3;display:flex;align-items:center;background:var(--surface)}
.matrixwrap .aname{left:0;box-shadow:6px 0 8px -4px rgba(0,0,0,.55)}
.matrixwrap .apct{right:0;justify-content:flex-end;box-shadow:-6px 0 8px -4px rgba(0,0,0,.55)}
.matrixwrap .agrow:not(.ahead):nth-child(even) .aname,.matrixwrap .agrow:not(.ahead):nth-child(even) .apct{background:var(--surface-2)}
.matrixwrap .ahead .aname,.matrixwrap .ahead .apct{background:var(--surface);z-index:4}
@media(max-width:760px){.matrixwrap .aname{width:92px}.matrixwrap .acell{width:24px;height:24px}.matrixwrap.attfit{overflow-x:hidden}.matrixwrap.attfit .agrid{min-width:0;width:100%}.matrixwrap.attfit .agrow{gap:2px}.matrixwrap.attfit .aname{flex:0 0 84px;width:84px;box-shadow:none}.matrixwrap.attfit .acell{flex:1 1 0;min-width:0;width:auto;max-width:30px;height:23px}.matrixwrap.attfit .apct{flex:0 0 auto;box-shadow:none;padding-left:4px}}
@media(min-width:761px){.matrixwrap.attfit{overflow-x:hidden}.matrixwrap.attfit .agrid{min-width:0;width:100%}.matrixwrap.attfit .agrow{gap:4px}.matrixwrap.attfit .aname{flex:0 0 150px;width:150px;box-shadow:none}.matrixwrap.attfit .acell{flex:1 1 0;min-width:0;width:auto;max-width:52px;height:30px}.matrixwrap.attfit .acell.head{font-size:10px}.matrixwrap.attfit .apct{flex:0 0 auto;box-shadow:none;padding-left:6px}}
.topbar{flex-wrap:wrap}
.crumbs{min-width:0}
@media(min-width:761px){.topbar{flex-wrap:nowrap}.crumbs{flex:0 1 auto;flex-wrap:nowrap;overflow-x:auto;min-width:0;-ms-overflow-style:none;scrollbar-width:none}.crumbs::-webkit-scrollbar{display:none}.crumbs .cur,.crumb{white-space:nowrap}}
.crumbs .cur{display:inline-block;max-width:46vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
/* snug pass */
.pad{padding:12px}.grid{gap:9px}.ch{padding:11px 14px}.content{padding:14px}.mb{margin-bottom:8px}.mt{margin-top:8px}.kpi{padding:11px 13px}
/* mini controls */
.distctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.distctl .dl{font-size:11px;color:var(--faint);font-weight:600}
.minibtn{background:var(--surface-2);border:1px solid var(--hair);color:var(--sub);border-radius:7px;padding:4px 11px;font-size:11.5px;font-weight:700}
.minibtn:hover{border-color:var(--accent);color:var(--ink)}
.lede{display:none}
.amini{display:flex;align-items:center;gap:14px;margin:10px 0 6px}
.amini-donut{width:78px;flex:none}
.amini-donut svg{width:100%!important;height:auto!important;display:block}
.amini-leg{display:flex;flex-direction:column;gap:3px;font-size:11px;font-weight:700;color:var(--sub)}
.amini-leg span{display:flex;align-items:center;gap:6px}
.amini-leg i{width:9px;height:9px;border-radius:2px;display:inline-block;flex:none}
.dolist2{display:flex;flex-direction:column;gap:16px}
.dob-dim{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
.dq{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:7px 0;border-top:1px solid var(--hair)}
.dq-q{font-size:12px;color:var(--sub);line-height:1.4}
.dq-a{font-size:13px;color:var(--ink);font-weight:600;line-height:1.4}
.atopics{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:4px 0 8px}
.ttag{font-size:11px;font-weight:600;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:6px;padding:3px 8px}
.ttag.more{color:var(--faint)}
.ttag-l{font-size:11px;font-weight:700;color:var(--faint);margin-right:2px}
.ttag.link{cursor:pointer}
.ttag.link:hover{border-color:var(--accent);color:var(--ink)}
@media(max-width:760px){.amini{justify-content:center;gap:20px}.amini-donut{width:128px}.dq{grid-template-columns:1fr;gap:2px;padding:8px 0}.dq-q{font-size:11.5px}}
.mb-s{margin-bottom:8px}
.sgctl{background:var(--surface-2);border:1px solid var(--hair);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:9px}
.sgctl-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sgctl-row .dl{font-size:11px;color:var(--faint);font-weight:700;min-width:74px}
.sgnote{font-size:12px;color:var(--sub);line-height:1.45}
.sg-card{display:flex;flex-direction:column;gap:8px}
.sg-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sg-n{font-weight:800;font-size:14px}
.sg-mem{display:flex;flex-direction:column;gap:3px}
.sg-row{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--surface-2);border:1px solid var(--hair);border-radius:8px;padding:7px 10px;width:100%;text-align:left;cursor:pointer}
.sg-row:hover{border-color:var(--accent)}
.sg-name{font-size:13px;font-weight:600}
.sg-rat{font-size:12px;color:var(--sub)}
.sg-flags{display:flex;flex-direction:column;gap:3px}
.sg-flag{font-size:11px;color:var(--warn);font-weight:600}
.iflag{font-size:11px;font-weight:700;border-radius:999px;padding:3px 9px;border:1px solid var(--hair)}
.iflag.good{color:var(--good);background:color-mix(in srgb,var(--good) 12%,transparent)}
.iflag.warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 12%,transparent)}
.iflag.mute{color:var(--sub)}
.dolist{display:flex;flex-direction:column}
.do-row{display:grid;grid-template-columns:158px 1fr;gap:12px;padding:8px 0;border-top:1px solid var(--hair)}
.do-row:first-child{border-top:0}
.do-dim{font-size:12px;font-weight:700;color:var(--sub)}
.do-ans{font-size:12.5px;color:var(--ink);line-height:1.5}
.do-ans i{color:var(--faint);font-style:normal;margin:0 6px}
@media(max-width:760px){.do-row{grid-template-columns:1fr;gap:2px}.sgctl-row .dl{min-width:0}}
.printbtn{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2);border:1px solid var(--hair);color:var(--sub);border-radius:8px;padding:6px 11px;font:inherit;font-size:12px;font-weight:600;cursor:pointer}.printbtn:hover{color:var(--ink);border-color:var(--hair-2)}
.acard-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:4px}.acard-meta{min-width:0}.acard-sub{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}.acard-mean{text-align:right;flex:none}.acard-mean b{font-family:inherit;font-size:22px;font-weight:600;line-height:1}.acard-mean b span{font-size:12px;color:var(--faint)}.acard-mean small{display:block;font-size:9px;color:var(--faint);text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-top:3px}
.trajbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-between}
.ohact-r{display:flex;gap:10px}
.acard .amini{margin:8px 0 4px}
.repgen{background:var(--surface);border:1px solid var(--hair);border-radius:12px;padding:10px 14px;margin-bottom:12px}
.repgen-title{font-weight:800;font-size:13px;margin-bottom:7px}
.repgen-form{display:flex;flex-direction:column;gap:2px}
.repgen-frow{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid color-mix(in srgb,var(--hair) 55%,transparent)}
.repgen-frow:last-child{border-bottom:none}
.repgen-k{font-size:12.5px;font-weight:700;color:var(--sub);width:108px;flex:none}
.repgen-v{font-size:13px;color:var(--ink);flex:1}
.repgen-frow .themesel{margin-left:auto}
.repgen-link{background:none;border:none;color:var(--accent);font-weight:600;font-size:12.5px;cursor:pointer;padding:4px 6px;text-decoration:underline}
.repgen-out{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.repgen-out .btn-go{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 13px;line-height:1.2;flex:1 1 150px;font-size:13px}
.repgen-out .btn-go small{font-weight:500;font-size:10.5px;opacity:.85}
.repgen-out .ghosty{background:var(--surface-2);color:var(--ink);border:1px solid var(--hair)}
.repgen-hint{font-size:11px;color:var(--faint);margin-top:8px;line-height:1.45}
.repbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px}
.repbar .btn-go{display:inline-flex;align-items:center;justify-content:center;width:auto;margin-top:0;padding:8px 18px;font-size:13px;border-radius:8px}
.repbar .btn-go.ghosty{background:var(--surface-2);color:var(--ink);border:1px solid var(--hair);font-weight:700}
.repbar-t{font-weight:800;font-size:12px;color:var(--ink);letter-spacing:.2px}
.repbar-grow{flex:1 1 8px}
.repbar .themesel{order:0;margin-left:0;font-size:12px;padding:6px 9px}
.repcheck{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--sub);cursor:pointer;user-select:none;white-space:nowrap}
.repcheck input{accent-color:var(--accent);width:14px;height:14px;margin:0}
.repgen-link{display:inline-flex;align-items:center;text-decoration:none;border:1px solid var(--hair);border-radius:8px;padding:5px 9px;background:var(--surface-2)}
.repgen-link i{font-style:normal;margin-left:7px;color:var(--accent);font-size:12px;font-weight:700;opacity:.8}
.repgen .btn-go{padding:7px 13px;font-size:12.5px;font-weight:700}
@media(max-width:760px){.repbar-grow{display:none}.repgen .btn-go{flex:1 1 46%}}

.rep-scopebar{display:flex;flex-wrap:wrap;align-content:flex-start;gap:6px;max-width:520px;max-height:128px;overflow:auto;margin:10px 0 0;padding:10px;border:1px solid var(--hair);border-radius:10px;background:var(--surface-2)}
.repchip{font-size:11px;font-weight:600;color:var(--sub);background:var(--surface);border:1px solid var(--hair);border-radius:999px;padding:4px 9px;cursor:pointer}
@media(max-width:760px){
  .tw{overflow-x:auto!important;overflow-y:visible!important;max-height:none;background:none}
  .tw table,.tw tbody,.tw tr,.tw td{display:block;width:auto}
  .tw thead{display:none}
  /* each record = a distinct, compact card */
  .tw tr{background:var(--surface);border:1.5px solid var(--hair-2);border-radius:12px;margin:0 0 9px;box-shadow:0 2px 7px rgba(0,0,0,.2);overflow:hidden;padding:2px 0 4px;position:relative}
  .tw tr:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:.5}
  .tw tr.rowlink:active{background:var(--surface-2)}
  .tw td{display:block;text-align:left!important;padding:3px 15px;border:0;overflow-wrap:anywhere;font-size:13.5px;line-height:1.35}
  .tw td:before{content:attr(data-label);display:block;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--faint);text-align:left;margin-bottom:0;line-height:1.4}
  .tw td[data-label=""]:before{display:none}
  /* identifying cell = card title (border only, no fill) */
  .tw td[data-label="Student"]{border-bottom:1px solid var(--hair-2);padding:8px 15px 7px;margin-bottom:3px}
  .tw td:has(.cellname){border-bottom:1px solid var(--hair-2);padding:8px 15px 7px;margin-bottom:3px}
  .tw td[data-label="Student"]:before{display:none}
  .tw td:has(.cellname):before{display:none}
  .tw .cellname{font-weight:800;font-size:15px}
  .tw .cellbar,.tw .cellname,.tw .minib,.tw .cellbar .bar{justify-content:flex-start}
  .tw .cellbar .bar,.tw .minib .bar{max-width:120px}
  .tw,.tw table,.tw tbody,.tw tr,.tw td{box-sizing:border-box;max-width:100%}
  .tw td .stem{max-width:100%!important;width:auto!important;white-space:normal!important;overflow:visible!important;word-break:break-word;text-align:left}
}
@media(max-width:760px){
  .ph-split{flex-direction:column;align-items:stretch;gap:12px}
  .bigscore{justify-content:flex-start;max-width:none;text-align:left}
  .bigscore .mono{font-size:40px}
  .bigscore .chip{flex:none}
  .bigscore .repbtn{flex:1 1 145px;justify-content:center}
}
.rep-scopelab{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);margin-right:4px}
.outseg{margin-bottom:18px;flex-wrap:wrap}
.themegrid{display:flex;flex-wrap:wrap;gap:10px}
.themecard{flex:1 1 150px;display:flex;align-items:center;gap:11px;padding:15px 16px;background:var(--surface-2);border:2px solid var(--hair-2);border-radius:12px;color:var(--ink);font:inherit;font-size:15px;font-weight:700;cursor:pointer;transition:border-color .12s}
.themeok{margin-left:auto;color:var(--accent);font-weight:800}
.scardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:8px}.scard{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:var(--surface);border:1px solid var(--hair-2);border-left:3px solid var(--bandc,var(--accent));border-radius:11px;padding:9px 12px 9px 11px;cursor:pointer;font:inherit;color:var(--ink);transition:border-color .12s,background .12s}.scard:hover{background:var(--surface-2);border-color:var(--bandc,var(--accent))}.scard:active{background:var(--surface-2)}.scard.risk{background:color-mix(in srgb,var(--risk) 8%,var(--surface))}.scard-rank{color:var(--faint);font-size:12px;min-width:18px;text-align:right;flex:none}.scard .av.sm{flex:none}.scard-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.scard-name{font-weight:700;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scard-sub{font-size:11.5px;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scard-g{font-weight:800;font-size:18px;display:flex;align-items:center;gap:7px;flex:none}.scard-let{font-size:11px;font-weight:700;padding:1px 6px;border-radius:6px;line-height:1.5}.rostctl{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}.rostsearch{flex:1 1 170px;min-width:130px;background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:8px 11px;color:var(--ink);font:inherit;font-size:13.5px}.rostsearch::placeholder{color:var(--mute)}.rostchips{display:flex;gap:6px;flex-wrap:wrap}.rostdir{background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;color:var(--sub);width:34px;height:34px;cursor:pointer;font-size:11px;flex:none}.rostdir:hover{border-color:var(--accent);color:var(--ink)}
.ascardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:7px;padding:2px 0 4px}.ascard{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:var(--surface-2);border:1px solid var(--hair);border-left:3px solid var(--bandc,var(--accent));border-radius:10px;padding:9px 12px;cursor:pointer;font:inherit;color:var(--ink);transition:border-color .12s,background .12s}.ascard:hover{border-color:var(--bandc,var(--accent));background:var(--surface)}.ascard:active{background:var(--surface)}.ascard-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.ascard-n{font-weight:700;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ascard-cat{font-size:11px;color:var(--sub);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ascard-r{flex:none;text-align:right;display:flex;flex-direction:column;align-items:flex-end}.ascard-pct{font-weight:800;font-size:17px;line-height:1.15}.ascard-u{font-size:10px;font-weight:600;opacity:.7;margin-left:1px}.ascard-d{font-size:10.5px;font-weight:600;line-height:1.2}
.themecard:hover{border-color:var(--accent)}
.themecard.on{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.themedot{width:22px;height:22px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.t-green{background:#10b3a3}.t-ocean{background:#2f7fd6}.t-violet{background:#7c6cf0}.t-light{background:#e8edf2}
.outbody{min-width:0}
.qa-list{display:flex;flex-direction:column;gap:8px}
.qa{background:var(--surface);border:1px solid var(--hair-2);border-radius:11px;padding:12px 14px;box-shadow:0 1px 4px rgba(0,0,0,.16);max-width:100%;box-sizing:border-box;overflow:hidden}
.qa.rowlink{cursor:pointer;transition:border-color .12s}.qa.rowlink:hover{border-color:var(--accent)}
.qa-h{display:flex;align-items:center;gap:9px;margin-bottom:6px;flex-wrap:wrap}
.qa-n{font-weight:800;font-size:13px;color:var(--accent)}
.qa-id{font-size:11px;color:var(--faint)}
.qa-tags{font-size:11px;color:var(--mute);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qa-stat{margin-left:auto;font-size:10.5px;font-weight:800;padding:3px 10px;border-radius:999px;flex:none}
.qa-stem{font-size:14px;line-height:1.5;color:var(--ink);margin-bottom:8px;overflow-wrap:anywhere}
.qa-ans{font-size:13px;line-height:1.45;padding:7px 11px;border-radius:8px;margin-top:5px;overflow-wrap:anywhere}
.qa-ans.good{background:color-mix(in srgb,var(--good) 12%,transparent)}
.qa-ans.bad{background:color-mix(in srgb,var(--risk) 12%,transparent)}
.qa-ans b{font-weight:700;color:var(--sub)}
.qa-why{font-size:12.5px;color:var(--mute);margin-top:7px;line-height:1.45;overflow-wrap:anywhere}
.flaglist{display:flex;flex-direction:column;gap:9px}
.flagrow{background:var(--surface);border:1px solid var(--hair-2);border-radius:11px;padding:11px 13px;box-shadow:0 1px 4px rgba(0,0,0,.16)}
.flagrow-h{display:flex;align-items:center;gap:11px;cursor:pointer}
.flagrow-h:hover .flagrow-name b{color:var(--accent)}
.flagrow-name{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px}
.flagrow-name b{font-weight:700;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flagrow-name span{font-size:11.5px;color:var(--mute)}
.flagrow-g{flex:0 0 auto;text-align:right;display:flex;flex-direction:column;line-height:1.05}
.flagrow-g b{font-size:18px}
.flagrow-g span{font-size:9.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.05em}
.flagchips{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.flagpill{font-size:11.5px;font-weight:600;padding:4px 9px;border-radius:999px;border:1px solid transparent;white-space:nowrap}
.flagpill.rowlink{cursor:pointer}
.flagpill.fail{background:color-mix(in srgb,var(--risk) 14%,transparent);color:var(--risk);border-color:color-mix(in srgb,var(--risk) 30%,transparent)}
.flagpill.watch{background:color-mix(in srgb,var(--mid) 16%,transparent);color:var(--mid);border-color:color-mix(in srgb,var(--mid) 32%,transparent)}
.flagpill.absent{background:color-mix(in srgb,#8b80f0 15%,transparent);color:#9990f2;border-color:color-mix(in srgb,#8b80f0 34%,transparent)}
.flagscroll{max-height:430px;overflow-y:auto;overflow-x:hidden;padding:2px}
.flagsum{font-size:12px;color:var(--mute);font-weight:600;margin:0 2px 9px}
.flagrow-h{display:flex;align-items:center;gap:11px;flex-wrap:wrap}
.flagrow-id{display:flex;align-items:center;gap:11px;flex:1 1 auto;min-width:0;cursor:pointer}
.flagrow-id:hover .flagrow-name b{color:var(--accent)}
.flagrow-g{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.flagrow-g b{font-size:15px}
.flag-dismissall{font-size:11px;font-weight:600;color:var(--mute);background:var(--surface-2);border:1px solid var(--hair-2);border-radius:7px;padding:4px 9px;cursor:pointer}
.flag-dismissall:hover{color:var(--risk);border-color:color-mix(in srgb,var(--risk) 30%,transparent)}
.fp-x{display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:50%;margin:0 5px 0 -2px;font-size:13px;line-height:1;cursor:pointer;opacity:.75;background:color-mix(in srgb,currentColor 18%,transparent)}
.fp-x:hover{opacity:1}
.flaglog-list{display:flex;flex-direction:column}
.flaglog{display:flex;align-items:center;gap:9px;padding:8px 3px;border-bottom:1px solid var(--hair)}
.flaglog:last-child{border-bottom:0}
.flaglog-dot{flex:none;width:8px;height:8px;border-radius:50%}
.flaglog.done{opacity:.5}
.flaglog-main{flex:1 1 auto;min-width:0;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.flaglog-main.rowlink{cursor:pointer}.flaglog-main.rowlink:hover b{color:var(--accent)}
.flaglog-main b{font-weight:600}
.flaglog-lv{font-size:11px;color:var(--faint);margin-left:4px}
.flaglog-state{flex:none;font-size:10.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.03em}
.flaglog-state.active{color:var(--mid)}
.flaglog-btn{flex:none;font-size:11px;font-weight:600;color:var(--mute);background:none;border:1px solid var(--hair-2);border-radius:7px;padding:3px 9px;cursor:pointer}
.flaglog-btn:hover{color:var(--accent);border-color:var(--accent)}
.repbtn{display:inline-flex!important;align-items:center;width:auto!important;margin:10px 0 0 8px!important;padding:8px 16px!important;font-size:13px!important;border-radius:8px!important}
.repbtn.ghosty{background:var(--surface-2);color:var(--ink);border:1px solid var(--hair);font-weight:700}
.emailcard{background:var(--surface);border:1px solid var(--hair);border-radius:14px;max-width:780px;overflow:hidden}
.emhead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--hair);background:var(--surface-2)}
.emhead-l{display:flex;align-items:center;gap:10px;min-width:0}
.emto{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--faint)}
.emname{font-weight:700;font-size:14px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.emchip{font-size:11.5px;font-weight:700;padding:2px 9px;border-radius:999px;white-space:nowrap}
.emangle{font-size:11px;font-weight:700;color:var(--accent);background:color-mix(in srgb,var(--accent) 15%,transparent);padding:4px 11px;border-radius:999px;white-space:nowrap;flex:none}
.embody{padding:16px 16px 4px}
.emrow{margin-bottom:14px}
.emlab{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);margin-bottom:6px}
.eminput,.emarea{width:100%;box-sizing:border-box;background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:11px 13px;font-size:13.5px;color:var(--ink);font-family:inherit;transition:border-color .12s,box-shadow .12s}
.eminput:focus,.emarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.emarea{line-height:1.55;resize:vertical;min-height:280px;white-space:pre-wrap}
.emactions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:13px 16px;border-top:1px solid var(--hair);background:var(--surface-2)}
.emactions .btn-go{display:inline-flex;align-items:center;width:auto;margin-top:0;padding:9px 20px;font-size:13px;border-radius:8px}
.emactions .btn-go.ghosty{background:var(--surface);color:var(--ink);border:1px solid var(--hair);font-weight:700}
.emhint{font-size:12px;color:var(--mute);flex:1 1 220px;line-height:1.4}
.repchip{font-size:11.5px;font-weight:600;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:999px;padding:5px 11px;cursor:pointer}
.repchip.on{background:color-mix(in srgb,var(--accent) 16%,transparent);border-color:var(--accent);color:var(--ink)}
.rep-batch{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
/* mobile table-card styles consolidated into the block above */
.ohgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
label.block{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--faint)}
label.block input,.ohta{font:inherit;font-weight:500;text-transform:none;letter-spacing:0;color:var(--ink);background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:9px 11px;width:100%}
.ohta{min-height:62px;resize:vertical;line-height:1.5}
.fl{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--faint);margin:0 0 8px}
.chiprow{display:flex;flex-wrap:wrap}
.ohchip{display:inline-flex;align-items:center;gap:4px;padding:5px 11px;border-radius:999px;border:1px solid var(--hair);background:var(--surface-2);color:var(--sub);font-size:12px;font-weight:600;cursor:pointer;margin:0 6px 6px 0}
.ohchip.on{background:color-mix(in srgb,var(--accent) 16%,transparent);border-color:var(--accent);color:var(--ink)}
.ohchips{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.ohactions{display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap}
.ohactions .del{color:var(--risk);border-color:color-mix(in srgb,var(--risk) 40%,transparent)}
@media(max-width:760px){.ohgrid{grid-template-columns:1fr 1fr}}
@page{margin:14mm}
@media print{
  .rail,.nav,.topbar,.printbtn,.backbtn,.seg,.wave,[data-print],.no-print{display:none!important}
  html,body{background:#fff!important}
  html{--canvas:#fff;--bg-2:#fff;--surface:#fff;--surface-2:#f3f6f9;--raise:#e7edf2;--ink:#16212c;--sub:#46535f;--mute:#69757f;--faint:#94a1ab;--hair:#e2e8ee;--hair-2:#d2dbe2;--accent:#0c8e72;--accent-d:#0a7a62;--accent-2:#2fc4ac;--accent-ink:#02231d;--good:#0a9a55;--ok:#2f9e5c;--mid:#bd7e1c;--warn:#bd7e1c;--risk:#d6452a}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body:not(:has(.report-sheet)) .app{display:block!important}
  body:not(:has(.report-sheet)) .main{margin:0!important;padding:0!important;overflow:visible!important;display:block!important}
  body:not(:has(.report-sheet)) .content{padding:0!important;margin:0!important;max-width:none!important;width:auto!important;overflow:visible!important;animation:none!important}
  body:not(:has(.report-sheet)) .grid,body:not(:has(.report-sheet)) .g2,body:not(:has(.report-sheet)) .g3,body:not(:has(.report-sheet)) .g4,body:not(:has(.report-sheet)) .g2-13,body:not(:has(.report-sheet)) .ohform{display:block!important}
  body:not(:has(.report-sheet)) .grid>*,body:not(:has(.report-sheet)) .ohform>*{margin-bottom:12px!important}
  body:not(:has(.report-sheet)) .card{break-inside:avoid;page-break-inside:avoid;overflow:visible!important;box-shadow:none!important;border:1px solid #dde2e8!important;margin-bottom:12px!important}
  body:not(:has(.report-sheet)) .ch,body:not(:has(.report-sheet)) .ph,body:not(:has(.report-sheet)) .eyebrow-row,body:not(:has(.report-sheet)) h1,body:not(:has(.report-sheet)) h2,body:not(:has(.report-sheet)) h3,body:not(:has(.report-sheet)) h4{break-after:avoid;page-break-after:avoid}
  body:not(:has(.report-sheet)) .kpi,body:not(:has(.report-sheet)) .legrow,body:not(:has(.report-sheet)) .li,body:not(:has(.report-sheet)) .opt,body:not(:has(.report-sheet)) .sg-card,body:not(:has(.report-sheet)) .row-mid,body:not(:has(.report-sheet)) tr,body:not(:has(.report-sheet)) svg{break-inside:avoid;page-break-inside:avoid}
  body:not(:has(.report-sheet)) thead{display:table-header-group}
  body:not(:has(.report-sheet)) .tw,body:not(:has(.report-sheet)) .list.scroll{overflow:visible!important;max-height:none!important}
  body:not(:has(.report-sheet)) .tw table{width:100%!important;table-layout:auto!important}
  body:not(:has(.report-sheet)) .tw th,body:not(:has(.report-sheet)) .tw td{white-space:normal!important;word-break:break-word;font-size:10px!important;padding:5px 6px!important}
  body:not(:has(.report-sheet)) .tw .stem{max-width:none!important;white-space:normal!important;overflow:visible!important}
}
.noteform{background:var(--surface-2);border:1px solid var(--hair);border-radius:10px;padding:10px;margin-bottom:12px}
.noteform-r1{display:flex;gap:10px;align-items:center;margin-bottom:8px;flex-wrap:wrap}
.notecat{background:var(--surface);border:1px solid var(--hair);color:var(--ink);border-radius:7px;padding:6px 9px;font:inherit;font-size:13px}
.notefu-lbl{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--sub)}
.noteinput{width:100%;box-sizing:border-box;background:var(--surface);border:1px solid var(--hair);color:var(--ink);border-radius:7px;padding:8px 10px;font:inherit;font-size:14px;resize:vertical;line-height:1.4}
.noteform-actions{display:flex;justify-content:flex-end;margin-top:8px}
.note-add{font-size:13px;padding:7px 15px}
.notelist{display:flex;flex-direction:column;gap:8px}
.noteitem{border:1px solid var(--hair);border-left:3px solid var(--hair);border-radius:8px;padding:9px 11px;background:var(--surface)}
.noteitem.fu{border-left-color:var(--warn)}
.noteitem.done{opacity:.55}
.note-h{display:flex;align-items:center;gap:7px;margin-bottom:5px}
.note-sp{flex:1}
.notetag{font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px;white-space:nowrap}
.note-date{font-size:11px;color:var(--mute)}
.note-fu{font-size:11px;font-weight:600;border:1px solid var(--warn);background:none;color:var(--warn);border-radius:20px;padding:2px 9px;cursor:pointer;white-space:nowrap}
.note-fu.is-done{color:var(--good);border-color:var(--good)}
.note-x{border:0;background:none;color:var(--faint);font-size:18px;line-height:1;cursor:pointer;padding:0 2px}
.note-x:hover{color:var(--risk)}
.note-body{font-size:13.5px;color:var(--ink);line-height:1.45;white-space:pre-wrap;word-break:break-word}
.bkrow{display:flex;gap:10px;flex-wrap:wrap}
.bklbl{cursor:pointer}
.bkrow .btn-go{text-align:center;justify-content:center}
.statusrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--surface-2);border:1px solid var(--hair);border-radius:10px;padding:8px 12px;margin-bottom:12px}
.statusrow.inactive{border-color:var(--mid)}
.statuslab{font-size:11px;font-weight:700;color:var(--mute);text-transform:uppercase;letter-spacing:.04em}
.statuspick{display:flex;gap:3px;background:var(--surface);border:1px solid var(--hair);border-radius:8px;padding:3px}
.stbtn{border:0;background:none;color:var(--mute);font:inherit;font-size:12.5px;font-weight:600;padding:5px 12px;border-radius:6px;cursor:pointer}
.stbtn.on{background:var(--good);color:#fff}
.stbtn.on.st-withdrawn{background:var(--mid)}
.stbtn.on.st-dismissed{background:var(--risk)}
.statusnote{font-size:11.5px;color:var(--mute)}
.stbadge{display:inline-block;margin-left:6px;font-size:10px;font-weight:700;padding:1px 7px;border:1px solid;border-radius:20px;vertical-align:middle}
.scard.inact{opacity:.52}
.scard.inact .scard-g{opacity:.75}
.hero{display:block}
.herokpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.herokpis>*{margin:0}
@media(min-width:761px){.hero{display:grid;grid-template-columns:1.55fr 1fr;gap:14px;align-items:stretch}.herochart{min-width:0}.herochart>.card{height:100%;margin:0}.herokpis{grid-template-columns:1fr;grid-auto-rows:1fr;gap:10px}.herokpis>.kpi{justify-content:center}}
.flaghead{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;background:none;border:0;color:inherit;font:inherit;padding:13px 15px;cursor:pointer;text-align:left;border-radius:12px}
.flaghead-l{display:flex;align-items:baseline;gap:10px;min-width:0}
.flaghead h3{margin:0;font-size:14px;font-weight:700}
.flagbadge{font-size:12px;color:var(--mute);white-space:nowrap}
.flagbadge.has{color:var(--risk);font-weight:600}
.flagchev{color:var(--mute);font-size:11px;font-weight:600;flex:none}
.flagcard.open .flaghead{border-bottom:1px solid var(--hair);border-radius:12px 12px 0 0}
.tw tbody tr:nth-child(even){background:var(--surface-2)}
.abcdbar{display:flex;height:24px;border-radius:7px;overflow:hidden;margin-top:14px;gap:2px}
.abcdseg{min-width:4px;border-radius:4px}
.abcdleg{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px;font-size:12px;font-weight:600}
.abcdleg span{display:inline-flex;align-items:center;gap:5px;color:var(--mute)}
.abcdleg i{width:10px;height:10px;border-radius:3px;display:inline-block}
.flagpill .fp-lab{cursor:default}
.flagpill.clickable .fp-lab{cursor:pointer}
.flagpill.clickable .fp-lab:hover{text-decoration:underline}
.rtable{display:flex;flex-direction:column;gap:4px}
.rhead{display:flex;align-items:center;gap:10px;padding:2px 13px 5px;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--faint)}
.rrow{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:var(--surface);border:1px solid var(--hair-2);border-left:3px solid var(--bandc,var(--accent));border-radius:10px;padding:8px 12px;cursor:pointer;font:inherit;color:var(--ink);transition:border-color .12s,background .12s}
.rrow:hover{background:var(--surface-2);border-color:var(--hair)}
.rrow.risk{background:color-mix(in srgb,var(--risk) 8%,var(--surface))}
.rrow.inact{opacity:.52}
.rrank{flex:none;width:18px;color:var(--faint);font-size:12px;text-align:right}
.rhav{flex:none;width:26px}
.rname{flex:1;min-width:0;font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rhname{flex:1;min-width:0}
.rsub{font-size:12px;color:var(--sub)}
.rcol-id{flex:none;width:60px;text-align:right;font-size:12px;color:var(--sub)}
.rcol-att{flex:none;width:46px;text-align:right;font-variant-numeric:tabular-nums;font-size:12.5px}
.rcol-trend{flex:none;width:56px;text-align:right;font-variant-numeric:tabular-nums;font-size:12.5px}
.rhgrade{flex:none;width:52px;text-align:right}
.rgrade{flex:none;width:52px;text-align:right;font-weight:800;font-size:15px;color:var(--ink);font-variant-numeric:tabular-nums}
.rpct{font-size:10px;font-weight:600;margin-left:1px}
.rletter{flex:none;width:26px;font-size:11px;font-weight:700;padding:1px 0;border-radius:6px;line-height:1.6;text-align:center}
@media(max-width:620px){.rrank,.rhav,.rcol-id,.rcol-att,.rcol-trend{display:none}}
.matrixwrap.qfit .agrid{min-width:0;width:100%}
.matrixwrap.qfit .acell{flex:1 1 22px;min-width:16px;width:auto;max-width:40px}
.tag.link,.ttag.link,.abcdlink,.mono.link{cursor:pointer}
.tag.link:hover,.ttag.link:hover,.abcdlink:hover,.mono.link:hover{filter:brightness(1.22);text-decoration:underline;text-underline-offset:2px}

.gbbar{display:flex;align-items:center;gap:10px;margin:14px 0 8px;flex-wrap:wrap}
.gbbar .rostsearch{max-width:260px}
.gbedits{font-size:12px;color:var(--sub)}
.gbedits b{color:var(--accent)}
.gbnote{font-size:11px;color:var(--faint);margin-bottom:10px;line-height:1.5}
.gbwrap{overflow-x:auto;overflow-y:visible;border:1px solid var(--hair);border-radius:12px;background:var(--surface);-webkit-overflow-scrolling:touch}
.gbtable{border-collapse:separate;border-spacing:0;font-size:12px;min-width:max-content}
.gbtable th,.gbtable td{border-bottom:1px solid var(--hair);border-right:1px solid var(--hair-2);white-space:nowrap;text-align:center}
.gbtable thead th{position:sticky;top:0;background:var(--surface-2);z-index:2;padding:6px 4px;font-weight:700;color:var(--sub)}
.gbh{min-width:50px}
.gbhn{display:block;font-size:10px;line-height:1.2}
.gbhmax{display:block;font-size:8px;color:var(--faint);font-weight:600}
.gbname{padding:5px 9px;text-align:left;font-weight:600;display:flex;align-items:center;gap:7px}
.gbnm{overflow:hidden;text-overflow:ellipsis;max-width:128px}
.gbsticky-l{position:sticky;left:0;background:var(--surface);z-index:3;box-shadow:5px 0 7px -5px rgba(0,0,0,.55);min-width:162px}
.gbtable thead .gbsticky-l{z-index:5}
.gbsticky-r{position:sticky;right:42px;background:var(--surface);z-index:3;box-shadow:-5px 0 7px -5px rgba(0,0,0,.55);min-width:46px;font-weight:800;font-family:'JetBrains Mono',monospace}
.gbsticky-r2{position:sticky;right:0;background:var(--surface);z-index:3;min-width:42px;font-weight:800}
.gbtable thead .gbsticky-r,.gbtable thead .gbsticky-r2{z-index:5}
.gbtable tbody tr:nth-child(even) td{background:var(--surface-2)}
.gbtable tbody tr:nth-child(even) .gbsticky-l,.gbtable tbody tr:nth-child(even) .gbsticky-r,.gbtable tbody tr:nth-child(even) .gbsticky-r2{background:var(--surface-2)}
.gbcell{width:46px;border:0;background:transparent;color:var(--ink);text-align:center;font-size:12px;padding:6px 2px;font-family:'JetBrains Mono',monospace}
.gbcell:focus{outline:2px solid var(--accent);outline-offset:-2px;background:var(--surface);border-radius:4px}
.gbtd.edited{background:color-mix(in srgb,var(--accent) 20%,transparent)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 45%,transparent)}
.gbtd.edited .gbcell{color:var(--accent);font-weight:700}
.gbtot,.gblet{padding:5px 6px}
.gbtable tbody td{transition:background .12s}
@media(max-width:620px){.gbsticky-l{min-width:120px}.gbnm{max-width:78px}.gbname .av{display:none}}

.gbgrp{background:var(--surface-2);font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--sub);font-weight:800;padding:5px 8px;text-align:center;border-bottom:1px solid var(--hair)}
.gbcat-start{border-left:2px solid var(--mute)!important}
.gbtable thead .gbcat-start{border-left:2px solid var(--mute)!important}
.gbsloth{min-width:25px}
.gbsloth .gbhn{font-size:9px}
.gbatd{padding:3px 2px;text-align:center}
.gbslot{width:23px;height:21px;border:0;border-radius:5px;font-size:9px;font-weight:800;cursor:pointer;background:var(--hair-2);color:var(--faint);line-height:21px;padding:0;transition:filter .1s}
.gbslot:hover{filter:brightness(1.18)}
.gbslot.p{background:var(--good);color:#04251a}
.gbslot.a{background:var(--risk);color:#2a0d05}
.gbslot.n{background:var(--hair-2);color:var(--faint)}
.gbatd.edited{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent)}
.gbslotpct,.gbslotpcth{min-width:40px}
.gbslotpct{font-family:'JetBrains Mono',monospace;font-weight:700;padding:5px 6px}
/* ---- Teaching / Lesson Planner ---- */
.tw-note{background:var(--surface-2);border:1px solid var(--hair);border-radius:10px;padding:9px 12px;font-size:12.5px;color:var(--sub);margin-bottom:10px}
.tw-grid{margin-top:2px}
.tw-wk .cn{margin-top:6px}
.tw-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tw-chips,.tw-chiprow{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
label.block select{font:inherit;font-weight:500;text-transform:none;letter-spacing:0;color:var(--ink);background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:9px 11px;width:100%;cursor:pointer}
.tw-classpct{display:flex;align-items:baseline;gap:10px;margin-bottom:6px}
.tw-classpct-n{font-size:30px;font-weight:600;letter-spacing:-1px;line-height:1}
.tw-classpct-l{font-size:12px;color:var(--mute)}
.tw-cap{font-size:11.5px;color:var(--mute);margin:0 0 12px}
.tw-slos{display:flex;flex-direction:column;margin-top:4px}
.tw-slo{font-size:12.5px;color:var(--sub);padding:6px 0;border-bottom:1px solid var(--hair-2)}
.tw-slo:last-child{border-bottom:none}
.tw-slo-h b{color:var(--ink);font-weight:700}
.tw-slo-m{display:flex;align-items:center;gap:8px;margin-top:5px}
.tw-bar{flex:1;height:5px;border-radius:3px;background:var(--bg-2);overflow:hidden;max-width:200px}
.tw-bar span{display:block;height:100%;border-radius:3px}
.tw-slo-pct{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:12px;min-width:34px;text-align:right}
.tw-below{font-size:11px;color:var(--mute)}
.tw-watch{display:flex;flex-direction:column;margin-top:2px}
.tw-wrow{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:7px 0;border-bottom:1px solid var(--hair-2)}
.tw-wrow:last-child{border-bottom:none}
.tw-wname{font-weight:600;color:var(--ink);font-size:13px}
.tw-wmeta{font-size:11.5px;color:var(--mute);white-space:nowrap}
.tw-ri{border:1px solid var(--hair);border-left:3px solid var(--warn);border-radius:10px;padding:11px 12px;margin-top:10px;background:var(--surface);break-inside:avoid}
.tw-ri-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:7px}
.tw-ri-pct{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:15px}
.tw-ri-sub{font-size:11.5px;color:var(--mute)}
.tw-ri-tags{display:flex;gap:5px;flex-wrap:wrap;margin-left:auto}
.tw-rt-tag{font-size:10.5px;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:999px;padding:2px 8px}
.tw-ri-stem{font-size:13px;color:var(--ink);line-height:1.5;margin-bottom:9px}
.tw-opts{display:flex;flex-direction:column;gap:4px;margin-bottom:9px}
.tw-opt{display:flex;align-items:center;gap:9px;padding:6px 9px;border:1px solid var(--hair);border-radius:8px;font-size:12.5px;color:var(--sub);background:var(--bg-2)}
.tw-opt.ok{border-color:color-mix(in srgb,var(--good) 50%,transparent);background:color-mix(in srgb,var(--good) 10%,transparent);color:var(--ink)}
.tw-opt.miss{border-color:color-mix(in srgb,var(--risk) 40%,transparent)}
.tw-opt-l{font-weight:700;min-width:14px}
.tw-opt-t{flex:1}
.tw-opt-n{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--mute);min-width:20px;text-align:right}
.tw-ri-rat{font-size:12px;color:var(--sub);line-height:1.5;background:var(--surface-2);border-radius:8px;padding:8px 10px}
.tw-ri-rat b{color:var(--ink)}
.tw-ri-miss{font-size:11px;color:var(--mute);margin-top:7px}
.tw-move{display:flex;gap:8px}
.tw-move button[disabled]{opacity:.4;cursor:default}
@media print{.tw-note{display:none!important}}
/* editable schedule tables + objectives (lesson planner) */
.tw-gr{display:grid;grid-template-columns:minmax(0,1.25fr) 52px minmax(0,2.2fr) 28px;gap:6px;align-items:center;margin-bottom:5px}
.tw-gr-head{margin-bottom:3px}
.tw-gr-head span{font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--mute);padding-left:2px}
.tw-cell{width:100%;box-sizing:border-box;background:var(--bg-2,#fff);border:1px solid var(--hair);border-radius:8px;padding:7px 8px;color:var(--ink);font:inherit;font-size:13px}
.tw-cell:focus{outline:none;border-color:var(--accent)}
.tw-rowx{border:1px solid var(--hair);background:transparent;color:var(--risk);border-radius:8px;width:28px;height:32px;cursor:pointer;font-size:16px;line-height:1;padding:0}
.tw-rowx:hover{background:color-mix(in srgb,var(--risk) 12%,transparent)}
.tw-addrow{margin-top:6px}
.tw-obj-row{display:grid;grid-template-columns:24px minmax(0,1fr) 28px;gap:8px;align-items:start;margin-bottom:7px}
.tw-obj-n{width:24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:5px;flex:none}
.tw-obj{width:100%;box-sizing:border-box;background:var(--bg-2,#fff);border:1px solid var(--hair);border-radius:8px;padding:7px 8px;color:var(--ink);font:inherit;font-size:13px;resize:vertical;line-height:1.4}
.tw-obj:focus{outline:none;border-color:var(--accent)}
@media print{.tw-rowx,.tw-addrow{display:none!important}}

/* advising & affective */
.adv-sub{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);font-weight:700;margin:2px 0 8px}
.adv-sub2{margin-top:18px;display:flex;align-items:center;justify-content:space-between}
.adv-slist,.adv-olist,.adv-hlist{display:flex;flex-direction:column;gap:7px}
.adv-srow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--hair);border-radius:10px;background:var(--surface-2);cursor:pointer;font-size:12px}
.adv-srow:hover{border-color:var(--accent)}
.adv-sdate{font-weight:600;color:var(--ink)}.adv-stop{color:var(--sub)}
.adv-att,.adv-tic,.adv-fl{font-size:10px;font-weight:700;padding:2px 7px;border-radius:20px;white-space:nowrap}
.adv-att-attended{background:rgba(33,118,79,.14);color:var(--good)}
.adv-att-scheduled{background:rgba(92,128,150,.16);color:var(--sub)}
.adv-att-no-show{background:rgba(188,68,42,.14);color:var(--risk)}
.adv-att-cancelled{background:var(--bg-2);color:var(--mute)}
.adv-tic-open{background:rgba(202,88,42,.14);color:var(--accent)}
.adv-tic-in-progress{background:rgba(183,138,52,.16);color:var(--mid)}
.adv-fl-pos{background:rgba(33,118,79,.14);color:var(--good)}
.adv-fl-watch{background:rgba(183,138,52,.18);color:var(--mid)}
.adv-fl-concern{background:rgba(188,68,42,.15);color:var(--risk)}
.adv-tag{font-size:10px;font-weight:600;padding:2px 7px;border-radius:6px;background:var(--bg-2);color:var(--sub);border:1px solid var(--hair)}
.adv-orow,.adv-hrow{padding:9px 11px;border:1px solid var(--hair);border-radius:10px;background:var(--surface)}
.adv-ohead,.adv-hhead{display:flex;flex-wrap:wrap;align-items:center;gap:7px}
.adv-odate{font-size:11px;font-weight:700;color:var(--ink)}
.adv-onote{font-size:12.5px;color:var(--sub);margin-top:5px;line-height:1.5;white-space:pre-wrap}
.adv-link{display:inline-block;margin-top:6px;font-size:10.5px;font-weight:600;color:var(--accent);background:rgba(202,88,42,.08);padding:2px 8px;border-radius:6px}
.adv-link[data-go]{cursor:pointer}
.adv-del{margin-left:auto;border:none;background:transparent;color:var(--mute);font-size:17px;line-height:1;cursor:pointer;padding:0 2px}
.adv-del:hover{color:var(--risk)}
.adv-empty{font-size:12px;color:var(--mute);font-style:italic;padding:6px 2px}
.adv-addbtn{border:1px solid var(--hair);background:var(--surface);color:var(--accent);font-size:11px;font-weight:700;padding:4px 10px;border-radius:8px;cursor:pointer}
.adv-addbtn:hover{border-color:var(--accent)}
.adv-form{display:none;margin-top:12px;padding:13px;border:1px solid var(--hair-2);border-radius:12px;background:var(--surface-2)}
.adv-form.open{display:block}
.adv-frow{margin-bottom:11px}
.adv-flbl{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--faint);font-weight:700;margin-bottom:5px}
.adv-in,.adv-ta{width:100%;border:1px solid var(--hair);border-radius:9px;background:var(--surface);color:var(--ink);font:inherit;font-size:13px;padding:8px 10px;box-sizing:border-box}
.adv-ta{min-height:70px;resize:vertical;line-height:1.5}
.adv-dimrow,.adv-flagseg{display:flex;flex-wrap:wrap;gap:6px}
.adv-dimchip{border:1px solid var(--hair);background:var(--surface);color:var(--sub);font-size:11px;font-weight:600;padding:5px 11px;border-radius:20px;cursor:pointer}
.adv-dimchip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.adv-flbtn{border:1px solid var(--hair);background:var(--surface);color:var(--sub);font-size:11px;font-weight:700;padding:5px 13px;border-radius:20px;cursor:pointer;opacity:.72}
.adv-flbtn.on{opacity:1;color:#fff}
.adv-flbtn.adv-fl-pos.on{background:var(--good);border-color:var(--good)}
.adv-flbtn.adv-fl-watch.on{background:var(--mid);border-color:var(--mid)}
.adv-flbtn.adv-fl-concern.on{background:var(--risk);border-color:var(--risk)}
.adv-factions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
.adv-kpis{display:flex;gap:10px;margin:4px 0 14px;flex-wrap:wrap}
.adv-kpi{flex:1;min-width:96px;border:1px solid var(--hair);border-radius:12px;background:var(--surface);padding:12px 14px}
.adv-kn{font-size:22px;font-weight:800;color:var(--ink)}
.adv-kl{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);font-weight:700;margin-top:2px}
.adv-filtrow{display:flex;gap:7px;margin-bottom:11px;flex-wrap:wrap}
.adv-filt{border:1px solid var(--hair);background:var(--surface);color:var(--sub);font-size:11.5px;font-weight:700;padding:5px 12px;border-radius:20px;cursor:pointer}
.adv-filt.on{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.adv-fc{opacity:.7}
.adv-hname{font-weight:700;color:var(--accent);cursor:pointer;font-size:12.5px}
.adv-frow2{cursor:pointer}
.adv-flagwrap{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:6px}
.adv-flagchip{border:1px solid var(--hair);font-size:11px;font-weight:700;padding:4px 11px;border-radius:20px;cursor:pointer}
@media print{.adv-form,.adv-addbtn,.adv-del,.adv-filtrow{display:none!important}}


/* advising hub v2 */
.adv-newbtn{font-size:12px;padding:8px 14px;white-space:nowrap}
.adv-apptform{display:none;margin:0 0 14px;padding:14px;border:1px solid var(--hair-2);border-radius:12px;background:var(--surface-2)}
.adv-apptform.open{display:block}
.adv-2col{display:flex;gap:10px;margin-bottom:11px}
.adv-2col>div{flex:1}
.adv-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:middle;flex:0 0 auto}
.adv-dot.adv-fl-pos{background:var(--good)}
.adv-dot.adv-fl-watch{background:var(--mid)}
.adv-dot.adv-fl-concern{background:var(--risk)}
.adv-stulist{display:flex;flex-direction:column;gap:6px}
.adv-stu{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 11px;border:1px solid var(--hair);border-radius:10px;background:var(--surface)}
.adv-stu-main{display:flex;align-items:center;gap:2px;flex:1;cursor:pointer;min-width:0}
.adv-stu-meta{font-size:10.5px;color:var(--mute);margin-left:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adv-mini{border:1px solid var(--hair);background:var(--surface);color:var(--accent);font-size:10.5px;font-weight:700;padding:4px 9px;border-radius:8px;cursor:pointer;white-space:nowrap;flex:0 0 auto}
.adv-mini:hover{border-color:var(--accent)}


/* enrollment guard */
.enroll-collapsed{display:inline-flex;align-items:center;gap:9px}
.enroll-cur{font-weight:700;font-size:12px;color:var(--ink)}
.enroll-manage{border:1px solid var(--hair);background:var(--surface);color:var(--accent);font-size:10.5px;font-weight:700;padding:4px 11px;border-radius:8px;cursor:pointer}
.enroll-manage:hover{border-color:var(--accent)}

@media(max-width:640px){.adv-barstack{grid-template-columns:1fr!important;display:grid!important}}

/* --- unified card rhythm: host mixed 9px(.mt/.mb) 10px(.grid) 16px(.stackcol) --- */
.mt,.mt-s{margin-top:12px!important}
.mb{margin-bottom:12px!important}
.grid{gap:12px!important}
.stackcol{gap:12px!important}

/* ============================================================
   PULSE - elevation & finish layer  (restyle 2026)
   Additive polish only: appended last so it refines the base
   without altering layout, class names, ids, or behavior.
   ============================================================ */
/* Accessibility floor: visible keyboard focus on every control */
a:focus-visible,button:focus-visible,[tabindex]:focus-visible,.nav button:focus-visible,
.crumb:focus-visible,.seg button:focus-visible,.distchip:focus-visible,.repchip:focus-visible,
.tag:focus-visible,.themecard:focus-visible,.scard:focus-visible,.ascard:focus-visible,
.rrow:focus-visible,.sg-row:focus-visible,.qa:focus-visible,.adv-stu:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.input:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}
/* Depth model: layered card elevation + subtle KPI gradient */
.card{box-shadow:var(--sh)}
.kpi{background:linear-gradient(180deg,color-mix(in srgb,var(--surface-2) 35%,var(--surface)),var(--surface))}
.click:hover,.card.rowlink:hover{box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 22%,transparent),0 16px 36px rgba(2,6,11,.5)}
/* Premium rail */
.rail{background:linear-gradient(180deg,var(--rail-1),var(--rail-2) 62%);box-shadow:inset -1px 0 0 rgba(255,255,255,.03)}
.nav button{transition:background .16s ease,color .16s ease,box-shadow .16s ease}
.nav button.on{box-shadow:inset 2px 0 0 var(--accent),0 0 0 1px color-mix(in srgb,var(--accent) 12%,transparent)}
.nav button.on svg{filter:drop-shadow(0 0 5px color-mix(in srgb,var(--accent) 50%,transparent))}
.logo{box-shadow:0 4px 18px color-mix(in srgb,var(--accent) 40%,transparent),inset 0 1px 0 rgba(255,255,255,.25)}
/* Primary buttons: dimensional, controlled accent glow */
.btn-go,.topbtn{background:linear-gradient(180deg,var(--accent-2),var(--accent));color:var(--accent-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 6px 18px color-mix(in srgb,var(--accent) 28%,transparent);transition:filter .14s ease,transform .06s ease,box-shadow .14s ease}
.btn-go:hover,.topbtn:hover{filter:brightness(1.05);background:linear-gradient(180deg,var(--accent-2),var(--accent))}
.btn-go:active,.topbtn:active{transform:translateY(1px);filter:brightness(.97)}
.btn-go.ghosty,.repbtn.ghosty,.repbar .btn-go.ghosty,.emactions .btn-go.ghosty,.repgen-out .ghosty{background:var(--surface-2);color:var(--ink);box-shadow:none;border:1px solid var(--hair)}
/* Numeric readouts align like an instrument */
.kpi .val,.bigscore .mono,.acard-mean b,.cardtop .rt b,.big,.tw-classpct-n,.adv-kn,.flagrow-g b,.rgrade,.gbslotpct,.tw-slo-pct{font-variant-numeric:tabular-nums}
/* Refined modal scrim */
.modal-bg{background:color-mix(in srgb,var(--canvas) 70%,#000);backdrop-filter:blur(6px) saturate(1.08)}
/* Crisper custom scrollbars */
*::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--accent) 55%,var(--faint))}
/* SIGNATURE: the topbar pulse trace breathes at ~15 breaths/min */
.wave path{stroke:var(--accent);stroke-width:1.9}
.logo svg path{stroke:#fff}
@media (prefers-reduced-motion:no-preference){
 .wave{overflow:visible}
 .wave path{filter:drop-shadow(0 0 3px color-mix(in srgb,var(--accent) 42%,transparent));animation:pulse-breathe 4s ease-in-out infinite}
 @keyframes pulse-breathe{0%,100%{opacity:.5}48%{opacity:1}}
}
/* Respect reduced motion globally */
@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}

/* ============================================================
   PULSE - REDESIGN v2  ("vitals deck")  — bolder, on-brand.
   Editorial type, generous rhythm, hero KPIs, an instrument
   control rail, premium cards. CSS-only; DOM + JS untouched.
   ============================================================ */
/* Canvas gains a faint accent wash, top-right, like a monitor glow */
body{background:radial-gradient(1100px 560px at 82% -12%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 62%),var(--canvas)}
/* Generous desktop rhythm */
@media(min-width:761px){
 .content{padding:30px 36px;max-width:1400px}
 .grid{gap:16px!important}.stackcol{gap:16px!important}.ph{margin-bottom:20px}
}
/* Editorial page header */
.eye{font-size:11px;letter-spacing:.16em;color:var(--accent)}
.eyebrow-row{font-size:11px;letter-spacing:.18em;color:var(--accent);gap:12px;margin-bottom:10px}
.eyebrow-row:before{width:22px;height:2px;background:var(--accent)}
.ph h2{font-size:clamp(27px,2.6vw,38px)!important;letter-spacing:-.9px;line-height:1.03}
.lede{font-size:13px;margin-top:6px}
/* Premium card surface + branded header tick */
.card{border-radius:16px;background:linear-gradient(180deg,color-mix(in srgb,var(--surface-2) 24%,var(--surface)),var(--surface))}
.ch{padding:16px 20px}
.ch h3{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--sub);display:flex;align-items:center;gap:9px}
.ch h3:before{content:"";width:7px;height:7px;border-radius:2px;background:var(--accent);box-shadow:0 0 9px color-mix(in srgb,var(--accent) 65%,transparent);flex:none}
.pad{padding:18px 20px}
/* Hero KPI treatment */
.kpi{padding:18px 20px;position:relative}
.kpi:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--accent),transparent)}
.kpi .lab{font-size:10.5px;letter-spacing:.1em;color:var(--mute)}
.kpi .val{font-size:clamp(36px,3.2vw,48px)!important;letter-spacing:-1.6px;margin-top:10px;line-height:.98;font-variant-numeric:tabular-nums}
.kpi .val .u{font-size:18px}
.kpi .sub{font-size:12px;margin-top:11px;color:var(--mute)}
/* Rail as an instrument control column */
.brand{padding:22px 20px 17px}
.brand h1{font-size:16px;letter-spacing:-.3px}
.brand small{font-size:9.5px;letter-spacing:.16em}
.grp{font-size:9.5px;letter-spacing:.18em;padding:16px 14px 7px}
.nav{padding:8px 12px}
.nav button{padding:10px 13px;border-radius:10px;font-size:13.5px;gap:12px;margin-bottom:1px}
.nav button svg{width:18px;height:18px}
.nav button.on{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 22%,transparent),color-mix(in srgb,var(--accent) 5%,transparent));box-shadow:inset 3px 0 0 var(--accent),0 0 0 1px color-mix(in srgb,var(--accent) 14%,transparent)}
.foot{padding:15px 20px}
/* Topbar presence */
.topbar{height:64px;padding:0 26px}
.pill{padding:6px 12px}
/* ---- MOBILE fixes: the breathing room was desktop-only; restore it here,
        and undo the fixed topbar height that scrunched the wrapped pills ---- */
@media(max-width:760px){
 /* top bar never gets a fixed height (that was cramming the wrapped pills) */
 .topbar{height:auto;min-height:54px;padding:8px 14px;row-gap:8px}
 /* EVERY view stacks its sections with ONE uniform gap — kills all 0-gap pairs */
 .content{display:flex;flex-direction:column;gap:16px;padding:16px 14px 26px}
 .content>*{margin-top:0!important;margin-bottom:0!important}
 /* spacing inside card groups */
 .hero{display:flex;flex-direction:column;gap:14px}
 .herokpis{gap:12px}
 .grid{gap:13px!important}
 .stackcol{gap:14px!important}
 .scardgrid{gap:12px!important}
 .ascardgrid{gap:12px!important}
 .kpi .val{font-size:clamp(32px,11vw,42px)!important}
}

/* ====== Lessons (Ch 3.4) ====== */
.les-ph .les-title{font-size:2.1rem;line-height:1.05;letter-spacing:-.02em;margin:2px 0 6px}
.les-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.les-tag{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;color:var(--mute);background:var(--surface-2);border:1px solid var(--hair);border-radius:8px;padding:5px 10px}
.les-tag em{font-style:normal;color:var(--accent);letter-spacing:.03em}

.les-rule{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 10%,var(--surface)),var(--surface));border:1px solid color-mix(in srgb,var(--accent) 30%,var(--hair));border-radius:var(--r);padding:16px 18px;margin-top:12px;box-shadow:var(--sh)}
.les-rule-k{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.les-rule p{font-size:15.5px;line-height:1.6;color:var(--ink);margin:0}
.les-rule b{color:var(--accent)}

.les-body{font-size:14.5px;line-height:1.62;color:var(--sub)}
.les-body p{margin:0 0 11px;max-width:74ch}
.les-body p:last-child{margin-bottom:0}
.les-body b{color:var(--ink);font-weight:700}

.les-legh{display:flex;align-items:center;gap:13px}
.les-legn{flex:none;width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--accent) 16%,var(--surface-2));color:var(--accent);font-weight:800;font-size:16px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}
.les-legh h3{margin:0;font-size:1.12rem}

.les-call{display:flex;gap:13px;background:var(--surface-2);border:1px solid var(--hair);border-left:3px solid var(--accent);border-radius:10px;padding:12px 14px;margin:13px 0;font-size:13.5px;line-height:1.55;color:var(--sub)}
.les-call-l{flex:none;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);width:118px;line-height:1.4}
.les-call b{color:var(--ink)}
.fick{display:block;font-family:'JetBrains Mono',monospace;font-size:15px;font-weight:700;color:var(--ink);margin-bottom:4px}
.fick-k{display:block;font-size:12px;color:var(--mute)}
.fick-k b{color:var(--sub)}

.les-eq{font-family:'JetBrains Mono',monospace;font-size:14.5px;font-weight:700;color:var(--ink);background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:11px 14px;margin:4px 0 13px;text-align:center;overflow-x:auto}
.les-eq em{font-style:normal;font-weight:500;font-size:12px;color:var(--mute);font-family:inherit}

/* journey chart */
.jrny-wrap{margin:2px 0 4px}
.jrny-leg{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:8px;font-size:12px;color:var(--mute);font-weight:600}
.jrny-leg i{display:inline-block;width:13px;height:4px;border-radius:2px;margin-right:6px;vertical-align:2px}
.jrny-rule{margin-left:auto;font-size:11px;font-style:italic;color:var(--faint)}
.jrny-hit.on{fill:color-mix(in srgb,var(--accent) 9%,transparent)!important}
.jrny-detail{margin-top:12px;background:var(--surface-2);border:1px solid var(--hair);border-radius:11px;padding:13px 15px}
.jd-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.jd-name{font-size:16px;font-weight:800;color:var(--ink)}
.jd-name em{font-style:normal;font-size:12px;font-weight:600;color:var(--mute);margin-left:8px}
.jd-nums{display:flex;gap:14px;font-family:'JetBrains Mono',monospace;font-size:14px}
.jd-note{margin:8px 0 0;font-size:13.5px;line-height:1.55;color:var(--sub)}

/* membrane stack */
.mem{display:flex;align-items:stretch;gap:12px;margin:6px 0 6px}
.mem-stack{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}
.mem-cap{font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--mute);text-align:center;padding:5px 8px;border-radius:7px;background:var(--surface-2);border:1px dashed var(--hair-2)}
.mem-layer{font-size:12px;font-weight:600;color:var(--ink);text-align:center;padding:8px;border-radius:7px;background:color-mix(in srgb,var(--accent) 14%,var(--surface-2));border:1px solid var(--hair)}
.mem-side{flex:none;width:96px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;border-radius:10px;padding:8px;gap:1px}
.mem-in{background:color-mix(in srgb,var(--accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}
.mem-out{background:color-mix(in srgb,#5b9cf0 14%,transparent);border:1px solid color-mix(in srgb,#5b9cf0 34%,transparent)}
.mem-side b{font-size:14px}.mem-in b{color:var(--accent)}.mem-out b{color:#5b9cf0}
.mem-side span{font-size:13px;font-weight:800;color:var(--ink)}
.mem-side small{font-size:10.5px;color:var(--mute);font-family:'JetBrains Mono',monospace}
.mem-note{font-size:12.5px;color:var(--mute);line-height:1.5;margin:4px 0 0}

/* co2 split */
.co2{display:flex;flex-direction:column;gap:13px;margin:4px 0}
.co2-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px}
.co2-name{font-size:13.5px;font-weight:700;color:var(--ink)}
.co2-pct{font-family:'JetBrains Mono',monospace;font-weight:800;font-size:14px}
.co2-bar{height:9px;border-radius:5px;background:var(--surface-2);overflow:hidden}
.co2-bar>div{height:100%;border-radius:5px}
.co2-desc{font-size:12.5px;color:var(--mute);line-height:1.5;margin-top:5px}

/* tissue helpers */
.les-helpers{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:6px 0 11px}
.helper{background:var(--surface-2);border:1px solid var(--hair);border-radius:10px;padding:12px 14px}
.helper b{display:block;font-size:13px;font-weight:800;color:var(--accent);text-transform:uppercase;letter-spacing:.05em;margin-bottom:5px}
.helper p{margin:0;font-size:12.5px;line-height:1.5;color:var(--sub)}
.les-tie{font-style:italic;color:var(--mute)!important}

/* four gradients */
.fourg{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fourg-col{background:var(--surface-2);border:1px solid var(--hair);border-radius:11px;padding:13px}
.fourg-h{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--mute);margin-bottom:9px}
.les-grad{display:flex;align-items:baseline;gap:8px;font-family:'JetBrains Mono',monospace;font-size:14px;color:var(--ink);padding:5px 0;border-top:1px solid var(--hair)}
.les-grad:first-of-type{border-top:0}
.les-grad b{min-width:34px;color:var(--accent)}
.les-grad em{font-style:normal;font-size:11.5px;color:var(--mute);margin-left:auto;font-family:var(--sans,inherit)}

/* calculator */
.calc-case{font-size:13.5px;line-height:1.55;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:10px;padding:12px 14px;margin-bottom:14px}
.calc-case b{color:var(--ink)}
.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.calc-row{margin-bottom:13px}
.calc-row label{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;font-weight:700;color:var(--sub);margin-bottom:6px}
.calc-row output{font-family:'JetBrains Mono',monospace;font-weight:800;font-size:13.5px;color:var(--accent)}
.calc-row input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:6px;border-radius:4px;background:var(--surface-2);border:1px solid var(--hair);outline:none}
.calc-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent);border:2px solid var(--surface);cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.4)}
.calc-row input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);border:2px solid var(--surface);cursor:pointer}
.calc-presets{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}
.calc-presets button{font-size:12px;font-weight:700;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:8px;padding:7px 11px;cursor:pointer;transition:.14s}
.calc-presets button:hover{border-color:var(--accent);color:var(--ink)}
.calc-presets button.on{background:color-mix(in srgb,var(--accent) 18%,var(--surface-2));border-color:var(--accent);color:var(--ink)}
.calc-out{background:var(--surface-2);border:1px solid var(--hair);border-radius:12px;padding:15px}
.calc-eq{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--mute);text-align:center;margin-bottom:10px;line-height:1.5}
.calc-total{text-align:center;margin-bottom:14px}
.calc-total span{font-size:3rem;font-weight:800;color:var(--accent);line-height:1;letter-spacing:-.02em}
.calc-total em{display:block;font-style:normal;font-size:12px;color:var(--mute);margin-top:3px;letter-spacing:.04em}
.cargo-bar{height:22px;border-radius:7px;background:var(--surface);border:1px solid var(--hair);overflow:hidden;display:flex}
.cargo-bound{height:100%;background:var(--accent);transition:width .18s}
.cargo-diss{height:100%;background:var(--warn);transition:width .18s}
.cargo-key{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:12px;color:var(--mute)}
.cargo-key b{color:var(--ink);font-family:'JetBrains Mono',monospace}
.cargo-key i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.ck-bound{background:var(--accent)}.ck-diss{background:var(--warn)}
.calc-verdict{margin-top:13px;font-size:13px;line-height:1.55;color:var(--sub);border-top:1px solid var(--hair);padding-top:12px}
.calc-verdict b{color:var(--ink)}

/* self-check */
.qz{display:flex;flex-direction:column;gap:14px}
.q{background:var(--surface-2);border:1px solid var(--hair);border-radius:12px;padding:14px 15px}
.q-stem{display:flex;gap:10px;font-size:14px;line-height:1.5;color:var(--ink);font-weight:600;margin-bottom:11px}
.q-n{flex:none;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:12.5px;color:var(--accent);padding-top:1px}
.q-opts{display:flex;flex-direction:column;gap:7px}
.q-opt{display:flex;align-items:center;gap:10px;text-align:left;width:100%;font-size:13.5px;color:var(--sub);background:var(--surface);border:1px solid var(--hair);border-radius:9px;padding:10px 12px;cursor:pointer;transition:.14s}
.q-opt:hover:not(:disabled){border-color:var(--accent);color:var(--ink)}
.q-opt:disabled{cursor:default}
.q-let{flex:none;width:22px;height:22px;border-radius:6px;background:var(--surface-2);display:grid;place-items:center;font-weight:800;font-size:12px;color:var(--mute)}
.q-opt.correct{background:color-mix(in srgb,var(--good) 16%,var(--surface));border-color:var(--good);color:var(--ink)}
.q-opt.correct .q-let{background:var(--good);color:#04210f}
.q-opt.wrong{background:color-mix(in srgb,var(--risk) 14%,var(--surface));border-color:var(--risk);color:var(--ink)}
.q-opt.wrong .q-let{background:var(--risk);color:#fff}
.q-rat{display:none;margin-top:11px;font-size:13px;line-height:1.55;color:var(--sub);background:var(--surface);border:1px solid var(--hair);border-left:3px solid var(--good);border-radius:9px;padding:11px 13px}
.q-rat.show{display:block}
.q-rat b{color:var(--good)}

/* chapter in one breath */
.les-breath{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 8%,var(--surface)),var(--surface));border:1px solid color-mix(in srgb,var(--accent) 26%,var(--hair));border-radius:var(--r);padding:16px 18px;margin-top:12px;box-shadow:var(--sh)}
.les-breath-k{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:7px}
.les-breath p{margin:0;font-size:14px;line-height:1.62;color:var(--sub)}
.les-breath b{color:var(--ink)}
.les-ahead{margin-top:12px;padding-top:11px;border-top:1px solid var(--hair);font-size:13px;color:var(--mute);line-height:1.5}
.les-ahead b{color:var(--accent)}

@media(max-width:720px){
  .les-ph .les-title{font-size:1.7rem}
  .calc-grid{grid-template-columns:1fr}
  .les-helpers,.fourg{grid-template-columns:1fr}
  .mem{flex-direction:column}
  .mem-side{width:auto;flex-direction:row;justify-content:center;gap:8px}
  .les-call{flex-direction:column;gap:6px}
  .les-call-l{width:auto}
  .calc-total span{font-size:2.4rem}
}

/* ====== Lessons hub (index) ====== */
.les-back{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:var(--mute);background:none;border:0;padding:0 0 8px;cursor:pointer;transition:.14s}
.les-back:hover{color:var(--accent)}
.lx-grid{display:flex;flex-direction:column;gap:12px}
.lx-card{display:flex;align-items:center;gap:16px;text-align:left;width:100%;background:var(--surface);border:1px solid var(--hair);border-left:3px solid var(--accent);border-radius:var(--r);padding:18px 20px;cursor:pointer;transition:.16s;box-shadow:var(--sh)}
.lx-card:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:var(--sh-lg)}
.lx-body{flex:1;min-width:0}
.lx-unit{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:5px}
.lx-title{font-size:1.4rem;font-weight:800;letter-spacing:-.01em;color:var(--ink);line-height:1.1;margin-bottom:5px}
.lx-sub{font-size:13.5px;line-height:1.5;color:var(--sub);max-width:70ch;margin-bottom:9px}
.lx-feats{display:flex;flex-wrap:wrap;gap:6px}
.lx-feats span{font-size:11px;font-weight:700;color:var(--mute);background:var(--surface-2);border:1px solid var(--hair);border-radius:7px;padding:4px 9px}
.lx-go{flex:none;font-size:13px;font-weight:800;color:var(--accent);white-space:nowrap}

/* ====== Pump lesson ====== */
.pmp-obj{margin:0;padding-left:0;list-style:none;counter-reset:o}
.pmp-obj li{position:relative;counter-increment:o;padding:7px 0 7px 34px;font-size:14px;line-height:1.5;color:var(--sub);border-top:1px solid var(--hair)}
.pmp-obj li:first-child{border-top:0}
.pmp-obj li::before{content:counter(o);position:absolute;left:0;top:7px;width:22px;height:22px;border-radius:7px;background:color-mix(in srgb,var(--accent) 16%,var(--surface-2));color:var(--accent);font-weight:800;font-size:12px;display:grid;place-items:center}

.pmp{background:var(--surface-2);border:1px solid var(--hair);border-radius:12px;padding:10px}
.pmp svg{max-width:580px;margin:0 auto}
.pmp-thx{fill:color-mix(in srgb,var(--accent) 6%,var(--surface));stroke:var(--hair)}
.pmp-abd{fill:color-mix(in srgb,#e0635c 6%,var(--surface));stroke:var(--hair)}
.pmp-dia{transition:transform .6s cubic-bezier(.4,0,.2,1)}
.pmp[data-phase="insp"] .pmp-dia{transform:translateY(46px)}
.pmp[data-phase="exp"] .pmp-dia{transform:translateY(0)}
.pmp-badge rect{fill:var(--surface);stroke:var(--hair)}
.pmp-badge text{font-size:12px;font-weight:800;transition:opacity .3s}
.pmp-thx-badge .pi{fill:var(--accent)} .pmp-thx-badge .pe{fill:var(--warn)}
.pmp-abd-badge .pi{fill:var(--warn)} .pmp-abd-badge .pe{fill:var(--accent)}
.pmp[data-phase="insp"] .pe{opacity:0}
.pmp[data-phase="exp"] .pi{opacity:0}
.pmp-up,.pmp-in,.pmp-valve-open,.pmp-valve-closed{transition:opacity .4s}
.pmp[data-phase="exp"] .pmp-up{opacity:.1}
.pmp[data-phase="insp"] .pmp-in{opacity:0}
.pmp[data-phase="insp"] .pmp-valve-closed{opacity:0}
.pmp[data-phase="exp"] .pmp-valve-open{opacity:0}
.pmp-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.pmp-btn{font-size:13px;font-weight:700;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:9px 14px;cursor:pointer;transition:.14s}
.pmp-btn:hover{border-color:var(--accent);color:var(--ink)}
.pmp-btn.on{background:color-mix(in srgb,var(--accent) 18%,var(--surface-2));border-color:var(--accent);color:var(--ink)}
.pmp-play{margin-left:auto;font-size:13px;font-weight:700;color:var(--mute);background:var(--surface);border:1px solid var(--hair);border-radius:9px;padding:9px 14px;cursor:pointer;transition:.14s}
.pmp-play:hover{border-color:var(--accent);color:var(--ink)}
.pmp-play.on{background:color-mix(in srgb,var(--accent) 14%,var(--surface));border-color:var(--accent);color:var(--accent)}
.pmp-readout{margin-top:12px;background:var(--surface-2);border:1px solid var(--hair);border-radius:11px;padding:14px}
.pmp-rd-h{display:flex;align-items:baseline;gap:10px;margin-bottom:11px}
.pmp-rd-name{font-size:17px;font-weight:800;color:var(--ink)}
.pmp-rd-tag{font-size:12px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.05em}
.pmp-rd-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px 16px}
.pmp-rd-grid>div{font-size:13px;line-height:1.45;color:var(--sub)}
.pmp-rd-grid b{display:block;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--mute);margin-bottom:2px}
.pmp-rd-eff{grid-column:1/-1;border-top:1px solid var(--hair);padding-top:9px}
.pmp-rd-eff b{color:var(--accent)}

.pmp-mtabs{display:flex;gap:8px;margin-bottom:13px}
.pmp-mtab{flex:1;font-size:13.5px;font-weight:700;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:10px;cursor:pointer;transition:.14s}
.pmp-mtab:hover{border-color:var(--accent);color:var(--ink)}
.pmp-mtab.on{background:color-mix(in srgb,var(--accent) 18%,var(--surface-2));border-color:var(--accent);color:var(--ink)}
.pmp-mode{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;align-items:center;border-radius:11px;padding:15px 16px;border:1px solid}
.pmp-mode.is-good{background:color-mix(in srgb,var(--accent) 9%,var(--surface-2));border-color:color-mix(in srgb,var(--accent) 32%,var(--hair))}
.pmp-mode.is-bad{background:color-mix(in srgb,var(--warn) 9%,var(--surface-2));border-color:color-mix(in srgb,var(--warn) 32%,var(--hair))}
.pmp-mode-arrow{grid-row:1/3;font-size:2.6rem;font-weight:800;line-height:1;width:48px;text-align:center}
.is-good .pmp-mode-arrow{color:var(--accent)} .is-bad .pmp-mode-arrow{color:var(--warn)}
.pmp-mode-name{font-size:15px;font-weight:800;color:var(--ink)}
.pmp-mode-press{font-size:13px;font-weight:700;color:var(--sub);margin:1px 0 3px}
.is-good .pmp-mode-press{color:var(--accent)} .is-bad .pmp-mode-press{color:var(--warn)}
.pmp-mode-mech{font-size:12.5px;line-height:1.45;color:var(--mute)}
.pmp-mode-vr{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;border-top:1px solid var(--hair);margin-top:9px;padding-top:11px}
.pmp-mode-vrk{font-size:14px;font-weight:800;color:var(--ink)}
.is-good .pmp-mode-vrk{color:var(--accent)} .is-bad .pmp-mode-vrk{color:var(--warn)}
.pmp-mode-line{font-size:12.5px;font-style:italic;color:var(--sub)}
.pmp-mode-bottom{font-size:13px;line-height:1.55;color:var(--sub);margin:13px 0 0}

.bed-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.bed{text-align:left;background:var(--surface-2);border:1px solid var(--hair);border-radius:11px;padding:13px 14px;cursor:pointer;transition:.14s}
.bed:hover{border-color:var(--accent)}
.bed.open{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,var(--surface-2))}
.bed-t{font-size:14px;font-weight:800;color:var(--ink)}
.bed-s{font-size:12px;color:var(--mute);margin-top:2px}
.bed-r{font-size:13px;line-height:1.5;color:var(--sub);max-height:0;opacity:0;overflow:hidden;transition:max-height .3s,opacity .3s,margin .3s}
.bed.open .bed-r{max-height:240px;opacity:1;margin-top:9px;padding-top:9px;border-top:1px solid var(--hair)}
.pmp-bottom{font-size:13.5px;line-height:1.55;color:var(--sub);margin:13px 0 0;background:var(--surface-2);border:1px solid var(--hair);border-left:3px solid var(--accent);border-radius:10px;padding:12px 14px}
.pmp-bottom b{color:var(--ink)}

.ask-list{display:flex;flex-direction:column;gap:10px}
.ask{text-align:left;background:var(--surface-2);border:1px solid var(--hair);border-radius:11px;padding:13px 15px;cursor:pointer;transition:.14s}
.ask:hover{border-color:var(--accent)}
.ask.open{border-color:var(--accent)}
.ask-q{display:flex;gap:10px;font-size:14px;line-height:1.5;font-weight:600;color:var(--ink)}
.ask-n{flex:none;width:22px;height:22px;border-radius:6px;background:color-mix(in srgb,var(--accent) 16%,var(--surface));color:var(--accent);font-weight:800;font-size:12px;display:grid;place-items:center}
.ask-a{font-size:13px;line-height:1.55;color:var(--sub);max-height:0;opacity:0;overflow:hidden;transition:max-height .3s,opacity .3s,margin .3s;padding-left:32px}
.ask.open .ask-a{max-height:260px;opacity:1;margin-top:9px}

@media(max-width:720px){
  .lx-card{flex-direction:column;align-items:flex-start;gap:10px}
  .lx-title{font-size:1.2rem}
  .pmp-rd-grid{grid-template-columns:1fr}
  .bed-grid{grid-template-columns:1fr}
  .pmp-play{margin-left:0}
}

/* ============================ PATCHES ============================ */

/* (1) PRINT — force the light palette regardless of the active screen theme.
   The built-in print block sets these on `html` (specificity 0,0,1) but the dark
   palette lives on `:root` (0,1,0) and on html[data-theme=...] (0,1,1), which win —
   so cards kept printing dark. Re-assert on :root + theme selectors with !important. */
@media print{
  :root,html,html[data-theme],html[data-theme="ocean"],html[data-theme="violet"]{
    --canvas:#fff!important;--bg-2:#fff!important;--surface:#fff!important;--surface-2:#f3f6f9!important;--raise:#e7edf2!important;
    --ink:#16212c!important;--sub:#46535f!important;--mute:#69757f!important;--faint:#94a1ab!important;
    --hair:#e2e8ee!important;--hair-2:#d2dbe2!important;
    --accent:#0c8e72!important;--accent-d:#0a7a62!important;--accent-2:#2fc4ac!important;--accent-ink:#02231d!important;
    --good:#0a9a55!important;--ok:#2f9e5c!important;--mid:#bd7e1c!important;--warn:#bd7e1c!important;--risk:#d6452a!important;
    --null:#aab4bd!important;--sh:none!important;--sh-lg:none!important;
  }
}

/* (2) STUDENT PAGE — stack the split header on mobile so the score and the
   Generate-report / Draft-email buttons stop overflowing off the right edge. */
@media(max-width:760px){
  .ph-split{flex-direction:column;align-items:flex-start;gap:12px}
  .ph-split .bigscore{justify-content:flex-start;max-width:100%;width:100%}
}

/* (3) ZEBRA — alternating row shading on Needs attention now, Items to reteach
   (.list.zebra), and Weakest outcomes (.pad-b.barzebra). Scoped via marker classes. */
.list.zebra .li:nth-child(even){background:var(--surface-2)}
.pad-b.barzebra>div{padding:6px 8px;border-radius:8px}
.pad-b.barzebra>div:nth-child(even){background:var(--surface-2)}

/* (4) ITEM ANALYSIS — explicit single-column order on mobile:
   Question & responses -> How the class answered -> Item statistics ->
   Score split -> Tags -> Rationale, then Missed by (which sits outside the grid).
   Promote both stackcols' children into the grid so they can be interleaved. */
@media(max-width:760px){
  .grid.g2-13{display:flex;flex-direction:column;gap:16px}
  .grid.g2-13>.stackcol{display:contents}
  .grid.g2-13 .it-q{order:1}
  .grid.g2-13 .itemchart{order:2}
  .grid.g2-13 .it-rat{order:3}
  .grid.g2-13 .it-stat{order:4}
  .grid.g2-13 .it-split{order:5}
  .grid.g2-13 .it-tags{order:6}
}

/* (5) SPLIT HEADER (desktop) — the right block (score + Generate report / Draft email)
   is taller than the name block. The base rule uses align-items:flex-end, which
   bottom-aligns them so the score/buttons overshoot UP and cram/clip against the page
   top. Top-align the two sides so the right block grows downward instead, and give the
   header a little top breathing room. */
.ph.ph-split{align-items:flex-start;padding-top:4px}

/* (6) Day-One profile — collapsed by default, click the header to expand.
   Native <details>; matches .card / .ch styling, hides the default marker,
   and shows a caret that rotates when open. */
.daycard{overflow:hidden}
.daycard>summary{cursor:pointer;list-style:none}
.daycard>summary::-webkit-details-marker{display:none}
.daycard>summary::marker{content:""}
.daycard>summary:hover{background:var(--surface-2)}
.daycard:not([open])>summary{border-bottom:0}
.daycard:not([open])>*:not(summary){display:none}
.day-h{display:flex;align-items:baseline;gap:12px;min-width:0}
.day-caret{flex:none;color:var(--mute);font-size:12px;transition:transform .18s ease}
.daycard[open] .day-caret{transform:rotate(90deg)}

/* (7) PRESENT MODE — a toggle in the top bar hides student-name lists (the "Missed by"
   card) so questions can be reviewed on a projector. State lives on <body> so it
   persists as you move between questions; doesn't affect print or desktop layout. */
body.present .presentbtn{background:color-mix(in srgb,var(--accent) 18%,var(--surface-2));border-color:var(--accent);color:var(--accent)}
body.present .missedby{display:none!important}

/* (8) NEXT/PREV question nav on the item page — for going through questions in class.
   Buttons use the app's data-go nav; go() replaces (not pushes) for item->item so the
   breadcrumb/back-stack doesn't grow as you advance. */
.qnav{display:flex;gap:8px;flex:none;align-items:center}
.qnav-btn{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:9px;padding:8px 14px;cursor:pointer;transition:.14s}
.qnav-btn:hover:not([disabled]){border-color:var(--accent);color:var(--ink)}
.qnav-btn[disabled]{opacity:.38;cursor:default}
.qnav-next{background:color-mix(in srgb,var(--accent) 16%,var(--surface-2));border-color:color-mix(in srgb,var(--accent) 42%,var(--hair));color:var(--accent)}
.qnav-next:hover:not([disabled]){background:color-mix(in srgb,var(--accent) 24%,var(--surface-2));color:var(--accent)}
@media(max-width:760px){.qnav{width:100%}.qnav-btn{flex:1;justify-content:center}}

/* (9) ITEM REVIEW — live in-class question review (landing + question view). */
.rev-grid{display:flex;flex-direction:column;gap:12px}
.rev-set{display:flex;align-items:center;gap:16px;text-align:left;width:100%;background:var(--surface);border:1px solid var(--hair);border-left:3px solid var(--accent);border-radius:var(--r);padding:15px 20px;cursor:pointer;transition:.16s;box-shadow:var(--sh);font:inherit}
.rev-set:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:var(--sh-lg)}
.rev-set-all{border-left-color:var(--accent-2)}
.rev-set-body{flex:1;min-width:0}
.rev-set-name{font-size:1.12rem;font-weight:800;color:var(--ink);display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.rev-set-topic{font-size:.82rem;font-weight:600;color:var(--accent)}
.rev-set-meta{font-size:12.5px;color:var(--mute);margin-top:3px}
.rev-set-go{flex:none;font-size:13px;font-weight:800;color:var(--accent)}
.rev-pos{font-size:22px;font-weight:800}
.rev-pos span{color:var(--mute);font-weight:600}
.rev-card{margin-top:4px}
.rev-meta{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.rev-stem{font-size:1.35rem;line-height:1.5;font-weight:600;color:var(--ink);margin-bottom:22px}
.rev-opts{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.rev-opt{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1.5px solid var(--hair);border-radius:12px;background:var(--surface-2);font-size:1.05rem;transition:.18s}
.rev-letter{flex:none;width:30px;height:30px;border-radius:8px;background:var(--surface);border:1px solid var(--hair);display:grid;place-items:center;font-weight:800;color:var(--sub)}
.rev-otext{flex:1;color:var(--ink)}
.rev-opt.is-correct{border-color:var(--good);background:color-mix(in srgb,var(--good) 13%,var(--surface-2))}
.rev-opt.is-correct .rev-letter{background:var(--good);border-color:var(--good);color:#fff}
.rev-check{flex:none;color:var(--good);font-weight:800;font-size:1.25rem;line-height:1}
.rev-blank{color:var(--mute);font-style:italic}
.rev-reveal{width:100%;padding:15px;font-size:1.02rem;font-weight:800;color:var(--accent-ink);background:var(--accent);border:0;border-radius:12px;cursor:pointer;transition:.15s}
.rev-reveal:hover{filter:brightness(1.06)}
.rev-answer{border-top:1px solid var(--hair);padding-top:18px}
.rev-ans-h{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--good);margin-bottom:9px}
.rev-rat{font-size:1.02rem;line-height:1.6;color:var(--sub)}
.rev-progress{height:5px;background:var(--surface-2);border-radius:99px;margin-top:16px;overflow:hidden}
.rev-progress-bar{height:100%;background:var(--accent);border-radius:99px;transition:width .25s ease}

/* ===================== LECTURE DECKS v2 — composed layout system =====================
   Reuses console tokens. Display = Plus Jakarta Sans (inherited, heavy).
   Technical labels/eyebrows/indices = JetBrains Mono. Palette: teal (--accent)
   + amber (--mid) duo, semantic green/red, on the console's near-black canvas. */

:root{--dk-mono:'JetBrains Mono',ui-monospace,'SF Mono',monospace;--dk-amber:#eaa83e;--dk-amber-ink:#2a1c06;}

/* ---- Hub ---- */
.deckhub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:14px}
.deckcard{display:flex;flex-direction:column;text-align:left;background:var(--surface);border:1px solid var(--hair);border-radius:16px;overflow:hidden;cursor:pointer;transition:.18s;box-shadow:var(--sh);font:inherit;position:relative}
.deckcard::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:.0;transition:.18s}
.deckcard:hover{transform:translateY(-3px);box-shadow:var(--sh-lg);border-color:var(--hair-2)}
.deckcard:hover::before{opacity:1}
.deckcard-top{padding:17px 19px 14px}
.deckcard-wk{font-family:var(--dk-mono);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.deckcard-title{font-size:1.24rem;font-weight:800;color:var(--ink);margin-top:7px;line-height:1.18;letter-spacing:-.01em}
.deckcard-body{padding:0 19px 17px;display:flex;flex-direction:column;gap:14px;flex:1}
.deckcard-sub{font-size:13px;color:var(--mute);line-height:1.5;flex:1}
.deckcard-foot{display:flex;align-items:center;justify-content:space-between;font-family:var(--dk-mono);font-size:11.5px;letter-spacing:.04em}
.deckcard-count{color:var(--faint);text-transform:uppercase}
.deckcard-go{color:var(--accent);font-weight:600}
.deckhub-h{font-family:var(--dk-mono);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin:24px 0 12px;display:flex;align-items:center;gap:12px}
.deckhub-h::after{content:'';flex:1;height:1px;background:var(--hair)}
.deckhub-h:first-of-type{margin-top:10px}

/* ---- Viewer chrome ---- */
.deckwrap{display:flex;flex-direction:column;gap:14px}
.deck-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.deck-top-l{min-width:0}
.deck-eyebrow{font-family:var(--dk-mono);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.deck-name{font-size:15px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw}
.deck-top-r{display:flex;align-items:center;gap:8px}
.deck-counter{font-family:var(--dk-mono);font-size:12.5px;font-weight:600;color:var(--sub);min-width:64px;text-align:center}
.deck-btn{display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--hair);color:var(--sub);border-radius:10px;padding:8px 12px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:.14s}
.deck-btn:hover:not(:disabled){border-color:var(--accent);color:var(--ink)}
.deck-btn:disabled{opacity:.35;cursor:default}
.deck-btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.deck-btn.primary:hover{filter:brightness(1.07)}

/* ---- Stage ---- */
.slide-stage{position:relative;background:linear-gradient(168deg,var(--surface),var(--bg-2));border:1px solid var(--hair);border-radius:20px;box-shadow:var(--sh-lg);min-height:min(73vh,690px);padding:clamp(28px,4.2vw,62px);display:flex;flex-direction:column;overflow:hidden}
.slide-stage::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(130% 90% at 100% -10%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 55%)}
.slide-in{position:relative;z-index:1;display:flex;flex-direction:column;flex:1;min-height:0;justify-content:center;animation:dkfade .3s ease}
@keyframes dkfade{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}

/* ---- Shared primitives ---- */
.dk-eyebrow{font-family:var(--dk-mono);font-size:clamp(11px,1.3vw,13px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);display:inline-flex;align-items:center;gap:11px;margin-bottom:18px}
.dk-eyebrow::before{content:'';width:22px;height:2px;background:var(--accent);border-radius:2px}
.dk-display{font-weight:800;line-height:1.06;letter-spacing:-.02em;color:var(--ink);font-size:clamp(27px,3.7vw,45px)}
.dk-lede{font-size:clamp(15px,1.7vw,19px);color:var(--sub);line-height:1.5;max-width:64ch;font-weight:450}
.dk-src{margin-top:30px;padding-top:20px;font-family:var(--dk-mono);font-size:11px;letter-spacing:.04em;color:var(--faint)}
.dk-ghost{position:absolute;font-family:var(--dk-mono);font-weight:700;color:var(--ink);opacity:.035;line-height:.8;pointer-events:none;z-index:0;user-select:none}

/* ---- 1 · COVER ---- */
.sl-cover{justify-content:center;gap:0}
.sl-cover-eye{font-family:var(--dk-mono);font-size:clamp(11px,1.3vw,13px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);display:flex;align-items:center;gap:14px;margin-bottom:26px}
.sl-cover-eye::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 50%,transparent),transparent)}
.sl-cover-grid{display:grid;grid-template-columns:1.35fr .9fr;gap:48px;align-items:center}
.sl-cover h1{font-size:clamp(33px,5vw,60px);font-weight:800;line-height:1.03;letter-spacing:-.025em;color:var(--ink);margin:0}
.sl-cover-essence{font-size:clamp(15px,1.8vw,20px);color:var(--accent);font-weight:600;margin-top:22px;line-height:1.4}
.sl-outcomes{border-left:2px solid var(--hair-2);padding-left:22px;display:flex;flex-direction:column;gap:0}
.sl-out-h{font-family:var(--dk-mono);font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--mute);margin-bottom:14px}
.sl-out{display:grid;grid-template-columns:30px 1fr;gap:13px;padding:11px 0;border-top:1px solid var(--hair);font-size:clamp(13px,1.4vw,15px);color:var(--sub);line-height:1.38}
.sl-out:first-of-type{border-top:0}
.sl-out-n{font-family:var(--dk-mono);font-size:12px;font-weight:700;color:var(--accent)}
.sl-cover-foot{margin-top:34px;font-family:var(--dk-mono);font-size:11px;letter-spacing:.04em;color:var(--faint);display:flex;align-items:center;gap:14px}
.sl-pulse{display:block;width:100%;height:34px;margin-top:30px;opacity:.5}

/* ---- 2 · STATEMENT ---- */
.sl-statement{justify-content:center}
.sl-stmt-big{font-size:clamp(30px,4.8vw,56px);font-weight:800;line-height:1.08;letter-spacing:-.02em;color:var(--ink);max-width:20ch}
.sl-stmt-big .hl{color:var(--accent)}
.sl-stmt-gloss{font-family:var(--dk-mono);font-size:clamp(13px,1.5vw,15.5px);color:var(--mute);margin-top:26px;line-height:1.6;max-width:60ch;display:flex;gap:13px}
.sl-stmt-gloss::before{content:'';flex:none;width:3px;align-self:stretch;background:var(--accent);border-radius:2px}

/* ---- 3 · SPLIT (concept | facts) ---- */
.sl-split-grid{display:grid;grid-template-columns:minmax(210px,36%) 1fr;gap:42px;align-items:start;margin-top:6px}
.sl-split-l{display:flex;flex-direction:column}
.sl-split-key{font-size:clamp(24px,3vw,38px);font-weight:800;line-height:1.08;letter-spacing:-.015em;color:var(--ink);margin:4px 0 0}
.sl-split-ess{font-size:clamp(14px,1.55vw,17px);color:var(--sub);margin-top:16px;line-height:1.5}
.sl-split-tag{display:inline-flex;align-self:flex-start;margin-top:20px;font-family:var(--dk-mono);font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--accent);background:color-mix(in srgb,var(--accent) 13%,transparent);border:1px solid color-mix(in srgb,var(--accent) 32%,var(--hair));border-radius:8px;padding:7px 13px}
.sl-facts{display:flex;flex-direction:column}
.sl-fact{display:grid;grid-template-columns:122px 1fr;gap:18px;padding:15px 0;border-top:1px solid var(--hair);align-items:baseline}
.sl-fact:first-child{border-top:0;padding-top:2px}
.sl-fact-k{font-family:var(--dk-mono);font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--mute);padding-top:3px;line-height:1.34;overflow-wrap:break-word;word-break:break-word;hyphens:none}
.sl-fact-v{font-size:clamp(14px,1.55vw,17px);color:var(--sub);line-height:1.5;min-width:0;overflow-wrap:break-word}
.sl-fact-v b,.sl-fact-v strong{color:var(--ink);font-weight:700}
.sl-fact.hot{background:color-mix(in srgb,var(--accent) 10%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,var(--hair));border-radius:12px;padding:14px 18px;margin-top:14px;grid-template-columns:122px 1fr}
.sl-fact.hot .sl-fact-k{color:var(--accent)}
.sl-fact.hot .sl-fact-v{color:var(--ink)}
.sl-fact.amber{background:color-mix(in srgb,var(--dk-amber) 11%,transparent);border:1px solid color-mix(in srgb,var(--dk-amber) 34%,var(--hair));border-radius:12px;padding:14px 18px;margin-top:14px;grid-template-columns:122px 1fr}
.sl-fact.amber .sl-fact-k{color:var(--dk-amber)}
.sl-fact.amber .sl-fact-v{color:var(--ink)}

/* ---- 4 · DUO / TRIO comparison ---- */
.sl-duo{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:8px;align-content:start}
.sl-duo.three{grid-template-columns:repeat(3,1fr)}
.sl-pane{background:var(--surface-2);border:1px solid var(--hair);border-radius:15px;padding:20px 22px;display:flex;flex-direction:column}
.sl-pane-h{font-family:var(--dk-mono);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center;gap:10px;margin-bottom:6px;color:var(--accent)}
.sl-pane-h::before{content:'';width:9px;height:9px;border-radius:50%;background:currentColor}
.sl-pane.pos .sl-pane-h{color:var(--good)}
.sl-pane.neg .sl-pane-h{color:var(--risk)}
.sl-pane.amber .sl-pane-h{color:var(--dk-amber)}
.sl-pane-verb{font-size:clamp(18px,2.1vw,24px);font-weight:800;color:var(--ink);letter-spacing:-.01em;margin:2px 0 12px}
.sl-pane-li{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.sl-pane-li li{position:relative;padding-left:22px;font-size:clamp(13px,1.45vw,15.5px);color:var(--sub);line-height:1.46}
.sl-pane-li li::before{content:'';position:absolute;left:4px;top:.55em;width:7px;height:7px;border-radius:2px;background:var(--accent)}
.sl-pane.pos li::before{background:var(--good);border-radius:50%}
.sl-pane.neg li::before{background:var(--risk);border-radius:1px;width:8px;height:2px;top:.7em}
.sl-pane-note{font-size:13px;color:var(--mute);line-height:1.5;margin-top:auto;padding-top:12px}

/* ---- 5 · FLOW (process) ---- */
.sl-flowh{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-top:34px;position:relative}
.sl-flowh::before{content:'';position:absolute;left:6%;right:6%;top:26px;height:2px;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 30%,var(--hair)))}
.sl-fnode{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:11px;padding:0 6px}
.sl-fdot{width:54px;height:54px;border-radius:50%;background:var(--surface);border:2px solid var(--accent);color:var(--accent);display:grid;place-items:center;font-family:var(--dk-mono);font-size:19px;font-weight:700;box-shadow:0 0 0 6px var(--bg-2)}
.sl-fnode.term .sl-fdot{background:var(--accent);color:var(--accent-ink)}
.sl-ftitle{font-size:clamp(13px,1.4vw,15.5px);font-weight:700;color:var(--ink);line-height:1.22}
.sl-fdesc{font-size:12px;color:var(--mute);line-height:1.4}
.sl-flowh-note{margin-top:30px;background:color-mix(in srgb,var(--accent) 9%,transparent);border:1px solid color-mix(in srgb,var(--accent) 28%,var(--hair));border-radius:12px;padding:14px 18px;font-size:clamp(13px,1.45vw,15.5px);color:var(--ink);line-height:1.5}
.sl-flowh-note .k{font-family:var(--dk-mono);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:5px}
/* vertical */
.sl-flowv{margin-top:20px;display:flex;flex-direction:column}
.sl-step{display:grid;grid-template-columns:54px 1fr;gap:20px;position:relative;padding-bottom:18px}
.sl-step:not(:last-child) .sl-step-spine::after{content:'';position:absolute;left:50%;top:46px;bottom:-2px;width:2px;background:color-mix(in srgb,var(--accent) 45%,var(--hair));transform:translateX(-50%)}
.sl-step-spine{position:relative}
.sl-step-dot{width:46px;height:46px;border-radius:13px;background:color-mix(in srgb,var(--accent) 16%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 40%,var(--hair));color:var(--accent);display:grid;place-items:center;font-family:var(--dk-mono);font-size:17px;font-weight:700}
.sl-step-body{padding-top:3px}
.sl-step-k{font-size:clamp(15px,1.6vw,18px);font-weight:800;color:var(--ink);letter-spacing:-.01em}
.sl-step-v{font-size:clamp(13px,1.45vw,15.5px);color:var(--sub);line-height:1.5;margin-top:5px}
.sl-step-v .ex{display:block;margin-top:6px;font-style:italic;color:var(--mute)}

/* ---- 6 · TIERS (pyramid) ---- */
.sl-tiers{display:grid;grid-template-columns:1fr 1.1fr;gap:38px;align-items:center;margin-top:10px}
.sl-pyramid{display:flex;flex-direction:column;align-items:center;gap:7px}
.sl-tier{height:clamp(46px,7vw,62px);border-radius:8px;display:grid;place-items:center;text-align:center;color:#04130e;font-weight:800;padding:0 14px;line-height:1.1;box-shadow:var(--sh)}
.sl-tier .tl{font-family:var(--dk-mono);font-size:11px;font-weight:700;opacity:.7;display:block}
.sl-tier .tn{font-size:clamp(12px,1.4vw,15px);font-weight:800}
.sl-legend{display:flex;flex-direction:column}
.sl-legend-row{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:11px 0;border-top:1px solid var(--hair);align-items:baseline}
.sl-legend-row:first-child{border-top:0}
.sl-legend-lv{font-family:var(--dk-mono);font-size:12px;font-weight:700;color:var(--accent);white-space:nowrap}
.sl-legend-tx{font-size:clamp(13px,1.45vw,15px);color:var(--sub);line-height:1.45}
.sl-legend-tx b{color:var(--ink);font-weight:700}

/* ---- 7 · FIGURE (stat hero) ---- */
.sl-figure{display:flex;align-items:center;gap:clamp(30px,5vw,64px);margin-top:14px;flex-wrap:wrap}
.sl-fig-hero{display:flex;flex-direction:column}
.sl-fig-num{font-size:clamp(66px,11vw,138px);font-weight:800;color:var(--accent);line-height:.86;letter-spacing:-.04em}
.sl-fig-lab{font-family:var(--dk-mono);font-size:clamp(12px,1.5vw,15px);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--sub);margin-top:14px;max-width:22ch;line-height:1.4}
.sl-fig-side{display:flex;flex-direction:column;gap:14px;min-width:200px;flex:1}
.sl-fig-stat{border-left:3px solid var(--accent);padding-left:16px}
.sl-fig-stat .v{font-size:clamp(24px,3vw,36px);font-weight:800;color:var(--ink);line-height:1}
.sl-fig-stat .l{font-size:13px;color:var(--mute);margin-top:5px;line-height:1.4}
.sl-fig-chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px;width:100%}
.sl-chip{font-family:var(--dk-mono);font-size:12px;font-weight:500;letter-spacing:.03em;color:var(--sub);background:var(--surface-2);border:1px solid var(--hair);border-radius:8px;padding:8px 13px}

/* ---- 8 · GRID (hierarchy cards) ---- */
.sl-cards{display:grid;gap:14px;margin-top:18px}
.sl-cards.c2{grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.sl-cards.c3{grid-template-columns:repeat(auto-fit,minmax(225px,1fr))}
.sl-cards.c4{grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}
.sl-gcard{position:relative;background:var(--surface-2);border:1px solid var(--hair);border-radius:14px;padding:17px 18px;overflow:hidden;transition:.15s}
.sl-gcard::before{content:'';position:absolute;left:0;top:0;width:34px;height:3px;background:var(--accent);border-radius:0 0 3px 0}
.sl-gcard:hover{border-color:var(--hair-2);transform:translateY(-2px)}
.sl-gnum{position:absolute;top:-8px;right:6px;font-family:var(--dk-mono);font-size:54px;font-weight:700;color:var(--ink);opacity:.05;line-height:1}
.sl-glabel{font-family:var(--dk-mono);font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--accent);margin-bottom:9px}
.sl-gtitle{font-size:clamp(14px,1.5vw,16.5px);font-weight:800;color:var(--ink);line-height:1.22;margin-bottom:7px;position:relative;z-index:1}
.sl-gdesc{font-size:12.5px;color:var(--mute);line-height:1.48;position:relative;z-index:1}
.sl-cards-note{margin-top:14px;background:color-mix(in srgb,var(--accent) 9%,transparent);border:1px solid color-mix(in srgb,var(--accent) 28%,var(--hair));border-radius:12px;padding:13px 17px;font-size:clamp(13px,1.4vw,15px);color:var(--ink);line-height:1.5}
.sl-cards-note .k{font-family:var(--dk-mono);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:4px}

/* ---- 9 · CASE (scenario + reveal) ---- */
.sl-case-scen{position:relative;background:color-mix(in srgb,var(--accent) 7%,var(--surface-2));border:1px solid var(--hair);border-left:3px solid var(--accent);border-radius:0 14px 14px 0;padding:18px 22px;margin-top:14px}
.sl-case-tag{font-family:var(--dk-mono);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.sl-case-body{font-size:clamp(14px,1.55vw,17px);color:var(--ink);line-height:1.55}
.sl-cqs{margin-top:16px;display:flex;flex-direction:column;gap:11px}
.sl-cq{border:1px solid var(--hair);border-radius:13px;overflow:hidden;background:var(--surface-2)}
.sl-cq-top{display:flex;gap:14px;align-items:flex-start;padding:15px 17px}
.sl-cq-tag{flex:none;font-family:var(--dk-mono);font-weight:700;font-size:13px;color:var(--accent);min-width:28px;padding-top:1px}
.sl-cq-q{flex:1;font-size:clamp(14px,1.5vw,16px);color:var(--ink);font-weight:600;line-height:1.42}
.sl-cq-btn{flex:none;align-self:center;font-family:var(--dk-mono);font-size:11.5px;font-weight:600;letter-spacing:.04em;color:var(--accent);background:none;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--hair));border-radius:8px;padding:7px 13px;cursor:pointer;transition:.14s}
.sl-cq-btn:hover{background:color-mix(in srgb,var(--accent) 13%,transparent)}
.sl-cq-a{display:none;border-top:1px solid var(--hair);padding:14px 17px;font-size:clamp(13px,1.45vw,15.5px);color:var(--sub);line-height:1.55;background:color-mix(in srgb,var(--good) 8%,var(--surface-2))}
.sl-cq.open .sl-cq-a{display:block;animation:dkfade .2s ease}
.sl-cq.open .sl-cq-btn{opacity:.4}

/* ---- 10 · RECAP (cheat sheet) ---- */
.sl-recap{columns:2;column-gap:34px;margin-top:16px}
.sl-recap.c3{columns:3}
.sl-recap-grp{break-inside:avoid;margin-bottom:18px}
.sl-recap-gh{font-family:var(--dk-mono);font-size:11px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--mute);padding-bottom:7px;border-bottom:1px solid var(--hair-2);margin-bottom:9px}
.sl-recap-row{padding:6px 0}
.sl-recap-t{font-family:var(--dk-mono);font-size:12.5px;font-weight:700;color:var(--accent);letter-spacing:.01em;overflow-wrap:anywhere;word-break:break-word}
.sl-recap-d{font-size:13px;color:var(--sub);line-height:1.4;margin-top:2px;overflow-wrap:anywhere;word-break:break-word}

/* ---- Bottom nav ---- */
.deck-foot{display:flex;align-items:center;gap:14px}
.deck-prog{flex:1;height:5px;background:var(--surface-2);border-radius:99px;overflow:hidden}
.deck-prog-bar{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:99px;transition:width .25s ease}
.deck-dots{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;margin-top:2px}
.deck-dot{width:7px;height:7px;border-radius:50%;background:var(--hair-2);cursor:pointer;transition:.14s;border:0;padding:0}
.deck-dot:hover{background:var(--mute)}
.deck-dot.on{background:var(--accent);transform:scale(1.3)}

/* ---- Present mode ---- */
body.deckpres .rail,body.deckpres .topbar{display:none!important}
body.deckpres .app{grid-template-columns:1fr!important}
body.deckpres .content{padding:16px 20px!important;max-width:100%!important}
body.deckpres .slide-stage{min-height:calc(100vh - 148px)}
body.deckpres .deck-name{max-width:62vw}

@media(max-width:820px){
  .sl-cover-grid,.sl-split-grid,.sl-tiers{grid-template-columns:1fr;gap:26px}
  .sl-outcomes{border-left:0;border-top:1px solid var(--hair-2);padding-left:0;padding-top:18px}
  .sl-duo,.sl-duo.three{grid-template-columns:1fr}
  .sl-flowh{flex-wrap:wrap;gap:16px}.sl-flowh::before{display:none}
  .sl-fact,.sl-fact.hot,.sl-fact.amber{grid-template-columns:96px 1fr;gap:13px}
  .sl-figure{flex-direction:column;align-items:stretch;gap:24px}
  .sl-fig-side{width:100%}
  .sl-recap,.sl-recap.c3{columns:1}
  .slide-stage{min-height:auto;padding:22px 20px}
}
/* universal anti-clip safety net — no text or box ever overflows its container */
.slide-stage,.slide-in{min-width:0}
.slide-in *{min-width:0}
.dk-display,.dk-lede,.sl-split-key,.sl-split-ess,.sl-stmt-big,.sl-stmt-gloss,.sl-pane-li li,.sl-pane-verb,.sl-pane-h,.sl-gtitle,.sl-gdesc,.sl-glabel,.sl-cq-q,.sl-cq-a,.sl-case-body,.sl-legend-tx,.sl-step-k,.sl-step-v,.sl-ftitle,.sl-fdesc,.sl-fig-lab,.sl-out,.sl-cover-essence,.sl-flowh-note,.sl-cards-note,.sl-pane-note,.dk-eyebrow,.sl-cover-eye{overflow-wrap:break-word;word-break:break-word}
.sl-cover h1,.sl-cover-essence{overflow-wrap:break-word}

/* ===================== BACKGROUND ART LAYER ===================== */
.slide-art{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;color:var(--accent)}
.slide-art svg{position:absolute;display:block;filter:drop-shadow(0 0 1px color-mix(in srgb,var(--accent) 28%,transparent))}
.slide-art.p-cover svg{right:-2%;bottom:-12%;width:40%;max-width:540px;opacity:.14}
.slide-art.p-right svg{right:-5%;top:50%;transform:translateY(-50%);width:36%;max-width:420px;opacity:.125}
.slide-art.p-br svg{right:-3%;bottom:-7%;width:34%;max-width:390px;opacity:.125}
.slide-art.p-bl svg{left:-5%;bottom:-8%;width:30%;max-width:350px;opacity:.105}
.slide-art.p-tr svg{right:-4%;top:-6%;width:32%;max-width:370px;opacity:.115}
.slide-art.p-figure svg{right:6%;top:50%;transform:translateY(-50%);width:30%;max-width:360px;opacity:.13}
.slide-art.faint svg{opacity:.07}
/* present mode: a touch more presence on the big canvas */
body.deckpres .slide-art svg{opacity:.145}
body.deckpres .slide-art.p-cover svg,body.deckpres .slide-art.p-figure svg{opacity:.16}
body.deckpres .slide-art.faint svg{opacity:.085}
/* narrow screens: don't hide — collapse every motif to one faint bottom-right
   corner that bleeds off-edge, so it's subtle texture, never behind body text */
@media(max-width:820px){
  .slide-art svg{right:-12%!important;bottom:-8%!important;left:auto!important;top:auto!important;
    transform:none!important;width:56%!important;max-width:300px!important;opacity:.07!important}
  .slide-art.faint svg{opacity:.05!important}
}

/* ===================== POLL / QUESTION SLIDES ===================== */
.sl-pollq{display:flex;flex-direction:column;justify-content:center;max-width:1180px;margin:0 auto;width:100%}
.sl-pollq-stem{font-size:clamp(20px,2.5vw,30px);font-weight:650;line-height:1.32;color:var(--ink);margin:14px 0 26px;letter-spacing:-.01em}
.sl-pollq-opts{display:flex;flex-direction:column;gap:12px}
.sl-poll-opt{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:var(--surface-2,#161b22);border:1.5px solid var(--hair,#23303a);border-radius:14px;padding:15px 18px;cursor:pointer;transition:border-color .15s,background .15s,transform .08s;color:var(--ink);font:inherit}
.sl-poll-opt:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--hair));background:color-mix(in srgb,var(--accent) 6%,var(--surface-2))}
.sl-poll-opt:active{transform:translateY(1px)}
.sl-poll-let{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font:600 14px/1 var(--dk-mono,monospace);color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}
.sl-poll-txt{flex:1;font-size:clamp(15px,1.5vw,19px);line-height:1.35}
.sl-poll-mark{flex:0 0 auto;width:22px;text-align:center;font-weight:700;opacity:0}
/* answered state */
.sl-pollq.answered .sl-poll-opt{cursor:default}
.sl-pollq.answered .sl-poll-opt:hover{background:var(--surface-2)}
.sl-poll-opt.correct{border-color:var(--good,#3fb950);background:color-mix(in srgb,var(--good,#3fb950) 13%,var(--surface-2))}
.sl-poll-opt.correct .sl-poll-let{color:var(--good,#3fb950);background:color-mix(in srgb,var(--good,#3fb950) 16%,transparent);border-color:color-mix(in srgb,var(--good,#3fb950) 40%,transparent)}
.sl-poll-opt.correct .sl-poll-mark{opacity:1;color:var(--good,#3fb950)}.sl-poll-opt.correct .sl-poll-mark::after{content:"\2713"}
.sl-poll-opt.wrong{border-color:rgba(150,160,172,.20);background:var(--surface-2)}
.sl-poll-opt.wrong .sl-poll-let{color:var(--sub);background:color-mix(in srgb,var(--sub) 12%,transparent);border-color:rgba(150,160,172,.28)}
.sl-poll-opt.wrong .sl-poll-mark{opacity:0}
.sl-pollq-reveal{max-height:0;overflow:hidden;opacity:0;transition:max-height .3s ease,opacity .3s ease,margin .3s ease;margin-top:0}
.sl-pollq.revealed .sl-pollq-reveal{max-height:340px;opacity:1;margin-top:20px}
.sl-pollq-ans{font-weight:700;font-size:clamp(15px,1.5vw,18px);color:var(--ink);margin-bottom:8px}
.sl-pollq-rat{font-size:clamp(13px,1.3vw,16px);line-height:1.5;color:var(--sub,#9aa7b2);border-left:3px solid color-mix(in srgb,var(--accent) 50%,transparent);padding-left:14px}
.sl-pollq-meta{margin-top:18px;font:500 12px/1.4 var(--dk-mono,monospace);letter-spacing:.06em;text-transform:uppercase;color:var(--mute,#6b7785)}
@media(max-width:820px){.sl-pollq-stem{margin:10px 0 18px}.sl-poll-opt{padding:13px 14px;gap:11px}.sl-pollq.revealed .sl-pollq-reveal{max-height:520px}}

/* ===== Fit-to-screen: lay each slide on a fixed 1280x720 canvas (slide + In-the-Lab bar together) and scale to fill any display ===== */
html{--deck-fit:1}
.deck-canvas{display:contents}
body.deckpres,body.poll-projector{overflow:hidden;background:var(--bg,#0b0e12)}
body.deckpres .content,body.poll-projector .content{padding:0!important;max-width:none!important;overflow:hidden}
.deckpres .deck-canvas{
  display:flex;flex-direction:column;
  position:fixed;top:50%;left:50%;
  width:1280px;min-height:720px;height:auto;margin:0;
  transform:translate(-50%,-50%) scale(var(--deck-fit,1));
  transform-origin:center center;overflow:hidden;
}
.deckpres .slide-stage{
  position:relative!important;flex:1 1 auto;min-height:0!important;
  width:auto!important;height:auto!important;max-width:none!important;margin:0!important;
  transform:none!important;border-radius:0;
}
.deckpres .deck-devbar{flex:0 0 auto;margin:14px 0 0}
.deckpres .deck-foot,.deckpres .deck-dots{display:none!important}
/* solo presenter keeps nav; projector hides deck-top via poll.css */
.deckpres .deck-top{display:none!important}
/* presenter/projector HUD: thin progress bar at the very top + slide number; hidden when a lab modal is open */
.deck-pres-hud{display:none}
body.deckpres .deck-pres-hud{display:block;position:fixed;left:0;right:0;top:0;z-index:60;pointer-events:none}
body.lab-open .deck-pres-hud{display:none!important}
.deck-pres-hud .dph-track{position:absolute;top:0;left:0;right:0;height:4px;background:rgba(255,255,255,.10);overflow:hidden}
.deck-pres-hud .dph-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));transition:width .25s ease}
.deck-pres-hud .dph-num{position:absolute;top:11px;left:20px;font-family:var(--dk-mono);font-size:12.5px;font-weight:600;letter-spacing:.06em;color:var(--sub);white-space:nowrap;opacity:.9;background:color-mix(in srgb,var(--bg,#070b0f) 65%,transparent);padding:3px 9px;border-radius:8px}

/* present-mode exit affordance (hidden on the projector, which stays in present) */
.deck-exitpres{display:none}
.deckpres .deck-exitpres{display:inline-flex;align-items:center;gap:6px;position:fixed;top:14px;right:16px;z-index:70;background:rgba(20,26,33,.82);color:var(--ink,#e9eef2);border:1px solid var(--hair,#222a33);border-radius:9px;padding:8px 13px;font:600 12px/1 var(--dk-mono,monospace);letter-spacing:.04em;cursor:pointer;backdrop-filter:blur(6px)}
.deckpres .deck-exitpres:hover{border-color:var(--accent,#24c9a0)}
.poll-projector .deck-exitpres{display:none!important}

/* ===================== LAB — Device Library ===================== */
.lab-searchwrap{position:relative;max-width:560px;margin:18px 0 26px}
.lab-searchic{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--mute);pointer-events:none}
#lab-q{width:100%;box-sizing:border-box;padding:13px 16px 13px 46px;font-size:15px;font-family:inherit;color:var(--ink);
  background:var(--surface);border:1px solid var(--hair-2);border-radius:var(--r);outline:none;transition:border-color .15s,box-shadow .15s}
#lab-q:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(36,201,160,.16)}
#lab-q::placeholder{color:var(--mute)}

.lab-sec{margin-bottom:30px}
.lab-sec-h{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--sub);margin:0 0 14px;padding-bottom:9px;border-bottom:1px solid var(--hair)}
.lab-sec-n{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:18px;padding:0 6px;border-radius:9px;
  background:var(--surface-2);color:var(--mute);font-size:11px;font-weight:700;letter-spacing:0}

.lab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}

.lab-card{display:flex;flex-direction:column;text-align:left;padding:0;overflow:hidden;cursor:pointer;
  background:var(--surface);border:1px solid var(--hair-2);border-radius:var(--r);box-shadow:var(--sh);
  transition:transform .14s,border-color .14s,box-shadow .14s;font-family:inherit}
.lab-card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--sh-lg)}
.lab-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.lab-img{position:relative;display:flex;align-items:center;justify-content:center;height:124px;
  background:linear-gradient(135deg,var(--surface-2),var(--bg-2));border-bottom:1px solid var(--hair)}
.lab-img-tok{font-family:var(--dk-mono);font-size:30px;font-weight:800;letter-spacing:.04em;color:var(--accent);opacity:.85}
.lab-img-tag{position:absolute;bottom:8px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:5px;
  font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--faint)}
.lab-img-tag svg{opacity:.7}

.lab-card-body{padding:13px 14px 15px}
.lab-card-name{font-size:14px;font-weight:700;color:var(--ink);line-height:1.32;margin-bottom:9px}
.lab-card-chips{display:flex;flex-wrap:wrap;gap:6px}
.lab-card-cat{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--mute)}

.lab-chip{display:inline-flex;align-items:baseline;gap:5px;padding:3px 8px;border-radius:7px;
  background:var(--surface-2);border:1px solid var(--hair);font-size:11px;color:var(--sub);line-height:1.3;overflow-wrap:anywhere}
.lab-chip b{font-family:var(--dk-mono);font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}

.lab-empty{padding:46px 20px;text-align:center;color:var(--mute);font-size:15px;
  background:var(--surface);border:1px dashed var(--hair-2);border-radius:var(--r)}

/* ---- device detail ---- */
.lab-detail{max-width:880px}
.lab-hero{display:grid;grid-template-columns:300px 1fr;gap:26px;align-items:stretch;margin-bottom:26px}
.lab-hero .lab-img-lg{height:100%;min-height:210px;border:1px solid var(--hair-2);border-bottom:1px solid var(--hair-2);border-radius:var(--r)}
.lab-img-lg .lab-img-tok{font-size:60px}
.lab-img-lg .lab-img-tag{bottom:12px}
.lab-hero-info{display:flex;flex-direction:column;justify-content:center}
.lab-cat-tag{align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--accent);background:rgba(36,201,160,.12);border:1px solid rgba(36,201,160,.28);padding:5px 11px;border-radius:8px;margin-bottom:14px}
.lab-dev-title{font-size:clamp(24px,4vw,34px);font-weight:800;letter-spacing:-.02em;color:var(--ink);margin:0 0 16px;line-height:1.1}
.lab-hero-chips{display:flex;flex-wrap:wrap;gap:8px}
.lab-hero-chips .lab-chip{font-size:12.5px;padding:5px 11px}
.lab-hero-chips .lab-chip b{font-size:10px}

.lab-block{margin-bottom:22px;padding-left:18px;border-left:3px solid var(--hair-2)}
.lab-block h3{font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--sub);margin:0 0 11px}
.lab-block.is-ind{border-left-color:var(--accent)}
.lab-block.is-ci{border-left-color:var(--warn)}
.lab-block.is-haz{border-left-color:var(--risk)}
.lab-block.is-key{border-left-color:var(--accent-2)}
.lab-list{list-style:none;margin:0;padding:0}
.lab-list li{position:relative;padding:7px 0 7px 18px;font-size:14px;line-height:1.55;color:var(--sub);
  border-bottom:1px solid var(--hair);overflow-wrap:anywhere}
.lab-list li:last-child{border-bottom:none}
.lab-list li::before{content:"";position:absolute;left:0;top:14px;width:6px;height:6px;border-radius:50%;background:var(--faint)}
.lab-block.is-ci .lab-list li::before{background:var(--warn)}
.lab-block.is-haz .lab-list li::before{background:var(--risk)}
.lab-block.is-ind .lab-list li::before{background:var(--accent)}

.lab-slides{display:flex;flex-wrap:wrap;gap:8px}
.lab-slide{font-family:var(--dk-mono);font-size:12px;color:var(--sub);background:var(--surface-2);
  border:1px solid var(--hair-2);border-radius:8px;padding:6px 11px;cursor:pointer;transition:border-color .14s,color .14s}
.lab-slide:hover{border-color:var(--accent);color:var(--accent)}

@media(max-width:760px){
  .lab-hero{grid-template-columns:1fr;gap:16px}
  .lab-hero .lab-img-lg{min-height:170px}
  .lab-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:11px}
  .lab-detail{max-width:100%}
}

/* ---- device bar under each lecture slide (visible in Present mode too) ---- */
.deck-devbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:10px 2px 0;padding:11px 14px;
  background:var(--surface);border:1px solid var(--hair-2);border-radius:12px;box-shadow:var(--sh)}
.deck-devbar-lab{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:var(--accent);white-space:nowrap}
.deck-devbar-lab svg{opacity:.9}
.deck-devbar-links{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.deck-devlink{display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-size:13px;font-weight:600;color:var(--ink);
  background:var(--surface-2);border:1px solid var(--hair-2);border-radius:9px;padding:6px 11px;cursor:pointer;
  transition:border-color .14s,color .14s,transform .14s}
.deck-devlink:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
.deck-devlink-go{color:var(--mute);font-weight:700;transition:color .14s}
.deck-devlink:hover .deck-devlink-go{color:var(--accent)}
@media(max-width:760px){
  .deck-devbar{margin-top:8px;padding:10px 12px}
  .deck-devlink{font-size:12px;padding:5px 10px}
}

/* ---- device modal (dive in from a slide without leaving it) ---- */
.lab-modal{max-width:900px;display:flex;flex-direction:column;max-height:calc(100vh - 44px)}
.lab-modal .modal-h{gap:10px}
.lab-modal .modal-b{overflow-y:auto;min-height:0}
.lab-modal-eye{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:var(--accent);white-space:nowrap}
.lab-modal-title{font-size:15px;font-weight:700;color:var(--ink);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lab-modal-x{flex:none;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--surface-2);border:1px solid var(--hair-2);border-radius:8px;color:var(--sub);font-size:14px;cursor:pointer;
  transition:border-color .14s,color .14s}
.lab-modal-x:hover{border-color:var(--risk);color:var(--risk)}
.lab-detail-modal{max-width:100%}
/* compact, CENTERED hero — small image so it doesn't eat vertical space */
.lab-hero-modal{display:flex;flex-direction:column;align-items:center;text-align:center;gap:11px;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--hair)}
.lab-hero-modal .lab-img-lg{width:100%;max-width:260px;height:132px;min-height:0}
.lab-img-lg .lab-img-tok{font-size:44px}
.lab-hero-modal .lab-img-tag{bottom:7px;font-size:9px}
.lab-hero-modal .lab-cat-tag{align-self:center;margin-bottom:0}
.lab-hero-modal .lab-hero-chips{justify-content:center}
/* two-column clinical sections */
.lab-modal-grid{column-count:2;column-gap:30px}
.lab-modal-grid .lab-block{break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;margin-bottom:16px}
.lab-modal-grid .lab-list li{padding:5px 0 5px 18px;line-height:1.5}
.lab-modal-grid .lab-list li::before{top:12px}
.lab-modal-foot{margin-top:4px;padding-top:14px;border-top:1px solid var(--hair)}
.lab-modal-open{font-family:inherit;font-size:13px;font-weight:600;color:var(--accent);background:rgba(36,201,160,.1);
  border:1px solid rgba(36,201,160,.3);border-radius:9px;padding:9px 14px;cursor:pointer;transition:background .14s}
.lab-modal-open:hover{background:rgba(36,201,160,.18)}
@media(max-width:720px){
  .lab-modal-grid{column-count:1}
}


/* ====== appended: present/deck-fit + live-poll UI from original ====== */

let repPreset='student',repAsms=new Set(),repFor=null;
let emailType='auto',emailFor=null;
let outTab='topics';
function repTitleSet(){if(!repFor)return;try{document.title='RC114_Report_'+repFor.replace(/[^A-Za-z0-9]+/g,'_')+'_'+repPreset+(repAsms.size?'_'+repAsms.size+'asms':'_Full')+'_'+new Date().toISOString().slice(0,10)}catch(e){}}
VIEWS.report=name=>{const s=D.roster.find(x=>x.name===name);if(!s){view.innerHTML='<div class="empty">Not found.</div>';return}setCrumbLabel('Report');repFor=name;repTitleSet();
  const presetBtns=Object.entries(REPORT_PRESETS).map(([k,p])=>`<button class="${repPreset===k?'on':''}" data-reppreset="${k}">${esc(p.label)}</button>`).join('');
  const chips=`<button class="repchip ${repAsms.size===0?'on':''}" data-repall>Whole term</button>`+(D.assessments||[]).map(a=>`<button class="repchip ${repAsms.has(a.name)?'on':''}" data-repasm="${esc(a.name)}">${esc(a.name)}</button>`).join('');
  view.innerHTML=`<style>${REPORT_CSS}</style>
   <div class="rep-toolbar no-print"><button class="btn-ghost" id="rep-back">\u2039 Back</button><div class="seg">${presetBtns}</div><label class="repcheck" style="margin:0 4px"><input type="checkbox" id="rep-items" checked><span>Include items</span></label><button class="btn-go" id="rep-dl">Download PDF</button></div>
   <div class="rep-scopebar no-print"><span class="rep-scopelab">Scope</span>${chips}</div>
   <div id="rep-preview" style="margin-top:12px;min-height:60vh;color:var(--faint)">Building preview\u2026</div>`;
  const O=()=>({preset:repPreset,asms:[...repAsms],names:[name],items:(document.getElementById('rep-items')||{checked:true}).checked});
  function preview(){const JS=jsPDFlib();const wrap=document.getElementById('rep-preview');if(!wrap)return;if(!JS){wrap.innerHTML='<div class="empty">PDF preview unavailable here \u2014 use Download PDF.</div>';return;}
    try{const doc=new JS({unit:'pt',format:'letter',compress:true});renderReportPDF(doc,name,O());const url=doc.output('bloburl');
      wrap.innerHTML='<iframe title="report preview" src="'+url+'" style="width:100%;height:78vh;border:1px solid var(--hair);border-radius:12px;background:#fff"></iframe>';}
    catch(e){wrap.innerHTML='<div class="empty">Could not render preview: '+esc(e.message)+'</div>';}}
  preview();
  const bk=document.getElementById('rep-back');if(bk)bk.onclick=back;
  const d=document.getElementById('rep-dl');if(d)d.onclick=()=>makeOnePDF(O(),d);
  const it=document.getElementById('rep-items');if(it)it.onchange=preview;};

VIEWS.email=name=>{const s=D.roster.find(x=>x.name===name);if(!s){view.innerHTML='<div class="empty">Not found.</div>';return}setCrumbLabel('Email');emailFor=name;
  const types=[['auto','Auto'],['remediation','Remediation'],['attendance','Attendance']];
  const segs=types.map(([k,l])=>`<button class="${emailType===k?'on':''}" data-emailtype="${k}">${esc(l)}</button>`).join('');
  const d=emailDraft(s,emailType);
  const autoNote=emailType==='auto'?`Auto-picked the <b>${esc(EMAIL_LABELS[d.resolved]||d.resolved)}</b> angle from ${esc(name.split(' ')[0])}'s data.`:'';
  view.innerHTML=`
   <div class="rep-toolbar no-print"><button class="btn-ghost" id="em-back">\u2039 Back</button><div class="seg">${segs}</div></div>
   <div class="emailcard">
     <div class="emhead"><div class="emhead-l"><span class="emto">To</span><span class="emname">${esc(s.name)}</span><span class="emchip" style="color:${COL(s.grade)};background:${band(s.grade).c}1f">${pc(s.grade)}% ${esc(s.letter||'')}</span></div><span class="emangle">${esc(EMAIL_LABELS[d.resolved]||'Email')}</span></div>
     <div class="embody">
       <div class="emrow"><label class="emlab">Subject</label><input id="em-subj" class="eminput" value="${esc(d.subject)}"></div>
       <div class="emrow"><label class="emlab">Message</label><textarea id="em-body" class="emarea" rows="18">${esc(d.body)}</textarea></div>
     </div>
     <div class="emactions"><button class="btn-go" id="em-copy">Copy</button><button class="btn-go ghosty" id="em-mail">Open in email</button>
       <span class="emhint">${autoNote} Edit anything before sending. Nothing leaves your device.</span></div>
   </div>`;
  const bk=document.getElementById('em-back');if(bk)bk.onclick=back;
  const subjEl=document.getElementById('em-subj'),bodyEl=document.getElementById('em-body');
  const cp=document.getElementById('em-copy');if(cp)cp.onclick=()=>{const txt='Subject: '+(subjEl.value||'')+'\n\n'+(bodyEl.value||'');
    const done=()=>{cp.childNodes[0].textContent='Copied';setTimeout(()=>{cp.childNodes[0].textContent='Copy'},1400)};
    if(navigator.clipboard&&navigator.clipboard.writeText){navigator.clipboard.writeText(txt).then(done,()=>{bodyEl.select();try{document.execCommand('copy')}catch(e){}done()})}
    else{bodyEl.select();try{document.execCommand('copy')}catch(e){}done()}};
  const ml=document.getElementById('em-mail');if(ml)ml.onclick=()=>{const u='mailto:?subject='+encodeURIComponent(subjEl.value||'')+'&body='+encodeURIComponent(bodyEl.value||'');try{window.location.href=u}catch(e){}};
};


/* ---- shared ---- */
function itemTable(items,title,cls,stats,showComp){if(!items.length)return card(chTitle(title),'<div class="empty">No items.</div>',cls);
  const cols=[
   {k:'id',label:'ID',def:'asc',sort:i=>i.id,cell:i=>`<span class="mono">${i.id}</span>`},
   {k:'stem',label:'Stem',sort:i=>i.stem,cell:i=>`<div class="stem">${esc(i.stem)}</div>`},
   {k:'egan',label:'Egan',sort:i=>String(i.egan_ch),cell:i=>String(i.egan_ch||'').split(',').map(x=>x.trim()).filter(Boolean).map(ch=>`<span class="tag link" data-go="eganDetail" data-arg="${ch}">${ch}</span>`).join(' ')||`<span class="tag">—</span>`},
   {k:'nbrc',label:'NBRC',sort:i=>i.nbrc,cell:i=>i.domain?`<span class="mono sm link" data-go="domainDetail" data-arg="${esc(i.domain)}">${esc(i.nbrc)}</span>`:`<span class="mono sm">${esc(i.nbrc)}</span>`},
   {k:'bloom',label:'Bloom',sort:i=>i.bloom,cell:i=>i.bloom?`<span class="tag link" data-go="bloomDetail" data-arg="${esc(i.bloom)}">${esc(i.bloom)}</span>`:`<span class="tag">${esc(i.bloom)}</span>`},
   {k:'diff',label:'Diff.',align:'r',sort:i=>i.difficulty,cell:i=>`<span class="mono" style="color:${COL(i.difficulty)}">${pc(i.difficulty)}</span>`},
   {k:'pb',label:'Pt-bis.',align:'r',sort:i=>i.point_biserial==null?-1:i.point_biserial,cell:i=>{const v=i.point_biserial,c=v==null?'var(--faint)':v<0.1?'var(--risk)':v<0.2?'var(--warn)':'var(--good)';return `<span class="mono" style="color:${c}">${v==null?'\u2014':v.toFixed(2)}</span>`}}];
  if(showComp)cols.splice(1,0,{k:'comp',label:'Assessment',def:'asc',sort:i=>i.component||'',cell:i=>`<span class="tag">${esc(i.component||'\u2014')}</span>`});
  if(stats)cols.push({k:'disc',label:'Disc.',align:'r',sort:i=>i.point_biserial,cell:i=>{const pb=i.point_biserial;return `<span class="mono" style="color:${pb==null?'var(--null)':pb<0.1?'var(--risk)':pb<0.2?'var(--warn)':'var(--good)'}">${pb==null?'—':pb.toFixed(2)}</span>`}});
  return card(chTitle(title,`${items.length} · tap a row`),dataTable('it_'+title.replace(/\W/g,''),cols,items,i=>['itemDetail',i.id]),cls)}
VIEWS.eganDetail=ch=>{ch=String(ch).trim();const items=D.items.filter(it=>String(it.egan_ch||'').split(',').map(x=>x.trim()).includes(ch)&&it.assessed);const title='Egan '+ch+(EGAN_TITLES[ch]?': '+EGAN_TITLES[ch]:'');setCrumbLabel('Egan '+ch);if(!items.length){view.innerHTML=`<div class="ph"><div><div class="eye">Egan chapter</div><h2>${esc(title)}</h2><div class="lede">No assessed items are mapped to this chapter yet.</div></div></div>`;return}const tot={},good={};items.forEach(it=>{const asm=it.component||it.assessment,miss=new Set(it.missed_by||[]),un=new Set(it.unanswered_by||[]);D.roster.forEach(st=>{if(st.scores&&st.scores[asm]!=null){tot[st.name]=(tot[st.name]||0)+1;if(!miss.has(st.name)&&!un.has(st.name))good[st.name]=(good[st.name]||0)+1}})});const studs=Object.keys(tot).map(nm=>({name:nm,pct:Math.round((good[nm]||0)/tot[nm]*100)}));const classPct=items.length?Math.round(items.reduce((a,it)=>a+(it.difficulty||0),0)/items.length):null;outcomeDetail(title,'Egan chapter \u00b7 where to reteach',classPct,items,studs);};
function outcomeDetail(title,sub,pct,items,studs){const below=studs.filter(s=>s.pct!=null&&s.pct<75).sort((a,b)=>a.pct-b.pct);
  view.innerHTML=`<div class="ph ph-split"><div><div class="eye">${esc(sub)}</div><h2>${esc(title)}</h2><div class="lede">${items.length} items · ${below.length} below mastery</div></div>${pct!=null?`<div class="bigscore"><div class="mono" style="color:${COL(pct)}">${pc(pct)}</div><span class="chip" style="background:${mband(pct).c}1a;color:${mband(pct).c}">${mband(pct).l}</span></div>`:''}</div>
   ${card(chTitle('Mastery distribution','how the cohort scored on this outcome · dashed = 75% mastery'),`<div class="pad">${distChart(studs.map(s=>s.pct),{passLine:75})}</div>`,'mb')}
   <div class="grid g2-13">${itemTable(items,'Mapped items')}
     ${card(chTitle('Below mastery',`${below.length} · tap to open`),below.length?`<div class="list scroll">${below.map(s=>`<div class="li rowlink" data-go="student" data-arg="${esc(s.name)}" tabindex="0"><div class="av sm" style="background:${avatarColor(s.name)}">${initials(s.name)}</div><div class="lg"><b>${esc(s.name)}</b></div><div class="cellbar" style="width:90px"><div class="bar"><i style="width:${s.pct}%;background:${COL(s.pct)}"></i></div><span class="mono" style="color:${COL(s.pct)}">${pc(s.pct)}</span></div></div>`).join('')}</div>`:'<div class="empty">All at or above mastery.</div>')}</div>`}
/* ===================== LIVE POLL UI ===================== */
/* status badge (host + student) */
#poll-badge{display:inline-flex;align-items:center;z-index:9000;margin:0 4px;white-space:nowrap;
  background:color-mix(in srgb,var(--accent) 16%,#0b0f14);color:var(--accent);
  border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);border-radius:999px;
  padding:5px 14px;font:600 11px/1 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase}

/* ---- host: live results painted onto the question options ---- */
.poll-host-zone{margin-top:22px}
.poll-go{width:100%;background:var(--accent);color:#04241c;border:none;border-radius:13px;
  padding:15px;font-weight:750;font-size:16px;cursor:pointer;letter-spacing:.01em}
.poll-go:hover{filter:brightness(1.07)}
.poll-hint{margin-top:10px;font-size:13px;color:var(--mute);text-align:center}
.sl-poll-opt.host-bar{position:relative;overflow:hidden}
.sl-poll-opt.host-bar::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--barw,0%);
  background:rgba(150,160,172,.30);transition:width .4s cubic-bezier(.4,0,.2,1);z-index:0}
.sl-poll-opt.host-bar>*{position:relative;z-index:1}
.sl-poll-opt.host-bar.correct::before{background:rgba(63,185,80,.34);background:color-mix(in srgb,var(--good,#3fb950) 34%,transparent)}
/* incorrect options stay neutral gray (no red) on instructor, presenter, and projector */
.poll-count{margin-left:auto;font:600 14px/1 'JetBrains Mono',monospace;color:var(--sub);white-space:nowrap}
.sl-poll-opt.correct .poll-count{color:var(--good,#3fb950)}
.poll-live-bar{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:20px;
  padding:16px 18px;background:var(--surface-2,#161b22);border:1px solid var(--hair,#23303a);border-radius:14px}
.poll-live-stat{font-size:14px;color:var(--sub);font-weight:500}
.poll-live-stat .n{font:750 26px/1 var(--dk-mono,monospace);color:var(--ink);margin-right:5px}
.poll-live-stat.correct .n{color:var(--good,#3fb950)}
.poll-live-key{font-size:13px;color:var(--sub);font-weight:600;letter-spacing:.02em;padding:5px 11px;border-radius:8px;
  border:1px dashed color-mix(in srgb,var(--good,#3fb950) 45%,transparent);background:color-mix(in srgb,var(--good,#3fb950) 8%,transparent)}
.poll-live-key b{color:var(--good,#3fb950);font:750 15px/1 var(--dk-mono,monospace);margin-left:3px}
.poll-live-actions{margin-left:auto;display:flex;gap:10px}
.poll-btn{background:var(--accent);color:#04241c;border:none;border-radius:10px;padding:10px 18px;font-weight:700;font-size:14px;cursor:pointer}
.poll-btn:hover{filter:brightness(1.07)}
.poll-btn.ghost{background:transparent;color:var(--sub);border:1px solid var(--hair)}
.poll-btn.ghost:hover{color:var(--ink);filter:none;border-color:var(--accent)}

/* ---- student: live-question overlay (bottom sheet on phones) ---- */
.poll-stu{position:fixed;inset:0;z-index:9500;display:flex;align-items:center;justify-content:center;
  background:#070b0f;transition:opacity .25s;padding:18px}
body.poll-student-only{overflow:hidden}
.poll-stu.hide{opacity:0;pointer-events:none}
.poll-stu-card{width:min(560px,100%);max-height:92vh;overflow:auto;background:#10151c;
  border:1px solid #1f2a33;border-radius:22px;
  padding:24px 20px calc(24px + env(safe-area-inset-bottom));box-shadow:0 -20px 60px rgba(0,0,0,.5)}
@media(min-width:620px){.poll-stu{align-items:center}.poll-stu-card{border-radius:22px}}
.poll-stu-eye{font:700 12px/1 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.poll-stu-stem{font-size:20px;font-weight:700;line-height:1.32;color:#e9eef2;margin-bottom:18px;letter-spacing:-.01em}
.poll-stu-opts{display:flex;flex-direction:column;gap:11px}
.poll-stu-opt{display:flex;align-items:center;gap:13px;width:100%;text-align:left;background:#0b0f14;
  border:1.5px solid #243039;border-radius:13px;padding:15px;color:#e9eef2;font:inherit;font-size:17px;cursor:pointer;transition:border-color .15s,background .15s;-webkit-tap-highlight-color:transparent}
@media (hover:hover){.poll-stu-opt:hover{border-color:color-mix(in srgb,var(--accent) 55%,#243039)}}
.poll-stu-opt.static{cursor:default}
.poll-stu-opt .l{flex:0 0 auto;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;
  font:700 14px/1 'JetBrains Mono',monospace;color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.poll-stu-opt.picked{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,#0b0f14)}
.poll-stu-opt.correct{border-color:var(--good,#3fb950);background:color-mix(in srgb,var(--good,#3fb950) 12%,#0b0f14)}
.poll-stu-opt.correct .l{color:var(--good,#3fb950);background:color-mix(in srgb,var(--good,#3fb950) 16%,transparent)}
.poll-stu-opt.wrong{border-color:var(--risk,#f15a48);background:color-mix(in srgb,var(--risk,#f15a48) 10%,#0b0f14)}
.poll-stu-opt.wrong .l{color:var(--risk,#f15a48);background:color-mix(in srgb,var(--risk,#f15a48) 14%,transparent)}
.poll-stu-foot{margin-top:16px;font-size:13px;color:var(--mute,#6b7785)}
/* waiting state */
.poll-stu-wait{text-align:center;padding-top:40px;padding-bottom:40px}
.poll-stu-dot{width:14px;height:14px;border-radius:50%;background:var(--accent);margin:18px auto 22px;
  box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 60%,transparent);animation:pollpulse 1.8s ease-out infinite}
@keyframes pollpulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent)}70%{box-shadow:0 0 0 16px transparent}100%{box-shadow:0 0 0 0 transparent}}
.poll-stu-waith{font-size:22px;font-weight:700;color:#e9eef2;letter-spacing:-.01em}
.poll-stu-waits{margin-top:8px;font-size:14px;color:var(--mute,#6b7785)}
/* rationale on reveal */
.poll-stu-rat{margin-top:16px;font-size:14px;line-height:1.5;color:#c4ccd4;background:#0b0f14;
  border:1px solid #1f2a33;border-left:3px solid var(--accent);border-radius:10px;padding:12px 14px}
.poll-stu-rat-h{display:block;font:700 11px/1 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:7px}

/* host: export session data button */
#poll-export{position:fixed;right:16px;bottom:16px;z-index:9001;background:var(--surface-2,#161b22);color:var(--ink,#e9eef2);border:1px solid var(--accent,#24c9a0);border-radius:11px;padding:11px 16px;font:600 13px/1 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.4)}
#poll-export:hover{background:color-mix(in srgb,var(--accent,#24c9a0) 14%,var(--surface-2,#161b22))}

/* ===================== INSTRUCTOR RESULTS PORTAL ===================== */
.pr-tools{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 24px}
.pr-empty{margin-top:30px;padding:40px;text-align:center;color:var(--mute,#6b7785);font-size:15px;line-height:1.7;background:var(--surface-2,#161b22);border:1px dashed var(--hair,#23303a);border-radius:16px}
.pr-empty b{color:var(--accent,#24c9a0)}
.pr-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:26px}
.pr-kpi{background:var(--surface-2,#161b22);border:1px solid var(--hair,#23303a);border-radius:14px;padding:18px 20px}
.pr-kpi .v{font:750 32px/1 var(--dk-mono,monospace);color:var(--ink,#e9eef2);letter-spacing:-.02em}
.pr-kpi .l{margin-top:6px;font-size:13px;color:var(--sub,#9aa7b2)}
.pr-sec-h{font:600 12px/1 var(--dk-mono,monospace);letter-spacing:.12em;text-transform:uppercase;color:var(--mute,#6b7785);margin:26px 0 14px}
.pr-doms{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.pr-dom{background:var(--surface-2,#161b22);border:1px solid var(--hair,#23303a);border-radius:12px;padding:13px 15px}
.pr-dom-top{display:flex;justify-content:space-between;font-size:13px;color:var(--sub,#9aa7b2);margin-bottom:8px}
.pr-dom-top span:first-child{color:var(--ink,#e9eef2);font-weight:600;font-family:var(--dk-mono,monospace)}
.pr-dom-bar{height:7px;border-radius:4px;background:var(--bg-2,#0b0f14);overflow:hidden}
.pr-dom-bar>div{height:100%;background:var(--accent,#24c9a0);border-radius:4px}
.pr-q{background:var(--surface-2,#161b22);border:1px solid var(--hair,#23303a);border-radius:16px;padding:20px 22px;margin-bottom:14px}
.pr-q-top{display:flex;gap:18px;align-items:flex-start;justify-content:space-between;margin-bottom:16px}
.pr-q-stem{font-size:17px;font-weight:650;line-height:1.4;color:var(--ink,#e9eef2)}
.pr-q-pct{flex:0 0 auto;text-align:center;font:750 24px/1 var(--dk-mono,monospace);color:var(--dk-amber,#eaa83e)}
.pr-q-pct.good{color:var(--good,#3fb950)} .pr-q-pct.low{color:var(--risk,#f15a48)}
.pr-q-pct span{display:block;font:500 10px/1 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--mute,#6b7785);margin-top:5px}
.pr-opts{display:flex;flex-direction:column;gap:8px}
.pr-opt{position:relative;display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;background:var(--bg-2,#0b0f14);border:1px solid var(--hair,#23303a);overflow:hidden}
.pr-opt-bar{position:absolute;inset:0 auto 0 0;background:rgba(36,201,160,.28);background:color-mix(in srgb,var(--accent,#24c9a0) 28%,transparent);transition:width .3s}
.pr-opt.correct{border-color:color-mix(in srgb,var(--good,#3fb950) 55%,transparent)}
.pr-opt.correct .pr-opt-bar{background:rgba(63,185,80,.30);background:color-mix(in srgb,var(--good,#3fb950) 30%,transparent)}
.pr-opt>span{position:relative;z-index:1}
.pr-opt-l{flex:0 0 auto;width:24px;height:24px;border-radius:6px;display:grid;place-items:center;font:700 12px/1 var(--dk-mono,monospace);color:var(--accent,#24c9a0);background:color-mix(in srgb,var(--accent,#24c9a0) 12%,transparent)}
.pr-opt.correct .pr-opt-l{color:var(--good,#3fb950);background:color-mix(in srgb,var(--good,#3fb950) 16%,transparent)}
.pr-opt-t{flex:1;font-size:14px;color:var(--ink,#e9eef2)}
.pr-opt-c{flex:0 0 auto;font:600 13px/1 var(--dk-mono,monospace);color:var(--sub,#9aa7b2)}
.pr-q-meta{margin-top:14px;font:500 11px/1.4 'JetBrains Mono',monospace;letter-spacing:.04em;text-transform:uppercase;color:var(--mute,#6b7785)}
@media(max-width:720px){.pr-summary{grid-template-columns:1fr}.pr-q-top{flex-direction:column;gap:10px}}

/* host: open-projector button */
#poll-projbtn{position:fixed;left:16px;bottom:16px;z-index:9001;background:var(--surface-2,#161b22);color:var(--ink,#e9eef2);border:1px solid var(--accent,#24c9a0);border-radius:11px;padding:11px 16px;font:600 13px/1 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.4)}
#poll-projbtn:hover{background:color-mix(in srgb,var(--accent,#24c9a0) 14%,var(--surface-2,#161b22))}

/* projector (class screen): clean — no controls, not interactive */
.poll-projector .deck-top,.poll-projector .deck-dots,.poll-projector .deck-foot,
.poll-projector #poll-badge,.poll-projector #poll-projbtn,.poll-projector #poll-export,.poll-projector #pr-nav-btn{display:none!important}
.poll-projector .sl-pollq [data-pollopt]{pointer-events:none;cursor:default}
/* projector slide-stage sizing handled by fit-to-screen canvas in deck.css */
.poll-projector .sl-pollq:not(.revealed) .sl-pollq-reveal{display:none}
.poll-projector .sl-pollq-ans{font-weight:700;color:var(--good,#3fb950);margin-bottom:10px}

/* present mode is a clean slide: hide control-view chrome (projector already hides these) */
body.deckpres #poll-projbtn,body.deckpres #poll-badge{display:none!important}
/* lab/device modals: larger and vertically centered */
body.lab-open .modal-bg{align-items:center!important;padding:24px 16px!important}
body.lab-open .modal.lab-modal{max-width:1120px!important;max-height:calc(100vh - 48px)!important}

#stu-gate{position:fixed;inset:0;z-index:99999;background:radial-gradient(1200px 700px at 70% -10%,rgba(36,201,160,.10),transparent),#0b0f14;display:flex;align-items:center;justify-content:center;font-family:Inter,system-ui,sans-serif}
#stu-gate.hide{opacity:0;pointer-events:none;transition:opacity .35s}
.stu-card{width:min(430px,90vw);background:#10151c;border:1px solid #1f2a33;border-radius:20px;padding:34px 30px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.stu-eye{font:600 12px/1 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#24c9a0;margin-bottom:14px}
.stu-h{font-size:25px;font-weight:750;color:#e9eef2;letter-spacing:-.02em;margin:0 0 6px}
.stu-sub{font-size:14px;color:#8a97a2;margin:0 0 22px;line-height:1.5}
.stu-seg{display:flex;gap:6px;background:#0b0f14;border:1px solid #243039;border-radius:12px;padding:4px;margin-bottom:16px}
.stu-seg-b{flex:1;background:transparent;border:none;border-radius:9px;padding:10px;color:#8a97a2;font:600 14px/1 Inter,system-ui,sans-serif;cursor:pointer;transition:background .15s,color .15s}
.stu-seg-b.on{background:#24c9a0;color:#04241c}
.stu-row{display:flex;gap:10px}
#stu-pw{flex:1;background:#0b0f14;border:1.5px solid #243039;border-radius:11px;padding:13px 14px;color:#e9eef2;font-size:16px;outline:none}
#stu-pw:focus{border-color:#24c9a0}
#stu-go{background:#24c9a0;color:#04241c;border:none;border-radius:11px;padding:0 24px;font-weight:700;font-size:15px;cursor:pointer}
#stu-go:hover{filter:brightness(1.07)}
.stu-err{color:#f15a48;font-size:13px;margin-top:12px;min-height:16px;font-weight:500}
.stu-foot{margin-top:18px;font:500 11px/1.5 'JetBrains Mono',monospace;color:#5b6772;letter-spacing:.04em}

/* back button on the full lab device page (instructor) */
.lab-back{ display:inline-flex; align-items:center; gap:6px; margin:0 0 16px; cursor:pointer;
  background:var(--surface); color:var(--sub); border:1px solid var(--hair-2); border-radius:10px;
  padding:8px 14px; font-size:13px; font-weight:600; }
.lab-back:hover{ color:var(--ink); border-color:var(--accent); }

/* instructor-only: mark the correct poll option before reveal (class added only in instructor flow; projector/student never get it) */
.sl-poll-opt.host-correct{ position:relative; border-color:var(--good,#3fb950)!important; box-shadow:inset 4px 0 0 var(--good,#3fb950); }
.sl-poll-opt.host-correct::after{ content:"\2713 ANSWER"; position:absolute; top:8px; right:12px;
  font:700 11px/1 'JetBrains Mono',monospace; letter-spacing:.12em; color:var(--good,#3fb950); }

/* larger slide-nav arrows; separate Next from Present to stop mis-taps */
.deck-btn[data-prev], .deck-btn[data-next]{ font-size:26px; line-height:1; font-weight:800;
  padding:8px 26px; min-width:74px; min-height:48px; justify-content:center; }
.deck-btn[data-present]{ margin-left:20px; }
@media (max-width:760px){
  .deck-top-r{ flex-wrap:wrap; row-gap:10px; }
  .deck-btn[data-prev], .deck-btn[data-next]{ padding:10px 28px; min-width:82px; min-height:54px; font-size:30px; }
  .deck-btn[data-present]{ margin-left:0; flex-basis:100%; justify-content:center; }
}

/* ── ECG question slides (ecgq) ─────────────────────────────────────── */
.sl-ecgq{display:flex;flex-direction:column;height:100%}
.sl-ecgq-strips{display:grid;grid-template-rows:1fr 1fr;gap:8px;flex:0 0 auto;height:min(46vh,420px);margin-bottom:14px}
.sl-ecgq-panel{position:relative;overflow:hidden;border-radius:10px;border:1px solid rgba(255,120,110,.18);box-shadow:0 8px 28px rgba(0,0,0,.25)}
.sl-ecgq-panel canvas{position:absolute;top:0;left:0;width:100%;height:100%;display:block}
.sl-ecgq-panel .ecg-ll{position:absolute;top:6px;left:9px;z-index:5;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:13px;font-weight:700;color:#a32820}
.sl-ecgq-controls{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.ecgq-sel-lbl{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ecgq-lead-sel{background:var(--card,#0e1c2a);border:1px solid rgba(255,255,255,.14);color:var(--ink,#e4eef6);border-radius:8px;padding:6px 10px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:13px;font-weight:600;cursor:pointer}
/* hide lead pickers + controls on projector/student (host-only) */
body.poll-projector .host-only,body.poll-student .host-only{display:none !important}
.sl-ecgq-clinical{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
.sl-ecgq-clinical>div{background:rgba(61,240,180,.05);border:1px solid rgba(61,240,180,.16);border-radius:12px;padding:13px 16px}
.sl-ecgq-clinical strong{display:block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#3df0b4;margin-bottom:6px}
.sl-ecgq-clinical p{margin:0;font-size:14.5px;line-height:1.5;color:var(--ink,#dde9f4)}
.ecgq-tx{border-color:rgba(224,82,82,.25)!important;background:rgba(224,82,82,.06)!important}
.ecgq-tx strong{color:#ff6b6b!important}
@media(min-width:900px){.sl-ecgq-clinical{grid-template-columns:1fr 1fr 1fr}}
.sl-ecgq.revealed .sl-pollq-reveal{max-height:none;opacity:1;margin-top:20px}

/* student phone: live ECG strip above options */
.stu-ecg-wrap{height:140px;border-radius:10px;overflow:hidden;border:1px solid rgba(255,120,110,.2);margin-bottom:14px;position:relative}
.stu-ecg-panel{position:absolute;inset:0}
.stu-ecg-panel canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.stu-ecg-panel .ecg-ll{position:absolute;top:5px;left:8px;z-index:5;font-family:ui-monospace,monospace;font-size:11px;font-weight:700;color:#a32820}
.poll-stu-clin{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.poll-stu-clin-row{background:rgba(61,240,180,.06);border:1px solid rgba(61,240,180,.16);border-radius:10px;padding:10px 13px}
.poll-stu-clin-row strong{display:block;font-family:ui-monospace,monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#3df0b4;margin-bottom:4px}
.poll-stu-clin-row p{margin:0;font-size:13px;line-height:1.45;color:#dde9f4}
.poll-stu-clin-row:first-child{background:rgba(224,82,82,.07);border-color:rgba(224,82,82,.22)}
.poll-stu-clin-row:first-child strong{color:#ff6b6b}

/* ── Analytics view ─────────────────────────────────────────────────── */
.an-wrap{max-width:1000px}
.an-loading,.an-empty{padding:60px 20px;text-align:center;color:var(--muted);font-size:15px}
.an-csv{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;font-weight:600;letter-spacing:.06em;
  color:#3df0b4;background:rgba(61,240,180,.08);border:1px solid rgba(61,240,180,.25);border-radius:9px;
  padding:8px 14px;text-decoration:none;cursor:pointer;white-space:nowrap;align-self:flex-start}
.an-csv:hover{background:rgba(61,240,180,.14)}
.an-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:4px 0 26px}
.an-card{background:var(--card,#0e1c2a);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:18px 16px}
.an-card-n{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:30px;font-weight:700;color:var(--ink,#e4eef6);line-height:1}
.an-card-l{font-size:12px;color:var(--muted);margin-top:7px;letter-spacing:.02em}
.an-sec{margin:0 0 26px}
.an-sec-h{font-size:16px;font-weight:700;color:var(--ink,#e4eef6);margin-bottom:3px}
.an-sec-sub{font-size:12.5px;color:var(--muted);margin-bottom:14px}
.an-2col{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.an-row{display:grid;grid-template-columns:minmax(0,1fr) 120px 48px;align-items:center;gap:14px;padding:7px 0}
.an-row-label{font-size:13.5px;color:var(--ink,#dde9f4);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.an-row-sub{display:block;font-size:11px;color:var(--muted);font-family:'JetBrains Mono',ui-monospace,monospace;letter-spacing:.02em;margin-top:2px;white-space:nowrap}
.an-row-track{height:8px;background:rgba(255,255,255,.07);border-radius:5px;overflow:hidden}
.an-row-fill{height:100%;border-radius:5px;transition:width .4s ease}
.an-row-fill.an-good{background:#3fb950}.an-row-fill.an-mid{background:#fbb830}.an-row-fill.an-weak{background:#e05252}
.an-row-pct{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:13px;font-weight:700;text-align:right}
.an-good{color:#3fb950}.an-mid{color:#fbb830}.an-weak{color:#e05252}
.an-q{display:flex;align-items:flex-start;gap:14px;background:var(--card,#0e1c2a);border:1px solid rgba(255,255,255,.07);
  border-left-width:3px;border-radius:10px;padding:13px 16px;margin-bottom:8px}
.an-q.an-good{border-left-color:#3fb950}.an-q.an-mid{border-left-color:#fbb830}.an-q.an-weak{border-left-color:#e05252}
.an-q-pct{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:18px;font-weight:700;min-width:50px}
.an-q-stem{font-size:14px;color:var(--ink,#e4eef6);line-height:1.4}
.an-q-meta{font-size:11.5px;color:var(--muted);font-family:'JetBrains Mono',ui-monospace,monospace;letter-spacing:.03em;margin-top:5px}
.an-q-dist{font-size:12.5px;color:#fbb830;margin-top:6px}
.an-sess{display:flex;align-items:center;gap:16px;width:100%;text-align:left;background:var(--card,#0e1c2a);
  border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:13px 16px;margin-bottom:8px;cursor:pointer;color:var(--ink,#e4eef6)}
.an-sess:hover{border-color:rgba(61,240,180,.3)}
.an-sess-date{font-weight:600;font-size:14px}
.an-sess-stats{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:13px;color:var(--muted)}
.an-sess-go{margin-left:auto;font-size:13px;color:#3df0b4;font-weight:600}
.an-foot{font-size:11.5px;color:var(--muted);text-align:center;padding:18px 0 8px;border-top:1px solid rgba(255,255,255,.05);margin-top:8px}
@media(max-width:760px){.an-cards{grid-template-columns:1fr 1fr}.an-2col{grid-template-columns:1fr;gap:0}
  .an-row{grid-template-columns:minmax(0,1fr) 70px 42px;gap:10px}.an-csv{align-self:flex-start}}

/* ── Analytics charts ───────────────────────────────────────────────── */
.an-top{display:grid;grid-template-columns:200px 1fr;gap:22px;margin:4px 0 28px;align-items:center}
.an-top-gauge{display:flex;justify-content:center}
.an-gauge-svg{width:170px;height:170px}
.an-gauge-arc{transition:stroke-dashoffset .9s cubic-bezier(.4,0,.2,1)}
.an-gauge-num{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:34px;font-weight:700;text-anchor:middle;dominant-baseline:middle}
.an-gauge-pct{font-size:16px}
.an-gauge-lbl{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;text-anchor:middle}
.an-cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.an-chart-wrap{width:100%;overflow-x:auto;margin-top:6px}
.an-chart{width:100%;min-width:300px;height:auto;display:block}
.an-axis{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;fill:var(--muted)}
.an-vbar{transition:height .7s cubic-bezier(.4,0,.2,1),y .7s cubic-bezier(.4,0,.2,1)}
.an-vval{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;font-weight:700}
.an-vlbl{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;fill:var(--ink,#dde9f4)}
.an-vsub{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;fill:var(--muted)}

/* answer distribution rows */
.an-qd{background:var(--card,#0e1c2a);border:1px solid rgba(255,255,255,.07);border-left-width:3px;border-radius:11px;padding:14px 16px;margin-bottom:10px}
.an-qd.an-good{border-left-color:#3fb950}.an-qd.an-mid{border-left-color:#fbb830}.an-qd.an-weak{border-left-color:#e05252}
.an-qd-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:12px}
.an-qd-pct{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:19px;font-weight:700;min-width:52px}
.an-good .an-qd-pct{color:#3fb950}.an-mid .an-qd-pct{color:#fbb830}.an-weak .an-qd-pct{color:#e05252}
.an-dist{display:flex;flex-direction:column;gap:7px;padding-left:2px}
.an-dist-row{display:grid;grid-template-columns:24px minmax(0,1.4fr) 2fr 38px;align-items:center;gap:10px}
.an-dist-let{width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:700;background:rgba(255,255,255,.06);color:var(--muted)}
.an-dist-let.ok{background:rgba(63,185,80,.18);color:#3fb950}
.an-dist-txt{font-size:13px;color:var(--ink,#dde9f4);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.an-dist-track{height:9px;background:rgba(255,255,255,.06);border-radius:5px;overflow:hidden}
.an-dist-fill{display:block;height:100%;border-radius:5px;transition:width .7s cubic-bezier(.4,0,.2,1)}
.an-dist-pct{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;font-weight:600;text-align:right;color:var(--muted)}

@media(max-width:760px){
  .an-top{grid-template-columns:1fr;gap:14px}
  .an-cards3{grid-template-columns:1fr 1fr}
  .an-dist-row{grid-template-columns:22px 1.2fr 1.6fr 34px;gap:7px}
  .an-dist-txt{font-size:12px}
}

/* ===== in-app deck ('in-deck'): fill the viewport vertically so slides don't collapse to a top band on large screens (present mode already scales via the 1280x720 fit canvas) ===== */
body.in-deck .slide-stage{min-height:calc(100vh - 210px);display:flex;flex-direction:column;justify-content:center}
@media(max-width:820px){ body.in-deck .slide-stage{min-height:auto;display:block} }

/* large-screen: scale content width up instead of a fixed 1340 column (fills big displays) */
@media(min-width:1700px){ .content{max-width:1560px} }
@media(min-width:2200px){ .content{max-width:1820px} }
@media(min-width:3000px){ .content{max-width:2060px} }
