.scr{--yl:#F5C400;--cb:#15151E;--ink:#1B2130;--mute:#5E6678;--line:#E2E6EC;--paper:#FAF8EE;--ok:#1E7A4C;--ko:#B23B2E;--warn:#B7791F;
font-family:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:12px;max-width:840px;margin:28px auto;box-sizing:border-box;line-height:1.5;overflow:hidden}
.scr *{box-sizing:border-box}
.scr-hd{background:var(--cb);color:#fff;padding:18px 22px;border-bottom:6px solid var(--yl)}
.scr .tool-h2{display:block;font-weight:700;margin:0 0 4px;font-size:1.4rem;line-height:1.2;color:#fff}
.scr-hd p{margin:0;font-size:.93rem;opacity:.9;max-width:680px}
.scr-body{padding:20px 22px}
.scr h3{font-size:1rem;margin:14px 0 8px}
.scr label{display:block;font-size:.72rem;font-weight:600;margin-bottom:3px;color:var(--mute)}
.scr input,.scr select{width:100%;padding:7px 8px;font:inherit;font-size:.93rem;border:1.5px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font-variant-numeric:tabular-nums}
.scr input:focus-visible,.scr select:focus-visible{outline:3px solid #F7DE7A;outline-offset:2px}
.scr-g{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.scr-gauge{margin-top:16px;background:var(--paper);border-radius:12px;padding:14px 16px}
.scr-gauge .track{position:relative;height:18px;background:#EEF0F4;border-radius:9px;margin:10px 0 4px}
.scr-gauge .rng{position:absolute;top:0;bottom:0;background:#F7DE7A;border-radius:9px}
.scr-gauge .pt{position:absolute;top:-4px;width:4px;height:26px;background:var(--cb);border-radius:2px}
.scr-gauge .mk{position:absolute;top:-4px;width:2px;height:26px;background:var(--ko)}
.scr-gauge .lg{display:flex;justify-content:space-between;font-size:.75rem;color:var(--mute)}
.scr-res{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.scr-c{border:2px solid var(--line);border-radius:12px;padding:12px 14px}
.scr-c.val{border-color:var(--ok);background:#EEF7F1}
.scr-c h4{margin:0 0 6px;font-size:1rem}
.scr-c .row{display:flex;justify-content:space-between;font-size:.88rem;font-variant-numeric:tabular-nums;padding:2px 0}
.scr-warn{margin-top:12px;border-radius:8px;padding:10px 14px;background:#FFF6E4;border:1px solid #F0D29A;font-size:.88rem}
.scr-say{margin-top:14px;border-left:4px solid var(--yl);background:var(--paper);border-radius:8px;padding:12px 14px;font-size:.93rem}
.scr-note{font-size:.8rem;color:var(--mute);margin:0;padding:12px 22px 16px;border-top:1px solid var(--line)}
.scr-note a{color:var(--cb)}
@media (max-width:720px){.scr-body{padding:15px}.scr-g{grid-template-columns:1fr 1fr}.scr-res{grid-template-columns:1fr}}

.scr .scr-big{font-size:1.6rem}
.scr .scr-rng-l{color:var(--mute);font-size:.85rem}

/* --- Einbettung & Mobile --- */
.scr{contain:inline-size;width:100%;min-width:0;max-width:min(840px,100%)}
.scr-g{grid-template-columns:repeat(4,minmax(0,1fr))}
.scr-res{grid-template-columns:repeat(2,minmax(0,1fr))}
.scr-g>*,.scr-res>*{min-width:0}
.scr-c .row{gap:10px}
.scr-gauge .lg{gap:8px}
.scr-gauge .lg span:nth-child(2){text-align:center;flex:1;min-width:0}
@media (max-width:720px){.scr-hd{padding:15px}.scr-g{grid-template-columns:repeat(2,minmax(0,1fr))}.scr-res{grid-template-columns:minmax(0,1fr)}.scr-note{padding:12px 15px 14px}}
@media (max-width:380px){.scr-g{grid-template-columns:minmax(0,1fr)}}

/* --- Schutz vor Theme-Stilen (article * { color; font-family; font-weight … }) --- */
.scr.scr *{color:inherit;font-family:inherit;font-weight:inherit;letter-spacing:normal;text-transform:none;line-height:inherit}
.scr.scr{color:var(--ink);font-weight:400;letter-spacing:normal;text-transform:none}
.scr.scr b,.scr.scr strong,.scr.scr h3,.scr.scr h4,.scr.scr .tool-h2{font-weight:700}
.scr .scr-hd,.scr .scr-hd p,.scr.scr .tool-h2{color:#fff}
.scr.scr h3,.scr.scr h4,.scr .scr-body,.scr .scr-gauge,.scr .scr-c,.scr .scr-warn,.scr .scr-say{color:var(--ink)}
.scr.scr label,.scr .scr-gauge .lg,.scr .scr-gauge .scr-rng-l{color:var(--mute)}
.scr.scr label{font-weight:600}
.scr .scr-note{color:var(--mute)}
.scr .scr-note a{color:var(--cb)}
.scr.scr input,.scr.scr select{color:var(--ink);font-weight:400}