:root { color-scheme: light; --bg:#fafafa; --card:#fff; --fg:#0a0a0a; --muted:#737373; --border:#e5e5e5; --primary:#171717; --primary-fg:#fafafa; --ring:#71717a; }
*,*::before,*::after { box-sizing:border-box; }
html,body { min-height:100%; margin:0; }
body { display:grid; place-items:center; min-height:100vh; min-height:100svh; padding:24px; background:var(--bg); color:var(--fg); font:16px/1.5 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
.login-shell { width:100%; max-width:400px; }
.product { margin:0 0 20px; text-align:center; font-size:15px; font-weight:600; letter-spacing:-.01em; }
.login-card { padding:28px; border:1px solid var(--border); border-radius:10px; background:var(--card); box-shadow:0 1px 2px rgb(0 0 0 / .04),0 10px 30px rgb(0 0 0 / .04); }
h1 { margin:0; font-size:24px; line-height:1.2; letter-spacing:-.025em; }
.description { margin:8px 0 24px; color:var(--muted); }
.primary-action { display:flex; min-height:44px; align-items:center; justify-content:center; padding:10px 16px; border:1px solid var(--primary); border-radius:7px; background:var(--primary); color:var(--primary-fg); font-weight:500; text-decoration:none; }
.primary-action:hover { background:#262626; }
.primary-action:focus-visible { outline:3px solid var(--ring); outline-offset:3px; }
.passkey-note,.security-note { color:var(--muted); font-size:13px; text-align:center; }
.passkey-note { margin:16px 0 0; }
.security-note { margin:18px 0 0; }
@media (max-width:480px) { body { padding:16px; } .login-card { padding:24px 20px; } }
@media (max-height:560px) { body { place-items:start center; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; } }