:root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #f5f7fb; color: #182235; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
.auth-shell { align-items: center; display: flex; justify-content: center; min-height: 100vh; padding: 24px; }
.auth-card { background: #fff; border: 1px solid #d9e0ec; border-radius: 16px; box-shadow: 0 18px 45px rgba(35, 55, 85, .12); max-width: 420px; padding: 36px; width: 100%; }
.auth-card--login { padding: 0 36px 36px; overflow: hidden; }
.auth-brand-panel { min-height: 102px; margin: 0 -36px 30px; padding: 22px 36px; display: flex; align-items: center; background-color: #fffaf3; background-image: linear-gradient(rgba(255, 253, 248, .66), rgba(255, 250, 242, .72)), url("/static/public/brand/real-light-wood.webp"); background-position: center, center; background-repeat: no-repeat; background-size: auto, cover; border-bottom: 1px solid #f0dec9; }
.auth-card--login .auth-brand { margin: 0; display: inline-flex; align-items: center; gap: 10px; color: #0b1f3a; font-size: 1.38rem; }
.auth-card--login .auth-brand img { width: 34px; height: 34px; }
.auth-brand { color: #2458d3; display: inline-block; font-size: 1.25rem; font-weight: 800; letter-spacing: -.04em; margin-bottom: 30px; text-decoration: none; }
h1 { font-size: 1.75rem; letter-spacing: -.03em; margin: 0 0 24px; }
.auth-form { display: grid; gap: 9px; }
.auth-form label { font-size: .92rem; font-weight: 650; margin-top: 8px; }
.auth-form input { border: 1px solid #b9c5d7; border-radius: 8px; color: inherit; font: inherit; min-height: 44px; padding: 10px 12px; width: 100%; }
.auth-form input:focus-visible, .auth-form button:focus-visible, .auth-brand:focus-visible { outline: 3px solid #7ea5ff; outline-offset: 2px; }
.auth-form button { background: #2458d3; border: 0; border-radius: 8px; color: #fff; cursor: pointer; font: inherit; font-weight: 700; margin-top: 16px; min-height: 44px; padding: 10px 16px; }
.auth-form button:hover { background: #1947b4; }
.auth-error { background: #fff0f0; border: 1px solid #ebbbbb; border-radius: 8px; color: #9d2424; margin: 0 0 18px; padding: 12px; }
.auth-message { line-height: 1.55; margin: 0 0 18px; }
.auth-help { line-height: 1.45; margin: 18px 0 0; }
.auth-help a { color: #2458d3; font-weight: 650; }
.auth-help a:focus-visible { outline: 3px solid #7ea5ff; outline-offset: 2px; }
@media (max-width: 480px) { .auth-shell { align-items: flex-start; padding: 16px; } .auth-card { margin-top: 12vh; padding: 28px 22px; } .auth-card--login { padding: 0 22px 28px; } .auth-brand-panel { min-height: 88px; margin: 0 -22px 24px; padding: 18px 22px; } }