/* PMI Studio: tokens and components from ui_versions/DESIGN.md §4. Every colour, space and radius comes from a token;
   no hex literal outside the :root blocks (tests/test_ui_static.py greps for it). */
:root{color-scheme:light;
  --bg:#f4f5f7;--surface:#fff;--surface-2:#f9fafb;--sunken:#eceff3;--text:#1a1f26;--muted:#566170;
  --line:#d3d8df;--line-strong:#7d8796;
  --accent:#1f4fbf;--accent-bg:#e6ecfb;--on-accent:#fff;--focus:#1f4fbf;
  --sel:#0b7a8c;--sel-bg:rgb(11 122 140/.18);--mesh:#dfe3e8;--paper:#fff;
  --ok:#17652b;--ok-bg:#e2f2e5;--warn:#7f4d00;--warn-bg:#fdf1d0;--block:#b0241b;--block-bg:#fce7e5;--on-block:#fff;
  --unknown:#475262;--unknown-bg:#eceff3;--assume:#6a32b5;--assume-bg:#f1e9fc;
  --info:#1f4fbf;--info-bg:#e6ecfb;--neutral:#5b6572;--neutral-bg:#eceef1;
  --font-ui:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  /* UI v08 (R8): figures in the UI font with tabular figures (the SF Mono zero carries a dot and read like Ø: "0 Volumenkörper",
     "Ø8,000"); the monospace stack stays for code, logs and hashes */
  --font-num:var(--font-ui);--font-mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --fs-12:12px;--fs-13:13px;--fs-14:14px;--fs-16:16px;--fs-20:20px;--fs-24:24px;--lh-tight:1.25;--lh:1.45;
  --fw-reg:400;--fw-med:500;--fw-bold:600;
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:48px;
  --r-sm:4px;--r-md:6px;--r-lg:10px;--r-pill:999px;
  --sh-1:0 1px 2px rgb(16 24 40/.06);--sh-2:0 4px 12px rgb(16 24 40/.10);--sh-3:0 12px 32px rgb(16 24 40/.18);
  --h-header:48px;--h-bar:56px;--h-step:40px;--h-ctl:36px;--h-row:32px;--h-dock:64px;--w-max:1200px;--w-queue:360px;--w-drawer:440px;
  --t-fast:120ms;--t-med:200ms;--z-bar:10;--z-dock:20;--z-drawer:30;--z-toast:40;--z-modal:50}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;
  --bg:#121519;--surface:#1a1e24;--surface-2:#20252c;--sunken:#262c35;--text:#e6e9ed;--muted:#9ba5b2;
  --line:#323a45;--line-strong:#6b7584;--accent:#8db0ff;--accent-bg:#1c2845;--on-accent:#0b1220;--focus:#8db0ff;
  --sel:#3dd6e8;--sel-bg:rgb(61 214 232/.20);--mesh:#4f5762;
  --ok:#6fd08a;--ok-bg:#14301c;--warn:#f2bc4f;--warn-bg:#33270b;--block:#ff8f85;--block-bg:#3d1a19;--on-block:#0b1220;
  --unknown:#b7c0cc;--unknown-bg:#262c35;--assume:#c9a8ff;--assume-bg:#2a2042;--info:#8db0ff;--info-bg:#1c2845;
  --neutral:#a3acb8;--neutral-bg:#252a31;
  --sh-1:0 1px 2px rgb(0 0 0/.4);--sh-2:0 4px 12px rgb(0 0 0/.45);--sh-3:0 12px 32px rgb(0 0 0/.55)}}
:root[data-theme="dark"]{color-scheme:dark;
  --bg:#121519;--surface:#1a1e24;--surface-2:#20252c;--sunken:#262c35;--text:#e6e9ed;--muted:#9ba5b2;
  --line:#323a45;--line-strong:#6b7584;--accent:#8db0ff;--accent-bg:#1c2845;--on-accent:#0b1220;--focus:#8db0ff;
  --sel:#3dd6e8;--sel-bg:rgb(61 214 232/.20);--mesh:#4f5762;
  --ok:#6fd08a;--ok-bg:#14301c;--warn:#f2bc4f;--warn-bg:#33270b;--block:#ff8f85;--block-bg:#3d1a19;--on-block:#0b1220;
  --unknown:#b7c0cc;--unknown-bg:#262c35;--assume:#c9a8ff;--assume-bg:#2a2042;--info:#8db0ff;--info-bg:#1c2845;
  --neutral:#a3acb8;--neutral-bg:#252a31;
  --sh-1:0 1px 2px rgb(0 0 0/.4);--sh-2:0 4px 12px rgb(0 0 0/.45);--sh-3:0 12px 32px rgb(0 0 0/.55)}
@media (max-width:720px){:root{--h-ctl:44px;--h-row:40px}}
@media (prefers-reduced-motion:reduce){:root{--t-fast:0ms;--t-med:0ms}*{animation:none!important}}

/* base */
*{box-sizing:border-box}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
body{margin:0;background:var(--bg);color:var(--text);font:var(--fs-14)/var(--lh) var(--font-ui)}
a{color:var(--accent)}
h2{font-size:var(--fs-16);font-weight:var(--fw-bold);margin:0}
h3{font-size:var(--fs-14);font-weight:var(--fw-bold);margin:0 0 var(--s-2)}
p{margin:0 0 var(--s-2)}
.num,.mono{font-family:var(--font-num);font-variant-numeric:tabular-nums}code{font-family:var(--font-mono)}.num{text-align:right}
code,.mono{font-size:var(--fs-12)}
.meta,.muted{color:var(--muted);font-size:var(--fs-12)}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
input,select,textarea{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--line-strong);
  border-radius:var(--r-md);padding:0 var(--s-3);min-height:var(--h-ctl);width:100%}
textarea{padding:var(--s-2) var(--s-3)}
input[type=checkbox]{width:20px;height:20px;min-height:0;accent-color:var(--accent)}

/* header */
header.top{display:flex;align-items:center;gap:var(--s-3);height:var(--h-header);padding:0 var(--s-4);
  border-bottom:1px solid var(--line);background:var(--surface)}
header.top h1{font-size:var(--fs-16);margin:0}header.top h1 a{color:inherit;text-decoration:none}
header.top #health{margin-left:auto;display:flex;gap:var(--s-2);align-items:center}
main{max-width:var(--w-max);margin:0 auto;padding:var(--s-4) var(--s-4) var(--s-7)}
main[data-page=job]{max-width:none}   /* every job tab is fluid: the status bar never shifts on a tab switch */
.only-narrow{display:none!important}

/* cards, layout */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-4);margin-bottom:var(--s-4);box-shadow:var(--sh-1)}
.card > .head{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);align-items:center;margin-bottom:var(--s-3)}
.card > .head .meta{margin-right:auto}
.grid-main{display:grid;grid-template-columns:2fr 1fr;gap:var(--s-4);align-items:start}
.grid-half{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);align-items:start}
.row{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center}
dl.kv{display:grid;grid-template-columns:max-content 1fr;gap:var(--s-1) var(--s-4);margin:0}
dl.kv dt{color:var(--muted)}dl.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}dl.kv dd.num{white-space:nowrap}
dl.kv.counts{grid-template-columns:minmax(0,1fr) max-content}
details > summary{cursor:pointer;min-height:var(--h-ctl);display:flex;align-items:center;gap:var(--s-2);font-weight:var(--fw-med);list-style:none}
details > summary::-webkit-details-marker{display:none}
details > summary::after{content:"▸";color:var(--muted)}details[open] > summary::after{content:"▾"}
details.fold{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:0 var(--s-4);margin-bottom:var(--s-4)}
details.fold[open]{padding-bottom:var(--s-4)}
pre{margin:0;max-height:360px;overflow:auto;background:var(--sunken);padding:var(--s-3);border-radius:var(--r-md);
  white-space:pre-wrap;font:var(--fs-12)/var(--lh) var(--font-mono)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:var(--h-ctl);padding:0 var(--s-4);
  border-radius:var(--r-md);border:1px solid transparent;font:var(--fw-bold) var(--fs-14)/1 var(--font-ui);cursor:pointer;
  text-decoration:none;white-space:nowrap;transition:filter var(--t-fast)}
.btn:hover{filter:brightness(.93)}.btn:active{filter:brightness(.86)}
.btn-primary{background:var(--accent);color:var(--on-accent)}
.btn-secondary{background:var(--surface);border-color:var(--line-strong);color:var(--accent)}
.btn-danger{background:var(--block);color:var(--on-block)}
.btn-danger-outline{background:var(--surface);border-color:var(--block);color:var(--block)}
.btn-ghost{background:transparent;color:var(--accent);padding:0 var(--s-2)}
.btn[aria-disabled="true"],.btn:disabled{opacity:.5;cursor:not-allowed;filter:none}
.btn-primary[aria-disabled="true"]{opacity:1;background:var(--sunken);color:var(--muted);border:1px dashed var(--line-strong)}   /* readable, not white on pale accent */
.btn-big{min-height:48px;font-size:var(--fs-16);padding:0 var(--s-5)}
.why{color:var(--muted);font-size:var(--fs-12)}
.busy{color:var(--info);font-weight:var(--fw-med);display:inline-flex;gap:var(--s-2);align-items:center}

/* chips */
.chip{display:inline-flex;align-items:center;gap:var(--s-1);height:22px;padding:0 var(--s-2);border-radius:var(--r-pill);
  font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap;background:var(--neutral-bg);color:var(--neutral)}
.chip[data-s=ok]{background:var(--ok-bg);color:var(--ok)}.chip[data-s=warn]{background:var(--warn-bg);color:var(--warn)}
.chip[data-s=block]{background:var(--block-bg);color:var(--block)}.chip[data-s=info]{background:var(--info-bg);color:var(--info)}
.chip[data-s=unknown]{background:var(--unknown-bg);color:var(--unknown);border:1px dashed var(--line-strong)}
.chip[data-s=assume]{background:var(--assume-bg);color:var(--assume)}
.chip[data-s=solid]{background:var(--ok);color:var(--surface)}
.chip.word{height:28px;font-size:var(--fs-14);padding:0 var(--s-3)}
.g{font-style:normal}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--line-strong)}
.dot[data-s=ok]{background:var(--ok)}.dot[data-s=block]{background:var(--block)}.dot[data-s=warn]{background:var(--warn)}

/* status bar + step strip (job page) */
.statusbar{position:sticky;top:0;z-index:var(--z-bar);display:grid;grid-template-columns:1fr auto;gap:var(--s-1) var(--s-4);align-items:center;
  min-height:var(--h-bar);padding:var(--s-2) var(--s-4);margin:0 0 var(--s-3);background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.statusbar .l1,.statusbar .l2{grid-column:1;display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-3);align-items:center;min-width:0}
.statusbar .part{font-size:var(--fs-16);font-weight:var(--fw-bold);overflow-wrap:anywhere}
.statusbar .reason{color:var(--muted)}
/* UI v07 (R3/R12): two fixed lines (56 px): line 1 never wraps (the reason ellipsizes, full text in its title), line 2
   holds the state, the flags (dirty, export failed, stage open) and the counts, which ellipsize */
@media (min-width:721px){.statusbar .l1,.statusbar .l2{flex-wrap:nowrap;white-space:nowrap}
  .statusbar .l1 > *,.statusbar .l2 > *{flex:none}.statusbar .l1 .reason,.statusbar .l2 .counts{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}}
.chip-link{text-decoration:none;border-radius:var(--r-pill);display:inline-flex}.chip-link:hover .chip{filter:brightness(.95)}
.num-i{font-family:var(--font-num);font-variant-numeric:tabular-nums}
.statusbar .counts{color:var(--muted);font-size:var(--fs-13)}
.statusbar .counts a{color:inherit}
.dock{display:flex;gap:var(--s-2);align-items:center;justify-content:flex-end;flex-wrap:wrap}
.statusbar .dock{grid-column:2;grid-row:1 / span 2}
.dock .why{max-width:280px}
ol.steps{display:flex;gap:var(--s-2);list-style:none;padding:0;margin:0 0 var(--s-4);min-height:var(--h-step)}
ol.steps li{flex:1;display:flex;align-items:center;gap:var(--s-2);padding:var(--s-1) var(--s-3);border-radius:var(--r-md);
  border:1px solid var(--line);background:var(--surface);min-width:0}
ol.steps li > a,ol.steps li > span.lbl{display:flex;align-items:center;gap:var(--s-2);color:inherit;text-decoration:none;min-width:0;flex:1}
ol.steps .n{flex:none;display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;font-size:var(--fs-12);
  font-weight:var(--fw-bold);background:var(--sunken);color:var(--muted)}
ol.steps .t{display:flex;flex-direction:column;min-width:0;line-height:var(--lh-tight)}
ol.steps .t b{font-weight:var(--fw-bold)}ol.steps .t small{font-size:var(--fs-12);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
ol.steps li[data-s=ok] .n{background:var(--ok-bg);color:var(--ok)}
ol.steps li[data-s=info] .n{background:var(--info);color:var(--on-accent)}
ol.steps li[data-s=block] .n{background:var(--block);color:var(--on-block)}
ol.steps li[data-s=warn] .n{background:var(--warn-bg);color:var(--warn)}
ol.steps li.here{border-color:var(--accent);box-shadow:inset 0 -3px 0 var(--accent)}
ol.steps li.off{opacity:.6}
.steps-c{display:none}

/* banners and decision cards */
.banner{border:1px solid var(--line);border-left:4px solid var(--info);border-radius:var(--r-lg);padding:var(--s-3) var(--s-4);
  margin-bottom:var(--s-4);background:var(--info-bg)}
.banner[data-s=block]{border-left-color:var(--block);background:var(--block-bg)}
.banner[data-s=warn]{border-left-color:var(--warn);background:var(--warn-bg)}
.banner[data-s=assume]{border-left-color:var(--assume);background:var(--assume-bg)}
.banner[data-s=ok]{border-left-color:var(--ok);background:var(--ok-bg)}
.banner .title{font-weight:var(--fw-bold);display:flex;gap:var(--s-2);align-items:baseline}
.banner .evidence{font-size:var(--fs-13);color:var(--text);margin:var(--s-1) 0 0;overflow-wrap:anywhere}
.banner ul{margin:var(--s-2) 0 0;padding-left:var(--s-5)}
.banner .opts{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-3);margin:var(--s-3) 0 0;padding:0;list-style:none}
.banner .opt{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-3);display:flex;flex-direction:column;gap:var(--s-2);align-items:flex-start}
.banner .opt p{margin:0;font-size:var(--fs-13)}
.banner .opt.chosen{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
/* UI v07: the stage decision card, two ways side by side, each a button + its consequence + its cost (no default) */
.banner.decision .opts.act .opt{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--s-3);align-items:center;padding:var(--s-2) var(--s-3)}
.banner.decision .opt .btn{grid-column:2;grid-row:1 / span 2}.banner.decision .opt p{grid-column:1}
.banner.decision .opt .what{font-size:var(--fs-13);color:var(--text)}.banner.decision:focus{outline:none}

/* tables */
.scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:var(--fs-13)}
th,td{text-align:left;padding:var(--s-1) var(--s-2);height:var(--h-row);border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:var(--fs-12);color:var(--muted);font-weight:var(--fw-bold);background:var(--surface)}
th.num{font-family:var(--font-ui)}   /* UI v07 (R8): headers in one font; only the figures below are mono */
tbody tr:hover{background:var(--sunken)}
table.checks td.s{width:120px}table.checks td.k{width:150px;color:var(--muted)}
table.evidence td.mono{overflow-wrap:anywhere}

/* S0 home */
.home{display:grid;grid-template-columns:2fr 1fr;gap:var(--s-4);align-items:start}
.dropzone{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-3);min-height:220px;padding:var(--s-3);border-radius:var(--r-lg);
  border:2px dashed var(--line-strong);background:var(--surface-2);transition:background var(--t-fast)}
.dropzone.over{border-color:var(--accent);background:var(--accent-bg)}
.slot{display:flex;flex-direction:column;gap:var(--s-2);align-items:center;justify-content:center;text-align:center;padding:var(--s-4);
  border:2px dashed var(--line);border-radius:var(--r-md);background:var(--surface);cursor:pointer;min-width:0}
.slot:focus-within{outline:2px solid var(--focus);outline-offset:2px}
.slot .ico{font-size:var(--fs-24);line-height:1;color:var(--muted)}
.slot strong{font-size:var(--fs-16)}
.slot[data-state=ok]{border-style:solid;border-color:var(--ok)}
.slot[data-state=error]{border-style:solid;border-color:var(--block)}
.slot .file{display:flex;gap:var(--s-2);align-items:center;max-width:100%}
.slot .file .chip{white-space:normal;height:auto;min-height:22px;overflow-wrap:anywhere;text-align:left}
.slot .x{min-height:28px;width:28px;padding:0;justify-content:center}
.slot .msg{color:var(--block);font-size:var(--fs-12);font-weight:var(--fw-med)}
fieldset.seg{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);align-items:center}
fieldset.seg legend{float:left;margin-right:var(--s-2);color:var(--muted);font-size:var(--fs-13)}
.seg .opts{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r-md);overflow:hidden}
.seg label{position:relative;display:inline-flex;align-items:center;min-height:var(--h-ctl);padding:0 var(--s-3);cursor:pointer;font-size:var(--fs-13)}
.seg label + label{border-left:1px solid var(--line-strong)}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg label:has(input:checked){background:var(--accent-bg);color:var(--accent);font-weight:var(--fw-bold)}
.seg label:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:-2px}
.readerline{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center;font-size:var(--fs-13)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-3);padding-top:var(--s-2)}
.fields label{display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--fs-12);color:var(--muted)}
.fields .wide{grid-column:1/-1}
.upload > * + *,.upload > fieldset.seg{margin-top:var(--s-3)}
.go{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);align-items:center}
.joblist{max-height:640px;overflow:auto;margin:0 calc(-1 * var(--s-4));padding:0 var(--s-4)}
.joblist ol{list-style:none;margin:0;padding:0}
.joblist li{display:grid;grid-template-columns:1fr auto;gap:2px var(--s-2);padding:var(--s-2) 0;border-bottom:1px solid var(--line)}
.joblist li:last-child{border-bottom:0}
.joblist .p{font-weight:var(--fw-bold);overflow-wrap:anywhere}.joblist .p a{color:inherit;text-decoration:none}.joblist .p a:hover{text-decoration:underline}
.joblist .sub{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center;font-size:var(--fs-12);color:var(--muted)}
.joblist .dl{font-size:var(--fs-12);white-space:nowrap}

/* S1 inputs */
/* UI v07 (R12): S1 and S4 are as wide as the status bar and step strip above them (the 1200 px cap left a 208 px dead
   band at 1440); their grids keep the reading width per column */
.mini3d{position:relative;height:240px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--surface-2)}
.mini3d.bad{--sel:var(--block)}   /* every face of a face soup in --block (viewer3d reads --sel from its element) */
.mini3d-cap{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center;margin:var(--s-2) 0 0;font-size:var(--fs-13);color:var(--block)}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--s-3)}
.thumbs figure{margin:0}.thumbs img{width:100%;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);display:block}
.thumbs figcaption{font-size:var(--fs-12);color:var(--muted);margin-top:var(--s-1);display:flex;flex-wrap:wrap;gap:var(--s-1);align-items:center}
.nothumb{padding:var(--s-6);text-align:center;color:var(--muted);border:1px dashed var(--line-strong);border-radius:var(--r-md)}
.side > * + *{margin-top:var(--s-4)}
dialog{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);color:var(--text);box-shadow:var(--sh-3);
  padding:var(--s-5);width:min(560px,calc(100vw - 32px))}
dialog::backdrop{background:rgb(0 0 0/.45)}
dialog form{display:grid;gap:var(--s-3)}
dialog label{display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--fs-13);color:var(--muted)}

/* S2 processing */
ol.stages{display:flex;flex-wrap:wrap;gap:var(--s-2);list-style:none;padding:0;margin:0 0 var(--s-4)}
ol.stages li{flex:1 1 0;min-width:72px;display:flex;flex-direction:column;gap:2px;padding:var(--s-2) var(--s-3);border:1px solid var(--line);
  border-radius:var(--r-md);background:var(--surface-2);font-size:var(--fs-12)}
ol.stages{margin:var(--s-4) 0 0}ol.stages li > span:first-child{overflow-wrap:anywhere;hyphens:auto}ol.stages li b{font-size:var(--fs-12)}
ol.stages li .meta.mono{font-size:var(--fs-12)}   /* numbers mono, words (ok, gestoppt) in the UI font */
.cnc-line{margin:var(--s-2) 0 0}
ol.stages li[data-s=ok]{border-color:var(--ok)}ol.stages li[data-s=ok] .g{color:var(--ok)}
ol.stages li[data-s=info]{border-color:var(--info);background:var(--info-bg)}ol.stages li[data-s=info] .g{color:var(--info);animation:pulse 1.2s ease-in-out infinite}
ol.stages li[data-s=block]{border-color:var(--block);background:var(--block-bg)}ol.stages li[data-s=block] .g{color:var(--block)}
ol.stages li[data-s=warn] .g{color:var(--warn)}
ol.stages li[data-s=neutral]{opacity:.6;border-style:dashed}
@keyframes pulse{50%{opacity:.35}}
.eta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-3)}
.eta div{display:flex;flex-direction:column;gap:2px}.eta b{font:var(--fw-bold) var(--fs-16)/var(--lh-tight) var(--font-ui);font-variant-numeric:tabular-nums}
.eta span{font-size:var(--fs-12);color:var(--muted)}
.eta [data-s=warn] b{color:var(--warn)}.eta [data-s=block] b{color:var(--block)}
.eta [data-over-budget] > span:last-child,.eta [data-s=block] > span:last-child{color:var(--warn);font-weight:var(--fw-med)}.eta [data-s=block] > span:last-child{color:var(--block)}
.eta div > span:first-child{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center}
/* UI v04: the progress card comes first and is compact (no visible head: the step strip and the bar name it) */
.card.prog{padding:var(--s-3) var(--s-4);margin-bottom:var(--s-3)}.card.prog .bar{margin-top:var(--s-2)}.card.prog .cnc-line{margin-top:var(--s-1)}
.card.prog ol.stages{margin-top:var(--s-2)}.eta .chip{height:18px}
@media (min-width:721px){.card.prog ol.stages li{flex-direction:row;justify-content:space-between;align-items:baseline;gap:var(--s-2);padding:var(--s-1) var(--s-2)}}
.stage-now{margin:var(--s-2) 0 0;font-size:var(--fs-13)}
/* warnings stack: one 40 px row per warning (glyph, title, mono evidence, ≤ 1 action) */
.warnstack{border:1px solid var(--line);border-left:4px solid var(--warn);border-radius:var(--r-lg);background:var(--warn-bg);margin-bottom:var(--s-3);padding:0 var(--s-3)}
.proc-grid > .card.tiles{padding-top:var(--s-3)}.card.tiles > .head{margin-bottom:var(--s-2)}
.warnstack[data-s=block]{border-left-color:var(--block);background:var(--block-bg)}.warnstack[data-s=info]{border-left-color:var(--info);background:var(--info-bg)}
.warnrows{list-style:none;margin:0;padding:0}
.warnrows li{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:var(--s-1) var(--s-3);align-items:center;min-height:40px;padding:2px 0;border-top:1px solid var(--line)}
.warnrows li:first-child{border-top:0}
.warnrows .g{font-weight:var(--fw-bold);text-align:center;color:var(--warn)}.warnrows li[data-s=block] .g{color:var(--block)}.warnrows li[data-s=info] .g{color:var(--info)}
.warnrows .wt{display:flex;flex-wrap:wrap;gap:0 var(--s-3);align-items:baseline;min-width:0}
.warnrows .wt .mono{color:var(--muted)}
.warnrows .btn{min-height:32px}
ul.rawlist{list-style:none;margin:0;padding:0}ul.rawlist li{padding:var(--s-1) 0;border-top:1px solid var(--line)}ul.rawlist li:first-child{border-top:0}
ul.rawlist code{color:var(--muted)}
.bar{height:6px;border-radius:var(--r-pill);background:var(--sunken);overflow:hidden;margin:var(--s-3) 0 0}
.bar i{display:block;height:100%;background:var(--info)}
/* S2 tile grid (It. 8): cells over the page image, state = border + 30 % tint + glyph + word, badges below the label */
.proc-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:var(--s-4);align-items:start}
.proc-grid > .card{margin-bottom:var(--s-4)}
.tmap{position:relative;margin:0 0 var(--s-3);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--paper)}
.tmap img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
.tmap figcaption{position:absolute;right:var(--s-2);bottom:var(--s-2);font-size:var(--fs-12);background:var(--surface);padding:0 var(--s-2);border-radius:var(--r-sm)}
.tcell{position:absolute;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:var(--s-1);margin:0;border:2px solid var(--tc);
  background:none;cursor:pointer;font:inherit;color:var(--text);text-align:left;--tc:var(--line-strong);--tf:var(--sunken)}
.tcell::before{content:"";position:absolute;inset:0;background:var(--tf);opacity:.3;pointer-events:none}   /* 30 %: the drawing stays legible */
.tcell > span{position:relative;font-size:var(--fs-12);line-height:var(--lh-tight);padding:1px var(--s-1);border-radius:var(--r-sm);background:var(--surface);max-width:100%}
.tcell .lab .w{font-weight:var(--fw-med)}
.tcell .corner{position:absolute;top:var(--s-1);right:var(--s-1);min-width:20px;height:20px;padding:0 var(--s-1);border-radius:var(--r-pill);
  background:var(--tc);color:var(--surface);font:normal var(--fw-bold) var(--fs-12)/20px var(--font-ui);text-align:center}
.tcell .tb{color:var(--warn);font-weight:var(--fw-med)}
.tcell[aria-pressed=true]{box-shadow:inset 0 0 0 3px var(--sel);z-index:1}
.tcell:hover::before{opacity:.5}
[data-s=ok]:is(.tcell,.tsq){--tc:var(--ok);--tf:var(--ok-bg)}[data-s=warn]:is(.tcell,.tsq){--tc:var(--warn);--tf:var(--warn-bg)}
[data-s=block]:is(.tcell,.tsq){--tc:var(--block);--tf:var(--block-bg)}[data-s=info]:is(.tcell,.tsq){--tc:var(--info);--tf:var(--info-bg)}
[data-s=unknown]:is(.tcell,.tsq){--tc:var(--unknown);--tf:var(--unknown-bg);border-style:dashed}[data-s=neutral]:is(.tcell,.tsq){--tc:var(--neutral);--tf:var(--neutral-bg)}
.tcell[data-s=info]::before{animation:pulse 1.2s ease-in-out infinite}
.tgrid{display:grid;gap:2px;margin:0 0 var(--s-3)}
.tsq{width:28px;height:28px;padding:0;border:2px solid var(--tc);border-radius:var(--r-sm);background:var(--tf);color:var(--tc);font:var(--fw-bold) var(--fs-12)/1 var(--font-ui);cursor:pointer}
.tsq[aria-pressed=true]{box-shadow:0 0 0 2px var(--sel)}
.tlegend{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2)}
.tdetail .tbadges{display:flex;flex-wrap:wrap;gap:var(--s-1);margin:0 0 var(--s-2)}
.tdetail .evidence{font-size:var(--fs-13);margin:0 0 var(--s-2)}
.tdetail dd[data-s=warn]{color:var(--warn);font-weight:var(--fw-bold)}
.tdetail .treaders{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1) var(--s-2);margin:var(--s-3) 0}
.tshot{margin:0 0 var(--s-2)}.tshot img{display:block;width:100%;max-height:260px;object-fit:contain;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md)}
pre.log{margin:0;max-height:320px;overflow:auto;padding:var(--s-3);background:var(--sunken);border-radius:var(--r-md);
  font:var(--fs-12)/1.5 var(--font-mono);white-space:pre-wrap;overflow-wrap:anywhere}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.tmap,.tshot) img{filter:invert(.9) hue-rotate(180deg)}}
:root[data-theme="dark"] :is(.tmap,.tshot) img{filter:invert(.9) hue-rotate(180deg)}
.spin{display:inline-block;width:12px;height:12px;border:2px solid var(--info);border-right-color:transparent;border-radius:50%;
  animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* S4 export */
.export-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-4);align-items:start}
.export-grid > .col > .card:last-child{margin-bottom:var(--s-4)}
.download-card,.word-block{display:flex;flex-direction:column;gap:var(--s-2);align-items:flex-start}
.download-card .file{font:var(--fw-bold) var(--fs-16)/var(--lh-tight) var(--font-ui);overflow-wrap:anywhere}
.download-card .facts{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-3);align-items:center;color:var(--muted);font-size:var(--fs-13)}
.download-card .facts .mono{color:var(--text)}
/* UI v08: the merged stage chip may be long: it wraps instead of widening the card (390 had a horizontal scroll) */
.download-card .facts .chip{white-space:normal;height:auto;min-height:22px;text-align:left;line-height:var(--lh-tight);padding-top:2px;padding-bottom:2px}
.export-grid > .col{min-width:0}
.word-block{align-self:stretch;border-top:1px solid var(--line);padding-top:var(--s-3);margin-top:var(--s-1)}
.word-block p{margin:0}.word-block .reason{font-size:var(--fs-14)}
.chip.big{height:28px;padding:0 var(--s-3);font-size:var(--fs-14)}
.word-block .missing{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center}
.chip-btn,.btn-link{background:none;border:0;padding:0;font:inherit;cursor:pointer;color:var(--accent)}
.chip-btn{border-radius:var(--r-pill)}.chip-btn:hover .chip{filter:brightness(.95)}
.btn-link{text-decoration:underline;font-size:var(--fs-13);white-space:nowrap}
ol.next-actions{list-style:none;margin:0;padding:0;counter-reset:a}
ol.next-actions li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:var(--s-1) var(--s-3);align-items:center;padding:var(--s-2) 0;border-bottom:1px solid var(--line)}
ol.next-actions .t{font-size:var(--fs-14)}ol.next-actions .stage-ctl{margin-top:var(--s-2)}
ol.next-actions li:last-child{border-bottom:0}
ol.next-actions .n{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--sunken);
  color:var(--muted);font:var(--fw-bold) var(--fs-12)/1 var(--font-num)}
ol.next-actions li.now .n{background:var(--info-bg);color:var(--info)}ol.next-actions li.now .t{font-weight:var(--fw-med)}
ol.next-actions .to{white-space:nowrap}ol.next-actions .to:empty{display:none}
.gates-card > .head{margin-bottom:var(--s-2)}
details.gate{border-top:1px solid var(--line)}details.gate[open]{padding-bottom:var(--s-3)}
details.gate > summary{gap:var(--s-3)}details.gate > summary::after{margin-left:auto}
.seg.stage-ctl .opts{background:var(--surface)}
ol.next-actions li:has([data-in-step]) .to{grid-column:2 / -1;white-space:normal}
/* ≤ 720 px: a segmented control fills the width in equal cells and its labels wrap ("unbekannt → Rückfrage") */
@media (max-width:720px){fieldset.seg{width:100%}fieldset.seg .opts{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);width:100%}
  fieldset.seg label{justify-content:center;text-align:center;padding:0 var(--s-1);line-height:var(--lh-tight);min-height:44px}}   /* UI v08 (R1): the stage answered in its step */
details.gate .gl{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:var(--r-sm);
  background:var(--sunken);font:var(--fw-bold) var(--fs-13)/1 var(--font-num)}
details.gate[data-ok="0"] .gl{background:var(--block-bg);color:var(--block)}details.gate[data-ok="1"] .gl{background:var(--ok-bg);color:var(--ok)}details.gate[data-ok=pending] .gl{background:var(--unknown-bg);color:var(--unknown);outline:1px dashed var(--line-strong)}
details.gate .gt{font-weight:var(--fw-bold)}
ul.gitems{list-style:none;margin:0;padding:0}
.gi{display:grid;grid-template-columns:104px minmax(0,13em) minmax(0,42ch);gap:var(--s-1) var(--s-3);align-items:baseline;padding:var(--s-1) 0;border-bottom:1px solid var(--line)}
.gi:last-child{border-bottom:0}.gi > .chip{justify-self:start}
.gi .k{color:var(--muted);font-size:var(--fs-13)}.gi .ev{font-size:var(--fs-13);overflow-wrap:anywhere}
details.raw{display:inline}details.raw > summary{display:inline-flex;min-height:0;font-size:var(--fs-12);font-weight:var(--fw-reg);color:var(--muted);margin-left:var(--s-2)}
details.raw[open] > code{display:block;margin-top:var(--s-1);color:var(--muted)}
details.oks > summary{min-height:28px;font-size:var(--fs-13);color:var(--muted);font-weight:var(--fw-reg)}
details.gate > ul.gitems,details.gate > details.oks{margin-left:calc(24px + var(--s-3))}
table.sheets td,table.sheets th{height:28px}
/* It. 14: gate F review panel (packet → reviewer → import) and the import's findings */
.review-f{margin:var(--s-3) 0 0 calc(24px + var(--s-3))}
ol.rv-steps{list-style:none;margin:0;padding:0;counter-reset:rv}
ol.rv-steps > li{counter-increment:rv;position:relative;padding:var(--s-2) 0 var(--s-3) calc(22px + var(--s-3));border-top:1px solid var(--line)}
ol.rv-steps > li::before{content:counter(rv);position:absolute;left:0;top:var(--s-2);display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:50%;background:var(--sunken);color:var(--muted);font:var(--fw-bold) var(--fs-12)/1 var(--font-num)}
.rv-h{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);align-items:center;justify-content:space-between;min-height:var(--h-ctl)}
.review-f .facts{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-3);align-items:center;color:var(--muted);font-size:var(--fs-13);margin:var(--s-2) 0 0}
.review-f .facts .mono{color:var(--text)}
.rv-import{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3);margin-top:var(--s-2)}
.rv-import label{display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--fs-12);color:var(--muted);min-width:0}
.rv-import .wide{grid-column:1/-1}.rv-import input[type=file]{padding:var(--s-1);min-width:0}
.rv-import .banner ul.evidence{margin:var(--s-1) 0;padding-left:var(--s-4);font-size:var(--fs-12)}
.rv-result{border-top:1px solid var(--line);padding-top:var(--s-3)}
h3.rv-t{font-size:var(--fs-13);font-weight:var(--fw-bold);margin:var(--s-3) 0 var(--s-1)}
table.rv-items td,table.rv-diff td{vertical-align:top;padding-top:var(--s-1);padding-bottom:var(--s-1)}
table.rv-items td:last-child{overflow-wrap:anywhere}
ul.list{list-style:none;margin:0;padding:0}
ul.list li{display:grid;grid-template-columns:1fr auto auto;gap:var(--s-1) var(--s-4);align-items:center;padding:var(--s-2) 0;border-bottom:1px solid var(--line)}
ul.list li:last-child{border-bottom:0}
ul.list .name{min-width:0;overflow-wrap:anywhere}ul.list .name .meta{display:block}
ul.list .facts{font-size:var(--fs-12);color:var(--muted);text-align:right}

/* S3 review (DESIGN §3 S3): queue | drawing | 3D, facts strip below; Tabelle mode: panes on top, the dense table below */
/* UI v05: the height is capped (a tall window no longer stretches the drawing into a grey void or loses the 3D framing) */
.review{display:grid;grid-template-columns:var(--w-queue) minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;
  grid-template-areas:"top top top" "queue draw model" "queue facts facts";gap:var(--s-3);height:clamp(600px,calc(100vh - 220px),1100px)}
/* Tabelle: panes 28 vh (min 220), the table gets the rest (≥ 8 rows at 1440×900); the facts pane scrolls inside */
.review[data-layout=table]{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.15fr);grid-template-rows:auto minmax(260px,33vh) minmax(240px,1fr);
  grid-template-areas:"top top top" "draw model facts" "queue queue queue";height:clamp(640px,calc(100vh - 220px),1100px)}
.review[data-layout=table] .rv-facts{max-height:none;padding-bottom:var(--s-2)}.review[data-layout=table] .fx-acts{flex-wrap:wrap}
.review[data-layout=table] dl.fx{gap:var(--s-1) var(--s-4)}.review[data-layout=table] .fx-why{margin-bottom:var(--s-1)}
.rv-top{grid-area:top;display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);align-items:center}
.rv-top h2{margin-right:var(--s-1)}.rv-top > .meta{flex:1 1 0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv-top .cfilters{flex:0 0 auto;flex-wrap:nowrap}.rv-top .cfilters input[type=search]{flex:none;width:220px}
.rv-top .fchips{flex:1 1 100%}
.rv-queue,.rv-model,.rv-facts{min-width:0;min-height:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg)}
.rv-draw{grid-area:draw;min-width:0;min-height:0}
.rv-queue{grid-area:queue;display:flex;flex-direction:column;overflow:hidden}
.rv-model{grid-area:model;position:relative;overflow:hidden}
.rv-facts{grid-area:facts;padding:0 var(--s-4) var(--s-3);overflow:auto;min-height:0;max-height:200px}
.rv-facts .fx-head{position:sticky;top:0;z-index:1;background:var(--surface);padding-top:var(--s-2)}
.pane{height:100%;min-height:0}.pane-msg{display:grid;place-items:center;height:100%;margin:0;padding:var(--s-4);color:var(--muted);text-align:center}
.pane-label{position:absolute;left:var(--s-2);top:var(--s-2);z-index:1;display:flex;gap:var(--s-1);align-items:center;font-size:var(--fs-12);color:var(--muted);
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-pill);padding:2px var(--s-2)}
.sw{display:inline-block;width:12px;height:12px;border-radius:var(--r-sm);border:1px solid var(--line-strong)}
.sw.sel{background:var(--sel)}.sw.mesh{background:var(--mesh);margin-left:var(--s-2)}
.sw.hatch{margin-left:var(--s-2);background:repeating-linear-gradient(45deg,var(--unknown) 0 2px,var(--mesh) 2px 5px)}
.rv-model .pane{background:var(--surface-2)}
.pane-cap{position:absolute;left:var(--s-2);bottom:var(--s-2);z-index:1;display:flex;flex-wrap:wrap;gap:var(--s-1);align-items:center;margin:0;max-width:calc(100% - 16px);
  font-size:var(--fs-12);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:2px var(--s-2);box-shadow:var(--sh-1)}
.rv-draw .dv-zoom button,.rv-draw .dv-tab{height:32px;min-width:36px}
.rv-draw .dv-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}   /* UI v08 (R12): one toolbar row with two pages */
.rv-draw .dv-tab .dv-other{display:none}   /* the other-part tab is the dashed "– Blatt 2" (words in its title and in the pane note) */
.pane-cap .btn-ghost{min-height:24px;font-size:var(--fs-12);padding:0 var(--s-1)}
.sh-3dbox{position:relative;flex:none}
.rv-qhead{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center;padding:var(--s-2) var(--s-3);border-bottom:1px solid var(--line);background:var(--surface-2)}
.rv-qhead .bar{flex:1 1 100%;margin:0;height:4px}.rv-qhead .bar i{background:var(--ok)}
.rv-qhead .btn-ghost{margin-left:auto;min-height:28px}
#rv-list{flex:1;overflow:auto;min-height:0}
.rv-list{list-style:none;margin:0;padding:0}
.rv-list li{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:var(--s-1) var(--s-2);align-items:center;padding:var(--s-1) var(--s-3) var(--s-1) var(--s-2);
  border-bottom:1px solid var(--line);cursor:pointer;min-height:48px;outline-offset:-2px}
.rv-list li:hover{background:var(--sunken)}
.rv-list li[aria-selected=true],table.chars tr[aria-selected=true]{background:var(--accent-bg);box-shadow:inset 3px 0 0 var(--sel)}
.rv-list li[data-seen] .o-l1,.rv-list li[data-seen] .crop{opacity:.6}
.rv-list .crop{width:64px;height:40px;object-fit:contain;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);display:grid;place-items:center;color:var(--muted)}
.rv-list .o-main{min-width:0;display:flex;flex-direction:column;gap:2px}
.rv-list .o-l1{display:flex;flex-wrap:wrap;gap:2px var(--s-2);align-items:center;min-width:0;white-space:nowrap}
.rv-list .q-title{flex:0 0 auto;max-width:100%;overflow:hidden;text-overflow:ellipsis}   /* ID + nominal never clip; the chips wrap */
.rv-list .o-l1 .draw{font-weight:var(--fw-med)}
.rv-list .o-l2{font-size:var(--fs-12);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv-list .seen{color:var(--ok);font-weight:var(--fw-bold)}
.rv-list .o-num{font-size:var(--fs-12);color:var(--muted);white-space:nowrap}.rv-list .o-num[data-s=warn]{color:var(--warn);font-weight:var(--fw-bold)}
.rv-list li[data-assume] .crop{border-left:3px solid var(--assume)}
/* UI v08 (R4): a thumbnail that stands in (a question's named callout, an assumption's first row) + its "+n" corner badge */
.crop-w{position:relative;display:block;width:64px;height:40px}
.crop-more{position:absolute;right:-4px;bottom:-4px;min-width:20px;height:16px;padding:0 4px;border-radius:var(--r-pill);background:var(--assume);color:var(--surface);
  font:var(--fw-bold) 11px/16px var(--font-ui);text-align:center;font-variant-numeric:tabular-nums}
/* UI v07 (R12): a confirmed row outside the queue is one line (its reason is the chip, the full text in the title) */
.rv-list li[data-routine]{min-height:44px;padding-top:2px;padding-bottom:2px}
/* UI v07 (R11): a callout drawn rotated (vertical dimension) is shown upright in its thumbnail */
:is(.rv-list,.mini-c) .crop.rot{display:grid;place-items:center;overflow:hidden;padding:0}
:is(.rv-list,.mini-c) .crop.rot img{width:40px;height:64px;max-width:none;object-fit:contain;transform:rotate(90deg);background:var(--paper)}
/* UI v07 (R4/R10): ≤ 720 px, the characteristics of a question group / assumption as cards with crop and full numbers */
ul.mini-c{list-style:none;margin:var(--s-2) 0 0;padding:0}
ul.mini-c li{display:grid;grid-template-columns:64px minmax(0,1fr);gap:var(--s-1) var(--s-3);align-items:start;padding:var(--s-2) 0;border-top:1px solid var(--line);cursor:pointer;min-height:44px}
ul.mini-c li[aria-selected=true]{background:var(--accent-bg);box-shadow:inset 3px 0 0 var(--sel)}
ul.mini-c .crop{width:64px;height:40px;object-fit:contain;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);display:grid;place-items:center;color:var(--muted)}
ul.mini-c .mc-main{display:flex;flex-direction:column;gap:2px;min-width:0}ul.mini-c .mc-l1 .draw{font-weight:var(--fw-med)}
ul.mini-c .mc-l2{font-size:var(--fs-13);display:flex;flex-wrap:wrap;gap:0 var(--s-2);align-items:baseline}ul.mini-c .mc-l2 .num{text-align:left}
@media (min-width:1100px){.rv-list .o-l2{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2}}
.rv-list li[data-sev="0"] .crop{border-left:3px solid var(--block)}.rv-list li[data-sev="1"] .crop{border-left:3px solid var(--unknown)}
.rv-list li[data-sev="2"] .crop{border-left:3px solid var(--warn)}
/* UI v06: queue items. A client question over several rows: mini-rows (ID, callout, Δ); an open assumption: a ≈ tile */
.rv-list .o-rows{display:grid;grid-template-columns:max-content minmax(0,1fr) max-content;gap:0 var(--s-2);margin:2px 0;font-size:var(--fs-12)}
.rv-list .mr{display:contents}.rv-list .mr > *{padding:1px 0;border-top:1px dashed var(--line)}
.rv-list .mr .num{color:var(--muted);text-align:right}.rv-list .mr .num[data-s=warn]{color:var(--warn);font-weight:var(--fw-bold)}
.rv-list .mr .draw{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rv-list .mr[data-on] > *{color:var(--sel);font-weight:var(--fw-bold)}
.rv-list li[data-kind=question],.rv-list li[data-kind=assume]{align-items:start;padding-top:var(--s-2);padding-bottom:var(--s-2)}
/* UI v08 (R5): an assumption card is two short lines (the chip says "Annahme", the title the full list) */
.rv-list li[data-kind=assume]{padding-top:var(--s-1);padding-bottom:var(--s-1)}.rv-list li[data-kind=assume] .o-l2{white-space:nowrap;display:block}
.rv-list .crop.assume{font:var(--fw-bold) var(--fs-20)/1 var(--font-ui);color:var(--assume);background:var(--assume-bg);border-color:var(--assume)}
.rv-list li[data-sev="3"] .crop{border-left:3px solid var(--assume)}
.rv-list li[data-kind=question] .o-l1,.rv-list li[data-kind=assume] .o-l1{white-space:normal;flex-wrap:nowrap;align-items:flex-start}
.rv-list li[data-kind] .q-title{flex:1 1 auto;white-space:normal;overflow:visible}
.rv-facts:has(.mini-t){max-height:260px}
table.mini-t{margin-top:var(--s-1)}table.mini-t th,table.mini-t td{height:28px;white-space:nowrap}
table.mini-t tbody tr{cursor:pointer}table.mini-t tr[aria-selected=true]{background:var(--accent-bg);box-shadow:inset 3px 0 0 var(--sel)}
table.mini-t td .draw{font-weight:var(--fw-med)}
.empty{color:var(--muted);display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center;padding:var(--s-3)}
.fx-head{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center}
.fx-head .draw{font-weight:var(--fw-bold);font-size:var(--fs-16)}
.fx-acts{margin-left:auto;display:flex;gap:var(--s-2);align-items:center}
kbd{font:var(--fs-12)/1 var(--font-num);padding:2px var(--s-1);border:1px solid var(--line-strong);border-radius:var(--r-sm);color:var(--muted)}
.btn-primary kbd{color:inherit;border-color:currentColor}
.fx-why{margin:var(--s-1) 0 var(--s-2);font-size:var(--fs-13)}
.fx-why[data-s=block]{color:var(--block)}.fx-why[data-s=warn]{color:var(--warn)}.fx-why[data-s=assume]{color:var(--assume)}
dl.fx{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);margin:0}dl.fx > div{min-width:72px}
dl.fx dt{font-size:var(--fs-12);color:var(--muted)}dl.fx dd{margin:0;min-width:0}
dl.fx dd small{display:block;font-size:var(--fs-12);color:var(--muted)}dl.fx dd small[data-drawing]{color:var(--warn);font-weight:var(--fw-med)}
dl.fx .wide{flex:1 1 200px}dl.fx [data-s=block]{color:var(--block);font-weight:var(--fw-bold)}
.faces{display:flex;flex-wrap:wrap;gap:var(--s-1);align-items:center}
details.faces-d > summary{min-height:28px;font-size:var(--fs-13);gap:var(--s-2)}details.faces-d[open] > .faces{margin-top:var(--s-1)}
.fchip.face{min-height:26px;padding:0 var(--s-2);font-family:var(--font-num);font-size:var(--fs-12)}
.fx-assume{display:flex;flex-direction:column;gap:var(--s-1);margin-top:var(--s-2)}
.fx-assume summary,.engine-note summary{min-height:28px;font-size:var(--fs-12);font-weight:var(--fw-reg)}
.engine{margin:var(--s-1) 0 0;font-size:var(--fs-12);color:var(--muted)}
.engine-note{margin-top:var(--s-1)}
/* It. 11: the row's edits (pending until a re-export) and the "Nicht für KMG …" form in the facts strip */
.fx-edit{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-3);align-items:center;margin-top:var(--s-2)}
ul.edits{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-3)}
ul.edits li{display:flex;gap:var(--s-2);align-items:center;font-size:var(--fs-13)}
details.edit-d > summary{min-height:28px;font-size:var(--fs-13);color:var(--accent)}
.edit-f{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center;margin-top:var(--s-1)}
.edit-f label{font-size:var(--fs-12);color:var(--muted)}.edit-f input{flex:1 1 200px;min-width:0}
.edit-f .meta{flex:1 1 100%;margin:0;font-size:var(--fs-12)}
@media (min-width:721px){table.sheets select,table.sheets .btn{min-height:28px}table.sheets select{padding:0 var(--s-2)}table.sheets .btn{padding:0 var(--s-3)}}
.gate .clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:var(--s-1) 0 0}
.o-l2 .pend{color:var(--warn);font-weight:var(--fw-med)}
@media (max-width:720px){.fx-edit .btn-link,details.edit-d > summary{min-height:44px}}
/* It. 12: row actions + the editors (faces picked in 3D, inline limits, add from a drawn box) in the facts strip */
.fx-actrow{display:flex;flex-wrap:wrap;gap:0 var(--s-4);align-items:flex-start}.fx-actrow > .op-f{flex:1 1 100%}
.fx-ops{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-4);align-items:center;margin-top:var(--s-2)}
.fx-ops .op-l{min-height:28px;text-decoration:none;font-size:var(--fs-13)}.fx-ops .op-l:hover{text-decoration:underline}
.op-f{display:flex;flex-direction:column;gap:var(--s-2);margin-top:var(--s-2);padding:var(--s-2) var(--s-3);border:1px solid var(--accent);border-left-width:4px;
  border-radius:var(--r-md);background:var(--accent-bg)}
.op-h{margin:0;font-size:var(--fs-13)}.op-h .meta{font-size:var(--fs-12)}
.op-note{margin:0;font-size:var(--fs-12);color:var(--warn);font-weight:var(--fw-med)}
.op-grid{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);align-items:flex-end}
.op-fl{display:flex;flex-direction:column;gap:2px}.op-fl label,.op-k{font-size:var(--fs-12);color:var(--muted)}
.op-fl input.num{width:7.5em;text-align:right;font-family:var(--font-num);font-variant-numeric:tabular-nums}
.op-fl .op-src{width:20em}.op-fl input[name=text]{width:12em}.op-fl output{min-height:var(--h-ctl);display:flex;align-items:center;font-family:var(--font-num)}
.op-faces{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-2);align-items:center}
.op-faces .fchip.picked{border-color:var(--sel);color:var(--text);background:var(--surface)}
.op-faces .fchip.picked::before{content:"";width:10px;height:10px;border-radius:var(--r-sm);background:var(--sel)}
.op-fin{width:9em;min-height:28px}
/* UI v08 (R12/R11): the typed face numbers fold behind "Nummern tippen"; a picked chip (the whole chip removes it) is ≥ 32 px */
.op-type{display:inline-flex;align-items:center;gap:var(--s-2)}.op-type > summary{display:inline-flex;align-items:center;min-height:32px;color:var(--accent);font-size:var(--fs-13);cursor:pointer}
.op-type[open] > summary{color:var(--muted)}
.op-faces .fchip.picked{min-height:32px}
.op-was{margin:0;font-size:var(--fs-12)}
.op-err{margin:0;color:var(--block);font-size:var(--fs-13);font-weight:var(--fw-med)}
.op-btns{display:flex;gap:var(--s-2);align-items:center}
.op-addrow{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:flex-end}.op-addrow .op-grid{flex:1 1 420px;min-width:0}
.op-crop{max-width:200px;max-height:60px;object-fit:contain;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm)}
.review[data-editing=faces] .rv-facts,.review[data-editing=limits] .rv-facts,.review[data-editing=add] .rv-facts{max-height:320px}
.rv-model[data-picking]{border-color:var(--sel);box-shadow:inset 0 0 0 2px var(--sel)}
.rv-model[data-picking] canvas{cursor:crosshair}
.pane-cap[data-pick] b{color:var(--sel)}
@media (max-width:720px){.fx-ops .op-l,.op-fin,.op-type > summary,.op-faces .fchip.picked{min-height:44px}.btn-link{display:inline-flex;align-items:center;min-height:44px}
  .rv-sheet .op-btns,.rv-sheet .op-crop{display:none}   /* UI v08: the sheet footer carries the editor's two buttons; the sheet crop is the drawn box */
 .op-fl input.num{width:6.5em}.op-fl .op-src{width:100%}.op-btns{flex-wrap:wrap}}
.seg-btns{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r-md);overflow:hidden}
.seg-btns button{font:var(--fw-med) var(--fs-13)/1 var(--font-ui);min-height:var(--h-ctl);padding:0 var(--s-3);border:0;background:var(--surface);color:var(--text);cursor:pointer}
.seg-btns button + button{border-left:1px solid var(--line-strong)}
.seg-btns button[aria-pressed=true]{background:var(--accent-bg);color:var(--accent);font-weight:var(--fw-bold)}
.fchips{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.fchip{display:inline-flex;align-items:center;gap:var(--s-1);min-height:var(--h-ctl);padding:0 var(--s-3);border-radius:var(--r-pill);cursor:pointer;white-space:nowrap;
  font:var(--fw-med) var(--fs-13)/1 var(--font-ui);background:var(--surface);color:var(--text);border:1px solid var(--line-strong)}
.fchip .num{font-family:var(--font-num);color:var(--muted)}
.fchip[data-s=ok] .g{color:var(--ok)}.fchip[data-s=warn] .g{color:var(--warn)}.fchip[data-s=block] .g{color:var(--block)}
.fchip[data-s=unknown] .g{color:var(--unknown)}.fchip[data-s=assume] .g{color:var(--assume)}.fchip[data-s=neutral] .g{color:var(--neutral)}
.fchip[aria-pressed=true]{background:var(--accent-bg);border-color:var(--accent);color:var(--accent);font-weight:var(--fw-bold)}
.fchip[aria-pressed=true] .num{color:var(--accent)}
.cfilters{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:center}
.cfilters input[type=search]{flex:1 1 220px;width:auto}
.review[data-layout=table] .rv-queue{overflow:hidden}
.review[data-layout=table] #rv-list{overflow:auto}.review[data-layout=table] .table-wrap{overflow:visible}   /* one scroll box: sticky head + ID column */
table.chars th:first-child,table.chars td:first-child{position:sticky;left:0;z-index:1;background:var(--surface)}
table.chars thead th:first-child{z-index:2}table.chars tr[aria-selected=true] td:first-child{background:var(--accent-bg)}
@media (max-width:1500px){.col-wide{display:none}}
table.chars th{position:sticky;top:0;z-index:1;box-shadow:inset 0 -1px 0 var(--line)}
table.chars td{height:var(--h-row);padding-top:2px;padding-bottom:2px;white-space:nowrap}
table.chars tr{cursor:pointer}
table.chars .c-text,table.chars .c-note{max-width:260px;overflow:hidden;text-overflow:ellipsis}
table.chars td small{margin-left:var(--s-1)}table.chars td.c-nom small{font-family:var(--font-ui)}
/* UI v08 (R8): the drawn value sits under the nominal, never beside it into the limits column */
table.chars td.c-nom small{display:block;margin:0;font-size:11px;line-height:1.1}table.chars td.c-nom,table.chars th.c-nom{padding-right:var(--s-4)}   /* the drawn value is words, not a figure */
table.chars .c-text .draw{font-weight:var(--fw-med)}
table.chars .c-delta[data-s=block]{color:var(--block);font-weight:var(--fw-bold)}
table.chars .why-t{font-size:var(--fs-12);color:var(--muted);margin-right:var(--s-1)}
table.chars tr[data-sev="0"] .c-id{box-shadow:inset 3px 0 0 var(--block)}
table.chars tr[data-sev="1"] .c-id{box-shadow:inset 3px 0 0 var(--unknown)}
table.chars tr[data-sev="2"] .c-id{box-shadow:inset 3px 0 0 var(--warn)}
.rv-sheet{position:fixed;inset:0;z-index:var(--z-modal);background:var(--bg);display:flex;flex-direction:column}
.sh-head{display:flex;align-items:center;gap:var(--s-2);min-height:52px;padding:0 var(--s-2);background:var(--surface);border-bottom:1px solid var(--line)}
.sh-head h2{font-size:var(--fs-14);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.sh-head .btn{min-height:44px}
.sh-body{flex:1;overflow:auto;padding:var(--s-3) var(--s-4);display:flex;flex-direction:column;gap:var(--s-3)}
.sh-crop{margin:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-2)}
.sh-cropbox{position:relative}.sh-crop img{display:block;width:100%;height:120px;object-fit:contain;background:var(--paper)}
.sh-cropbox svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.sh-cropbox rect{fill:var(--sel-bg);stroke:var(--sel);stroke-width:2px;vector-effect:non-scaling-stroke}
.sh-crop figcaption{font-size:var(--fs-12);text-align:right}
.sh-3d{height:240px;flex:none;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--surface-2)}
.sh-foot{display:flex;gap:var(--s-2);align-items:center;padding:var(--s-2) var(--s-4);background:var(--surface);border-top:1px solid var(--line);box-shadow:var(--sh-2)}
.sh-foot .btn{flex:1;min-height:44px}.sh-foot .btn-short{flex:0 0 auto;padding:0 var(--s-4)}.sh-foot .btn-link,.q-acts .btn-link{min-height:44px}
.sh-head h2{flex:1;min-width:0}.sh-head h2:focus{outline:none}
.sh-dl{flex:none;min-height:44px;padding:0 var(--s-3);gap:var(--s-1)}.sh-dl small{font-weight:var(--fw-reg);color:var(--warn)}
.sh-proof{display:flex;flex-direction:column;gap:var(--s-3)}
.sh-note{margin:0 0 var(--s-2);padding:var(--s-1) var(--s-3);border-left:4px solid var(--neutral);border-radius:var(--r-sm);background:var(--neutral-bg);color:var(--neutral);font-size:var(--fs-13)}
.sh-crop.other img{filter:grayscale(1);opacity:.45}
/* ≤ 720 px: the selected card expanded with its proof (crop + compact 3D) right under it (UI v05) */
.rv-list li.q-proof{display:flex;flex-direction:column;gap:var(--s-2);min-height:0;padding:0 var(--s-3) var(--s-3);cursor:default;background:var(--accent-bg);box-shadow:inset 3px 0 0 var(--sel)}
.rv-list li.q-proof:hover{background:var(--accent-bg)}.rv-list li[aria-selected=true]:has(+ .q-proof){border-bottom:0}
.q-slot{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-2)}
.q-slot .sh-crop{padding:var(--s-1)}.q-slot .sh-crop img{height:96px}.q-slot .sh-crop figcaption{display:none}
.q-slot .sh-3d{height:180px}
.q-acts{display:flex;gap:var(--s-2);align-items:center;order:-1}   /* UI v06: the next control right under the card, above the dock at 390 */.q-acts .btn{min-height:44px}.q-acts [data-next]{margin-left:auto}
html.sheet-open{overflow:hidden}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.rv-list,.mini-c) .crop,:root:not([data-theme="light"]) .sh-crop img{filter:invert(.9) hue-rotate(180deg)}}
:root[data-theme="dark"] :is(.rv-list,.mini-c) .crop,:root[data-theme="dark"] .sh-crop img{filter:invert(.9) hue-rotate(180deg)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sh-crop.other img{filter:invert(.9) grayscale(1);opacity:.45}}
:root[data-theme="dark"] .sh-crop.other img{filter:invert(.9) grayscale(1);opacity:.45}
@media (max-width:1100px) and (min-width:721px){
  .review{grid-template-columns:var(--w-queue) minmax(0,1fr);grid-template-rows:auto minmax(260px,1fr) minmax(220px,1fr) auto;
    grid-template-areas:"top top" "queue draw" "queue model" "queue facts";height:auto;min-height:calc(100vh - 196px)}
}
@media (max-width:720px){
  .review{display:block;height:auto}
  .rv-draw,.rv-model,.rv-facts{display:none}
  .rv-top > .meta{display:none}
  .rv-top{gap:var(--s-2)}
  .rv-qhead .btn[data-filters]{margin-left:auto;min-height:36px}.rv-qhead .btn[data-filters] + .btn-ghost{margin-left:0}
  /* UI v05: the step strip already names "Prüfung". UI v06 (R10): "Ausnahmen" + "Alle" as chips and every other filter in
     one select, on one row with nothing cut off at the edge; "Suche ▾" sits in the queue head */
  .rv-top h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .rv-top .fchips{flex:1 1 100%;min-width:0;flex-wrap:nowrap;gap:var(--s-2)}
  .rv-top .fchips .fchip:nth-of-type(n+3){display:none}
  .rv-top .cfilters{display:none;flex:1 1 100%;order:3}.rv-top .cfilters.show{display:flex}.rv-top .cfilters input[type=search]{flex:1 1 200px}
  .fchip{min-height:44px}
  .fsel{flex:1 1 0;min-width:0;min-height:44px;width:auto;border-radius:var(--r-pill);font-size:var(--fs-13);padding:0 var(--s-2)}
  .fsel[data-on]{background:var(--accent-bg);border-color:var(--accent);color:var(--accent);font-weight:var(--fw-bold)}
  .rv-list li[data-kind=question] .o-l2,.rv-list li[data-kind=question] .q-title > .meta{display:none}   /* the mini-rows say it */
  .rv-queue{margin-top:var(--s-3)}
  .rv-list li{min-height:60px;padding:var(--s-2) var(--s-3) var(--s-2) var(--s-2)}
}

/* toasts */
#toasts{position:fixed;right:var(--s-4);bottom:var(--s-4);display:flex;flex-direction:column;gap:var(--s-2);z-index:var(--z-toast)}
.toast{padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--surface);color:var(--text);border:1px solid var(--line);
  border-left:4px solid var(--block);box-shadow:var(--sh-2);max-width:360px}
.toast[data-s=ok]{border-left-color:var(--ok)}.toast[data-s=info]{border-left-color:var(--info)}.toast[data-s=warn]{border-left-color:var(--warn)}

/* narrow: one column, compact bar, the primary moves to the sticky bottom dock */
@media (max-width:1100px){.home{grid-template-columns:1fr}.col-opt{display:none}}
@media (max-width:720px){
  main{padding:var(--s-3) var(--s-4) calc(var(--h-dock) + var(--s-6))}
  header.top{height:44px}.hide-narrow{display:none!important}.only-narrow{display:revert!important}
  .grid-main,.grid-half,.export-grid,.fields{grid-template-columns:1fr}
  ol.next-actions li{grid-template-columns:24px minmax(0,1fr)}ol.next-actions .to{grid-column:2}
  .seg.stage-ctl .opts{display:flex;width:100%}.seg.stage-ctl label{flex:1;justify-content:center}
  .dropzone{grid-template-columns:1fr;min-height:180px}
  .slot{flex-direction:row;justify-content:flex-start;text-align:left;padding:var(--s-3);flex-wrap:wrap}
  .statusbar .dock{grid-column:auto;grid-row:auto}
  .statusbar{grid-template-columns:1fr;padding:var(--s-2) var(--s-3);border-radius:0;margin:0 calc(-1 * var(--s-4)) var(--s-3);border-width:0 0 1px}
  .statusbar .part{font-size:var(--fs-14);overflow:hidden;min-width:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow-wrap:anywhere}
  .statusbar .l1 .chip.word{height:24px;font-size:var(--fs-12)}
  .statusbar .reason-d > summary{min-height:0;align-items:flex-start;font-size:var(--fs-12);font-weight:var(--fw-reg);color:var(--muted)}
  .statusbar .reason-d > summary > span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;flex:1;min-width:0}
  .statusbar .reason-d[open] > summary > span{display:block}
  .statusbar .l1{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--s-2)}.statusbar .l1 > :not(.part):not(.chip.word){grid-column:1/-1}
  .statusbar .l2{flex-wrap:nowrap;white-space:nowrap;overflow:hidden}.statusbar .counts{overflow:hidden;text-overflow:ellipsis;font-size:var(--fs-12)}
  .dock{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-dock);min-height:var(--h-dock);padding:var(--s-2) var(--s-4);
    background:var(--surface);border-top:1px solid var(--line);box-shadow:var(--sh-2);justify-content:stretch;flex-wrap:nowrap}
  .dock .btn{flex:1 1 0;min-width:0;white-space:normal;text-align:center;line-height:var(--lh-tight);padding:0 var(--s-2)}.dock .btn-primary{flex:1.6 1 0}
  .dock .btn-short{flex:0 0 auto;padding:0 var(--s-3)}.dock .btn-primary:has(+ .btn-short){flex:1 1 auto;white-space:nowrap}.dock .why{flex:1 1 100%;max-width:none;order:-1;margin:0}
  .dock:has(.why){flex-wrap:wrap}
  /* step strip (DESIGN §3, UI v04): one line "Schritt 3/4 · Prüfung · …" + 4 state dots (links once reached) */
  ol.steps{display:none}
  .steps-c{display:flex;align-items:center;gap:var(--s-2);margin:0 0 var(--s-3);min-height:44px}
  .steps-c p{margin:0;flex:1;min-width:0;font-size:var(--fs-13);line-height:var(--lh-tight)}
  .sdots{display:flex;flex:none}
  .sdot{display:grid;place-items:center;width:40px;height:44px}
  .sdot i{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--line-strong);color:var(--surface);
    font:normal var(--fw-bold) 11px/1 var(--font-ui)}   /* UI v07 (R11): glyph in the dot (✓ ! ✕ ?), never colour alone */
  .sdot[data-s=ok] i{background:var(--ok)}.sdot[data-s=warn] i{background:var(--warn)}.sdot[data-s=block] i{background:var(--block)}
  .sdot[data-s=info] i{background:var(--info)}.sdot[data-s=unknown] i{background:var(--unknown)}
  .sdot.off i{background:transparent;border:2px solid var(--line-strong)}
  .sdot.here i{box-shadow:0 0 0 3px var(--surface),0 0 0 5px var(--info)}
  .eta{grid-template-columns:1fr 1fr}
  .proc-grid{grid-template-columns:1fr;gap:0}
  .tcell{padding:2px}.tcell .tb,.tcell .lab .sep{display:none}.tcell .corner{top:auto;bottom:2px;right:2px}
  .tcell .lab .w{display:block;font-size:11px}   /* the state word stays (never colour + glyph alone) */
  .warnrows li{grid-template-columns:16px minmax(0,1fr);padding:var(--s-2) 0}.warnrows .btn{grid-column:2;justify-self:start;min-height:44px}
  .tsq{width:44px;height:44px}
  ol.stages{display:grid;grid-template-columns:1fr 1fr;gap:2px var(--s-3)}
  details.stages-d{margin-top:var(--s-2)}details.stages-d > summary{min-height:44px;gap:var(--s-2)}details.stages-d .stage-now{margin:0}
  ol.stages li{flex-direction:row;justify-content:space-between;padding:var(--s-1) 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;min-width:0}
  ol.stages li[data-s=info],ol.stages li[data-s=block]{border-color:var(--line)}
  /* the decision card at 390 (UI v05): two short lines, no boxes; the two ways are the dock's buttons */
  .banner .opts{grid-template-columns:1fr;gap:var(--s-1);margin-top:var(--s-2)}
  .banner .opt{display:block;background:none;border:0;padding:0;font-size:var(--fs-13)}
  .banner .opt b::after{content:": "}.banner .opt p{display:inline}
  .banner .opt[data-way]::before{content:"▸ ";color:var(--warn)}
  /* the stage decision keeps its buttons at 390 (its ways are not dock buttons) */
  .banner .opts.act{gap:var(--s-2)}.banner.decision .opts.act .opt{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);padding:var(--s-3)}
  .banner .opts.act .opt b::after{content:none}.banner .opts.act .opt[data-way]::before{content:none}.banner .opts.act .opt p{display:block}
  .banner .opts.act .btn{align-self:stretch;order:9;margin-top:var(--s-1)}
  .mini3d{height:200px}
  /* UI v06 (R10): on Eingaben the model and drawing come right after the banners, side by side, before the checklist */
  #body[data-tab=inputs] .grid-main > .side{order:-1;display:grid;grid-template-columns:1fr 1fr;gap:var(--s-3);align-items:start}
  #body[data-tab=inputs] .grid-main > .side > *{margin:0}#body[data-tab=inputs] .side > #readers{grid-column:1/-1}
  #body[data-tab=inputs] .side .card{padding:var(--s-3)}#body[data-tab=inputs] .side .card > .head{margin-bottom:var(--s-2)}
  #body[data-tab=inputs] .side .card > .head .meta{flex-basis:100%}
  #body[data-tab=inputs] .side .mini3d{height:150px}#body[data-tab=inputs] .side .thumbs{grid-template-columns:1fr}
  table.checks tr{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px var(--s-2);padding:var(--s-2) 0;border-bottom:1px solid var(--line)}
  table.checks td{display:block;height:auto;padding:0;border:0}table.checks td.s,table.checks td.k{width:auto}table.checks td:last-child{grid-column:1/-1;font-size:var(--fs-13)}
  .gi{grid-template-columns:auto minmax(0,1fr);gap:2px var(--s-2);padding:var(--s-2) 0}.gi .k{color:var(--text)}.gi .ev{grid-column:1/-1;color:var(--muted)}
  details.gate > ul.gitems,details.gate > details.oks{margin-left:0}
  .review-f{margin-left:0}.rv-import{grid-template-columns:minmax(0,1fr)}.rv-import .btn{min-height:44px}
  ol.next-actions .to .btn{min-height:44px}
  details.fold > summary .meta{margin-left:auto}details.fold > summary::after{margin-left:var(--s-1)}
  details.fold.gates-card > summary{font-weight:var(--fw-bold)}details.fold.gates-card details.gate:first-of-type{border-top:0}
  ul.list li{grid-template-columns:1fr auto}ul.list .facts{grid-column:1/-1;text-align:left}
  #toasts{left:var(--s-4);right:var(--s-4);bottom:calc(var(--h-dock) + var(--s-2));align-items:center}
  .sh-crop figcaption a,.joblist details.older summary,.joblist .dl{display:inline-flex;align-items:center;min-height:44px}   /* touch targets */
}
.mt{margin-top:var(--s-3)}.mb{margin-bottom:var(--s-2)}select.auto{width:auto}
.go.dock{justify-content:flex-start}
.warnlist{list-style:none;margin:var(--s-2) 0 0;padding:0}.warnlist li{padding:var(--s-1) 0;border-top:1px solid var(--line)}
.warnlist li:first-child{border-top:0}.warnlist .meta{display:block}
code{overflow-wrap:anywhere}.warnlist code{display:block;font-size:var(--fs-12);color:var(--muted)}
.warnlist details.raw summary{min-height:24px;font-size:var(--fs-12);font-weight:var(--fw-reg);color:var(--muted)}
.readerline .extras{flex-basis:100%}
.joblist details.older{grid-column:1/-1}.joblist details.older summary{min-height:28px;font-size:var(--fs-12);color:var(--muted);font-weight:var(--fw-reg)}
.joblist details.older li{grid-template-columns:1fr auto;padding:var(--s-1) 0 var(--s-1) var(--s-3);border-bottom:0}
.joblist details.older a.sub{text-decoration:none;color:var(--muted)}
.joblist [data-all]{margin-top:var(--s-2)}
ul.list.inline li{grid-template-columns:minmax(0,max-content) auto;justify-content:start}ul.list.inline .facts{text-align:left}   /* size + sha next to the name */
.sh-3dbox[data-picking] .pane{box-shadow:inset 0 0 0 2px var(--sel)}

/* It. 13: the question drawer (DESIGN §4 Drawers: right side over the 3D pane, never over the queue; ≤ 720 px a bottom
   sheet with a grab handle) and the email box on Export (editable, copy / download only, the [C1] tick) */
.rv-top .rv-qbtn{min-height:32px}
.q-drawer{position:fixed;top:var(--drawer-top,calc(var(--h-header) + var(--h-bar) + var(--h-step) + 2*var(--s-4)));right:0;bottom:0;width:min(var(--w-drawer),100vw);z-index:var(--z-drawer);background:var(--surface);
  border-left:1px solid var(--line);box-shadow:var(--sh-3);display:flex;flex-direction:column}
.q-scrim{display:none}
.qd-head{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-2) var(--s-2) var(--s-2) var(--s-4);border-bottom:1px solid var(--line)}
.qd-head .meta{flex:1}.qd-head h2:focus{outline:none}   /* focused on open for screen readers, not a control */.qd-x{font-size:var(--fs-20);min-width:var(--h-ctl)}
/* UI v09 (R12): the card picker scales: one grouped select between "‹" and "›", "3 von 18" */
.qd-nav{display:flex;align-items:center;gap:var(--s-1);padding:var(--s-2) var(--s-3);border-bottom:1px solid var(--line);background:var(--surface-2)}
.qd-pick{flex:1 1 0;min-width:0;width:auto;height:var(--h-ctl);font-size:var(--fs-13)}
.qd-step{min-width:var(--h-ctl);padding:0;font-size:var(--fs-20);line-height:1}.qd-pos{white-space:nowrap;font-size:var(--fs-12)}
/* the answer mode: a 2 × 2 grid at drawer width (UI v09, R11: "Nicht für / KMG" no longer wraps) */
fieldset.seg.qd-modes{display:block}.qd-modes legend{float:none;margin:0 0 var(--s-1)}
fieldset.seg.qd-modes .opts{display:grid;grid-auto-flow:row;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));width:100%;gap:1px;background:var(--line-strong)}
.qd-modes label{justify-content:center;white-space:nowrap;background:var(--surface)}.qd-modes label + label{border-left:0}
.qd-body{flex:1;overflow:auto;padding:var(--s-3) var(--s-4)}
.qd-foot{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2);padding:var(--s-3) var(--s-4);border-top:1px solid var(--line);background:var(--surface)}
.qd-chips{display:flex;flex-wrap:wrap;gap:var(--s-1);margin-bottom:var(--s-2)}
.qd-title{font-size:var(--fs-16);margin:0 0 2px}.qd-title .mono{font-size:var(--fs-16)}
.qd-crop{margin:var(--s-2) 0 var(--s-3)}.qd-crop figcaption{margin-top:2px}
.qd-cropbox{position:relative;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--paper)}
.qd-crop img{display:block;width:100%;height:auto;max-height:220px;object-fit:contain;background:var(--paper);border-radius:var(--r-md)}
.qd-cropbox img{border-radius:0}.qd-cropbox svg{position:absolute;inset:0;width:100%;height:100%}
.qd-cropbox rect{fill:var(--sel-bg);stroke:var(--sel);stroke-width:2;vector-effect:non-scaling-stroke}
.qd-q blockquote{margin:0 0 var(--s-1);padding:var(--s-2) var(--s-3);border-left:3px solid var(--unknown);background:var(--surface-2);border-radius:var(--r-sm)}
.qd-edit,.qd-owner,.qd-warn{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-1) var(--s-2);margin:var(--s-2) 0}
.qd-form{display:grid;gap:var(--s-2);margin-top:var(--s-3);padding-top:var(--s-3);border-top:1px solid var(--line)}
.qd-form .qd-what{margin:0}
.qd-opts{border:0;margin:0;padding:0}.qd-opts ul{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-1)}
.qd-opt{display:flex;gap:var(--s-2);align-items:flex-start;padding:var(--s-2);border:1px solid var(--line);border-radius:var(--r-md);cursor:pointer;font-size:var(--fs-13)}
.qd-opt:has(input:checked){border-color:var(--accent);background:var(--accent-bg)}
.qd-opt:has(input:disabled){opacity:.6;cursor:not-allowed}.qd-opt:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:1px}
.qd-opt input{width:auto;min-height:0;margin:3px 0 0}.qd-opt small{display:block}.qd-opt .chip{margin-left:var(--s-1);vertical-align:1px}
.qd-field{display:grid;gap:var(--s-1)}.qd-field > label{font-size:var(--fs-13);color:var(--muted)}
details.qd-field > summary{cursor:pointer;font-size:var(--fs-13);color:var(--accent);min-height:28px;display:flex;align-items:center}
.q-email .head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-2);margin-bottom:var(--s-2)}
.q-email-text{font:var(--fs-13)/var(--lh) var(--font-ui);min-height:320px;resize:vertical}
.q-c1{display:flex;align-items:center;gap:var(--s-2);margin:var(--s-3) 0 var(--s-2);font-weight:var(--fw-med)}
.q-email-acts .btn-link{margin-left:auto}
@media (max-width:720px){
  .q-drawer{top:auto;left:0;width:auto;height:90vh;border-left:0;border-top:1px solid var(--line);border-radius:var(--r-lg) var(--r-lg) 0 0}
  .q-scrim{display:block;position:fixed;inset:0;z-index:var(--z-drawer);background:rgb(0 0 0/.45)}.q-scrim[hidden]{display:none}
  .qd-grab{display:block!important;width:40px;height:4px;flex:none;border-radius:var(--r-pill);background:var(--line-strong);margin:var(--s-2) auto 0}
  .qd-foot{padding:var(--s-2) var(--s-3)}.qd-foot .btn{flex:1}.qd-foot [data-commit-why]{flex-basis:100%;text-align:center}
  .qd-body{padding:var(--s-3)}.qd-opt{min-height:44px}
  .q-email-text{min-height:260px}.q-email-acts .btn{flex:1}.q-email-acts .btn-link{margin-left:0}
}
html.drawer-open{overflow:hidden}
.q-dock{display:none!important}
/* UI v09 (R12/R3): ≥ 1101 px the drawer takes the 3D column: the grid closes it and the review keeps its own width left of
   the drawer, so the queue, the drawing, the facts strip and the toolbar stay whole (the drawer starts below the bar and
   the step strip, which stay visible); the review button hides while its drawer is open */
@media (min-width:1101px){
  html.drawer-open #body[data-tab=review]{margin-right:calc(var(--w-drawer) - var(--s-4) + var(--s-3))}
  html.drawer-open .review{grid-template-columns:var(--w-queue) minmax(0,1fr);grid-template-areas:"top top" "queue draw" "queue facts"}
  html.drawer-open .review[data-layout=table]{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"top top" "draw facts" "queue queue"}
  html.drawer-open .review .rv-model,html.drawer-open .rv-qbtn{display:none}
  /* UI v09 (R4): picking faces keeps the 3D pane full height (the editor grows under the drawing only) */
  .review[data-layout=list]:is([data-editing=faces],[data-editing=add]){grid-template-areas:"top top top" "queue draw model" "queue facts model"}
}
@media (max-width:720px){
  .dock .q-dock{display:inline-flex!important}.rv-top .rv-qbtn{display:none}
  /* UI v09 (R10): the question sheet shows the answer first: question, then the mode and options, the crop below */
  .qd-card{display:flex;flex-direction:column}.qd-card > :is(.qd-edit,.qd-owner,.qd-warn){order:4}.qd-card > .qd-crop{order:5}.qd-card > .engine-note{order:6}
  .qd-q blockquote{font-size:var(--fs-13)}.qd-crop img{max-height:160px}.qd-nav{padding:var(--s-2) var(--s-3)}.qd-pick,.qd-step{height:44px}
}
/* UI v10 (R4/R5): the independent review's findings in the queue; quoted reviewer text; hidden selected faces */
.rv-list li[data-kind=finding] .crop.none{font:var(--fw-bold) var(--fs-20)/1 var(--font-ui);color:var(--block);background:var(--block-bg);border-color:var(--block)}
q.rv-quote{quotes:"„" "“";font-style:normal}
.pane-cap .cap-unseen{display:inline-flex;flex-wrap:wrap;gap:var(--s-1);align-items:center}
.pane-cap .btn-cap{min-height:24px;font:var(--fw-bold) var(--fs-12)/1 var(--font-num);padding:0 var(--s-2);border:1px solid var(--sel);color:var(--text)}
/* UI v10 (R12): an open editor gets the height it needs (the drawing row shrinks), its buttons stay in view, and the
   sticky facts head never covers the labels it scrolls to */
.review[data-layout=list]:is([data-editing=faces],[data-editing=limits],[data-editing=add]){grid-template-rows:auto minmax(160px,1fr) auto}
.review:is([data-editing=faces],[data-editing=limits],[data-editing=add]) .rv-facts{max-height:calc(100vh - 360px);scroll-padding-top:64px;scroll-padding-bottom:var(--s-3)}
.rv-facts .op-f .op-btns{position:sticky;bottom:calc(-1 * var(--s-3));z-index:1;background:var(--accent-bg);padding:var(--s-2) 0;margin-bottom:calc(-1 * var(--s-2))}
.rv-facts .fx-head{box-shadow:0 1px 0 var(--line)}
/* the question drawer owns "Beantworten" and "Weiter" while it is open: the facts strip does not repeat them */
html.drawer-open .rv-facts [data-q-open],html.drawer-open .rv-facts .fx-acts [data-next],html.drawer-open .rv-facts .fx-acts kbd{display:none}
/* UI v10 (R10/R12): the gate F import files are drop-zone slots (the Home component), findings link to the review */
.rv-drop{min-height:0;padding:var(--s-2);gap:var(--s-2)}
.rv-import .rv-slot{flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-start;text-align:left;gap:var(--s-3);padding:var(--s-2) var(--s-3);min-height:64px;color:var(--text);font-size:var(--fs-14)}
.rv-slot .rv-sl{display:flex;flex-direction:column;gap:2px;min-width:0}.rv-slot strong{font:var(--fw-bold) var(--fs-14)/1.3 var(--font-num)}
.rv-slot.over{border-color:var(--accent);background:var(--accent-bg)}.rv-slot[aria-disabled=true]{opacity:.5;cursor:not-allowed}
a.rv-id{display:inline-flex;gap:var(--s-2);align-items:center;min-height:40px;text-decoration:none}a.rv-id .mono{text-decoration:underline;white-space:nowrap}
a.rv-id .crop{width:64px;height:40px;object-fit:contain;background:var(--paper);border:1px solid var(--block);border-left-width:3px;border-radius:var(--r-sm);display:grid;place-items:center;color:var(--muted)}
@media (max-width:720px){
  .pane-cap .btn-cap{min-height:44px}
  table.cardable thead{display:none}
  table.cardable,table.cardable tbody{display:block}
  table.cardable tr{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-1) var(--s-3);padding:var(--s-2) 0;border-top:1px solid var(--line)}
  table.cardable td{display:block;height:auto;padding:0;border:0;text-align:left}
  table.cardable td.col-opt{display:none}
  table.rv-items td[data-l=Befund]{grid-column:1/-1}
  table.rv-diff tr{grid-template-columns:minmax(0,1fr) auto}table.rv-diff td[data-l=Typ]{font-weight:var(--fw-med)}
  table.rv-diff td.num{grid-row:2;font-size:var(--fs-13)}table.rv-diff td.num::before{content:attr(data-l) " ";color:var(--muted);font-family:var(--font-ui)}
  table.rv-diff td.num[data-l=Inventar]{grid-column:1}table.rv-diff td.num[data-l="Part 21"]{grid-column:2;text-align:right}
  table.rv-diff td[data-l=Abgleich]{grid-column:2;grid-row:1;justify-self:end}
  .rv-drop{grid-template-columns:1fr}.rv-import .rv-slot{min-height:56px}
  table.rv-diff td[data-l=Klasse]{font-weight:var(--fw-med)}table.rv-diff td.num[data-l=erwartet]{grid-column:1}table.rv-diff td.num[data-l=MiCAT]{grid-column:2;text-align:right}
  a.rv-id{min-height:44px}
}
.q-acts:has(.q-find){flex-wrap:wrap}.q-find{flex:1 1 100%;margin:0;font-size:var(--fs-13);color:var(--text)}

/* It. 15: delivery card, sign-offs, SFA / pilot forms (reuse .review-f, .rv-steps, .rv-import, .rv-slot) */
.delivery-card .banner{width:100%;margin:var(--s-2) 0 0}
.delivery-card .signoff{width:100%;border-top:1px solid var(--line);padding-top:var(--s-2)}
ul.plain{list-style:none;margin:0;padding:0}.signoff ul.plain,.signoff ul.plain li{min-width:0}
.signoff ul.plain .q-c1{margin:var(--s-1) 0;font-weight:var(--fw-reg);min-width:0}
.signoff ul.plain .q-c1 .chip{flex:none}
.signoff ul.plain .q-c1 .clamp{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gate .review-f[data-sfa-panel] .facts,.gate .review-f[data-pilot-panel] .facts{margin-top:0}
.rv-import label.q-c1{flex-direction:row;align-items:center;gap:var(--s-2);color:var(--text);font-size:var(--fs-14);margin:var(--s-1) 0}
.rv-import label.q-c1 input{flex:none}
.rv-drop.one{grid-template-columns:1fr}