/* Ergänzungen für die echte Alpha-Anmeldung: zusätzliche Formularfelder,
   persönliche Statusseite und Verwaltung (beide kommen vom Alpha-Dienst). */

.signup-panel input[type=text],.signup-panel textarea{width:100%;border:1px solid #d2c8dc;border-radius:10px;background:white;padding:14px 15px;font:inherit;font-size:14px;color:var(--ink)}
.signup-panel textarea{resize:vertical;min-height:84px;line-height:1.5}
.signup-panel label small{font-weight:400;color:var(--muted)}
.signup-panel input:focus-visible,.signup-panel textarea:focus-visible{outline:3px solid #a58bdc;outline-offset:1px}
.honigtopf{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
#form-status .status-link{display:inline-block;margin-top:8px;font-weight:700;color:inherit}

/* ---------- Seiten des Alpha-Dienstes ---------- */
.app-page .brand{display:block;width:fit-content;margin-bottom:40px}
.app-page h1{line-height:1.1;margin:6px 0 18px}
.app-page .eyebrow{color:var(--muted)}
.app-page form{margin:22px 0}
.status-karte{display:flex;gap:20px;align-items:flex-start;background:white;border:2px solid var(--ink);border-radius:20px;padding:24px 26px;box-shadow:6px 7px 0 var(--ink);margin:10px 0 28px}
.status-karte h1{font-size:38px;margin:0 0 8px}
.status-karte p{margin:0}
.status-symbol{font-size:42px;line-height:1}
.status-frei{background:#f1f8e8}
.status-wartend{background:#fffbe6}
.download-box{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;background:var(--ink);color:white;border-radius:18px;padding:20px 24px;margin:0 0 30px}
.download-box strong{display:block;font-family:var(--display);font-size:24px;font-weight:400}
.download-box small{color:#d9cdee}
.schritte li{margin:6px 0}
.hinweis{background:#ede7f3;border-radius:10px;padding:13px 16px;font-size:14px}
.loeschen{margin-top:40px;border-top:1px solid var(--line);padding-top:16px}
.loeschen summary{cursor:pointer;color:var(--muted);font-size:14px}
.button-gefahr{background:#ffd9d6}
.button-hell{background:white}

/* Verwaltung */
.app-page.verwaltung{max-width:1240px}
.kopfzeile{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.kopfzeile form{margin:0 0 18px}
.infozeile{display:flex;flex-wrap:wrap;gap:8px 28px;font-size:14px;color:var(--muted);margin-bottom:18px}
.meldung{background:#edf2e5;border:1px solid #c3d6a3;color:#354820;border-radius:9px;padding:12px 15px;font-size:14px}
.meldung-fehler{background:#fff0ef;border-color:#e4aba7;color:#9c3535}
.meldung .link{display:inline-block;margin-top:6px;word-break:break-all;user-select:all;background:white;padding:4px 8px;border-radius:6px}
.reiter{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 14px}
.reiter a{text-decoration:none;color:var(--ink);border:2px solid var(--ink);border-radius:100px;padding:6px 14px;font-weight:700;font-size:14px;background:white}
.reiter a[aria-current]{background:var(--yellow);box-shadow:0 3px 0 var(--ink)}
.reiter a span{display:inline-block;min-width:20px;margin-left:6px;padding:0 6px;border-radius:20px;background:var(--ink);color:white;font-size:12px;text-align:center}
.leer{color:var(--muted)}
.tabelle-rahmen{overflow-x:auto;border:2px solid var(--ink);border-radius:14px;background:white}
.tabelle{width:100%;border-collapse:collapse;font-size:14px}
.tabelle th,.tabelle td{padding:10px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.tabelle th{background:#f3eff8;font-size:12px;letter-spacing:.5px}
.tabelle tr:last-child td{border-bottom:0}
.tabelle small{color:var(--muted)}
.tabelle .warnung{color:#a0611a}
.tabelle .nachricht{max-width:280px;white-space:pre-line;color:#4d4459}
.aktionen form{display:flex;flex-wrap:wrap;gap:6px;margin:0}
.knopf{font:inherit;font-size:13px;font-weight:700;padding:5px 10px;border:2px solid var(--ink);border-radius:8px;background:white;color:var(--ink);cursor:pointer}
.knopf:hover{background:#f3eff8}
.knopf-ja{background:var(--yellow)}
.knopf-ja:hover{background:#ffd61a}
.knopf-gefahr{background:#ffd9d6}
.loeschen-klein{margin-top:6px}
.loeschen-klein summary{cursor:pointer;font-size:12px;color:var(--muted)}
.loeschen-klein form{margin-top:6px}
.formular label{display:block;font-weight:700;font-size:13px;margin-bottom:6px}
.formular input{width:100%;max-width:380px;border:1px solid #d2c8dc;border-radius:10px;padding:12px 14px;font:inherit;margin-bottom:16px;background:white}

@media (max-width:760px){
  .status-karte{flex-direction:column;gap:10px;padding:20px}
  .status-karte h1{font-size:30px}
  .download-box .button{width:100%}
}