/* Oberfläche Richtung A "Werkbank" (Jens, 10.11.2026). Nur Variablen und kleine Bausteine, keine Fonts, keine URLs.
   Dunkel = :root, hell = html.hell. Namen wie heute (--bg --panel ...), neue mit --ui-. */
:root{
 --bg:#1d2127;--panel:#2a3038;--panel2:#343b45;--line:#4a5361;--txt:#e6ebf1;--dim:#9aa5b4;--acc:#e8902f;--accText:#1b1306;--map:#2f3d33;--ovl:rgba(42,48,56,.94);--r:10px;
 --p0:#3b82f6;--p1:#e5484d;
 --ui-accDark:#a8620f;--ui-good:#3fae5a;--ui-warn:#e0a020;--ui-bad:#d9453f;--ui-focus:#ffd84d;--ui-shadow:rgba(0,0,0,.5);
 --ui-rs:6px;--ui-bw:2px;--ui-press:3px;--ui-bh:32px;--ui-bh-sm:26px;
 --ui-fs1:13px;--ui-fs2:15px;--ui-fs3:18px;--ui-s1:4px;--ui-s2:8px;--ui-s3:12px;--ui-s4:16px;
 --ui-font:ui-rounded,"SF Pro Rounded",system-ui,-apple-system,"Segoe UI",sans-serif;
}
html.hell{
 --bg:#e9e3d6;--panel:#fbf7ee;--panel2:#efe8d8;--line:#c9bda4;--txt:#2b2a26;--dim:#6f6a5c;--acc:#e07a1f;--accText:#fff;--map:#bcd3a4;--ovl:rgba(251,247,238,.94);
 --ui-accDark:#a85410;--ui-shadow:rgba(80,60,20,.25);
}
/* Bausteine (Klassen mit ui-, damit nichts Bestehendes überschrieben wird) */
.ui-btn{min-height:var(--ui-bh);font:inherit;font-weight:600;color:var(--txt);background:var(--panel2);border:var(--ui-bw) solid var(--line);border-radius:var(--ui-rs);padding:7px 14px;cursor:pointer;box-shadow:0 var(--ui-press) 0 var(--line)}
.ui-btn:hover:not(:disabled){border-color:var(--acc)}.ui-btn:active:not(:disabled){transform:translateY(var(--ui-press));box-shadow:none}
.ui-btn.pri{background:var(--acc);color:var(--accText);border-color:var(--ui-accDark);box-shadow:0 var(--ui-press) 0 var(--ui-accDark)}
.ui-btn.pri.wait{background:var(--panel2);color:var(--dim);border-color:var(--line);box-shadow:0 var(--ui-press) 0 var(--line)}
.ui-btn.sm{min-height:var(--ui-bh-sm);padding:3px 9px;font-size:var(--ui-fs1)}.ui-btn:disabled{opacity:.45;cursor:default}
.ui-panel{background:var(--panel);border:var(--ui-bw) solid var(--line);border-radius:var(--r);padding:var(--ui-s3) 14px;box-shadow:0 var(--ui-press) 0 var(--line)}
.ui-lbl{font-size:11px;color:var(--dim);font-weight:600}
.ui-num{font-family:var(--ui-font);font-variant-numeric:tabular-nums}
.ui-kacheln{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ui-s2);margin-top:var(--ui-s2)}
.ui-kacheln>div{background:var(--panel2);border:1px solid var(--line);border-radius:var(--ui-rs);padding:4px 6px;text-align:center}
.ui-kacheln b{display:block;font-size:var(--ui-fs3)}.ui-kacheln span{font-size:11px;color:var(--dim)}
.ui-reiter{display:flex;margin-bottom:var(--ui-s3)}.ui-reiter>*{padding:6px 14px;border:1px solid var(--line);margin-left:-1px;background:var(--panel2);color:var(--dim);font-weight:600;cursor:pointer}
.ui-reiter>*:first-child{border-radius:var(--ui-rs) 0 0 var(--ui-rs)}.ui-reiter>*:last-child{border-radius:0 var(--ui-rs) var(--ui-rs) 0}
.ui-reiter>.on,.ui-reiter>[aria-selected=true]{background:var(--acc);color:var(--accText);border-color:var(--ui-accDark)}
.ui-phasen{display:flex}.ui-phasen>span{padding:4px 12px;font-size:12px;font-weight:600;border:1px solid var(--line);margin-left:-1px;background:var(--panel2);color:var(--dim)}
.ui-phasen>.on{background:var(--acc);color:var(--accText);border-color:var(--ui-accDark)}.ui-phasen>.done{color:var(--txt)}.ui-phasen>.done::before{content:"✓ "}
.ui-zeile{display:flex;align-items:center;gap:var(--ui-s3);padding:var(--ui-s2) 0;border-bottom:1px solid var(--line)}.ui-zeile>:first-child{flex:1}
svg.ui-ic{width:18px;height:18px;vertical-align:-4px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
:focus-visible{outline:3px solid var(--ui-focus);outline-offset:2px}
