:root { --navy: #0f2742; --blue: #1f6fd1; --accent: #f07a1a; --ink: #13202f; --muted: #5d6b7c; --line: #e2e8f0; --soft: #f4f6f9;
  --ok: #1a7f37; --ok-bg: #e7f6ec; --bad: #b42318; --bad-bg: #fdecea; }
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--ink); background: var(--soft); }
.top { position: sticky; top: 0; display: flex; align-items: center; gap: 14px; padding: 12px 16px; background: var(--navy); color: #fff; z-index: 5; }
.brand { color: #fff; text-decoration: none; margin-right: auto; display: flex; flex-direction: column; line-height: 1.1; }
.brand span, .login-brand span { font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: #9fb6d4; }
.who { font-size: .9rem; } .who small { display: block; color: #9fb6d4; font-size: .75rem; }
.link { background: none; border: 0; color: #fff; font: inherit; font-size: .9rem; text-decoration: underline; cursor: pointer; padding: 0; }
.main { max-width: 960px; margin: 0 auto; padding: 20px 16px 60px; }
.title { font-size: 1.5rem; margin: 4px 0 16px; color: var(--navy); }
.card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 20px; margin-bottom: 16px; }
.narrow { max-width: 460px; }
.muted { color: var(--muted); }
label { display: grid; gap: 6px; font-weight: 600; font-size: .9rem; margin-bottom: 14px; color: var(--navy); }
label small { font-weight: 400; color: var(--muted); }
input { font: inherit; font-size: 16px; padding: 12px; border: 1.5px solid var(--line); border-radius: 10px; width: 100%; }
input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px #e3eefc; }
.btn { width: 100%; padding: 14px; border: 0; border-radius: 999px; background: var(--accent); color: #fff; font: 700 1rem system-ui, sans-serif; cursor: pointer; }
.flash { padding: 12px 14px; border-radius: 10px; font-weight: 600; }
.flash-ok { background: var(--ok-bg); color: var(--ok); } .flash-error { background: var(--bad-bg); color: var(--bad); }
.guest .main { max-width: 420px; padding-top: 10vh; }
.login-brand { text-align: center; margin: 0 0 18px; display: flex; flex-direction: column; font-size: 1.6rem; color: var(--navy); }