/* OPTIC MM: assessment and admin application styles (light working surface, navy chrome). */
body.app{background:var(--paper);color:var(--slate-2);min-height:100vh;display:flex;flex-direction:column}
.app a{color:var(--royal-d);text-underline-offset:3px}
.app h1{font-size:clamp(1.6rem,3.4vw,2.2rem);color:var(--ink)}
.app h2{font-size:1.25rem;color:var(--ink)}
.app h3{font-size:1.05rem;color:var(--ink);letter-spacing:-.01em}
.app h4{font-size:.95rem;color:var(--ink);letter-spacing:0;margin-top:.6rem}
.lede{font-size:1.06rem;color:var(--slate);max-width:68ch}
.sub{color:var(--slate);font-size:.93rem;max-width:86ch;margin-top:.25rem}
.fine{font-size:.85rem;color:var(--slate)}
.kicker{font-size:.8rem;color:var(--royal-d);font-weight:500}
.meta{display:flex;flex-wrap:wrap;gap:.4rem .8rem;align-items:center;font-size:.86rem;color:var(--slate)}
.meta.small{font-size:.82rem}
.nowrap{white-space:nowrap}
.loading{padding:3rem 0;text-align:center;color:var(--slate)}
.form-err{color:var(--bad);font-weight:500;font-size:.92rem;min-height:0}
.form-err:empty{display:none}

/* chrome */
.appbar{background:var(--ink);color:#fff;display:flex;align-items:center;gap:1rem 1.6rem;flex-wrap:wrap;padding:.75rem var(--pad);position:sticky;top:0;z-index:50}
.appbar .brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:#fff}
.appbar .brand img{width:30px;height:30px}
.appbar .brand img.lockup{width:auto;height:28px}
.appbar .brand .name{font-family:var(--display);font-weight:700;letter-spacing:.12em;font-size:1rem}
.appbar .brand .name b{color:var(--swoosh)}
.appbar .brand .tagline{font-size:.78rem;color:var(--mist);border-left:1px solid var(--line-d);padding-left:.7rem;margin-left:.2rem}
.appbar nav{display:flex;gap:.3rem;flex-wrap:wrap}
.appbar nav a{color:var(--mist-2);text-decoration:none;font-size:.92rem;padding:.4rem .8rem;border-radius:999px}
.appbar nav a:hover{color:#fff;background:rgba(255,255,255,.07)}
.appbar nav a.on{color:#04121F;background:var(--swoosh);font-weight:600}
.appbar .right{margin-left:auto;display:flex;align-items:center;gap:.8rem;font-size:.88rem;color:var(--mist-2)}
.appbar .right .chip{margin-right:.3rem}
.app-main{width:100%;max-width:1240px;margin:0 auto;padding:clamp(1.2rem,3vw,2.2rem) var(--pad) 4rem;flex:1}
.app-main.slim{max-width:900px}
.app-foot{padding:1.2rem var(--pad);font-size:.8rem;color:var(--slate);border-top:1px solid var(--line-l);display:flex;gap:.4rem 1.2rem;flex-wrap:wrap;justify-content:space-between}

/* blocks */
.card{background:#fff;border:1px solid var(--line-l);border-radius:var(--r-m);padding:clamp(1.1rem,2.4vw,1.7rem);display:grid;gap:1rem;box-shadow:0 1px 2px rgba(8,19,32,.04)}
.card.narrow{max-width:520px;margin:clamp(1rem,6vh,4rem) auto 0}
.card.flush{padding:0;overflow:hidden}
.card.soft{background:transparent;box-shadow:none;border-style:dashed}
.card.empty{text-align:left;border-style:dashed;background:transparent;box-shadow:none}
.card.empty p{max-width:62ch}
.stack{display:grid;gap:1.1rem;min-width:0}
.stack.tight{gap:.6rem}
.grid2{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.grid3{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.actions{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.actions.spread{justify-content:space-between}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem}
.page-head h1 .chip{margin-left:.6rem;vertical-align:middle}
.crumb{font-size:.85rem;margin-bottom:.3rem}
.sec-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;flex-wrap:wrap}
.tabs{display:flex;gap:.2rem;border-bottom:1px solid var(--line-l);margin-bottom:1.3rem;overflow-x:auto;scrollbar-width:thin}
.tabs a{padding:.7rem 1rem;text-decoration:none;color:var(--slate);font-weight:500;font-size:.95rem;border-bottom:3px solid transparent;white-space:nowrap;margin-bottom:-1px}
.tabs a:hover{color:var(--ink)}
.tabs a.on{color:var(--ink);border-bottom-color:var(--swoosh);font-weight:600}
.tab-body{display:grid;gap:1.1rem;min-width:0}
.split{display:grid;gap:1.4rem;grid-template-columns:minmax(260px,400px) minmax(0,1fr);align-items:start}
.split.wide-left{grid-template-columns:minmax(280px,460px) minmax(0,1fr)}
@media (max-width:860px){.split,.split.wide-left{grid-template-columns:minmax(0,1fr)}}
details.more{border-top:1px solid var(--line-l);padding-top:.8rem}
details.more summary{cursor:pointer;font-weight:600;color:var(--royal-d);font-size:.93rem}
details.more[open] summary{margin-bottom:.6rem}
ul.plain{display:grid;gap:.45rem;font-size:.92rem}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:.35rem 1.2rem;font-size:.93rem}
.kv dt{color:var(--slate)} .kv dd{color:var(--ink)}
.quote{border-left:3px solid var(--line-l);padding:.2rem 0 .2rem .8rem;font-size:.93rem;white-space:pre-wrap}

/* tables */
.tbl-wrap{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.tbl-wrap.tall{max-height:560px;overflow-y:auto}
.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
.tbl th,.tbl td{padding:.55rem .7rem;text-align:left;border-bottom:1px solid var(--line-l);vertical-align:middle}
.tbl thead th{font-size:.78rem;font-weight:600;color:var(--slate);background:#FAFCFE;position:sticky;top:0;z-index:1;white-space:nowrap}
.tbl tbody th{font-weight:500;color:var(--ink)}
.tbl .num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.tbl .big{font-size:1.05rem;font-weight:500;color:var(--ink)}
.tbl .chip{margin-left:.45rem}
.tbl.compact th,.tbl.compact td{padding:.35rem .55rem}
.tbl tr.group th{background:var(--cloud);font-family:var(--display);font-weight:600;color:var(--ink)}
.tbl tr.group .group-meta{font-family:var(--mono);font-weight:400;font-size:.78rem;color:var(--slate);margin-left:.8rem}
.tbl tr.lim th{box-shadow:inset 3px 0 0 #C28B00}
.tbl tr.na td,.tbl tr.na th{color:var(--slate);font-style:italic}
.tbl tr.excluded td,.tbl tr.excluded th{opacity:.5}
.tbl tr.contested th{box-shadow:inset 3px 0 0 var(--bad)}
.tbl tr.fires th{box-shadow:inset 3px 0 0 var(--bad)}
.tbl tr.lead th,.tbl tr.lead td{background:#F2F9FE}
.tbl .wide{min-width:220px}
.tbl .row-actions{white-space:nowrap;text-align:right}
.tbl .row-actions .btn+.btn{margin-left:.3rem}
.pk{display:inline-grid;place-items:center;width:1.55rem;height:1.55rem;border-radius:6px;background:var(--ink);color:#fff;font-size:.82rem;font-weight:500;margin-right:.55rem}
.pk.big{width:2.2rem;height:2.2rem;font-size:1.1rem;border-radius:8px}
.skipn{color:var(--slate);font-size:.75rem}
.tbl.dims .trk{width:230px;min-width:190px;padding-block:.2rem}
.tbl.dims .dst{min-width:150px;width:200px}
.tbl.dims thead .trk{padding-block:.2rem}
.flag-q{display:block;font-weight:400;font-size:.84rem;color:var(--slate);max-width:52ch;margin-top:.15rem}
.assessor{white-space:normal!important;max-width:9rem;line-height:1.25}
.fl.yes{color:var(--bad);font-weight:600} .fl.no{color:var(--ok)} .fl.unsure{color:var(--warn)}

/* level and gap encodings */
.hm{text-align:center!important;font-family:var(--mono);font-weight:500;min-width:2.4rem}
.hm.l1{background:var(--seq-1);color:#0B2A52} .hm.l2{background:var(--seq-2);color:#0B2A52} .hm.l3{background:var(--seq-3);color:#fff} .hm.l4{background:var(--seq-4);color:#fff} .hm.l5{background:var(--seq-5);color:#fff}
.hm.na{color:var(--slate);background:#F3F6FA}
span.hm{display:inline-grid;place-items:center;width:1.9rem;height:1.9rem;border-radius:6px;margin-right:.5rem}
.tbl.heat td.hm{border:2px solid #fff}
.hm-n{display:block;font-weight:400;font-size:.7rem;color:var(--slate)}
.tbl td.hot{color:var(--bad);font-weight:600}
.scale{display:flex;align-items:center;gap:.25rem;font-size:.8rem;color:var(--slate)}
.scale .hm{display:inline-grid;place-items:center;width:1.7rem;height:1.5rem;border-radius:4px;min-width:0}
.scale span:first-child{margin-right:.4rem} .scale span:last-child{margin-left:.4rem}
.gapchip{display:inline-block;font-family:var(--mono);font-size:.76rem;font-weight:500;padding:.18rem .5rem;border-radius:5px;white-space:nowrap}
.gapchip.n3{background:var(--gap-n3);color:#fff} .gapchip.n2{background:var(--gap-n2);color:#fff} .gapchip.n1{background:var(--gap-n1);color:#5A1C0C}
.gapchip.z{background:var(--gap-0);color:var(--slate-2)} .gapchip.p1{background:var(--gap-p1);color:#0B2A52} .gapchip.p2{background:var(--gap-p2);color:#fff} .gapchip.na{color:var(--slate)}
.mv.up{color:var(--ok);font-weight:600} .mv.down{color:var(--bad);font-weight:600}
.role{font-family:var(--mono);font-size:.78rem;font-weight:500;padding:.2rem .6rem;border-radius:999px;background:#EEF2F6;color:var(--slate-2)}
.role.lead{background:var(--ink);color:#fff} .role.support{background:#E0F4FC;color:#075E80} .role.simplify{background:var(--warn-bg);color:var(--warn)}

/* charts */
.viz{display:grid;gap:.5rem;justify-items:center;min-width:0}
.viz-radar{width:100%;max-width:440px;height:auto;overflow:visible}
.rd-ring{fill:none;stroke:#DCE5F0;stroke-width:1} .rd-ring.outer{stroke:#C3D0E0}
.rd-spoke{stroke:#DCE5F0;stroke-width:1} .rd-spoke.major{stroke:#B4C3D6}
.rd-axis{font-family:var(--mono);font-size:15px;font-weight:500;fill:var(--ink)} .rd-axis.small{font-size:10.5px;font-weight:400;fill:var(--slate)} .rd-axis.mark{font-weight:700;fill:#8A5A00}
.rd-tick{font-family:var(--mono);font-size:9.5px;fill:#8FA0B6}
.rd-area{fill:var(--viz-level);fill-opacity:.16;stroke:var(--viz-level);stroke-width:2.5;stroke-linejoin:round}
.rd-target{fill:none;stroke:var(--viz-target);stroke-width:2;stroke-dasharray:7 5;stroke-linejoin:round}
.rd-next{fill:none;stroke:var(--viz-next);stroke-width:1.8;stroke-dasharray:2 5;stroke-linecap:round;stroke-linejoin:round}
.rd-line{fill:none;stroke-width:2;stroke-linejoin:round}
.rd-dot{fill:var(--viz-level);stroke:#fff;stroke-width:2;cursor:default}
.viz-legend{display:flex;flex-wrap:wrap;gap:.35rem 1.1rem;font-size:.82rem;color:var(--slate-2);justify-content:center}
.viz-legend li{display:flex;align-items:center;gap:.45rem}
.viz-legend .sw{--sw:var(--viz-level);width:22px;height:0;border-top:3px solid var(--sw);flex:none}
.viz-legend .sw.area{height:11px;border:2px solid var(--sw);background:color-mix(in srgb,var(--sw) 18%,transparent);border-radius:3px;width:16px}
.viz-legend .sw.target{border-top:2px dashed var(--viz-target)}
.viz-legend .sw.next{border-top:2px dotted var(--viz-next)}
.viz-legend .sw.none{display:none}
.viz-legend .sw.dot-rapid{width:11px;height:11px;border:2.5px solid var(--viz-level);border-radius:50%;background:#fff}
.viz-legend .sw.dot-deep{width:11px;height:11px;border:0;border-radius:2px;background:var(--ink)}
.viz-track{width:100%;max-width:230px;height:auto;display:block}
.tk-base{stroke:#D4DEEA;stroke-width:1} .tk-tick{stroke:#B9C7D8;stroke-width:1}
.tk-range{stroke:#A9C6EC;stroke-width:6;stroke-linecap:round;opacity:.55}
.tk-gap{stroke-width:2.5} .tk-gap.below{stroke:var(--gap-n2)} .tk-gap.above{stroke:var(--gap-p2)}
.tk-target{stroke:var(--viz-target);stroke-width:2.5}
.tk-mean{fill:#fff;stroke:var(--viz-level);stroke-width:1.6}
.tk-level{fill:var(--viz-level);stroke:#fff;stroke-width:2}
.tk-lab{font-family:var(--mono);font-size:9px;fill:var(--slate)}
.viz-dist{display:flex;gap:2px;height:22px;border-radius:5px;overflow:hidden;min-width:120px}
.viz-dist .ds{display:grid;place-items:center;font-family:var(--mono);font-size:.7rem;min-width:3px;flex-basis:0}
.viz-dist .ds:first-child{border-radius:4px 0 0 4px} .viz-dist .ds:last-child{border-radius:0 4px 4px 0}
.viz-dist .l1{background:var(--seq-1);color:#0B2A52} .viz-dist .l2{background:var(--seq-2);color:#0B2A52} .viz-dist .l3{background:var(--seq-3);color:#fff} .viz-dist .l4{background:var(--seq-4);color:#fff} .viz-dist .l5{background:var(--seq-5);color:#fff}
.viz-dist .empty{font-size:.78rem;color:var(--slate)}
.viz-dist.mini{display:inline-flex;width:110px;min-width:110px;height:16px;vertical-align:middle;margin-right:.6rem}
.viz-trend{width:100%;height:auto;overflow:visible}
.tr-grid{stroke:#E4EBF3;stroke-width:1}
.tr-lab{font-family:var(--mono);font-size:10px;fill:var(--slate)} .tr-lab.strong{fill:var(--viz-target)}
.tr-target{stroke:var(--viz-target);stroke-width:1.5;stroke-dasharray:6 4}
.tr-line{fill:none;stroke:var(--viz-level);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.tr-line.deep{stroke:var(--ink);stroke-width:1.5}
.tr-dot.rapid{fill:#fff;stroke:var(--viz-level);stroke-width:2.5}
.tr-dot.deep{fill:var(--ink);stroke:#fff;stroke-width:2}
.tr-val{font-family:var(--mono);font-size:11px;font-weight:500;fill:var(--ink)}
.viz-tip{position:fixed;z-index:400;pointer-events:none;background:var(--ink);color:#fff;font-size:.8rem;line-height:1.4;padding:.45rem .65rem;border-radius:7px;max-width:300px;opacity:0;transition:opacity .12s;box-shadow:var(--shadow-1)}
.viz-tip.show{opacity:1}
.keybox{background:#FAFCFE;border:1px solid var(--line-l);border-radius:var(--r-s);padding:1rem;display:grid;gap:.6rem;align-self:start}
ul.key{display:grid;gap:.5rem;font-size:.86rem}
ul.key li{display:flex;align-items:center}
.k-dot,.k-ring,.k-bar,.k-tick{flex:none;margin-right:.7rem;display:inline-block}
.k-dot{width:13px;height:13px;border-radius:50%;background:var(--viz-level)}
.k-ring{width:9px;height:9px;border-radius:50%;border:1.6px solid var(--viz-level);margin-left:2px;margin-right:.85rem}
.k-bar{width:22px;height:6px;border-radius:3px;background:#A9C6EC;opacity:.7}
.k-tick{width:3px;height:16px;background:var(--viz-target);margin-left:5px;margin-right:1rem}

/* tiles */
.tiles{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.tile{background:#fff;border:1px solid var(--line-l);border-radius:var(--r-m);padding:1rem 1.1rem;display:grid;gap:.1rem}
.tile-v{font-family:var(--display);font-size:1.75rem;font-weight:600;color:var(--ink);line-height:1.15}
.tile-l{font-weight:600;color:var(--ink);font-size:.92rem}
.tile-s{font-size:.82rem;color:var(--slate)}
.tile.alert{border-color:#E3B4AD;background:#FFF8F7} .tile.alert .tile-v{color:var(--bad)}

/* toolbar and filters */
.toolbar{display:flex;flex-wrap:wrap;gap:.8rem 1.2rem;align-items:flex-end;background:#fff;border:1px solid var(--line-l);border-radius:var(--r-m);padding:.8rem 1rem}
.toolbar>.actions{margin-left:auto}
.toolbar .roundpick{min-width:min(100%,280px)}
.filterbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
details.filter{position:relative}
details.filter summary{list-style:none;cursor:pointer;border:1px solid #B9C8DB;border-radius:999px;padding:.42rem .85rem;font-size:.88rem;background:#fff;display:flex;gap:.5rem;align-items:center;user-select:none}
details.filter summary::-webkit-details-marker{display:none}
details.filter.on summary{border-color:var(--royal);background:#EDF4FD;color:var(--royal-d);font-weight:600}
.f-count{font-family:var(--mono);font-size:.75rem;color:var(--slate)}
details.filter .pop{position:absolute;top:calc(100% + 6px);left:0;z-index:30;background:#fff;border:1px solid var(--line-l);border-radius:var(--r-s);box-shadow:var(--shadow-1);padding:.8rem;display:grid;gap:.5rem;min-width:240px;max-height:320px;overflow:auto}
.f-n{color:var(--slate)}
.select.compact,.input.compact{padding:.4rem .6rem;font-size:.88rem;width:auto;min-width:6.5rem}
.select.compact{padding-right:1.9rem}
.input.compact{width:100%}
.slice-note{font-size:.9rem;color:var(--slate-2)}
.seg{display:inline-flex;justify-self:start;flex-wrap:wrap;border:1px solid #B9C8DB;border-radius:10px;overflow:hidden;background:#fff}
.seg-o{position:relative;cursor:pointer;font-size:.9rem}
.seg-o input{position:absolute;opacity:0;inset:0;cursor:pointer}
.seg-o span{display:block;padding:.55rem .9rem;border-right:1px solid var(--line-l)}
.seg-o:last-child span{border-right:0}
.seg-o input:checked+span{background:var(--ink);color:#fff}
.seg-o input:focus-visible+span{outline:3px solid var(--swoosh);outline-offset:-3px}
.seg-o input:disabled+span{opacity:.55;cursor:not-allowed}
.seg.small .seg-o span{padding:.38rem .75rem;font-size:.85rem}
.inline-fields{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;font-size:.92rem}

/* rounds */
.round-main{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.round-n{text-align:right;display:grid;font-size:.82rem;color:var(--slate)}
.round-n .big{font-size:1.9rem;color:var(--ink);line-height:1}
.codebox{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;background:var(--cloud);border-radius:var(--r-s);padding:.8rem 1rem}
.codebox .lab{display:block;font-size:.76rem;color:var(--slate)}
.codebox .code{font-size:1.45rem;font-weight:500;color:var(--ink);letter-spacing:.06em}
.code-hero{font-size:clamp(1.8rem,6vw,2.6rem);font-weight:500;letter-spacing:.08em;color:var(--ink);text-align:center;background:var(--cloud);border-radius:var(--r-m);padding:1rem}
.textarea.tall{min-height:17rem;font-size:.85rem}
.textarea.list{min-height:9rem}
.tmp-preview{display:grid;gap:1.2rem;grid-template-columns:minmax(220px,330px) minmax(0,1fr);align-items:center}
@media (max-width:760px){.tmp-preview{grid-template-columns:minmax(0,1fr)}}
.dim-targets{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr))}
.dt-col{display:grid;gap:.4rem;align-content:start}
.dt-row{display:flex;justify-content:space-between;align-items:center;gap:.6rem;font-size:.86rem}
.sticky-foot{position:sticky;bottom:0;background:linear-gradient(180deg,rgba(245,248,252,0),var(--paper) 35%);padding:1.2rem 0 .8rem}
.lead-head{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.card.lead.done{opacity:.6}
.msg{white-space:pre-wrap;font-size:.95rem}
.leadbox{background:var(--ink);color:#fff;border-radius:var(--r-m);padding:1.1rem 1.3rem;display:grid;gap:.3rem}
.leadbox h3{color:#fff;font-size:1.2rem} .leadbox p{color:var(--mist-2);font-size:.92rem;max-width:90ch}
.leadbox .lead-k{color:var(--swoosh);font-size:.76rem}
.trend-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr))}
.trend-card{border:1px solid var(--line-l);border-radius:var(--r-m);padding:.9rem 1rem;display:grid;gap:.4rem;background:#fff;align-content:start}
.trend-card.on{border-color:var(--royal);box-shadow:0 0 0 2px rgba(44,114,201,.18)}
.trend-card header{display:flex;gap:.2rem;align-items:center}
.trend-card .linkbtn{font-size:.82rem;justify-self:start}
.comments{display:grid;gap:.9rem}
.comments li{display:grid;gap:.25rem;justify-items:start;border-bottom:1px solid var(--line-l);padding-bottom:.8rem}
.export-item{display:flex;justify-content:space-between;gap:1rem;align-items:center;border-bottom:1px solid var(--line-l);padding:.8rem 0}
.export-item p{font-size:.88rem;color:var(--slate);max-width:60ch}
.export-item h4{margin:0}
.anchors{list-style:decimal;padding-left:1.4rem;display:grid;gap:.35rem;font-size:.88rem}
.ev-item{border:1px solid var(--line-l);border-radius:var(--r-s);padding:.7rem .9rem;font-size:.92rem}
.ev-head{display:flex;align-items:center;margin-bottom:.3rem}

/* modal and toast */
.modal-back{position:fixed;inset:0;z-index:200;background:rgba(8,19,32,.55);display:grid;place-items:start center;padding:5vh 1rem;overflow:auto}
.modal{background:#fff;border-radius:var(--r-m);width:min(100%,520px);box-shadow:var(--shadow-2);display:grid}
.modal.wide{width:min(100%,820px)}
.modal-head{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.3rem;border-bottom:1px solid var(--line-l)}
.modal-x{background:none;border:0;font-size:1.6rem;line-height:1;cursor:pointer;color:var(--slate);padding:.1rem .4rem;border-radius:6px}
.modal-body{padding:1.2rem 1.3rem;display:grid;gap:1rem;min-width:0}
.modal-foot{display:flex;justify-content:flex-end;gap:.6rem;flex-wrap:wrap;padding:.9rem 1.3rem;border-top:1px solid var(--line-l);background:#FAFCFE;border-radius:0 0 var(--r-m) var(--r-m)}
.toast{position:fixed;left:50%;bottom:1.4rem;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:.7rem 1.1rem;border-radius:10px;font-size:.92rem;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:500;max-width:calc(100vw - 2rem);box-shadow:var(--shadow-2)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast.ok{background:#0B5C2E} .toast.bad{background:#8E2D20}

/* ---------- assessment ---------- */
.code-input{font-size:1.5rem;letter-spacing:.08em;text-align:center;text-transform:uppercase;padding-block:.9rem}
.stepper-wrap{position:sticky;top:3.3rem;z-index:20;background:var(--paper);padding:.7rem 0 .5rem;margin-bottom:1rem;display:grid;gap:.45rem}
.stepper{display:flex;gap:.35rem;overflow-x:auto;scrollbar-width:none}
.stepper::-webkit-scrollbar{display:none}
.st{flex:1 0 auto;border:1px solid #B9C8DB;background:#fff;border-radius:999px;padding:.4rem .85rem;cursor:pointer;color:var(--slate-2);font-size:.85rem;min-width:2.6rem}
.st.done{background:#E3F4EA;border-color:#9FD3B4;color:#0A4F28}
.st.done .st-k::after{content:" \2713"}
.st.cur{background:var(--ink);border-color:var(--ink);color:#fff}
.prog{height:4px;background:#DCE5F0;border-radius:2px;overflow:hidden}
.prog-bar{height:100%;background:var(--swoosh);transition:width .3s var(--ease)}
.prog-txt{font-size:.74rem;color:var(--slate)}
.howto{display:grid;gap:.6rem}
.how-list{list-style:decimal;padding-left:1.3rem;display:grid;gap:.45rem}
.pillar{display:grid;gap:1.1rem}
.pillar-head{display:flex;gap:1rem;align-items:center}
.pillar-k{font-family:var(--display);font-weight:700;font-size:clamp(3rem,9vw,4.6rem);line-height:.9;color:var(--swoosh);flex:none;width:1.1em;text-align:center}
.pillar-k.flag{color:var(--bad)}
.remind{font-size:.9rem;background:var(--cloud);border-radius:var(--r-s);padding:.6rem .9rem;color:var(--slate-2)}
fieldset.dim{border:1px solid var(--line-l);border-radius:var(--r-m);background:#fff;padding:1.1rem clamp(.9rem,2.4vw,1.4rem) 1.2rem;margin:0;min-width:0;display:grid;gap:.9rem}
fieldset.dim legend{font-family:var(--display);font-weight:600;font-size:1.08rem;color:var(--ink);padding:0 .5rem;margin-left:-.5rem;line-height:1.3}
fieldset.dim.answered{border-color:#9FD3B4}
fieldset.dim.flagq legend{font-family:var(--body);font-weight:500;font-size:1rem}
.dim-c{display:inline-block;background:var(--ink);color:#fff;border-radius:6px;padding:.1rem .45rem;font-size:.8rem;font-weight:500;margin-right:.55rem;vertical-align:.1em}
.ladder{display:grid;gap:.45rem}
.rung{display:grid;grid-template-columns:auto auto 1fr;gap:.2rem .75rem;align-items:start;border:1px solid var(--line-l);border-radius:10px;padding:.7rem .85rem;cursor:pointer;transition:border-color .15s,background .15s}
.rung:hover{border-color:#8FA5C0}
.rung input{margin-top:.28rem;width:1.05rem;height:1.05rem;accent-color:var(--royal)}
.rung-n{display:grid;place-items:center;width:1.6rem;height:1.6rem;border-radius:6px;background:var(--cloud);color:var(--ink);font-weight:500;font-size:.86rem}
.rung-t{display:grid;gap:.1rem}
.rung-l{font-size:.78rem;font-weight:600;color:var(--slate)}
.rung-d{font-size:.96rem;color:var(--ink);line-height:1.5}
.rung.sel{border-color:var(--royal);background:#EFF6FE;box-shadow:inset 3px 0 0 var(--royal)}
.rung.sel .rung-n{background:var(--royal);color:#fff}
.rung.cant{border-style:dashed}
.rung.cant .rung-d{color:var(--slate);font-size:.88rem}
.evidence{border-top:1px dashed var(--line-l);padding-top:.9rem}
.yn{display:flex;flex-wrap:wrap;gap:.5rem}
.yn-o{border:1px solid #B9C8DB;border-radius:999px;padding:.5rem 1rem;cursor:pointer;display:flex;gap:.5rem;align-items:center;font-size:.93rem}
.yn-o input{accent-color:var(--royal)}
.yn-o.sel{border-color:var(--royal);background:#EFF6FE;font-weight:600}
.yn-o.yes.sel{border-color:var(--bad);background:var(--bad-bg);color:#6E2219}
.flag-group{margin-top:.6rem}
.review-grid{display:grid;gap:.5rem}
.review-row{display:grid;grid-template-columns:minmax(120px,210px) 1fr;gap:.8rem;align-items:center}
@media (max-width:560px){.review-row{grid-template-columns:1fr}}
.rv-cells{display:flex;flex-wrap:wrap;gap:.35rem}
.rv{font-size:.8rem;border-radius:6px;padding:.2rem .5rem;background:#EEF2F6;color:var(--slate-2)}
.rv.l1{background:var(--seq-1);color:#0B2A52} .rv.l2{background:var(--seq-2);color:#0B2A52} .rv.l3{background:var(--seq-3);color:#fff} .rv.l4{background:var(--seq-4);color:#fff} .rv.l5{background:var(--seq-5);color:#fff}
.rv.open{background:var(--warn-bg);color:var(--warn)}
.open-list{margin-top:.5rem;display:grid;gap:.25rem;list-style:disc;padding-left:1.2rem}
.own{border-top:1px solid var(--line-l);padding-top:1.2rem;display:grid;gap:1rem}
.own-grid{display:grid;gap:1.4rem;grid-template-columns:minmax(240px,380px) minmax(0,1fr);align-items:center}
@media (max-width:760px){.own-grid{grid-template-columns:minmax(0,1fr)}}

@media (max-width:640px){
  .appbar .brand .tagline{display:none}
  .toolbar>.actions{margin-left:0}
  .rung{grid-template-columns:auto 1fr}
  .rung input{grid-row:1}
  .rung-n{display:none}
}
@media print{
  body.app{background:#fff}
  .appbar,.app-foot,.toolbar,.tabs,.actions,.stepper-wrap,.toast,.row-actions,.linkbtn,details.more{display:none!important}
  .app-main{max-width:none;padding:0}
  .card,.tile{box-shadow:none;break-inside:avoid}
  .tbl-wrap.tall{max-height:none;overflow:visible}
  .tbl thead th{position:static}
  #sec-responses,#sec-calibration select,#sec-comments{display:none}
  .hm,.viz-dist .ds,.gapchip,.leadbox,.pk,.role{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* codes such as O1 or RF-P1 use the display face: in the mono face a capital O reads as a zero */
.dc{font-family:var(--display);font-weight:600;font-size:.93em;letter-spacing:.01em;color:var(--ink)}
.pk,.dim-c,.st-k{font-family:var(--display);font-weight:600}
.rd-axis{font-family:var(--display);font-weight:600}
.rd-axis.small{font-weight:500}
.linkbtn{text-align:left}
.tbl tbody th:has(>.pk){white-space:nowrap}
.tbl.heat th.num{white-space:normal;min-width:4.6rem;max-width:8rem;line-height:1.25;vertical-align:bottom}
.tbl.heat tbody th{min-width:220px}
.tbl.heat td.hm{padding:.38rem .4rem}
.split .tbl.heat tbody th{min-width:0}
.hm.dn2{background:var(--gap-n2);color:#fff} .hm.dn1{background:var(--gap-n1);color:#5A1C0C} .hm.dz{background:#EEF2F6;color:var(--slate-2)} .hm.dp1{background:var(--gap-p1);color:#0B2A52} .hm.dp2{background:var(--gap-p2);color:#fff}
.rung,fieldset.dim{scroll-margin-top:9.5rem}
.app a.btn{text-decoration:none}
.app a.btn-ink,.app a.btn-ink:hover{color:#fff}
.app a.btn-line{color:var(--ink)}
.app a.btn-primary{color:#04121F}
fieldset.dim.flagq legend{float:left;width:100%;margin:0 0 .2rem;padding:0}
fieldset.dim.flagq legend+*{clear:both}