/* login.css – eigene Datei, damit die Anmeldeseite ohne style.css (und ohne Anmeldung) auskommt. */
:root{
  --bg:#111317; --panel:#1b1e24; --panel2:#22262e; --line2:#343a45;
  --text:#e7e9ee; --text2:#b4bac6; --muted:#8b93a1; --accent:#f5b942; --accent2:#ffd27a;
  --up:#3ddc97; --down:#ff6b7a;
  --ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --serif:Georgia,"Times New Roman",serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:radial-gradient(1200px 600px at 50% -10%,#1d2026,#0e1013 60%);color:var(--text);font:14px/1.5 var(--ui)}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.card{width:100%;max-width:380px;background:linear-gradient(180deg,#1c1f26,#171a1f);border:1px solid var(--line2);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.5);padding:28px 26px 22px}
.brand{display:flex;align-items:center;gap:9px;margin-bottom:6px}
.brand .mark{display:flex;align-items:flex-end;gap:2px;height:20px}
.brand .mark i{display:block;width:5px;border-radius:2px;background:var(--accent)}
.brand .mark i:nth-child(1){height:9px;background:var(--up)}
.brand .mark i:nth-child(2){height:18px}
.brand .mark i:nth-child(3){height:13px;background:var(--down)}
.brand .word{font:500 20px/1 var(--serif);letter-spacing:-.01em}
.brand .word em{font-style:italic;color:var(--accent2)}
.lede{margin:2px 0 20px;color:var(--text2);font-size:13px}
label{display:block;margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--muted);text-transform:uppercase}
input{width:100%;padding:10px 12px;margin-bottom:14px;background:var(--panel2);border:1px solid var(--line2);border-radius:10px;color:var(--text);font:14px var(--ui)}
input:focus{outline:2px solid rgba(245,185,66,.45);outline-offset:0;border-color:transparent}
button{width:100%;padding:11px 14px;border-radius:10px;border:1px solid transparent;font:700 14px var(--ui);cursor:pointer}
button:disabled{opacity:.55;cursor:progress}
.primary{background:var(--accent);color:#1a1405}
.primary:hover:enabled{background:var(--accent2)}
.ghost{background:var(--panel2);border-color:var(--line2);color:var(--text)}
.ghost:hover:enabled{border-color:var(--accent)}
.or{display:flex;align-items:center;gap:10px;margin:18px 0;color:var(--muted);font-size:12px}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line2)}
.hint{margin:8px 0 0;font-size:12px;color:var(--muted)}
.msg{min-height:20px;margin:14px 0 0;font-size:13px;color:var(--text2)}
.msg.err{color:var(--down)}
.msg.ok{color:var(--up)}
.foot{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line2);font-size:12px;color:var(--muted)}
@media (prefers-reduced-motion:no-preference){.card{animation:in .35s ease-out}@keyframes in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}