:root { color-scheme: light; --navy: #101c38; --raspberry: #d41650; --ink: #12213b; --muted: #69768a; --line: #dfe5ee; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; display: grid; place-items: center; padding: 24px; color: var(--ink); background: radial-gradient(circle at 15% 0%, #fdeaf1, transparent 32%), #f4f6f9; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.login-shell { width: min(100%, 440px); }
.login-card { padding: 34px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 24px 80px rgba(16,28,56,.14); }
.brand-mark { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 22px; border-radius: 13px; color: #fff; background: linear-gradient(135deg, #eb2a65, #a80f3d); font-weight: 850; letter-spacing: -.03em; }
.eyebrow { color: var(--raspberry); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
h1 { margin: 7px 0 7px; font-size: 28px; letter-spacing: -.04em; }
.intro { margin: 0 0 25px; color: var(--muted); font-size: 13px; }
form { display: grid; gap: 8px; }
label { color: var(--muted); font-size: 11px; font-weight: 750; }
input { min-height: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font: inherit; }
input:focus { outline: 0; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(36,59,105,.12); }
button { min-height: 44px; margin-top: 8px; border: 0; border-radius: 9px; color: #fff; background: var(--navy); cursor: pointer; font: inherit; font-weight: 800; }
button:hover { background: #1b2e56; }
.error { margin: 7px 0 0; padding: 9px 10px; border-radius: 8px; color: #a42e2e; background: #fdecec; font-size: 11px; }
.security-note { margin: 24px 0 0; color: var(--muted); font-size: 10px; line-height: 1.5; }