:root {
  color-scheme: light;
  --ink: #16283e;
  --muted: #637388;
  --paper: #f4f7fb;
  --line: #dce4ed;
  --navy: #14263d;
  font-family: Inter, ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  color: var(--ink);
  background: radial-gradient(circle at 10% -10%, rgba(35,125,159,.2), transparent 38%), var(--paper);
}
.login-shell { display: grid; place-items: center; min-height: 100vh; padding: 24px; }
.login-card { width: min(100%, 420px); padding: 32px; border: 1px solid var(--line); border-radius: 28px; background: rgba(255,255,255,.94); box-shadow: 0 24px 65px rgba(31,52,77,.14); }
.brand-mark { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 22px; border-radius: 17px; color: white; background: var(--navy); font-size: 1.5rem; font-weight: 850; box-shadow: 0 9px 20px rgba(20,38,61,.2); }
.eyebrow { color: var(--muted); font-size: .74rem; font-weight: 850; letter-spacing: .13em; }
h1 { margin: 4px 0 7px; font-size: 2rem; letter-spacing: -.04em; }
.login-card > p { margin: 0 0 26px; color: var(--muted); }
label { display: block; margin: 16px 0 7px; color: var(--muted); font-size: .86rem; font-weight: 750; }
select, input { width: 100%; height: 50px; border: 1px solid var(--line); border-radius: 14px; padding: 0 14px; color: var(--ink); background: white; font: inherit; outline: none; }
select:focus, input:focus { border-color: #237d9f; box-shadow: 0 0 0 4px rgba(35,125,159,.12); }
button { width: 100%; height: 50px; margin-top: 22px; border: 0; border-radius: 14px; color: white; background: var(--navy); font: inherit; font-weight: 800; cursor: pointer; }
button:disabled { opacity: .6; cursor: wait; }
.error { margin: 14px 0 -7px; padding: 11px 13px; border-radius: 12px; color: #8b2941; background: #f9e2e7; font-size: .85rem; }
@media (max-width: 460px) { .login-shell { padding: 16px; } .login-card { padding: 25px; } }
