/* Gemeinsame Gestaltung fuer Anmeldung und Verwaltung. Dunkel, ruhig, ein orangener Akzent wie in der Hauptansicht. */
:root {
  --grund: #0c0e12; --flaeche: #14171d; --flaeche2: #1a1e26; --rahmen: #232830; --rahmen2: #303744;
  --text: #e8ebf0; --text2: #a4adba; --text3: #7a8494; --akzent: #f4a340; --akzent2: #ffbf6b; --gut: #7ee08a; --warn: #f2e15a; --fehler: #ff7a90;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace; --sans: system-ui, -apple-system, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-height: 100%; background: var(--grund); }
body { margin: 0; min-height: 100vh; background: radial-gradient(1200px 700px at 50% -10%, #171b24 0%, var(--grund) 60%) no-repeat; color: var(--text);
  font: 15px/1.5 var(--sans); -webkit-font-smoothing: antialiased; }
a { color: var(--akzent2); }
:focus-visible { outline: 2px solid var(--akzent); outline-offset: 2px; border-radius: 6px; }
.marke { font: 600 13px var(--mono); letter-spacing: .28em; color: var(--akzent); text-transform: uppercase; }
.karte { background: linear-gradient(180deg, var(--flaeche2), var(--flaeche)); border: 1px solid var(--rahmen); border-radius: 14px;
  box-shadow: 0 30px 80px -30px rgba(0,0,0,.7); }
button, .knopf { font: 600 14px var(--sans); border-radius: 9px; padding: 11px 16px; border: 1px solid var(--rahmen2); background: var(--flaeche2);
  color: var(--text); cursor: pointer; transition: background .15s, border-color .15s, transform .05s; }
button:hover, .knopf:hover { background: #222833; border-color: #3c4556; }
button:active { transform: translateY(1px); }
button.primaer { background: var(--akzent); border-color: var(--akzent); color: #1a1206; }
button.primaer:hover { background: var(--akzent2); border-color: var(--akzent2); }
button[disabled] { opacity: .5; cursor: default; }
input[type=text] { font: 15px var(--sans); background: var(--grund); border: 1px solid var(--rahmen2); color: var(--text); border-radius: 9px; padding: 10px 12px; width: 100%; }
.klein { font-size: 13px; color: var(--text2); }
.fehler { color: var(--fehler); }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

.block > p:last-child { margin-bottom: 0; }
button.primaer:focus-visible { outline: 2px solid var(--akzent2); outline-offset: 3px; }