/* ===== Looks: Stellwerk (Standard) · Konsole · Klar ===== */
:root[data-look=konsole]{
  --bg:#0B111C;--surface:#141C2B;--surface2:#1A2438;--hover:#1E2942;
  --ink:#E8EDF5;--ink2:#A9B4C6;--ink3:#7B889D;
  --frame:#26334A;--line:#33425E;--line2:#222D42;
  --chrome:#0F1626;--chrome-ink:#AAB6CA;--chrome-hover:#1A2438;--chrome-on:#7AA2FF;--chrome-line:#1F2A40;
  --brand:#6B7CFF;--brand-ink:#fff;--brand-bg:#222B52;--brand-grad:linear-gradient(90deg,#6B6BFF,#19B6E0);
  --block:#FF8080;--block-bg:#3A1F28;--block-line:#6B3340;
  --warn:#F2B34C;--warn-bg:#3A2E16;--ok:#4CD39A;--ok-bg:#15382C;
  --ai:#B79CFF;--ai-bg:#2A2150;--off:#8794A8;--off-bg:#212B3E;
  --code:#0A0F19;--codeink:#C9D4E6;--hit:#40202A;--lamp-off:#2B364B;
  --r:12px;--bw:1px;--shadow:0 1px 0 rgba(255,255,255,.03) inset;--s-crit:#FF5D5D;--s-high:#FF9A4D;--s-med:#F2C94C;--s-low:#6B9CFF;--s-info:#7B889D;--s-txt:#101826;
  --disp:'Bricolage Grotesque','Instrument Sans',system-ui,sans-serif;
  --body:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'Martian Mono',ui-monospace,Consolas,monospace;
  --htrans:none;--hls:-.01em;--h1:28px;--h2:17px;--h3:14.5px;--base:14.5px;--ctrans:none;--cls:0;--csize:12px;
}
:root,[data-look=klar]{
  --bg:#E8ECF0;--surface:#FFFFFF;--surface2:#F6F8FA;--hover:#F1F4F7;
  --ink:#16202C;--ink2:#4A586A;--ink3:#7A8797;
  --frame:#D3DAE2;--line:#CBD3DC;--line2:#E6EAEF;
  --chrome:#111A25;--chrome-ink:#C4CFDC;--chrome-hover:#1C2937;--chrome-on:#6E93FF;--chrome-line:#243244;
  --brand:#1F4FD8;--brand-ink:#fff;--brand-bg:#E4EBFC;--brand-grad:#1F4FD8;
  --block:#C62F2F;--block-bg:#FBE9E9;--block-line:#E2B4B4;
  --warn:#A86A06;--warn-bg:#FBF1DC;--ok:#2B7A4B;--ok-bg:#E3F3EA;
  --ai:#6A44B5;--ai-bg:#EEE8F9;--off:#8A95A3;--off-bg:#EEF1F4;
  --code:#0F1722;--codeink:#C9D4E3;--hit:#3A1D24;--lamp-off:#3A4452;
  --r:8px;--bw:1px;--shadow:none;--s-crit:#B71C1C;--s-high:#C84A07;--s-med:#F2B80C;--s-low:#3B6FC4;--s-info:#8E99A4;--s-txt:#fff;
  --disp:'Bricolage Grotesque','Instrument Sans',system-ui,sans-serif;
  --body:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'Martian Mono',ui-monospace,Consolas,monospace;
  --htrans:none;--hls:-.01em;--h1:28px;--h2:17px;--h3:14.5px;--base:14.5px;--ctrans:none;--cls:0;--csize:12px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font:400 var(--base)/1.5 var(--body)}
h1,h2,h3{font-family:var(--disp);margin:0;letter-spacing:var(--hls);text-transform:var(--htrans)}
h1{font-size:var(--h1);font-weight:700;line-height:1.1}
h2{font-size:var(--h2);font-weight:700}
h3{font-size:var(--h3);font-weight:700}
a{color:var(--brand);text-decoration:none}
[data-look=konsole] a{color:#8FB0FF}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
[data-look=konsole] :focus-visible{outline-color:#8FB0FF}
.muted{color:var(--ink2)}.faint{color:var(--ink3)}
.mono{font-family:var(--mono);font-size:12px}

/* shell: Stellwerk = Kopfleiste, Konsole/Klar = Seitenleiste */
.app{display:grid;grid-template-columns:236px 1fr;min-height:100vh}
.side{background:var(--chrome);color:var(--chrome-ink);padding:20px 14px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.logo{display:flex;align-items:center;gap:10px;padding:2px 8px 22px;font:700 19px var(--disp);color:#fff;letter-spacing:var(--hls);text-transform:var(--htrans)}
.logo i{width:26px;height:26px;border-radius:var(--r);background:repeating-linear-gradient(135deg,#E03B32 0 5px,#fff 5px 10px);flex:none}
.nav a{display:flex;justify-content:space-between;align-items:center;padding:9px 10px;margin-bottom:2px;border-radius:var(--r);color:var(--chrome-ink);font-weight:500}
.nav a:hover{background:var(--chrome-hover);color:#fff}
.nav a.on{background:var(--chrome-hover);color:#fff;box-shadow:inset 3px 0 0 var(--chrome-on)}
.badge{background:#E24B4B;color:#fff;font:600 11px var(--body);padding:1px 7px;border-radius:99px}
.who{margin-top:auto;padding:12px 8px 0;border-top:1px solid var(--chrome-line);font-size:13px}
.who b{display:block;color:#fff}
.who select{width:100%;margin-top:8px;background:var(--chrome-hover);color:var(--chrome-ink);border:1px solid var(--chrome-line);border-radius:var(--r);padding:6px;font:inherit}
.who a{display:inline-block;margin-top:8px;color:#8FA3BC;font-size:12.5px}
.main{padding:30px 38px 60px;width:100%;min-width:0}
.top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:22px;flex-wrap:wrap}
.crumb{font-size:13px;color:var(--ink3);margin-bottom:6px}
.crumb a{color:var(--ink2)}
.sub{color:var(--ink2);margin-top:4px}

/* controls */
.btn{border:var(--bw) solid var(--frame);background:var(--surface);border-radius:var(--r);padding:7px 14px;font-weight:600;line-height:1.3}
.btn:hover{background:var(--hover)}
.btn.pri{background:var(--brand-grad);border-color:var(--brand);color:var(--brand-ink)}
.btn.pri:hover{filter:brightness(1.1);background:var(--brand-grad)}
[data-look=konsole] .btn.pri{border-color:transparent}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
[data-look=konsole] .btn.ok{color:#06281C}
.btn.danger{color:var(--block);border-color:var(--block-line)}
.btn.sm{padding:4px 11px;font-size:13px}
.btn[disabled]{opacity:.4;cursor:not-allowed}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.chip{display:inline-block;padding:1px 9px;border-radius:var(--r);font:600 var(--csize) var(--body);letter-spacing:var(--cls);text-transform:var(--ctrans);background:var(--off-bg);color:var(--ink2);white-space:nowrap}
[data-look=konsole] .chip,[data-look=klar] .chip{border-radius:99px}
.chip.block{background:var(--block-bg);color:var(--block)}.chip.warn{background:var(--warn-bg);color:var(--warn)}
.chip.ok{background:var(--ok-bg);color:var(--ok)}.chip.ai{background:var(--ai-bg);color:var(--ai)}.chip.brand{background:var(--brand-bg);color:var(--brand)}
[data-look=konsole] .chip.brand{color:#9DB6FF}
.tabs{display:flex;gap:2px;border-bottom:var(--bw) solid var(--frame);margin-bottom:20px;flex-wrap:wrap}
.tabs a{padding:9px 16px;color:var(--ink2);font:600 16px var(--body);border-bottom:4px solid transparent;margin-bottom:calc(var(--bw) * -1)}
.tabs a.on{color:var(--ink);border-color:var(--chrome-on)}
[data-look=klar] .tabs a.on,[data-look=konsole] .tabs a.on{border-width:2px;border-color:var(--brand)}
[data-look=konsole] .tabs a.on{border-color:#7AA2FF}
.card{background:var(--surface);border:var(--bw) solid var(--frame);border-radius:var(--r);padding:18px 20px;margin-bottom:18px;box-shadow:var(--shadow)}
.card>h2{margin-bottom:12px}
.grid2{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}
table{width:100%;border-collapse:collapse}
.tw{overflow-x:auto}
th{text-align:left;font:600 12px var(--body);color:var(--ink3);text-transform:uppercase;letter-spacing:.06em;padding:0 12px 8px 0}
td{padding:11px 12px 11px 0;border-top:1px solid var(--line2);vertical-align:middle}
tr.link{cursor:pointer}tr.link:hover td{background:var(--hover)}
.empty{padding:26px;text-align:center;color:var(--ink2);border:2px dashed var(--line);border-radius:var(--r)}
label{display:block;font-weight:600;font-size:13px;margin:12px 0 4px}
input[type=text],input[type=search],input[type=date],input[type=email],input[type=password],select,textarea{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:var(--r);font:inherit;background:var(--surface);color:var(--ink)}
[hidden]{display:none!important}
[data-look=konsole] input[type=date]{color-scheme:dark}
input[type=search]{appearance:none;-webkit-appearance:none}
textarea{min-height:84px;resize:vertical}
.sw{display:inline-flex;width:40px;height:22px;border-radius:99px;background:var(--line);border:0;padding:2px;transition:background .15s;flex:none}
.sw i{width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .15s}
.sw.on{background:var(--ok)}.sw.on i{transform:translateX(18px)}
[data-look=konsole] .sw.on{background:#2FB683}
.segctl{display:inline-flex;border:var(--bw) solid var(--frame);border-radius:var(--r);overflow:hidden}
.segctl button{border:0;background:var(--surface);padding:5px 12px;font-size:13px;font-weight:600;border-left:1px solid var(--line2)}
.segctl button:first-child{border-left:0}
.segctl button:hover{background:var(--hover)}
.segctl button.on[data-value=off]{background:var(--off-bg);color:var(--ink)}
.segctl button.on[data-value=warn],.segctl button.on[data-value=changed]{background:var(--warn-bg);color:var(--warn)}
.segctl button.on[data-value=block],.segctl button.on[data-value=full]{background:var(--block-bg);color:var(--block)}

/* Schranke: Zustandsleiste eines Laufs (Erkennungszeichen) */
.gate{display:grid;grid-template-columns:repeat(5,1fr);border:var(--bw) solid var(--frame);border-radius:var(--r);overflow:hidden;background:var(--surface);margin-bottom:20px;box-shadow:var(--shadow)}
.seg{padding:18px 16px 13px;border-left:1px solid var(--line2);position:relative}
.seg:first-child{border-left:0}
.seg::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:var(--off)}
.seg.s-ok::before{background:var(--ok)}.seg.s-warn::before{background:var(--warn)}
.seg.s-block::before{height:9px;background:repeating-linear-gradient(135deg,var(--block) 0 7px,#fff 7px 14px)}
[data-look=konsole] .seg.s-block::before{background:repeating-linear-gradient(135deg,#FF6B6B 0 7px,#2A1620 7px 14px)}
.seg .n{display:flex;align-items:center;gap:8px;font:700 14px var(--disp);letter-spacing:var(--hls);text-transform:var(--htrans)}
.seg .n::before{content:"";width:11px;height:11px;border-radius:50%;background:var(--off);flex:none}
.s-ok .n::before{background:var(--ok);box-shadow:0 0 0 3px var(--ok-bg)}
.s-warn .n::before{background:var(--warn);box-shadow:0 0 0 3px var(--warn-bg)}
.s-block .n::before{background:var(--block);box-shadow:0 0 0 3px var(--block-bg)}
.seg .st{display:block;margin-top:8px;font:700 24px var(--disp);letter-spacing:var(--hls);text-transform:var(--htrans)}
.s-ok .st{color:var(--ok)}.s-warn .st{color:var(--warn)}.s-block .st{color:var(--block)}.s-off .st{color:var(--off)}
.seg .md{font:400 11px var(--mono);color:var(--ink3);margin-top:3px;display:block}
.mini{display:inline-flex;gap:4px;vertical-align:middle;background:#13171C;padding:4px 6px;border-radius:99px}
.mini i{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--lamp-off);font:700 8.5px/1 var(--mono);font-style:normal;letter-spacing:0;color:#13171C}
.mini .s-ok{background:#3DDC84}.mini .s-warn{background:#F2B80C}
.mini .s-block{background:#FF4B3E;color:#fff;box-shadow:0 0 0 2px rgba(255,75,62,.35)}
.mini .s-off{background:var(--lamp-off);color:#6B7480}
.mini .s-none{background:transparent;box-shadow:inset 0 0 0 1.5px #7A8794;color:#9AA5B1}
.mini .s-run{background:#F2B80C;animation:dg-pulse 1.2s ease-in-out infinite}
@keyframes dg-pulse{50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.mini .s-run{animation:none}.chip.live{animation:none}}
.chip.live{animation:dg-pulse 1.6s ease-in-out infinite}
tr[data-running]{background:var(--warn-bg)}
.bar{height:6px;border-radius:3px;background:var(--line2);margin-top:4px;min-width:120px;overflow:hidden}
.bar span{display:block;height:100%;background:var(--warn)}
.seg.s-none::before{background:transparent;border-top:2px dashed var(--off)}
.s-none .n::before{background:transparent;box-shadow:inset 0 0 0 2px var(--off)}
.s-none .st{color:var(--ink3)}
.seg .st.small{font-size:15px;line-height:1.25}

/* Funde */
.frow{width:100%;text-align:left;background:var(--surface);border:var(--bw) solid var(--frame);border-radius:var(--r);padding:12px 14px;display:flex;gap:12px;align-items:center}
.frow:hover{background:var(--hover)}
.frow .loc{font:400 12px var(--mono);color:var(--ink2);margin-left:auto;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:46%}
.frow .msg{font-weight:600}
.fwrap{margin-bottom:12px}
.fwrap.dim .frow{opacity:.75}
.fbody{border:var(--bw) solid var(--frame);border-top:0;border-radius:0 0 var(--r) var(--r);overflow:hidden;margin-top:-4px;padding-top:6px;background:var(--code)}
.code{padding:6px 0;font:400 12px/1.7 var(--mono);color:var(--codeink);overflow-x:auto}
.ln{display:flex;white-space:pre;padding-right:16px}
.ln .no{flex:0 0 52px;text-align:right;padding-right:14px;color:#5E6E85;user-select:none}
.ln.hit{background:var(--hit);color:#fff}
.ln.hit .no{color:#FF9B9B}
.note{margin:8px 16px 10px 52px;background:var(--surface);color:var(--ink);border-radius:var(--r);border-left:5px solid var(--block);padding:12px 14px;white-space:normal;font:400 14.5px/1.5 var(--body);min-width:300px;max-width:none}
.note.ai{border-color:var(--ai)}.note.warn{border-color:var(--warn)}.note.ok{border-color:var(--ok)}
.note .h{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.note .rule{font:400 11.5px var(--mono);color:var(--ink3)}
.note p{margin:4px 0 10px}
.note .acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.filters{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.filters button{border:var(--bw) solid var(--frame);background:var(--surface);border-radius:var(--r);padding:4px 14px;font-size:13.5px;font-weight:600}
.filters button.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.sect{font:600 12px var(--body);text-transform:uppercase;letter-spacing:.08em;color:var(--ink3);margin:22px 0 10px}

/* Einstellungen je Prüfung */
.tool{border:var(--bw) solid var(--frame);border-radius:var(--r);margin-top:14px;overflow:hidden}
.tool .th{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:11px 14px;background:var(--surface2);border-bottom:1px solid var(--line2)}
.tool .th>b{font:700 var(--h3) var(--disp);letter-spacing:var(--hls);text-transform:var(--htrans)}
.tool .th select{width:auto;padding:5px 8px;font-size:13px}
.tool.off .fgrid{opacity:.45}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:2px 16px;padding:4px 14px 14px}
.fgrid label{margin:10px 0 4px}
.fgrid .h{font-size:12px;color:var(--ink3);margin-top:3px}
.fgrid .wide{grid-column:1/-1}
.chk{display:flex;flex-wrap:wrap;gap:6px 14px}
.chk label{display:flex;align-items:center;gap:6px;margin:0;font-weight:500}
.chk input,label input[type=checkbox]{width:auto}
.fsw{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px}
.fsw b{font-size:13px}
.pick{display:block;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;margin-bottom:8px}
.pick.on{border-color:var(--brand);background:var(--brand-bg);box-shadow:inset 4px 0 0 var(--brand)}
[data-look=konsole] .pick.on{border-color:#7AA2FF;box-shadow:inset 4px 0 0 #7AA2FF}
.vars{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
.vars span{font:400 11.5px var(--mono);background:var(--off-bg);border-radius:var(--r);padding:2px 7px}
textarea.big{min-height:260px;font:400 12.5px/1.6 var(--mono)}
.stat{display:inline-block;min-width:110px;margin:0 14px 6px 0}
.stat b{display:block;font:700 30px var(--disp);letter-spacing:var(--hls)}
.stat span{font-size:12.5px;color:var(--ink3);text-transform:var(--ctrans);letter-spacing:var(--cls)}

/* Freigaben */
.req{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}
.req+.req{border-top:1px solid var(--line2);margin-top:14px;padding-top:14px}
.reason{background:var(--surface2);border-radius:var(--r);padding:8px 11px;margin-top:8px;font-size:14px;color:var(--ink2)}
.hint{font-size:12.5px;color:var(--ink3);margin-top:6px;text-align:right;max-width:230px}

/* Fenster, Meldung, Bericht */
.ov{position:fixed;inset:0;background:rgba(10,14,20,.62);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal{background:var(--surface);color:var(--ink);border:var(--bw) solid var(--frame);border-radius:var(--r);padding:24px;width:100%;max-width:560px;max-height:90vh;overflow:auto}
.modal.wide{max-width:720px}
.modal h2{margin-bottom:4px}
.modal .acts{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.pre{background:var(--code);color:#D5E0EF;border-radius:var(--r);padding:12px 14px;font:400 12px/1.7 var(--mono);white-space:pre-wrap;word-break:break-all;margin:8px 0}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--surface);padding:10px 18px;border-radius:var(--r);z-index:60;box-shadow:0 8px 24px rgba(0,0,0,.3);max-width:92vw;font-weight:500}
.sheet{background:#fff;color:#16202C;border:1px solid #D3DAE2;padding:30px 34px;font-size:13px}
.sheet h2{font-size:20px}
.sheet .kv{display:grid;grid-template-columns:110px 1fr;gap:2px 10px;margin:12px 0 16px;font-size:12.5px}
.sheet .fnd{border-top:1px solid #D3DAE2;padding:10px 0}
.sheet th{color:#6E7883}.sheet td{border-color:#E6EAEF}
.qr{width:132px;height:132px;border:6px solid #fff;outline:1px solid var(--line);background:conic-gradient(#111 25%,#fff 0 50%,#111 0 75%,#fff 0) 0 0/22px 22px}
.center{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.auth{background:var(--surface);border:var(--bw) solid var(--frame);border-radius:var(--r);padding:34px;width:100%;max-width:410px}
.auth .logo{color:var(--ink);padding:0 0 22px}
.warnbar{background:var(--warn-bg);border:1px solid var(--warn);color:var(--warn);padding:10px 14px;border-radius:var(--r);margin-bottom:16px;font-weight:600}

.logo{white-space:nowrap}
.sev{display:inline-flex;align-items:center;gap:6px;padding:1px 10px 1px 8px;border-radius:var(--r);font:700 var(--csize) var(--body);letter-spacing:var(--cls);text-transform:var(--ctrans);white-space:nowrap;color:var(--s-txt)}
.sev::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.85}
.sev.crit{background:var(--s-crit)}.sev.high{background:var(--s-high)}
.sev.med{background:var(--s-med);color:#101826}.sev.low{background:var(--s-low)}
.sev.info{background:var(--off-bg);color:var(--ink2)}
.fwrap{--sevc:var(--frame)}
.fwrap.v-crit{--sevc:var(--s-crit)}.fwrap.v-high{--sevc:var(--s-high)}.fwrap.v-med{--sevc:var(--s-med)}.fwrap.v-low{--sevc:var(--s-low)}.fwrap.v-info{--sevc:var(--s-info)}
.frow{border-left:8px solid var(--sevc)}
.fbody{border-left:8px solid var(--sevc)}
.sevbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.sevbar .lbl{font:600 12px var(--body);text-transform:uppercase;letter-spacing:.06em;color:var(--ink3);margin-right:4px}
.sevb{border:var(--bw) solid var(--frame);border-left:6px solid var(--sevc,var(--frame));background:var(--surface);border-radius:var(--r);padding:4px 12px;font-weight:600;font-size:13.5px;display:inline-flex;gap:7px;align-items:baseline}
.sevb b{font:700 18px var(--disp)}
.sevb.crit{--sevc:var(--s-crit)}.sevb.high{--sevc:var(--s-high)}.sevb.med{--sevc:var(--s-med)}.sevb.low{--sevc:var(--s-low)}.sevb.info{--sevc:var(--s-info)}
.sevb.zero{opacity:.5}
.sevb.on{background:var(--ink);color:var(--surface)}
.linkbtn{border:0;background:none;color:var(--brand);font-weight:600;text-decoration:underline;padding:4px 6px}
[data-look=konsole] .linkbtn{color:#8FB0FF}
.legend td{vertical-align:top;padding-right:16px}
.cmdc{font:600 13px var(--mono);background:var(--surface2);padding:2px 7px;border-radius:var(--r);white-space:nowrap}
.faq h3{margin:16px 0 4px}
.faq p{margin:0;color:var(--ink2)}
.pgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:12px}
.pstat,.scard{background:var(--surface2);border:1px solid var(--line2);border-radius:var(--r);padding:12px 14px}
.pstat span,.scard .t{display:block;font-size:12.5px;color:var(--ink3);margin-bottom:4px}
.pstat b{font:700 30px var(--disp);letter-spacing:var(--hls)}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin-bottom:14px}
.scard{background:var(--surface);border:var(--bw) solid var(--frame)}
.scard b.big{display:block;font:700 30px var(--disp);letter-spacing:var(--hls)}
.scard .m{font-size:13px;color:var(--ink2)}
.scard ul{list-style:none;margin:0;padding:0;font-size:14px}
.scard li{display:flex;justify-content:space-between;padding:2px 0}
.age{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.age div{border:1px solid var(--line2);border-radius:var(--r);padding:6px 10px;font-size:13px}
.age b{font:700 18px var(--disp);margin-left:4px}
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.leg{display:flex;gap:12px;flex-wrap:wrap;font-size:12.5px;color:var(--ink2);margin:6px 0 0}
.leg i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.risk{display:flex;justify-content:space-between;align-items:flex-start;border:1px solid var(--line2);border-radius:var(--r);padding:12px 14px;background:var(--surface);cursor:pointer;margin-bottom:8px;gap:12px}
.risk:hover{background:var(--hover)}
@media (max-width:860px){.pgrid,.sgrid,.cgrid{grid-template-columns:1fr 1fr}}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;gap:8px;padding:12px 16px}
  .logo{padding:0 10px 0 0}.nav{display:flex;flex-wrap:wrap;gap:2px}
  .who{margin:0;border:0;padding:0}
  .main{padding:20px 16px 50px}
  .gate{grid-template-columns:1fr 1fr}.seg:nth-child(3){border-left:0}
  .grid2{grid-template-columns:1fr}
  .req{grid-template-columns:1fr}.hint{text-align:left}
  .frow{flex-wrap:wrap}.frow .loc{max-width:100%;margin-left:0}
}
.tool .tdesc{padding:10px 14px 0;color:var(--ink2)}
.tool .tcmd{margin:8px 14px 0}
.tool .tfoot{padding:0 14px 14px}
.tool .baseline{margin-top:10px;justify-content:space-between}
.refcfg summary{cursor:pointer;font-weight:600;margin:12px 0 4px}
.meta dl{margin:0}.meta dt{color:var(--ink3);font-size:13px;margin-top:10px}.meta dt:first-child{margin-top:0}.meta dd{margin:0}
.fhead{font-weight:600;margin:18px 0 8px;color:var(--ink2)}
.step{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:start;padding:14px 0;border-top:1px solid var(--line2)}
.step .num{font:700 18px var(--disp);width:36px;height:36px;border:var(--bw) solid var(--frame);border-radius:var(--r);display:grid;place-items:center}
.step.done .num{background:var(--ok);color:#fff;border-color:var(--ok)}
.chkline{display:flex;gap:6px;align-items:center;margin:0;font-weight:500}
.chkline input{width:auto}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
/* ===== Anwendung ===== */
.read-filters{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.read-filters label{flex:1 1 150px;margin:0;min-width:0}
.read-filters input,.read-filters select{display:block;width:100%;min-width:0;height:38px}
.read-filters label:has(input[type=search]){flex:2 1 220px}
.form-actions{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.form-actions label{flex:1 1 220px;max-width:320px;min-width:0;margin:0}
.form-actions input{display:block;height:40px}
.form-actions button{min-height:40px}
.metric-missing{fill:none;stroke:var(--ink3);stroke-dasharray:3 3}.metric-chart .metric-grid{stroke:var(--line2);stroke-dasharray:2 3}
.read-text{overflow-wrap:anywhere;min-width:0}
.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:14px 0}
.plain-text{white-space:pre-wrap;overflow-wrap:anywhere}
.comment+.comment{border-top:1px solid var(--line2);padding-top:12px}
.scard .t{font-size:13px;font-weight:500;text-transform:none;letter-spacing:normal}
.frow .msg{flex:1;min-width:0}
.fwrap summary{cursor:pointer;list-style:none}
.fwrap summary::-webkit-details-marker{display:none}
@media(max-width:600px){.sgrid,.cgrid{grid-template-columns:1fr}.note{margin-left:12px;min-width:0}.frow .loc{max-width:100%}}
.flash{padding:10px 14px;border-radius:var(--r);margin-bottom:16px;font-weight:600;border:1px solid var(--line)}
.flash.success{background:var(--ok-bg);color:var(--ok);border-color:var(--ok)}
.flash.error,.error{background:var(--block-bg);color:var(--block);border:1px solid var(--block-line);padding:10px 14px;border-radius:var(--r);margin:0 0 12px;font-weight:600}
.flash.info{background:var(--panel2,transparent);color:var(--text);border-color:var(--line)}
.flash.warning{background:var(--warn-bg);color:var(--warn);border-color:var(--warn)}
dialog.modal{padding:24px;width:min(560px,calc(100vw - 32px));margin:auto}
dialog.modal::backdrop{background:rgba(10,14,20,.62)}
dialog.modal .acts{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.linkbox{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.linkbox input{flex:1;min-width:220px;font:400 12px var(--mono)}
form.inline{display:inline}
.btn.link{border:0;background:none;color:var(--brand);padding:4px 6px;text-decoration:underline}
.side form.logout{margin-top:8px}
.side .logoutbtn{background:none;border:0;padding:0;color:#8FA3BC;font-size:12.5px;cursor:pointer;text-decoration:underline}
.auth form{margin-top:4px}
.auth button[type=submit]{margin-top:18px;border:var(--bw) solid var(--brand);background:var(--brand-grad);color:var(--brand-ink);border-radius:var(--r);padding:8px 16px;font-weight:600;cursor:pointer}
.sr{position:absolute;left:-9999px}
.tabs span.later{padding:9px 16px;color:var(--ink3);font:600 16px var(--body);cursor:not-allowed;opacity:.55}

/* Prüf-Einstellungen */
.tool>summary{list-style:none;cursor:pointer}
.tool>summary::-webkit-details-marker{display:none}
.tool>summary::before{content:"▾";margin-right:8px;color:var(--ink3)}
.tool:not([open])>summary::before{content:"▸"}
.tool fieldset.fgrid{min-width:0}
.segctl label{display:inline-block;margin:0;border-left:1px solid var(--line2);background:var(--surface);padding:5px 12px;font-size:13px;font-weight:600;cursor:pointer}
.segctl label:first-child{border-left:0}
.segctl label input{position:absolute;opacity:0;width:0;height:0}
.segctl label:hover{background:var(--hover)}
.segctl label:has(input:focus-visible){outline:3px solid var(--brand);outline-offset:-3px}
.segctl label[data-value=off]:has(input:checked){background:var(--off-bg);color:var(--ink)}
.segctl label[data-value=warn]:has(input:checked),.segctl label[data-value=changed]:has(input:checked){background:var(--warn-bg);color:var(--warn)}
.segctl label[data-value=block]:has(input:checked),.segctl label[data-value=full]:has(input:checked){background:var(--block-bg);color:var(--block)}
.swc{display:inline-flex;align-items:center;flex:0 0 40px;width:40px;height:22px;vertical-align:middle;margin:0}
.fsw>div{min-width:0;overflow-wrap:anywhere}
.swc input[type=checkbox]{appearance:none;-webkit-appearance:none;display:block;flex:none;width:40px;min-width:40px;height:22px;border-radius:99px;background:var(--line);position:relative;cursor:pointer;margin:0;transition:background .15s}
.swc input::before{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .15s}
.swc input:checked{background:var(--ok)}
.swc input:checked::before{transform:translateX(18px)}
.swc input:disabled{opacity:.5;cursor:not-allowed}
.swc input:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
.pre.command{white-space:pre-wrap;word-break:break-all;margin:8px 0}
.pre.install-help{white-space:pre-wrap;overflow-wrap:anywhere}
.commands-page .pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.commands-table code { display: block; margin-bottom: 8px; overflow-wrap: anywhere; }
.commands-page details summary { cursor: pointer; font-weight: 600; margin: 12px 0; }
@media (max-width: 700px) {
    .commands-table, .commands-table tbody, .commands-table tr, .commands-table td { display: block; width: auto; }
    .commands-table thead { display: none; }
    .commands-table tr { padding: 12px 0; border-bottom: 1px solid var(--line); }
    .commands-table td { border: 0; white-space: normal; }
    .commands-table td[data-label]::before { content: attr(data-label); display: block; font-weight: 600; margin-bottom: 4px; }
}
.metric-panels{gap:16px}.metric-chart{display:block;width:100%;height:auto;overflow:visible}.metric-chart text{fill:var(--ink2);font:10px sans-serif}.metric-axis{fill:none;stroke:var(--line)}.metric-series{fill:none;stroke:currentColor;stroke-width:2}.metric-dot{fill:currentColor}.metric-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px}.metric-new{color:var(--warn)}.metric-resolved{color:var(--ok)}.metric-severity-critical{fill:var(--s-crit);color:var(--s-crit)}.metric-severity-high{fill:var(--s-high);color:var(--s-high)}.metric-severity-medium{fill:var(--s-med);color:var(--s-med)}.metric-severity-low{fill:var(--s-low);color:var(--s-low)}.metric-severity-info{fill:var(--s-info);color:var(--s-info)}

/* plain-language help under a finding */
.explain{margin:10px 0 4px;padding:10px 12px;border-left:3px solid var(--brand);background:var(--hover);border-radius:var(--r)}
.explain p{margin:4px 0;line-height:1.5}
.decide{margin:10px 0}.decide>summary{cursor:pointer;display:inline-block}.decide form{margin-top:10px;display:grid;gap:6px;max-width:560px}

/* a connection's edit panel opens with a label, so the buttons of the row stay in one line */
.conn{position:relative}
.conn .edit-toggle{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.conn .edit-panel{display:none}
.conn .edit-toggle:checked ~ .edit-panel{display:block}
.conn .edit-label{display:inline-block;margin:0;cursor:pointer;color:inherit;font-size:13px;font-weight:600;line-height:1.3}
.conn:has(.edit-toggle:focus-visible) .edit-label{outline:2px solid var(--accent,#6aa6ff);outline-offset:2px}
.conn:has(.edit-toggle:checked) .edit-label{background:var(--surface2,var(--line))}
tr.fresh{animation:dg-fresh 2.4s ease-out}
@keyframes dg-fresh{from{background:var(--brand-bg,var(--warn-bg))}to{background:transparent}}
@media (prefers-reduced-motion:reduce){tr.fresh{animation:none}}
