/* Schalter — Promptheus-Look wie die Werft (Nord, dunkel, scharfe Kanten). Schriften lokal. */
@font-face{font-family:"Inter";src:url(schriften/InterVariable.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(schriften/JetBrainsMono-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(schriften/JetBrainsMono-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
:root{
  --green:163,190,140;
  --base:#2e3440; --tief:#272c36; --knopf:#3b4252; --rand:#4c566a;
  --text1:#eceff4; --text2:#d8dee9; --text3:#9aa3b2;
  --akzent:#a3be8c; --gelb:#ebcb8b; --rot:#bf616a;
  --font-ui:"JetBrains Mono",ui-monospace,monospace;
  --font-body:"Inter","Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{background:var(--tief)}
body{background:radial-gradient(ellipse at 30% 0%,#3b4252 0%,var(--base) 55%,var(--tief) 100%) fixed;color:var(--text1);font-family:var(--font-body);font-size:16px;line-height:1.55;min-height:100vh;-webkit-font-smoothing:antialiased}
button,input{font:inherit;color:inherit}
a{color:var(--akzent)}
.mono{font-family:var(--font-ui)}
.leise{color:var(--text3)}
.buehne{display:flex;justify-content:center;padding:56px 16px}
.karte{width:100%;max-width:520px;background:rgba(26,30,38,.62);border:1px solid rgba(var(--green),.14);padding:32px}
h1{font-family:var(--font-ui);font-weight:600;font-size:24px;letter-spacing:.02em;margin-bottom:10px}
h2{font-family:var(--font-ui);font-weight:600;font-size:18px;margin-bottom:12px}
.marke{color:var(--akzent);text-shadow:0 0 8px rgba(var(--green),.8)}
.einleitung{margin-bottom:26px}
form{display:flex;flex-direction:column;gap:18px}
label{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--text2)}
input:not([type=radio]){background:var(--tief);border:1px solid var(--rand);padding:10px 12px;font-size:16px;outline:none}
input:focus{border-color:var(--akzent)}
small{color:var(--text3);font-size:12.5px}
fieldset.wahl{border:none;display:flex;flex-direction:column;gap:8px}
legend{font-size:14px;color:var(--text2);margin-bottom:6px}
fieldset.wahl{flex-direction:row;flex-wrap:wrap}
fieldset.wahl label{flex:1 1 180px;flex-direction:row;align-items:flex-start;gap:10px;border:1px solid var(--rand);padding:10px 12px;cursor:pointer;color:var(--text1)}
fieldset.wahl label:has(input:checked){border-color:rgba(var(--green),.7);background:rgba(var(--green),.08)}
fieldset.wahl span{display:flex;flex-direction:column;font-size:13px;color:var(--text3)}
fieldset.wahl b{font-family:var(--font-ui);font-weight:600;font-size:14px;color:var(--text1)}
input[type=radio]{accent-color:var(--akzent);margin-top:4px}
.knopf{background:var(--knopf);border:1px solid var(--rand);padding:8px 14px;cursor:pointer;font-family:var(--font-ui);font-size:14px}
.knopf.haupt{background:var(--akzent);border-color:var(--akzent);color:#1d2129;font-weight:600;padding:13px 18px;font-size:15px;align-self:flex-start}
.knopf.haupt:hover{filter:brightness(1.08)}
.knopf:disabled{opacity:.6;cursor:progress}
.meldung{font-size:14px;color:var(--text2);border-left:2px solid var(--akzent);padding-left:10px}
.meldung.fehler{color:var(--rot);border-left-color:var(--rot)}
.code-form{margin:20px 0 18px}
input.code{font-size:26px;letter-spacing:.35em;max-width:230px;padding:10px 14px}
.klein{font-size:14px}
.trocken{margin-top:14px;font-size:12px;color:var(--gelb);word-break:break-all}
.uebersicht{display:grid;grid-template-columns:max-content 1fr;gap:6px 18px;margin:16px 0 22px;font-size:15px}
.uebersicht dt{color:var(--text3)}
.uebersicht dd{word-break:break-all}
.gross{font-size:18px;word-break:break-all}
#fertig p{margin-bottom:10px}
#fertig .knopf.haupt{margin:10px 0 14px}
.hinweis{font-size:14px;color:var(--text2)}
.schritte{list-style:none;display:flex;flex-direction:column;gap:2px;margin-top:18px}
.schritte li{padding:8px 10px;border-left:2px solid transparent;color:var(--text3);font-family:var(--font-ui);font-size:14px}
.schritte li::before{content:"○  ";}
.schritte li.fertig{color:var(--akzent);border-left-color:var(--akzent)}
.schritte li.fertig::before{content:"✓  "}
.schritte li.laeuft{color:var(--gelb);border-left-color:var(--gelb);background:rgba(235,203,139,.06)}
.schritte li.laeuft::after{content:" …";animation:puls 1.2s infinite}
.schritte li.fehler{color:var(--rot);border-left-color:var(--rot)}
.schritte li.fehler::before{content:"✕  "}
@keyframes puls{50%{opacity:.3}}
@media (max-width:560px){.buehne{padding:20px 12px}.karte{padding:22px 18px}.uebersicht{grid-template-columns:1fr;gap:0}.uebersicht dd{margin-bottom:8px}}