:root {
  --auth-brand: var(--color-primary, #f51b24); --auth-brand-hover: var(--color-primary-hover, #df1119); --auth-ink: var(--color-title, #0d0e12); --auth-copy: #50545b; --auth-muted: #767b84; --auth-line: #cfd2d7; --auth-line-soft: #e4e6e9; --auth-canvas: #f4f5f6; --auth-surface: #fff; --auth-danger: #d91f2b; --auth-danger-soft: #fff5f5; --auth-success: #0aa878; --auth-focus: rgba(245,27,36,.11); --auth-fast: 180ms; --auth-ease: cubic-bezier(.16,1,.3,1);
}
.auth-page { margin: 0; min-width: 0; color: var(--auth-copy); background: var(--auth-canvas); font: 400 16px/1.5 'Finlandica Text', sans-serif; }
.auth-page *, .auth-page *::before, .auth-page *::after { box-sizing: border-box; box-shadow: none; }
.auth-page button, .auth-page input { font: inherit; } .auth-page [hidden] { display: none!important; }
.auth-layout { display: grid; width: 100%; min-height: 100vh; padding: 132px 24px 72px; place-items: center; border-bottom: 1px solid var(--auth-line); background: var(--auth-canvas); }
.auth-panel { width: min(100%,500px); padding: 42px 42px 34px; border: 1px solid var(--auth-line-soft); border-top: 3px solid var(--auth-brand); border-radius: 16px; background: var(--auth-surface); }
.auth-page--register .auth-panel { width: min(100%,650px); }
.auth-panel__head { margin: 0 0 28px; }
.auth-panel__head h1, .auth-success h2 { margin: 0; color: var(--auth-ink); font: 580 38px/.98 'Finlandica Text', sans-serif; letter-spacing: -.045em; }
.auth-panel__head p { margin: 14px 0 0; color: var(--auth-copy); font-size: 15px; line-height: 1.45; }
.auth-panel__head strong { color: var(--auth-ink); font-weight: 650; }
.auth-message { margin: 0 0 18px; padding: 12px 14px; border: 1px solid #efc3c6; border-radius: 8px; background: var(--auth-danger-soft); color: var(--auth-danger); font-size: 15px; line-height: 1.4; }
.auth-message.is-info { border-color: var(--auth-line-soft); background: #f8f8f9; color: var(--auth-copy); }
.auth-form { display: grid; gap: 18px; }
.auth-fields-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.auth-field { display: grid; gap: 7px; color: var(--auth-ink); font-size: 15px; font-weight: 650; }
.auth-field input { width: 100%; height: 52px; padding: 0 15px; border: 1px solid var(--auth-line); border-radius: 8px; outline: 0; background: var(--auth-surface); color: var(--auth-ink); font-size: 16px; font-weight: 400; transition: border-color var(--auth-fast) var(--auth-ease), background var(--auth-fast) var(--auth-ease); }
.auth-field input::placeholder { color: #9ca1aa; } .auth-field input:hover { border-color: var(--auth-muted); } .auth-field input:focus { border-color: var(--auth-brand); }
.auth-field small, .auth-standalone-error { margin: 0; color: var(--auth-danger); font-size: 15px; font-weight: 400; line-height: 1.35; }
.auth-field small:empty, .auth-standalone-error:empty { display: none; } .auth-field .auth-field__hint { display: block; color: var(--auth-muted); }
.auth-field.has-error input { border-color: var(--auth-danger); background: var(--auth-danger-soft); }
.auth-password { position: relative; display: block; } .auth-password input { padding-right: 102px; }
.auth-password button { position: absolute; top: 1px; right: 1px; bottom: 1px; min-width: 94px; padding: 0 12px; border: 0; border-left: 1px solid var(--auth-line-soft); border-radius: 0 7px 7px 0; background: var(--auth-surface); color: var(--auth-copy); font-size: 15px; font-weight: 600; cursor: pointer; } .auth-password button:hover { color: var(--auth-brand); }
.auth-form__options { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.auth-form__options > a { color: var(--auth-ink); font-size: 15px; text-underline-offset: 4px; }
.auth-check { display: flex; align-items: flex-start; gap: 10px; color: var(--auth-copy); font-size: 15px; line-height: 1.4; cursor: pointer; }
.auth-check input { width: 18px; height: 18px; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--auth-brand); } .auth-check a { color: var(--auth-ink); text-underline-offset: 3px; }
.auth-submit, .auth-secondary { display: flex; width: 100%; min-height: 52px; padding: 0 20px; align-items: center; justify-content: center; border: 1px solid var(--auth-brand); border-radius: 8px; background: var(--auth-brand); color: #fff!important; font-size: 16px; font-weight: 650; text-align: center; text-decoration: none; cursor: pointer; transition: background var(--auth-fast) var(--auth-ease), border-color var(--auth-fast) var(--auth-ease), transform var(--auth-fast) var(--auth-ease); }
.auth-submit:hover { border-color: var(--auth-brand-hover); background: var(--auth-brand-hover); } .auth-submit:active { transform: translateY(1px); }
.auth-switch { margin: 24px 0 0; color: var(--auth-copy); font-size: 15px; text-align: center; }
.auth-switch a, .auth-return { color: var(--auth-ink); font-weight: 650; text-underline-offset: 4px; }
.auth-return { display: inline-flex; margin: 0 0 26px; font-size: 15px; text-decoration: none; } .auth-return:hover { color: var(--auth-brand); }
.auth-field--code input { height: 52px; font: 400 16px/1.4 'Finlandica Text', sans-serif; letter-spacing: 0; text-align: left; }
.auth-resend { min-height: 40px; padding: 0; border: 0; background: transparent; color: var(--auth-copy); font-size: 15px; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; } .auth-resend:hover { color: var(--auth-brand); }
.auth-success { display:grid; justify-items:center; text-align:center; }
.auth-success > span { display: grid; width: 52px; height: 52px; margin-bottom: 24px; place-items: center; border-radius: 50%; background: var(--auth-success); color: #fff; font-size: 24px; }
.auth-success > p { margin: 15px 0 24px; color: var(--auth-copy); font-size: 15px; } .auth-next-actions { display: grid; width:100%; gap: 10px; }
.auth-secondary { border-color: var(--auth-line); background: var(--auth-surface); color: var(--auth-ink)!important; } .auth-secondary:hover { border-color: var(--auth-ink); }
.auth-page :focus-visible { outline: 2px solid var(--auth-brand); outline-offset: 3px; box-shadow: 0 0 0 4px var(--auth-focus); }
.auth-page .nav-link-num, .auth-page .nav-mega-kicker, .auth-page .mega-city-item small, .auth-page .eyebrow { font-size: 13px; }
@media (max-width: 820px) { .auth-layout { padding: 112px 20px 64px; } }
@media (max-width: 560px) { .auth-layout { padding: 96px 12px 48px; background: var(--auth-surface); } .auth-panel, .auth-page--register .auth-panel { padding: 32px 20px 28px; border-right: 0; border-bottom: 0; border-left: 0; border-radius: 0; } .auth-panel__head h1, .auth-success h2 { font-size: 34px; } .auth-fields-pair { grid-template-columns: 1fr; gap: 18px; } .auth-form__options { align-items: flex-start; flex-direction: column; gap: 13px; } .auth-field--code input { font-size: 16px; letter-spacing: 0; } }
@media (prefers-reduced-motion: reduce) { .auth-page *, .auth-page *::before, .auth-page *::after { transition-duration: .01ms!important; } }