/* Auth pages share a single mono-styled CSS block to match the redesigned
   app shell. Extracted from ``presentation/auth/constants._AUTH_CSS`` in
   Q-016 — moving to a static file lets the browser cache it across
   /login + /register navigations and keeps the Python code free of
   inline styling. CSP allows ``style-src 'self'`` so <link> works
   without a per-request nonce. */
:root{
  /* Neutral zinc palette — matches the main app shell (styles.css) after
     the v1-reference repaint. Previous values had a navy tint which
     looked mismatched when the user bounced between /login and /. */
  --bg-0:#0a0a0c; --bg-1:#111114; --bg-2:#17171b; --bg-3:#1f1f23;
  --fg-0:#fafafa; --fg-1:#d4d4d8; --fg-2:#a1a1aa; --fg-3:#71717a;
  --line-1:#27272d; --line-2:#3a3a42;
  --brand:#0088cc; --brand-h:#006fa8; --bad:#ef5350;
  --f-sans:"Inter",-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--bg-0);color:var(--fg-0);font-family:var(--f-sans);font-size:14px;display:flex;align-items:center;justify-content:center;padding:16px}
a{color:var(--fg-0);text-decoration:none}
.auth-shell{width:100%;max-width:420px;display:flex;flex-direction:column;gap:18px}
.auth-brand{display:flex;align-items:center;gap:10px;padding:0 4px}
/* Logo is already a circular PNG (white disc + tree), so no border-radius
   or background needed here — object-fit keeps it intact at any size. */
.auth-brand-mark{width:72px;height:72px;object-fit:contain;display:block;flex-shrink:0;image-rendering:auto}
div.auth-brand-mark{background:var(--bg-3);border:1px solid var(--line-2);display:grid;place-items:center;font-family:var(--f-mono);font-weight:700;font-size:12px;color:var(--fg-0)}
.auth-brand-name{font-weight:600;font-size:14px;letter-spacing:-0.01em}
.auth-brand-sub{font-size:11px;color:var(--fg-2);font-family:var(--f-mono);letter-spacing:0.04em}
.auth-card{background:var(--bg-1);border:1px solid var(--line-1);border-radius:10px;padding:24px}
.auth-title{font-size:20px;font-weight:600;letter-spacing:-0.01em;margin-bottom:4px}
.auth-sub{font-size:12.5px;color:var(--fg-2);margin-bottom:18px;font-family:var(--f-mono)}
.auth-form{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}
.auth-field label{display:block;font-size:10.5px;color:var(--fg-2);text-transform:uppercase;letter-spacing:0.08em;font-weight:600;margin-bottom:6px}
.auth-field input{width:100%;background:var(--bg-0);border:1px solid var(--line-2);border-radius:6px;padding:10px 12px;color:var(--fg-0);font:inherit;outline:none;transition:border-color 120ms}
.auth-field input:focus{border-color:var(--brand)}
.auth-field input::placeholder{color:var(--fg-3)}
.auth-err{color:var(--bad);font-size:12.5px;min-height:18px}
.auth-btn{display:block;width:100%;border:1px solid var(--line-2);background:var(--bg-2);color:var(--fg-0);border-radius:6px;padding:10px 14px;font:inherit;font-weight:600;cursor:pointer;text-align:center;margin-top:6px;transition:all 120ms;text-decoration:none}
.auth-btn:hover{border-color:var(--fg-3);background:var(--bg-3)}
.auth-btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.auth-btn.primary:hover{background:var(--brand-h);border-color:var(--brand-h)}
.auth-btn.secondary{background:var(--bg-2)}
.auth-sep{display:flex;align-items:center;gap:10px;color:var(--fg-3);font-size:11px;font-family:var(--f-mono);letter-spacing:0.08em;text-transform:uppercase;margin:14px 0 10px}
.auth-sep::before,.auth-sep::after{content:'';flex:1;height:1px;background:var(--line-1)}
.auth-note{font-size:12px;color:var(--fg-2);margin-top:14px;text-align:center}
.auth-note a{color:var(--brand);font-weight:600}
.auth-foot{font-size:11px;color:var(--fg-3);font-family:var(--f-mono);text-align:center;letter-spacing:0.04em}