/* A24 Systems — Werkzeugkasten /technik (ergänzt zahn.css) */
.tk-hero{padding:34px 0 8px}
.tk-hero h1{font:600 clamp(34px,4.4vw,56px)/1.02 var(--f-display);letter-spacing:-.035em;margin:12px 0 10px}
.tk-hero p{color:var(--ink-2);max-width:760px;margin:0;font-size:16px}
.tabs{position:sticky;top:0;z-index:20;display:flex;gap:6px;flex-wrap:wrap;padding:12px 0;margin-top:18px;background:linear-gradient(var(--ground) 70%,transparent)}
.tabs a{font:500 13px var(--f-mono);letter-spacing:.06em;color:var(--ink-2);text-decoration:none;padding:8px 13px;border-radius:999px;border:1px solid var(--line-strong);background:var(--surface)}
.tabs a:hover{color:var(--ink);border-color:var(--gold)}
section[id]{scroll-margin-top:70px}

.g-2{grid-template-columns:1fr 1fr}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-setup{grid-template-columns:1.25fr 1fr}
.full{grid-column:1/-1}

/* Software-Auswahl */
.grp{margin-top:4px}
.grp h4{font:500 10.5px var(--f-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);margin:10px 0 7px}
.pills{display:flex;flex-wrap:wrap;gap:7px}
.pill{position:relative}
.pill input{position:absolute;opacity:0;pointer-events:none}
.pill span{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:9px;border:1px solid var(--line-strong);background:#0d1219;font-size:13.5px;color:var(--ink-2);cursor:pointer;user-select:none;transition:border-color .15s,background .15s,color .15s}
.pill span::before{content:"";width:12px;height:12px;border-radius:3px;border:1px solid var(--ink-3);flex:0 0 auto}
.pill input:checked+span{border-color:rgba(227,168,76,.6);background:var(--gold-dim);color:var(--ink)}
.pill input:checked+span::before{background:var(--gold);border-color:var(--gold);box-shadow:inset 0 0 0 2px #1a1204}
.pill input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.presets{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.presets .lbl{font:500 10.5px var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-right:4px}

/* Einstellungen */
.opts{display:grid;gap:2px}
.opt{border-top:1px solid var(--line);padding:9px 0}
.opt:first-child{border-top:0}
.opt>label{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.opt>label input{accent-color:var(--gold);width:16px;height:16px;margin-top:3px;flex:0 0 auto}
.opt b{font-weight:500;font-size:14.5px;display:block}
.opt small{display:block;color:var(--ink-3);font-size:12.5px;line-height:1.45}
.opt .sub{display:none;gap:8px;flex-wrap:wrap;margin:8px 0 2px 26px}
.opt.on .sub{display:flex}
.sub input,.sub textarea,.mini{font:400 13.5px var(--f-mono);color:var(--ink);background:#0d1219;border:1px solid var(--line-strong);border-radius:8px;padding:7px 10px;min-width:0;flex:1 1 140px}
.sub textarea{flex-basis:100%;min-height:58px;resize:vertical}
.sub input:focus,.sub textarea:focus,.mini:focus{outline:none;border-color:var(--gold)}
.card>.mini,.card>textarea.mini{flex:none}
.sf{display:flex;flex-direction:column;gap:4px;flex:1 1 150px;min-width:0}
.sf.wide{flex-basis:100%}
.sf>span{font:500 10px var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.sf input,.sf textarea{flex:none;width:100%}
input[type=range]{width:150px}

/* Code-Ausgabe */
.code{position:relative;background:#06080b;border:1px solid var(--line-strong);border-radius:12px;max-height:440px;overflow:auto}
.code pre{margin:0;padding:16px 18px;font:400 12.5px/1.6 var(--f-mono);color:#cfd6e2;white-space:pre;tab-size:2}
.code .c{color:#6b7588}.code .k{color:var(--gold-2)}.code .s{color:#9fd4b6}
.howto{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--ink-3);font-size:13px}
.howto b{color:var(--ink-2);font-weight:500}

/* Tabellen */
table.t{width:100%;border-collapse:collapse;font-size:13.5px}
table.t th{font:500 10.5px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);text-align:left;padding:7px 10px 7px 0;border-bottom:1px solid var(--line-strong)}
table.t td{padding:7px 10px 7px 0;border-bottom:1px solid var(--line);vertical-align:top}
table.t td.m{font-family:var(--f-mono);white-space:nowrap;color:var(--ink)}
table.t tr:hover td{background:rgba(255,255,255,.02)}
.tscroll{overflow:auto;max-height:420px}
.res{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:14px}
.res dt{font:500 10.5px/2 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
.res dd{margin:0;font-family:var(--f-mono);color:var(--ink)}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.err{color:#f2c3bb;font-size:13px}

/* Passwort */
.pw-list{display:grid;gap:7px}
.pw{display:flex;align-items:center;gap:10px;background:#0d1219;border:1px solid var(--line);border-radius:9px;padding:9px 12px;cursor:pointer}
.pw code{font:500 16px var(--f-mono);color:var(--ink);flex:1;overflow-wrap:anywhere;letter-spacing:.02em}
.pw small{color:var(--ink-3);font:400 11px var(--f-mono)}
.pw:hover{border-color:var(--gold)}
input[type=range]{accent-color:var(--gold)}

/* WLAN-QR */
.qrbox{display:grid;grid-template-columns:1fr 210px;gap:18px;align-items:start}
.qr{background:#fff;border-radius:12px;padding:12px;aspect-ratio:1;display:grid;place-items:center}
.qr svg{width:100%;height:100%}

/* Tastatur */
.kb{display:grid;gap:5px;user-select:none;overflow-x:auto;padding-bottom:4px}
.kb-row{display:flex;gap:5px}
.key{flex:0 0 auto;height:38px;min-width:38px;border-radius:7px;border:1px solid var(--line-strong);border-bottom-width:3px;background:#11161f;color:var(--ink-3);font:500 10.5px var(--f-mono);display:grid;place-items:center;padding:0 2px;overflow:hidden;white-space:nowrap;transition:background .1s,color .1s}
.key.hit{background:rgba(227,168,76,.16);color:var(--gold-2);border-color:rgba(227,168,76,.55)}
.key.down{background:var(--gold);color:#1a1204;border-color:var(--gold)}
.kb-gap{flex:0 0 18px}
.kb-wrap{display:flex;gap:18px;align-items:flex-start;overflow-x:auto}
.kb-last{font:400 13px var(--f-mono);color:var(--ink-2);min-height:20px}

/* Pegel */
.lvl{height:10px;border-radius:6px;background:rgba(255,255,255,.07);overflow:hidden}
.lvl i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--signal),var(--gold) 70%,var(--alarm))}

/* Vollbild-Bildschirmtest */
#screenTest{position:fixed;inset:0;z-index:100;display:none;cursor:none}
#screenTest.on{display:block}
#screenTest .hint{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);font:500 13px var(--f-mono);padding:8px 14px;border-radius:8px;background:rgba(0,0,0,.55);color:#fff;transition:opacity .6s}

/* Druckvorlagen (nur im Druck sichtbar) */
.print-only{display:none}
@media print{
  @page{size:A4;margin:14mm}
  body{background:#fff!important;color:#000!important}
  body::before{display:none}
  body>*:not(.print-only){display:none!important}
  body[data-print="wlan"] #printWlan{display:block!important}
  body[data-print="test"] #printTest{display:block!important}
  .print-only{color:#000;font-family:var(--f-body)}
}
.pw-sheet{text-align:center;padding-top:10mm}
.pw-sheet .pr-kick{font:600 12pt var(--f-mono);letter-spacing:.3em;text-transform:uppercase;color:#a87420}
.pw-sheet h1{font:700 40pt/1.05 var(--f-display);letter-spacing:-.03em;margin:6mm 0 3mm}
.pw-sheet .pr-sub{font-size:15pt;color:#333;margin:0 0 10mm}
.pw-sheet .pr-qr{width:105mm;height:105mm;margin:0 auto;border:1px solid #ddd;border-radius:6mm;padding:6mm}
.pw-sheet .pr-qr svg{width:100%;height:100%}
.pw-sheet table{margin:10mm auto 0;font-size:15pt;border-collapse:collapse}
.pw-sheet td{padding:2mm 5mm;text-align:left}
.pw-sheet td:first-child{color:#666;font-size:12pt;text-transform:uppercase;letter-spacing:.12em}
.pw-sheet td code{font:600 17pt var(--f-mono)}
.pw-sheet .pr-steps{margin:10mm auto 0;max-width:150mm;font-size:12.5pt;color:#333}
.pr-foot{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;font-size:10pt;color:#555;border-top:1px solid #ccc;padding-top:3mm}
.pr-foot b{font-family:var(--f-display);color:#000}
.pt h1{font:700 26pt var(--f-display);margin:0 0 2mm}
.pt .meta{font:400 10pt var(--f-mono);color:#444;margin-bottom:6mm}
.pt .bars{display:flex;height:22mm;margin:4mm 0}
.pt .bars div{flex:1;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.pt .ramp{height:12mm;background:linear-gradient(90deg,#fff,#000);border:1px solid #000;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.pt .lines{display:flex;gap:4mm;margin:6mm 0}
.pt .lines div{flex:1;height:30mm;background:repeating-linear-gradient(90deg,#000 0 var(--w),#fff var(--w) calc(var(--w)*2));-webkit-print-color-adjust:exact;print-color-adjust:exact}
.pt .txt p{margin:1.2mm 0}
.pt .frame{position:fixed;inset:0;border:0.3mm solid #000}

@media (max-width:1100px){.g-setup,.g-3{grid-template-columns:1fr}.g-2{grid-template-columns:1fr}}
@media (max-width:620px){.qrbox{grid-template-columns:1fr}.qr{max-width:240px}}

/* Hintergrundbild-Download */
.wp-row{display:grid;grid-template-columns:minmax(0,420px) 1fr;gap:22px;align-items:center}
.wp-prev{display:block;border-radius:11px;overflow:hidden;border:1px solid var(--line-strong);line-height:0}
.wp-prev img{width:100%;height:auto;display:block;transition:transform .4s}
.wp-prev:hover img{transform:scale(1.03)}
.wp-txt{display:flex;flex-direction:column;gap:12px}
@media (max-width:820px){.wp-row{grid-template-columns:1fr}}

/* PC-Setup-Karte */
.setup-row{display:grid;grid-template-columns:1fr minmax(0,440px);gap:24px;align-items:center}
.term{margin:0;background:#05070a;border:1px solid var(--line-strong);border-radius:12px;padding:16px 18px;font:400 12.5px/1.65 var(--f-mono);color:#d6dde8;overflow:auto;box-shadow:inset 0 0 40px rgba(79,213,152,.04)}
.term .tc{color:#4fc3f7}.term .td{color:#5b6475}.term .tk{color:var(--gold);animation:blink 1.2s steps(1) infinite}
@media (max-width:1100px){.setup-row{grid-template-columns:1fr}}
.term .tw{color:#e3c26b}.term .tp{color:#f08a7c}
