/* Dedicated login and registration pages */
body.auth-page-body.auth-desktop-shell,
body.auth-page-body.auth-mobile-shell {
   --auth-canvas: #0a2239;
   --auth-panel: #123a5f;
   --auth-panel-raised: #173f67;
   --auth-text: #f8fbff;
   --auth-muted: #c8d9e8;
   --auth-subtle: #a9bfd2;
   --auth-accent-cyan: #67e8f9;
   --auth-accent-gold: #fcd34d;
   --auth-accent-lilac: #c4b5fd;
   --auth-accent-green: #86efac;
   --auth-action-start: #2563eb;
   --auth-action-end: #0ea5e9;
   --auth-action-gradient: linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%);
   --auth-border: rgba(220, 234, 245, .18);
   --auth-control: #f4f8fc;
   --auth-control-focus: #ffffff;
   --auth-control-text: #102033;
   --auth-control-placeholder: #64748b;
   --auth-control-icon: #7890a8;
   --auth-control-border: #c9d7e5;
   --auth-link: #7cc4ff;
   --auth-divider: rgba(220, 234, 245, .24);
   --auth-form-surface: #ffffff;
   --auth-form-border: rgba(35, 77, 119, .24);
   --auth-shadow: 0 28px 90px rgba(2, 12, 27, .32), 0 2px 8px rgba(2, 12, 27, .18);
   --auth-grid-size: 32px 32px;
   --auth-grid-line: rgba(56, 189, 248, .1);
   --auth-page-background:
      radial-gradient(circle at 14% 20%, rgba(34, 211, 238, .16), transparent 34%),
      radial-gradient(circle at 84% 18%, rgba(37, 99, 235, .22), transparent 36%),
      linear-gradient(var(--auth-grid-line) 1px, transparent 1px) 0 0 / var(--auth-grid-size),
      linear-gradient(90deg, var(--auth-grid-line) 1px, transparent 1px) 0 0 / var(--auth-grid-size),
      linear-gradient(120deg, #020617 0%, #071b2f 48%, #063044 100%);
   --auth-mobile-promo-background:
      radial-gradient(circle at 92% 7%, transparent 0 142px, rgba(255, 255, 255, .16) 143px 144px, transparent 145px),
      radial-gradient(circle at 4% 93%, transparent 0 112px, rgba(255, 255, 255, .14) 113px 114px, transparent 115px),
      linear-gradient(rgba(255, 255, 255, .09) 1px, transparent 1px) 0 0 / 18px 18px,
      linear-gradient(145deg, rgba(255, 255, 255, .08), transparent 35%),
      linear-gradient(155deg, #172a5d 0%, #2149a0 48%, #0786b8 100%);
   --bg: var(--auth-canvas);
   --bg2: var(--auth-control);
   --sf: var(--auth-panel);
   --bd: var(--auth-border);
   --bd2: var(--auth-control-border);
   --tx: var(--auth-text);
   --tx2: var(--auth-muted);
   --tx3: var(--auth-subtle);
   display: block;
   min-height: 100vh;
   min-height: 100dvh;
   padding: 0 !important;
   color: var(--auth-text);
   color-scheme: dark;
   background: var(--auth-page-background);
   overflow-x: hidden;
   overflow-anchor: none;
   transition: background-color .2s ease, color .2s ease;
}

html.lm body.auth-page-body,
html[data-theme="light"] body.auth-page-body {
   --auth-canvas: #f1f6fb;
   --auth-panel: #ffffff;
   --auth-panel-raised: #ffffff;
   --auth-text: #153b63;
   --auth-muted: #536f8b;
   --auth-subtle: #6f849a;
   --auth-border: rgba(35, 77, 119, .14);
   --auth-control: #f5f9fd;
   --auth-control-focus: #ffffff;
   --auth-control-text: #102f4e;
   --auth-control-placeholder: #6c8299;
   --auth-control-icon: #7890a8;
   --auth-control-border: #c8d6e4;
   --auth-link: #1d4ed8;
   --auth-divider: #d7e1eb;
   --auth-form-surface: #ffffff;
   --auth-form-border: rgba(35, 77, 119, .2);
   --auth-shadow: 0 28px 90px rgba(15, 23, 42, .14), 0 2px 8px rgba(15, 23, 42, .05);
   --auth-grid-size: 32px 32px;
   --auth-grid-line: rgba(14, 165, 233, .1);
   --auth-page-background:
      radial-gradient(circle at 14% 22%, rgba(6, 182, 212, .16), transparent 34%),
      radial-gradient(circle at 86% 18%, rgba(37, 99, 235, .18), transparent 36%),
      linear-gradient(var(--auth-grid-line) 1px, transparent 1px) 0 0 / var(--auth-grid-size),
      linear-gradient(90deg, var(--auth-grid-line) 1px, transparent 1px) 0 0 / var(--auth-grid-size),
      linear-gradient(120deg, #f8fcff 0%, #edfaff 46%, #dff5ff 100%);
   --auth-mobile-promo-background:
      radial-gradient(circle at 92% 7%, transparent 0 142px, rgba(37, 99, 235, .24) 143px 144px, transparent 145px),
      radial-gradient(circle at 4% 93%, transparent 0 112px, rgba(14, 165, 233, .22) 113px 114px, transparent 115px),
      linear-gradient(rgba(37, 99, 235, .11) 1px, transparent 1px) 0 0 / 18px 18px,
      linear-gradient(145deg, rgba(255, 255, 255, .52), transparent 35%),
      linear-gradient(155deg, #d8e8ff 0%, #b9d8ff 48%, #72d5e8 100%);
   color-scheme: light;
}

.auth-page-skip {
   position: fixed;
   top: 10px;
   left: 12px;
   z-index: 10001;
   padding: 10px 14px;
   color: #fff;
   font-size: .82rem;
   font-weight: 700;
   text-decoration: none;
   background: var(--auth-action-start, #2563eb);
   border-radius: 10px;
   transform: translateY(-150%);
   transition: transform .16s ease;
}
.auth-page-skip:focus { transform: translateY(0); }

.auth-page-shell {
   width: 100%;
   min-height: 100vh;
   min-height: 100dvh;
   display: flex;
   flex-direction: column;
   padding: max(12px, env(safe-area-inset-top, 0px)) max(22px, env(safe-area-inset-right, 0px)) max(8px, env(safe-area-inset-bottom, 0px)) max(22px, env(safe-area-inset-left, 0px));
   background: var(--auth-page-background);
}
.auth-page-topbar {
   width: min(1180px, 100%);
   min-height: 46px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 20px;
   margin: 0 auto 9px;
}
.auth-page-brand,
.auth-page-back { display: inline-flex; align-items: center; color: var(--auth-text); text-decoration: none; }
.auth-page-brand { gap: 10px; font-size: 1.02rem; font-weight: 700; letter-spacing: -.025em; }
.auth-page-brand strong { color: var(--auth-action-start, #2563eb); font-weight: 800; }
.auth-page-brand-mark {
   width: 40px;
   height: 40px;
   display: grid;
   place-items: center;
   background: #fff;
   border: 1px solid rgba(148, 163, 184, .3);
   border-radius: 12px;
   box-shadow: 0 8px 20px rgba(15, 23, 42, .08);
}
.auth-page-brand-mark img { width: 31px; height: 31px; object-fit: contain; }
.auth-page-back {
   min-height: 42px;
   gap: 8px;
   padding: 0 13px;
   color: var(--auth-text);
   font-size: .82rem;
   font-weight: 650;
   background: var(--auth-panel-raised);
   border: 1px solid var(--auth-border);
   border-radius: 11px;
   box-shadow: 0 8px 18px rgba(15, 23, 42, .1);
   transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.auth-page-back:hover,
.auth-page-back:focus-visible { color: #fff; background: #1d4ed8; border-color: #1d4ed8; box-shadow: 0 10px 22px rgba(37, 99, 235, .24); transform: translateX(-2px); }
.auth-page-topbar-actions { display: flex; align-items: center; gap: 6px; }
.auth-page-theme-toggle {
   width: 42px;
   height: 42px;
   display: grid;
   place-items: center;
   padding: 0;
   color: var(--auth-muted);
   background: transparent;
   border: 1px solid transparent;
   border-radius: 11px;
   cursor: pointer;
   transition: color .16s ease, background-color .16s ease, border-color .16s ease, transform .16s ease;
}
.auth-page-theme-toggle:hover { color: var(--auth-link); background: var(--auth-panel-raised); border-color: var(--auth-border); transform: translateY(-1px); }
.auth-page-theme-toggle [hidden] { display: none !important; }

.auth-page-card {
   width: min(1180px, 100%);
   display: grid;
   grid-template-columns: minmax(330px, .82fr) minmax(520px, 1.18fr);
   flex: 1 1 auto;
   min-height: 0;
   margin: 0 auto;
   overflow: hidden;
   overflow-anchor: none;
   background: var(--auth-form-surface);
   border: 1px solid var(--auth-form-border);
   border-radius: 24px;
   box-shadow: var(--auth-shadow);
}
.auth-page-shell[data-auth-mode="login"] .auth-page-card { min-height: 0; }

.auth-page-promo {
   position: relative;
   min-height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   gap: 20px;
   padding: clamp(28px, 3vw, 44px);
   color: #f8fbff;
   background:
      radial-gradient(85% 90% at 4% 100%, rgba(14, 165, 233, .28), transparent 66%),
      radial-gradient(75% 75% at 100% 0%, rgba(96, 165, 250, .24), transparent 64%),
      linear-gradient(145deg, rgba(255, 255, 255, .09), transparent 35%),
      linear-gradient(155deg, #172a5d 0%, #2149a0 48%, #0786b8 100%);
   isolation: isolate;
   overflow: hidden;
}
.auth-page-promo::before {
   content: "";
   position: absolute;
   inset: 0;
   z-index: -1;
   opacity: .14;
   background-image: radial-gradient(rgba(255, 255, 255, .8) .8px, transparent .8px);
   background-size: 18px 18px;
   mask-image: linear-gradient(to bottom right, #000, transparent 78%);
}
.auth-page-promo::after {
   content: "";
   position: absolute;
   inset: 0;
   z-index: -1;
   pointer-events: none;
   background: linear-gradient(110deg, transparent 0 56%, rgba(255, 255, 255, .06) 56.2%, transparent 56.5%);
}
.auth-page-orb { position: absolute; z-index: -1; border: 1px solid rgba(255, 255, 255, .16); border-radius: 50%; }
.auth-page-orb-one { width: 270px; height: 270px; right: -120px; top: -85px; box-shadow: inset 0 0 60px rgba(255, 255, 255, .07); }
.auth-page-orb-two { width: 190px; height: 190px; left: -95px; bottom: 36px; }
.auth-page-promo-content { position: relative; z-index: 1; margin: auto 0; }
.auth-page-promo-kicker {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   margin-bottom: 14px;
   padding: 7px 11px;
   color: #ecfeff;
   font-size: .68rem;
   font-weight: 700;
   letter-spacing: .06em;
   text-transform: uppercase;
   background: rgba(125, 211, 252, .13);
   border: 1px solid rgba(186, 230, 253, .22);
   border-radius: 999px;
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 8px 18px rgba(8, 47, 73, .12);
}
.auth-page-promo-kicker i { color: var(--auth-accent-gold); font-size: .82rem; filter: drop-shadow(0 0 8px rgba(252, 211, 77, .42)); }
.auth-page-promo h2 { max-width: 450px; margin: 0; color: #fff; font-size: clamp(1.8rem, 2.65vw, 2.55rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.04; text-wrap: balance; }
.auth-page-promo-content > p { max-width: 450px; margin: 14px 0 0; color: rgba(238, 247, 255, .84); font-size: .86rem; line-height: 1.58; text-align: left; text-wrap: pretty; }
.auth-page-benefits { position: relative; display: grid; gap: 12px; margin: 23px 0 0; padding: 0; list-style: none; }
.auth-page-benefits::before { content: ""; position: absolute; top: 19px; bottom: 19px; left: 19px; width: 1px; background: linear-gradient(to bottom, rgba(103, 232, 249, .55), rgba(196, 181, 253, .24)); }
.auth-page-benefits li { position: relative; z-index: 1; display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: 11px; }
.auth-page-benefit { --benefit-accent: var(--auth-accent-cyan); --benefit-surface: rgba(34, 211, 238, .14); --benefit-border: rgba(103, 232, 249, .28); }
.auth-page-benefit-focus { --benefit-accent: var(--auth-accent-cyan); --benefit-surface: rgba(34, 211, 238, .14); --benefit-border: rgba(103, 232, 249, .28); }
.auth-page-benefit-feedback { --benefit-accent: var(--auth-accent-gold); --benefit-surface: rgba(251, 191, 36, .14); --benefit-border: rgba(253, 224, 71, .28); }
.auth-page-benefit-progress { --benefit-accent: var(--auth-accent-lilac); --benefit-surface: rgba(167, 139, 250, .16); --benefit-border: rgba(196, 181, 253, .3); }
.auth-page-benefit-private { --benefit-accent: var(--auth-accent-green); --benefit-surface: rgba(34, 197, 94, .14); --benefit-border: rgba(134, 239, 172, .28); }
.auth-page-benefit-recovery { --benefit-accent: var(--auth-accent-gold); --benefit-surface: rgba(251, 191, 36, .14); --benefit-border: rgba(253, 224, 71, .28); }
.auth-page-benefits li > span,
.auth-page-benefit-icon { width: 40px; height: 40px; display: grid; place-items: center; color: var(--benefit-accent); background: linear-gradient(145deg, var(--benefit-surface), rgba(255, 255, 255, .06)); border: 1px solid var(--benefit-border); border-radius: 13px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 7px 14px rgba(8, 47, 73, .1); }
.auth-page-benefit-icon i { font-size: .94rem; filter: drop-shadow(0 0 6px var(--benefit-accent)); }
.auth-page-benefit > div { min-width: 0; padding-top: 1px; }
.auth-page-benefits strong, .auth-page-benefits small { display: block; }
.auth-page-benefits strong { color: #fff; font-size: .84rem; font-weight: 750; line-height: 1.25; }
.auth-page-benefits small { max-width: 34rem; margin-top: 3px; color: rgba(232, 243, 255, .78); font-size: .7rem; line-height: 1.42; text-wrap: pretty; }
.auth-page-body .auth-page-promo h2 { color: #fff !important; }
.auth-page-body .auth-page-promo-content > p { color: rgba(238, 247, 255, .82); }
.auth-page-body .auth-page-benefits small { color: rgba(232, 243, 255, .75); }
.auth-page-promo-footer { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 10px 18px; color: rgba(238, 247, 255, .73); font-size: .68rem; font-weight: 600; }
.auth-page-promo-footer span { display: inline-flex; align-items: center; gap: 7px; }
.auth-page-promo-footer span i { color: var(--auth-accent-cyan); }
.auth-page-promo-footer span:nth-child(2) i { color: var(--auth-accent-gold); }

.auth-page-form-side {
   --auth-text: #153b63;
   --auth-muted: #536f8b;
   --auth-subtle: #6f849a;
   --auth-link: #1d4ed8;
   --auth-security-text: #9a3412;
   --auth-security-icon: #d97706;
   --auth-security-surface: rgba(245, 158, 11, .11);
   --auth-security-border: rgba(217, 119, 6, .34);
   --auth-border: rgba(35, 77, 119, .14);
   --auth-divider: #d7e1eb;
   --bg: #f1f6fb;
   --bg2: #edf5fc;
   --bg3: #f7fbff;
   --sf: #ffffff;
   --bd: rgba(35, 77, 119, .14);
   --bd2: rgba(35, 77, 119, .22);
   --tx: #153b63;
   --tx2: #536f8b;
   --tx3: #6f849a;
   --pur: #1d4ed8;
   --blu: #06b6d4;
   color-scheme: light;
   min-height: 0;
   display: flex;
   align-items: center;
   padding: clamp(22px, 2.7vw, 40px);
   color: #153b63;
   background: var(--auth-form-surface);
   border-left: 1px solid var(--auth-form-border);
   overflow-y: auto;
   overflow-anchor: none;
   overscroll-behavior: contain;
   scrollbar-gutter: stable;
}
/* The shared user-page theme intentionally uses high-specificity, global text
   rules. Keep the auth form's white surface readable in both day and night
   themes by scoping its contrast tokens back to the form panel. */
body.auth-page-body .auth-page-form-side .auth-page-eyebrow,
body.auth-page-body .auth-page-form-side .auth-page-heading h1,
body.auth-page-body .auth-page-form-side .auth-page-intro,
body.auth-page-body .auth-page-form-side .auth-page-field > label,
body.auth-page-body .auth-page-form-side .auth-page-label-row label,
body.auth-page-body .auth-page-form-side .auth-page-check,
body.auth-page-body .auth-page-form-side .auth-page-check label,
body.auth-page-body .auth-page-form-side .auth-page-field-help,
body.auth-page-body .auth-page-form-side .auth-page-password-status,
body.auth-page-body .auth-page-form-side .auth-page-password-rules,
body.auth-page-body .auth-page-form-side .auth-page-support-copy,
body.auth-page-body .auth-page-form-side .auth-page-security-note {
   color: var(--auth-text) !important;
   -webkit-text-fill-color: var(--auth-text) !important;
}
body.auth-page-body .auth-page-form-side .auth-page-eyebrow,
body.auth-page-body .auth-page-form-side .auth-page-field-help,
body.auth-page-body .auth-page-form-side .auth-page-password-status,
body.auth-page-body .auth-page-form-side .auth-page-password-rules,
body.auth-page-body .auth-page-form-side .auth-page-support-copy,
body.auth-page-body .auth-page-form-side .auth-page-security-note,
body.auth-page-body .auth-page-form-side .auth-page-check {
   color: var(--auth-muted) !important;
   -webkit-text-fill-color: var(--auth-muted) !important;
}
body.auth-page-body .auth-page-form-side .auth-page-eyebrow,
body.auth-page-body .auth-page-form-side .auth-page-label-row a,
body.auth-page-body .auth-page-form-side .auth-page-check a,
body.auth-page-body .auth-page-form-side .auth-page-switch a {
   color: var(--auth-link) !important;
   -webkit-text-fill-color: var(--auth-link) !important;
}
body.auth-page-body .auth-page-form-side .auth-page-switch {
   color: var(--auth-subtle) !important;
   -webkit-text-fill-color: var(--auth-subtle) !important;
}
body.auth-page-body .auth-page-form-side .auth-page-security-note i {
   width: 18px;
   height: 18px;
   display: inline-grid;
   place-items: center;
   flex: 0 0 18px;
   color: #fff !important;
   -webkit-text-fill-color: #fff !important;
   background: var(--auth-action-start, var(--auth-security-icon));
   border-radius: 50%;
   font-size: .56rem;
}
body.auth-page-body .auth-page-form-side .auth-page-security-note {
   width: fit-content;
   max-width: 100%;
   margin-left: auto;
   margin-right: auto;
   padding: 5px 11px;
   color: var(--auth-security-text) !important;
   -webkit-text-fill-color: var(--auth-security-text) !important;
   background: var(--auth-security-surface);
   border: 1px solid var(--auth-security-border);
   border-radius: 999px;
   font-weight: 650;
   line-height: 1.35;
}
.auth-page-security-note > span { min-width: 0; text-wrap: balance; }
body.auth-page-body .auth-page-form-side .auth-page-field-help.is-valid,
body.auth-page-body .auth-page-form-side .auth-page-password-status.is-valid,
body.auth-page-body .auth-page-form-side .auth-page-password-rules li.is-met {
   color: #059669 !important;
   -webkit-text-fill-color: #059669 !important;
}
body.auth-page-body .auth-page-form-side .auth-page-field-help.is-invalid,
body.auth-page-body .auth-page-form-side .auth-page-password-status.is-invalid {
   color: #dc2626 !important;
   -webkit-text-fill-color: #dc2626 !important;
}
.auth-page-form-wrap { width: 100%; max-width: 610px; margin: auto; transform-origin: 50% 50%; animation: auth-page-form-float 5.5s ease-in-out infinite; will-change: transform; }
.auth-page-shell[data-auth-mode="login"] .auth-page-form-wrap { max-width: 610px; }
.auth-page-switch { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 15px 0 0; color: var(--auth-subtle); font-size: .74rem; text-align: center; }
.auth-page-switch a { display: inline-flex; align-items: center; gap: 6px; color: var(--auth-link); font-weight: 750; text-decoration: none; }
.auth-page-switch a:hover { text-decoration: underline; text-underline-offset: 3px; }
.auth-page-heading { display: flex; align-items: center; gap: 14px; }
.auth-page-heading-icon { width: 48px; height: 48px; flex: 0 0 48px; display: grid; place-items: center; color: #fff; background: var(--auth-action-gradient, linear-gradient(135deg, #2563eb, #0ea5e9)); border: 1px solid rgba(255, 255, 255, .22); border-radius: 15px; box-shadow: 0 12px 28px rgba(37, 99, 235, .23); animation: auth-page-form-icon-pulse 3.2s ease-in-out infinite; will-change: transform, box-shadow; }
.auth-page-eyebrow { margin: 0 0 2px; color: var(--auth-link); font-size: .64rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.auth-page-heading h1 { margin: 0; color: var(--auth-text); font-size: clamp(1.48rem, 2.2vw, 1.9rem); font-weight: 780; letter-spacing: -.035em; line-height: 1.12; text-wrap: balance; }
.auth-page-intro { max-width: 36rem; margin: 10px 0 18px; color: var(--auth-muted); font-size: .8rem; line-height: 1.5; text-wrap: pretty; }

.auth-page-alert { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; margin-bottom: 18px; padding: 12px 14px; font-size: .78rem; line-height: 1.5; border: 1px solid; border-radius: 12px; }
.auth-page-alert > i { margin-top: 2px; }
.auth-page-alert strong, .auth-page-alert p { display: block; margin: 0; }
.auth-page-alert strong { font-size: .78rem; font-weight: 750; }
.auth-page-alert p { margin-top: 2px; }
.auth-page-alert .auth-create-account-link { color: var(--auth-link); font-weight: 750; text-decoration: underline; text-underline-offset: 2px; }
.auth-page-alert .auth-create-account-link:hover { color: var(--auth-text); }
.auth-page-alert-error { color: #b42318; background: #fff3f2; border-color: #ffd0cc; }
.auth-page-alert-warning { color: #92400e; background: #fffbeb; border-color: #fde68a; }
.auth-page-alert-success { color: #047857; background: #ecfdf5; border-color: #a7f3d0; }
.auth-page-reactivation { margin-top: 8px; padding: 8px 11px; color: #fff; font: inherit; font-weight: 750; background: #b45309; border: 0; border-radius: 9px; cursor: pointer; }

.auth-page-google {
   min-height: 48px;
   display: grid;
   grid-template-columns: 24px 1fr 20px;
   align-items: center;
   gap: 11px;
   padding: 0 16px;
   color: var(--auth-control-text) !important;
   -webkit-text-fill-color: var(--auth-control-text);
   font-size: .82rem;
   font-weight: 700;
   text-align: center;
   text-decoration: none;
   background: var(--auth-control) !important;
   border: 1px solid var(--auth-control-border);
   border-radius: 13px;
   transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.auth-page-google:hover { color: var(--auth-control-text) !important; background: var(--auth-control-focus) !important; border-color: #60a5fa; box-shadow: 0 9px 24px rgba(37, 99, 235, .16); transform: translateY(-1px); }
.auth-page-google.is-loading { pointer-events: none; opacity: .74; }
.auth-page-google .google-auth-mark { width: 23px; height: 23px; display: block; }
.auth-page-google .google-auth-svg { width: 100%; height: 100%; display: block; }
.auth-page-google-arrow { justify-self: end; color: var(--auth-control-icon); font-size: .72rem; }
.auth-page-divider { display: flex; align-items: center; gap: 12px; margin: 17px 0; color: var(--auth-subtle); font-size: .65rem; text-align: center; }
.auth-page-divider::before, .auth-page-divider::after { content: ""; height: 1px; flex: 1; background: var(--auth-divider); }

.auth-page-form { display: grid; gap: 14px; }
.auth-page-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.auth-page-field-full { grid-column: 1 / -1; }
.auth-page-field { min-width: 0; }
.auth-page-field > label, .auth-page-label-row label { display: block; margin-bottom: 5px; color: var(--auth-text); font-size: .7rem; font-weight: 720; }
.auth-page-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.auth-page-label-row a, .auth-page-forgot-link a { color: var(--auth-link); font-size: .69rem; font-weight: 700; text-decoration: none; }
.auth-page-label-row a:hover, .auth-page-forgot-link a:hover { text-decoration: underline; text-underline-offset: 3px; }
.auth-page-forgot-link { display: flex; justify-content: flex-end; margin-top: 8px; }

.auth-page-input-wrap { min-height: 48px; display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; gap: 9px; padding: 0 14px; color: var(--auth-action-start, #2563eb); background: var(--auth-control); border: 1px solid var(--auth-control-border); border-radius: 12px; transition: color .16s ease, border-color .16s ease, background-color .16s ease; }
.auth-page-input-wrap:focus-within { color: var(--auth-action-start, #2563eb); background: var(--auth-control); border-color: var(--auth-control-border); box-shadow: none; }
.auth-page-input-wrap:has(.auth-page-input:focus-visible) { border-color: var(--auth-action-start, #2563eb); }
.auth-page-password-wrap { grid-template-columns: 20px minmax(0, 1fr) 42px; padding-right: 4px; }
.auth-page-input { width: 100%; min-width: 0; height: 46px; padding: 0; color: var(--auth-control-text); -webkit-text-fill-color: var(--auth-control-text); caret-color: var(--auth-control-text); font-family: inherit; font-size: .82rem; line-height: 1.2; background: transparent !important; border: 0; outline: 0 !important; box-shadow: none !important; }
.auth-page-input:focus,
.auth-page-input:focus-visible { outline: 0 !important; outline-offset: 0 !important; box-shadow: none !important; }
.auth-page-input::placeholder { color: var(--auth-control-placeholder); -webkit-text-fill-color: var(--auth-control-placeholder); opacity: 1; }
.auth-page-input[aria-invalid="true"] { color: var(--auth-control-text); }
.auth-page-input:-webkit-autofill,
.auth-page-input:-webkit-autofill:hover,
.auth-page-input:-webkit-autofill:focus {
   -webkit-text-fill-color: var(--auth-control-text) !important;
   caret-color: var(--auth-control-text);
   box-shadow: 0 0 0 1000px var(--auth-control) inset !important;
   transition: background-color 9999s ease-out 0s;
}
.auth-page-input-wrap:has(.auth-page-input[aria-invalid="true"]) { border-color: #f87171; }
.auth-page-password-toggle { width: 42px; height: 42px; display: grid; place-items: center; padding: 0; color: var(--auth-control-icon); background: transparent; border: 0; border-radius: 10px; cursor: pointer; }
.auth-page-password-toggle:hover { color: var(--auth-action-start, #2563eb); background: rgba(37, 99, 235, .08); }

.auth-page-field-help, .auth-page-field-error, .auth-page-password-status { display: flex; align-items: flex-start; gap: 5px; margin-top: 6px; font-size: .63rem; line-height: 1.45; }
.auth-page-field-help { color: var(--auth-subtle); }
.auth-page-field-error { color: #dc2626; font-weight: 650; }
.auth-page-field-help.is-valid { color: #059669; font-weight: 650; }
.auth-page-field-help.is-invalid { color: #dc2626; font-weight: 650; }
.auth-page-password-status.is-valid { color: #059669; }
.auth-page-password-status.is-invalid { color: #dc2626; }
.auth-page-password-status[hidden] { display: none !important; }
.auth-page-password-rules { display: flex; flex-wrap: wrap; gap: 4px 9px; margin: 5px 0 0; padding: 0; color: var(--auth-subtle); font-size: .59rem; list-style: none; }
.auth-page-password-rules li { display: inline-flex; align-items: center; gap: 4px; }
.auth-page-password-rules i { font-size: .38rem; }
.auth-page-password-rules li.is-met { color: #059669; font-weight: 650; }

.auth-page-options { display: flex; align-items: center; justify-content: space-between; }
.auth-page-check { display: grid; grid-template-columns: 18px minmax(0, 1fr); align-items: start; gap: 9px; color: var(--auth-muted); font-size: .68rem; line-height: 1.42; }
.auth-page-check input[type="checkbox"] { width: 17px; height: 17px; margin: 2px 0 0; accent-color: var(--auth-action-start, #2563eb); cursor: pointer; }
.auth-page-check label { cursor: pointer; }
.auth-page-check a { color: var(--auth-link); font-weight: 700; text-decoration: none; }
.auth-page-check a:hover { text-decoration: underline; }
.auth-page-terms { margin-top: 1px; }
.auth-page-terms-error { margin-top: -11px; }

.auth-page-submit { min-height: 51px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 0 20px; color: #fff; font-family: inherit; font-size: .84rem; font-weight: 750; background: var(--auth-action-gradient, linear-gradient(135deg, #2563eb, #0ea5e9)); border: 0; border-radius: 13px; box-shadow: 0 12px 25px rgba(37, 99, 235, .2); cursor: pointer; transition: box-shadow .16s ease, transform .16s ease, filter .16s ease; position: relative; isolation: isolate; overflow: hidden; }
.auth-page-submit > *,
.auth-page-step-next > * { position: relative; z-index: 1; }
.auth-page-submit::after,
.auth-page-step-next::after { content: ""; position: absolute; z-index: 0; top: -40%; bottom: -40%; left: -38%; width: 28%; pointer-events: none; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .32), transparent); transform: translateX(-240%) skewX(-18deg); animation: auth-page-action-shine 5.2s ease-in-out infinite; }
.auth-page-submit:hover { filter: saturate(1.12); box-shadow: 0 15px 30px rgba(37, 99, 235, .27); transform: translateY(-1px); }
.auth-page-submit:disabled { opacity: .72; cursor: wait; transform: none; }
.auth-page-security-note { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 13px 0 0; color: var(--auth-subtle); font-size: .62rem; text-align: center; }
.auth-page-security-note i { color: #059669; animation: auth-page-form-icon-pulse 3.2s ease-in-out infinite; }
.auth-page-footer { min-height: 34px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 7px 14px; padding: 4px 10px; color: var(--auth-subtle); font-size: .76rem; font-weight: 600; }
.auth-page-footer-brand,
.auth-page-footer a { display: inline-flex; align-items: center; gap: 6px; }
.auth-page-footer-brand { color: var(--auth-muted); }
.auth-page-footer-brand i,
.auth-page-footer a i { color: var(--auth-link); font-size: .73rem; }
.auth-page-footer-divider { width: 4px; height: 4px; flex: 0 0 4px; background: var(--auth-link); border-radius: 50%; opacity: .55; }
.auth-page-footer a { color: var(--auth-link); font-weight: 750; text-decoration: none; }
.auth-page-footer a:hover { color: var(--auth-text); }

.auth-page-transition[hidden] { display: none !important; }
.auth-page-transition { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; padding: max(20px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(20px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); background: rgba(23, 39, 58, .64); backdrop-filter: blur(9px); opacity: 0; transition: opacity .18s ease; }
.auth-page-transition.is-active { opacity: 1; }
.auth-page-transition-card { width: min(560px, calc(100vw - 32px)); padding: clamp(34px, 5vw, 52px) clamp(22px, 5vw, 48px) clamp(30px, 4vw, 42px); color: var(--tx, #102033); text-align: center; background: var(--sf, #fff); border: 1px solid rgba(255, 255, 255, .82); border-radius: 30px; box-shadow: 0 28px 80px rgba(15, 23, 42, .30); transform: translateY(8px) scale(.985); transition: transform .18s ease; }
.auth-page-transition.is-active .auth-page-transition-card { transform: none; }
.auth-page-transition-logo { position: relative; width: 86px; height: 86px; display: grid; place-items: center; margin: 0 auto 23px; }
.auth-page-transition-logo > span { position: absolute; inset: 0; border: 4px solid rgba(37, 99, 235, .15); border-top-color: #2563eb; border-right-color: #06b6d4; border-radius: 50%; animation: auth-page-spin .8s linear infinite; }
.auth-page-transition-logo img { width: 60px; height: 60px; object-fit: contain; border-radius: 18px; filter: drop-shadow(0 10px 18px rgba(37, 99, 235, .18)); }
.auth-page-transition h2 { margin: 0; color: var(--tx, #102033); font-size: clamp(1.05rem, 2vw, 1.42rem); font-weight: 800; line-height: 1.25; letter-spacing: -.015em; }
.auth-page-transition p { max-width: 32rem; margin: 9px auto 0; color: var(--tx3, #64748b); font-size: clamp(.86rem, 1.5vw, 1rem); line-height: 1.5; }

@media (max-width: 575.98px) {
   .auth-page-transition-card { width: min(100%, 430px); padding: 31px 20px 28px; border-radius: 24px; }
   .auth-page-transition-logo { width: 72px; height: 72px; margin-bottom: 18px; }
   .auth-page-transition-logo > span { border-width: 3px; }
   .auth-page-transition-logo img { width: 50px; height: 50px; border-radius: 15px; }
}
@keyframes auth-page-form-float {
   0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
   35% { transform: translate3d(0, -2px, 0) scale(1.002); }
   70% { transform: translate3d(-1px, -1px, 0) scale(1.001); }
}
@keyframes auth-page-form-icon-pulse {
   0%, 100% { transform: scale(1); }
   50% { transform: scale(1.045); }
}
@keyframes auth-page-action-shine {
   0%, 55% { transform: translateX(-240%) skewX(-18deg); opacity: 0; }
   64% { opacity: 1; }
   78%, 100% { transform: translateX(520%) skewX(-18deg); opacity: 0; }
}
@keyframes auth-page-spin { to { transform: rotate(360deg); } }

.auth-page-brand:focus-visible,
.auth-page-back:focus-visible,
.auth-page-theme-toggle:focus-visible,
.auth-page-switch a:focus-visible,
.auth-page-google:focus-visible,
.auth-page-password-toggle:focus-visible,
.auth-page-step-next:focus-visible,
.auth-page-submit:focus-visible,
.auth-page-check a:focus-visible,
.auth-page-footer a:focus-visible,
.auth-page-reactivation:focus-visible {
   outline: 3px solid rgba(37, 99, 235, .36);
   outline-offset: 3px;
}
.auth-page-back:focus-visible { outline-color: rgba(248, 113, 113, .62); }

html.dm .auth-page-alert-error,
html[data-theme="dark"] .auth-page-alert-error { color: #fecaca; background: rgba(127, 29, 29, .24); border-color: rgba(248, 113, 113, .35); }
html.dm .auth-page-alert-warning,
html[data-theme="dark"] .auth-page-alert-warning { color: #fde68a; background: rgba(120, 53, 15, .24); border-color: rgba(251, 191, 36, .32); }
html.dm .auth-page-alert-success,
html[data-theme="dark"] .auth-page-alert-success { color: #a7f3d0; background: rgba(6, 78, 59, .25); border-color: rgba(52, 211, 153, .3); }
html.dm .auth-page-brand-mark,
html[data-theme="dark"] .auth-page-brand-mark { border-color: rgba(148, 163, 184, .2); box-shadow: 0 8px 24px rgba(0, 0, 0, .22); }

/* Keep every auth form readable when the outer page changes theme. The form
   remains a bright, high-contrast surface in dark mode while its surrounding
   canvas and navigation use the dark palette. */
html.lm .auth-page-form-side,
html[data-theme="light"] .auth-page-form-side,
.auth-page-shell[data-auth-theme="light"] .auth-page-form-side {
   --auth-form-surface: #ffffff;
   --auth-form-border: rgba(35, 77, 119, .2);
   --auth-text: #153b63;
   --auth-muted: #536f8b;
   --auth-subtle: #6f849a;
   --auth-control: #f5f9fd;
   --auth-control-focus: #ffffff;
   --auth-control-text: #102f4e;
   --auth-control-placeholder: #6c8299;
   --auth-control-icon: #7890a8;
   --auth-control-border: #c8d6e4;
   --auth-link: #1d4ed8;
   --auth-security-text: #9a3412;
   --auth-security-icon: #d97706;
   --auth-security-surface: rgba(245, 158, 11, .11);
   --auth-security-border: rgba(217, 119, 6, .34);
   --auth-divider: #d7e1eb;
   color-scheme: light;
   color: var(--auth-text);
   background: var(--auth-form-surface);
   border-left-color: var(--auth-form-border);
}

html.dm .auth-page-form-side,
html[data-theme="dark"] .auth-page-form-side,
.auth-page-shell[data-auth-theme="dark"] .auth-page-form-side {
   --auth-form-surface: #123a5f;
   --auth-form-border: rgba(147, 197, 253, .32);
   --auth-text: #f8fbff;
   --auth-muted: #c8d9e8;
   --auth-subtle: #a9bfd2;
   --auth-control: #173f67;
   --auth-control-focus: #1f527f;
   --auth-control-text: #f8fbff;
   --auth-control-placeholder: #a9bfd2;
   --auth-control-icon: #a6c4dc;
   --auth-control-border: rgba(220, 234, 245, .3);
   --auth-link: #7cc4ff;
   --auth-security-text: #fcd34d;
   --auth-security-icon: #f59e0b;
   --auth-security-surface: rgba(245, 158, 11, .14);
   --auth-security-border: rgba(251, 191, 36, .38);
   --auth-divider: rgba(220, 234, 245, .3);
   --pur: #60a5fa;
   --blu: #22d3ee;
   color-scheme: dark;
   color: var(--auth-text);
   background: var(--auth-form-surface);
   border-left-color: var(--auth-form-border);
}

.auth-page-shell[data-auth-mode="register"] .auth-page-switch { margin-top: 13px; }
.auth-page-shell[data-auth-mode="login"] .auth-page-intro { text-align: center; }
.auth-page-shell[data-auth-mode="register"] .auth-page-intro { text-align: center; }
.auth-page-shell[data-auth-mode="register"] .auth-page-heading { gap: 12px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-heading-icon { width: 44px; height: 44px; flex-basis: 44px; border-radius: 13px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-heading h1 { font-size: clamp(1.42rem, 2vw, 1.75rem); }
.auth-page-shell[data-auth-mode="register"] .auth-page-intro { margin: 6px 0 11px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-google { min-height: 44px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-divider { margin: 10px 0; font-size: .61rem; }
.auth-page-shell[data-auth-mode="register"] .auth-page-form { gap: 9px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-fields { gap: 9px 14px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-field > label { margin-bottom: 4px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-input-wrap { min-height: 44px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-input { height: 42px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-field-help,
.auth-page-shell[data-auth-mode="register"] .auth-page-field-error,
.auth-page-shell[data-auth-mode="register"] .auth-page-password-status { margin-top: 3px; font-size: .6rem; line-height: 1.32; }
.auth-page-shell[data-auth-mode="register"] .auth-page-password-rules { margin-top: 3px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-terms { font-size: .63rem; line-height: 1.35; }
.auth-page-shell[data-auth-mode="register"] .auth-page-submit { min-height: 45px; }
.auth-page-shell[data-auth-mode="register"] .auth-page-security-note { margin-top: 9px; }

.auth-support-page .auth-page-form-wrap { max-width: 520px; }
.auth-support-page .auth-page-heading h1 { font-size: clamp(1.42rem, 2.2vw, 1.86rem); }
.auth-support-page .auth-page-form { gap: 13px; }
.auth-support-page .auth-page-submit { min-height: 48px; }
.auth-page-support-divider { margin-top: 20px; margin-bottom: 12px; }
.auth-page-support-copy { margin: 0 0 12px; color: var(--auth-muted); font-size: .72rem; line-height: 1.5; }
.auth-mobile-register-only,
.auth-register-stepper { display: none; }
.auth-mobile-register-step { display: contents; }
.auth-mobile-register-final { display: contents; }
.auth-page-step-next { display: none; position: relative; isolation: isolate; overflow: hidden; }

@media (min-width: 981px) {
   body.auth-page-body.auth-desktop-shell { height: 100vh; height: 100dvh; overflow: hidden; }
   .auth-page-shell {
      height: 100vh;
      height: 100dvh;
      min-height: 0;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      overflow: hidden;
   }
   .auth-page-card { width: min(1180px, 100%); height: 100%; min-height: 0; flex: none; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-card,
   .auth-page-shell.auth-support-page .auth-page-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
   .auth-page-shell[data-auth-mode="login"] .auth-page-card { height: auto; align-self: center; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-promo { min-height: 0; }
   .auth-page-shell.auth-support-page .auth-page-card { height: auto; align-self: center; }
   .auth-page-shell.auth-support-page .auth-page-promo { min-height: 0; }
   .auth-page-shell.auth-support-page .auth-page-form-wrap { max-width: 610px; }
   .auth-page-form-side { min-height: 0; }
}

@media (min-width: 981px) and (max-height: 760px) {
   .auth-page-shell { padding-top: max(8px, env(safe-area-inset-top, 0px)); padding-bottom: max(5px, env(safe-area-inset-bottom, 0px)); }
   .auth-page-topbar { min-height: 42px; margin-bottom: 6px; }
   .auth-page-brand-mark { width: 36px; height: 36px; border-radius: 10px; }
   .auth-page-brand-mark img { width: 28px; height: 28px; }
   .auth-page-form-side { padding: 16px clamp(22px, 2.4vw, 34px); }
   .auth-page-promo { padding: 24px clamp(26px, 2.8vw, 38px); }
   .auth-page-promo-footer { display: none; }
   .auth-page-footer { min-height: 24px; }
}

@media (min-width: 981px) and (max-height: 680px) {
   .auth-page-promo h2 { font-size: clamp(1.7rem, 2.35vw, 2.15rem); }
   .auth-page-promo-content > p { margin-top: 9px; }
   .auth-page-benefits { gap: 8px; margin-top: 15px; }
   .auth-page-benefits small { display: none; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-security-note { display: none; }
}

@media (max-width: 980px) {
   body.auth-page-body.auth-mobile-shell,
   .auth-page-shell { min-height: 100svh; }
   .auth-page-shell { padding-right: max(18px, env(safe-area-inset-right, 0px)); padding-left: max(18px, env(safe-area-inset-left, 0px)); }
   .auth-page-topbar, .auth-page-card { width: min(680px, 100%); }
   .auth-page-card { grid-template-columns: minmax(0, 1fr); background: transparent; border: 0; box-shadow: none; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-card { flex: 0 0 auto; height: auto; align-self: center; margin-top: auto; margin-bottom: auto; }
   .auth-page-shell.auth-support-page .auth-page-card { flex: 0 0 auto; height: auto; align-self: center; margin-top: auto; margin-bottom: auto; }
   .auth-page-promo { display: none; }
   .auth-page-form-side { min-height: 0; padding: 24px clamp(18px, 3vw, 28px); background: var(--auth-form-surface); border: 1px solid var(--auth-form-border); box-shadow: 0 18px 48px rgba(15, 23, 42, .16); }
   .auth-page-form-wrap, .auth-page-shell[data-auth-mode="login"] .auth-page-form-wrap { max-width: 560px; }
}

@media (max-width: 640px) {
   body.auth-page-body.auth-desktop-shell,
   body.auth-page-body.auth-mobile-shell { background: var(--auth-page-background); }
   /* Recovery and reset forms can be taller than a phone viewport. Keep the
      document scrollable so the lower fields and submit action remain usable. */
   html.auth-mobile-document {
      overflow-x: hidden;
      overflow-y: auto;
      scroll-padding-bottom: 96px;
      -webkit-overflow-scrolling: touch;
   }
   body.auth-page-body.auth-mobile-shell {
      overflow-x: hidden;
      overflow-y: auto;
      scroll-padding-bottom: 96px;
      -webkit-overflow-scrolling: touch;
   }
   .auth-page-shell {
      min-height: 100dvh;
      min-height: 100svh;
      height: auto;
      scroll-padding-bottom: 96px;
      padding: max(8px, env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px)) max(8px, env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
   }
   .auth-page-topbar { min-height: 46px; margin-bottom: 4px; padding: 0 2px; }
   .auth-page-brand { font-size: .91rem; }
   .auth-page-brand-mark { width: 36px; height: 36px; border-radius: 10px; }
   .auth-page-brand-mark img { width: 28px; height: 28px; }
   .auth-page-theme-toggle { width: 42px; height: 42px; }
   .auth-page-back { min-height: 42px; padding: 0 9px; }
   .auth-page-back span { display: none; }
   .auth-page-card { flex: 0 0 auto; height: auto; margin-top: auto; margin-bottom: auto; overflow: visible; border: 0; border-radius: 20px; box-shadow: none; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-card { min-height: 0; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-card { min-height: 0; }
   .auth-page-shell.auth-support-page .auth-page-card { min-height: 0; }
   .auth-page-form-side { min-height: 0; align-items: flex-start; padding: 18px 14px 22px; border-radius: 20px; overflow: visible; scrollbar-gutter: auto; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-form-side { align-items: center; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-form-side { align-items: center; }
   .auth-page-form-wrap, .auth-page-shell[data-auth-mode="login"] .auth-page-form-wrap { max-width: 520px; margin: 0 auto; }
   .auth-page-switch { justify-content: center; margin: 14px 0 0; font-size: .74rem; text-align: center; }
   .auth-page-heading { gap: 12px; }
   .auth-page-heading-icon { width: 42px; height: 42px; flex-basis: 42px; border-radius: 12px; }
   .auth-page-heading h1 { font-size: 1.4rem; }
   .auth-page-intro { margin-top: 8px; margin-bottom: 16px; font-size: .8rem; }
   .auth-page-google { min-height: 50px; font-size: .84rem; }
   .auth-page-divider { margin: 16px 0; font-size: .64rem; }
   .auth-page-form { gap: 13px; }
   .auth-page-fields { grid-template-columns: minmax(0, 1fr); }
   .auth-page-field-full { grid-column: auto; }
   .auth-page-field > label, .auth-page-label-row label { font-size: .76rem; }
   .auth-page-input-wrap { min-height: 50px; }
   .auth-page-input { height: 48px; font-size: 1rem; }
   .auth-page-field-help, .auth-page-field-error, .auth-page-password-status { font-size: .7rem; }
   .auth-page-password-rules { font-size: .66rem; }
   .auth-page-check { font-size: .73rem; }
   .auth-page-submit { min-height: 50px; font-size: .86rem; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-switch { margin-top: 13px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-intro { margin: 7px 0 14px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-google { min-height: 50px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-divider { margin: 15px 0; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-form { gap: 13px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-fields { gap: 14px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-input-wrap { min-height: 50px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-input { height: 48px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-field-help,
   .auth-page-shell[data-auth-mode="register"] .auth-page-field-error,
   .auth-page-shell[data-auth-mode="register"] .auth-page-password-status { margin-top: 4px; font-size: .69rem; line-height: 1.4; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-terms { font-size: .72rem; line-height: 1.45; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-submit { min-height: 50px; }
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-only { display: block; }
   .auth-page-shell[data-auth-mode="register"] .auth-register-stepper { margin: 0 0 18px; }
   .auth-register-stepper ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; }
   .auth-register-stepper li { position: relative; z-index: 0; display: grid; justify-items: center; gap: 6px; color: var(--auth-subtle); font-size: .62rem; font-weight: 700; line-height: 1.2; text-align: center; }
   .auth-register-stepper li:not(:last-child)::after { content: ""; position: absolute; z-index: -1; top: 17px; left: calc(50% + 18px); width: calc(100% - 36px); height: 2px; background: var(--auth-divider); }
   .auth-register-stepper li.is-complete:not(:last-child)::after { background: #86efac; }
   .auth-register-step-trigger { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; color: inherit; background: transparent; border: 0; border-radius: 50%; cursor: pointer; }
   .auth-register-step-trigger:disabled { cursor: not-allowed; opacity: .58; }
   .auth-register-step-trigger:not(:disabled):hover .auth-register-step-marker { border-color: var(--auth-action-start, #2563eb); box-shadow: 0 0 0 4px rgba(37, 99, 235, .11); }
   .auth-register-step-trigger:focus-visible { outline: 3px solid rgba(37, 99, 235, .32); outline-offset: 3px; }
   .auth-register-step-marker { width: 36px; height: 36px; display: grid; place-items: center; color: var(--auth-muted); font-size: .82rem; font-weight: 800; background: var(--auth-control); border: 2px solid var(--auth-control-border); border-radius: 50%; transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease; }
   .auth-register-stepper li.is-active .auth-register-step-marker { color: #fff; background: var(--auth-action-start, #2563eb); border-color: var(--auth-action-start, #2563eb); box-shadow: 0 0 0 4px rgba(37, 99, 235, .14); }
   .auth-register-stepper li.is-complete .auth-register-step-marker { color: #fff; background: #059669; border-color: #059669; }
   .auth-register-step-marker i { font-size: .75rem; }
   .auth-register-stepper p { margin: 10px 0 0; color: var(--auth-subtle); font-size: .66rem; text-align: center; }
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-fields { display: block; }
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-step { display: none; }
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-step.is-active { display: grid; gap: 13px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-step-next { min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 2px; padding: 0 18px; color: #fff; font: inherit; font-size: .86rem; font-weight: 750; background: var(--auth-action-gradient, linear-gradient(135deg, #2563eb, #0ea5e9)); border: 0; border-radius: 13px; box-shadow: 0 12px 25px rgba(37, 99, 235, .2); cursor: pointer; }
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-final { display: none; }
   .auth-page-shell[data-auth-mode="register"] form[data-register-step="3"] .auth-mobile-register-final { display: grid; gap: 13px; }
   .auth-support-page .auth-page-submit { min-height: 50px; }
   .auth-page-shell.auth-support-page .auth-page-card {
      margin-top: auto;
      margin-bottom: auto;
   }
   .auth-page-support-divider { margin-top: 17px; margin-bottom: 10px; }
   .auth-page-security-note { font-size: .67rem; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-security-note { margin-top: 12px; }
   .auth-page-footer { min-height: 30px; padding: 2px 8px 0; }
}

@media (max-width: 640px) and (max-height: 760px) {
   .auth-page-shell[data-auth-mode="login"] .auth-page-form-side { align-items: flex-start; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-form-side { padding-top: 12px; padding-bottom: 16px; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-switch { margin-top: 10px; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-intro { margin: 7px 0 13px; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-divider { margin: 13px 0; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-form { gap: 11px; }
   .auth-page-shell[data-auth-mode="login"] .auth-page-security-note { margin-top: 9px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-form-side { padding-top: 12px; padding-bottom: 16px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-heading { gap: 9px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-heading-icon { width: 40px; height: 40px; flex-basis: 40px; border-radius: 11px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-heading h1 { font-size: 1.34rem; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-intro { margin: 5px 0 10px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-google { min-height: 46px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-divider { margin: 10px 0; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-form { gap: 8px; }
   .auth-page-shell[data-auth-mode="register"] .auth-register-stepper { margin-bottom: 8px; }
   .auth-page-shell[data-auth-mode="register"] .auth-register-stepper li { gap: 3px; }
   .auth-page-shell[data-auth-mode="register"] .auth-register-stepper p { margin-top: 5px; }
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-step.is-active { gap: 8px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-field > label { margin-bottom: 3px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-input-wrap { min-height: 46px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-input { height: 44px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-field-help,
   .auth-page-shell[data-auth-mode="register"] .auth-page-field-error,
   .auth-page-shell[data-auth-mode="register"] .auth-page-password-status { margin-top: 2px; font-size: .64rem; line-height: 1.25; }
   .auth-page-shell[data-auth-mode="register"] #signupPasswordHelp { display: none; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-password-rules { flex-wrap: nowrap; gap: 2px 4px; margin-top: 2px; font-size: .58rem; line-height: 1.2; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-password-rules li { white-space: nowrap; }
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-final { gap: 8px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-step-next,
   .auth-page-shell[data-auth-mode="register"] .auth-page-submit { min-height: 46px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-switch { margin-top: 9px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-security-note { display: none; }
   .auth-page-footer { min-height: 26px; }
}

@media (max-width: 390px) and (max-height: 700px) {
   .auth-page-shell[data-auth-mode="login"] .auth-page-form-side { padding-top: 10px; padding-bottom: 3px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-form-side { padding-top: 10px; padding-bottom: 3px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-form { gap: 3px; }
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-step.is-active,
   .auth-page-shell[data-auth-mode="register"] .auth-mobile-register-final { gap: 4px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-field-help,
   .auth-page-shell[data-auth-mode="register"] .auth-page-password-rules { display: none; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-input-wrap { min-height: 42px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-input { height: 40px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-step-next,
   .auth-page-shell[data-auth-mode="register"] .auth-page-submit { min-height: 40px; }
   .auth-page-shell[data-auth-mode="register"] .auth-page-switch { margin-top: 5px; }
}

@media (max-width: 380px) {
   .auth-page-form-side { padding-right: 10px; padding-left: 10px; }
   .auth-page-heading h1 { font-size: 1.34rem; }
   .auth-page-heading-icon { width: 42px; height: 42px; flex-basis: 42px; }
   .auth-page-divider span { max-width: 190px; }
}

@media (prefers-reduced-motion: reduce) {
   .auth-page-form-wrap,
   .auth-page-heading-icon,
   .auth-page-security-note i,
   .auth-page-submit::after,
   .auth-page-step-next::after { animation: none !important; }
   .auth-page-skip,
   .auth-page-back,
   .auth-page-theme-toggle,
   .auth-page-google,
   .auth-page-submit,
   .auth-page-transition,
   .auth-page-transition-card { transition: none; }
   .auth-page-transition-logo > span { animation-duration: 1.6s; }
}
