:root { --bg:#0f1216; --karte:#171b21; --rand:#2a313b; --text:#e6e9ee; --leise:#8b95a3;
        --akzent:#3fb68b; --warn:#e0a84a; --fehler:#e06464; --stern:#f2c94c; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text);
       font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
.wrap { max-width:1000px; margin:0 auto; padding:24px 18px 60px; }
h1 { font-size:22px; margin:0 0 4px; } h2 { font-size:16px; margin:0 0 12px; }
.unter { color:var(--leise); margin:0 0 18px; }
.karte { background:var(--karte); border:1px solid var(--rand); border-radius:10px; padding:18px; margin-bottom:16px; }
.hinweis { border-color:#6b5426; background:#221c10; }
.hinweis strong { color:var(--warn); }
.reihe { display:flex; gap:12px; flex-wrap:wrap; } .reihe > div { flex:1 1 220px; }
label { display:block; font-size:13px; color:var(--leise); margin:0 0 4px; }
select, input[type=text], textarea { width:100%; background:#0c0f13; color:var(--text);
       border:1px solid var(--rand); border-radius:7px; padding:9px 10px; font:inherit; }
textarea { resize:vertical; min-height:90px; }
select:focus, input:focus, textarea:focus { outline:2px solid #2d6b56; border-color:#2d6b56; }
button { background:var(--akzent); color:#06120d; border:0; border-radius:7px; padding:9px 18px;
         font:inherit; font-weight:600; cursor:pointer; }
button.zweit { background:#2a313b; color:var(--text); font-weight:500; }
button:disabled { opacity:.5; cursor:not-allowed; }
.aktionen { display:flex; gap:10px; align-items:center; margin-top:12px; flex-wrap:wrap; }
.leise { color:var(--leise); font-size:13px; }
.antwort { white-space:pre-wrap; word-wrap:break-word; background:#0c0f13; border:1px solid var(--rand);
           border-radius:7px; padding:12px; min-height:60px; max-height:520px; overflow:auto; }
details { margin-top:8px; } summary { cursor:pointer; color:var(--leise); font-size:13px; }
.gedanken { white-space:pre-wrap; color:var(--leise); font-size:13px; padding:8px; }
.laden { display:none; align-items:center; gap:10px; color:var(--leise); }
.laden.an { display:flex; }
.spinner { width:18px; height:18px; border:3px solid #2a313b; border-top-color:var(--akzent);
           border-radius:50%; animation:dreh 0.9s linear infinite; }
@keyframes dreh { to { transform:rotate(360deg); } }
.sterne { display:flex; gap:4px; font-size:28px; line-height:1; }
.sterne button { background:none; color:#3a424e; padding:0 2px; font-size:28px; font-weight:400; }
.sterne button.an { color:var(--stern); }
.meldung { font-size:13px; } .ok { color:var(--akzent); } .err { color:var(--fehler); }
.zaehler { display:flex; gap:22px; } .zaehler b { font-size:22px; display:block; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th, td { text-align:left; padding:6px 8px; border-bottom:1px solid var(--rand); vertical-align:top; }
th { color:var(--leise); font-weight:500; }
.kurz { max-width:420px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
a { color:var(--akzent); }
.versteckt { display:none; }
/* --- Server-Version --- */
.kopf { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; }
.nav { display:flex; gap:14px; align-items:center; font-size:13px; color:var(--leise); }
.nav button { padding:5px 12px; }
.fuss { margin-top:28px; font-size:13px; color:var(--leise); text-align:center; }
.mt { margin-top:12px; } .mt16 { margin-top:16px; } .rechts { text-align:right; } .mitte { align-items:center; }
.inline { margin:0; display:inline; }
input[type=password] { width:100%; background:#0c0f13; color:var(--text); border:1px solid var(--rand);
       border-radius:7px; padding:9px 10px; font:inherit; }
.schmal { max-width:460px; margin:40px auto; }
.check { display:flex; gap:10px; align-items:flex-start; color:var(--text); font-size:14px; }
.check input { margin-top:4px; }
.pille { display:inline-block; padding:2px 10px; border-radius:20px; font-size:13px; border:1px solid var(--rand); }
.pille.online { color:var(--akzent); border-color:#2d6b56; }
.pille.pausiert, .pille.beschaeftigt { color:var(--warn); border-color:#6b5426; }
.pille.offline { color:var(--fehler); border-color:#6b2e2e; }
mark.platzhalter { background:#5a1d1d; color:#ffd7d7; padding:1px 4px; border-radius:4px; }
.link-box { word-break:break-all; background:#0c0f13; border:1px solid var(--rand); border-radius:7px; padding:10px; font-family:ui-monospace,Consolas,monospace; font-size:13px; }
.recht h2 { margin-top:22px; } .recht p, .recht li { color:var(--text); }
button.klein { padding:4px 10px; font-size:13px; }