/* Layout only; typography, controls and colors use the canonical style system. */
.auth-page{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-ui)}
.auth-surface{box-sizing:border-box;width:min(100%,var(--ui-modal-md));margin:var(--ui-space-12) auto;padding:var(--ui-space-dialog-x)}
.auth-surface form{display:grid;gap:var(--ui-space-3)}
.auth-surface nav,.auth-actions{display:flex;flex-wrap:wrap;gap:var(--ui-space-3);margin-block:var(--ui-space-3)}
.auth-surface input,.auth-surface select{box-sizing:border-box;width:100%}
.auth-surface section{border-top:var(--ui-divider-rule);padding-block:var(--ui-space-4)}
.auth-surface a{color:var(--ink2)}
.auth-error{color:var(--ui-danger)}

.auth-surface label:not(.ui-info-field){display:grid;gap:var(--ui-space-2)}
.auth-paths{display:grid;grid-template-columns:1fr 1fr;gap:var(--ui-space-3);margin-block:var(--ui-space-6)}
.auth-paths .ui-b2{width:100%}
.timezone-picker{position:relative}
.timezone-picker .timezone-search{width:100%;font-family:var(--font-ui)}
.timezone-options{position:absolute;z-index:10;top:100%;inset-inline:0;max-height:240px;overflow:auto;background:var(--bg);border:1px solid var(--bg4);font:var(--ui-p2-font)}
.timezone-options [role=option]{padding:var(--ui-space-2) var(--ui-space-3);cursor:pointer}
.timezone-options [role=option]:hover,.timezone-options [data-active=true],.timezone-options [aria-selected=true]{background:var(--bg2)}
@media(max-width:420px){.auth-paths{grid-template-columns:1fr}}

/* Public entry uses the original high-resolution brand assets. */
.landing-page{margin:0;background:#F5F2EB;color:#111;font-family:var(--font-ui,Arial,sans-serif)}
.landing-surface{min-height:100svh;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px 24px;gap:44px}
.landing-logo{width:min(560px,82vw);height:auto}
.landing-surface h1{font-size:clamp(25px,3vw,38px);line-height:1.3;font-weight:400;letter-spacing:-.035em;margin:0}
.landing-cta{position:relative;display:grid;background:#111;color:#F5F2EB;text-decoration:none;border-radius:0;padding:20px 64px;font:400 max(var(--ui-ocr-min-size),calc(20px - var(--ui-ocr-size-adjustment))) var(--font-mono-product);}
/* Reserve the original label's geometry while rendering the canonical OCR-A asset. */
.landing-cta::before{content:attr(data-label);visibility:hidden;font-family:var(--font-ui,Arial,sans-serif);font-size:20px;}
.landing-cta>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.landing-hero{display:grid}
.landing-hero-message{grid-area:1/1;opacity:1;animation:landing-hero-fade 6.8s linear infinite}
.landing-hero-message:nth-child(2){opacity:0;animation-delay:-3.4s}
/* Each message holds for 3s, fades out for 200ms, then the next fades in for 200ms. */
@keyframes landing-hero-fade{0%,44.117647%{opacity:1}47.058824%,97.058824%{opacity:0}100%{opacity:1}}
@media(prefers-reduced-motion:reduce){.landing-hero-message{animation:none}}
.landing-cta:focus-visible,.auth-surface a:focus-visible{outline:2px solid currentColor;outline-offset:5px}
/* Auth-only geometry: MOUDO uses straight edges, including onboarding controls. */
.auth-page,.auth-page *{border-radius:0!important}
.auth-account-page{background:#F5F2EB;padding:64px 24px;box-sizing:border-box;min-height:100svh;display:grid;place-items:center}
.auth-account-page .auth-surface{--ink:#F5F2EB;--ink2:#dedbd5;--bg:#242424;--bg2:#303030;--bg4:#99958d;--ui-font-ocr:var(--font-mono-product);background:var(--bg);color:var(--ink);width:min(100%,620px);min-height:740px;margin:0;padding:72px 64px 56px;box-shadow:none;border:0}
.auth-brand{display:block;margin:0 auto 68px;width:min(270px,75%)}
.auth-brand img{display:block;width:100%;height:auto}
.auth-account-page .auth-surface h1{font-size:16px;font-weight:400;margin:0 0 28px;color:var(--ink)}
.auth-account-page[data-auth-route=login] .auth-surface h1,.auth-account-page[data-auth-route=signup] .auth-surface h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.auth-account-page .auth-surface .ui-info-input{display:block;box-sizing:border-box;width:100%;color:var(--ink);background:#242424;border:1px solid #99958d!important;min-height:50px;padding:12px 16px;font:400 max(var(--ui-ocr-min-size),calc(14px - var(--ui-ocr-size-adjustment)))/calc(14px * 1.5) var(--ui-font-ocr);letter-spacing:0;caret-color:var(--ink);color-scheme:dark}
.auth-account-page .auth-surface .ui-info-input:focus-visible{outline:2px solid #F5F2EB!important;outline-offset:4px;border-color:#F5F2EB!important}
.auth-account-page .auth-surface .ui-info-input:-webkit-autofill,.auth-account-page .auth-surface .ui-info-input:-webkit-autofill:hover,.auth-account-page .auth-surface .ui-info-input:-webkit-autofill:focus{-webkit-text-fill-color:#F5F2EB;caret-color:#F5F2EB;-webkit-box-shadow:0 0 0 1000px #242424 inset!important;box-shadow:0 0 0 1000px #242424 inset!important}
.auth-account-page .auth-surface .ui-info-input:autofill{background:#242424;color:#F5F2EB}
.auth-account-page .auth-surface .ui-info-field{display:grid;grid-template-columns:minmax(0,1fr);justify-content:stretch;gap:12px;border:0;padding:0}
.auth-account-page .auth-surface .ui-info-field>span{height:auto;margin:0;text-transform:uppercase;color:var(--ink2);font:400 max(var(--ui-ocr-min-size),calc(12px - var(--ui-ocr-size-adjustment)))/calc(12px * 1.5) var(--ui-font-ocr);letter-spacing:0}
.auth-account-page .auth-surface form{gap:28px}
.auth-account-page .auth-surface .ui-b2{min-height:44px;padding:10px 18px;font:400 max(var(--ui-ocr-min-size),calc(14px - var(--ui-ocr-size-adjustment)))/calc(14px * 1.5) var(--ui-font-ocr);letter-spacing:0;cursor:pointer}
.auth-account-page .auth-surface form>.ui-b2{background:#F5F2EB;color:#242424;border:1px solid #F5F2EB;margin-top:12px;width:100%}
.auth-account-page .auth-surface .auth-google{display:flex;align-items:center;justify-content:center;gap:12px;background:#242424;color:#F5F2EB;border:1px solid #99958d;width:100%;margin-top:20px}
.auth-google img{display:block;object-fit:contain;width:18px;height:18px;flex:none;background:white}
.auth-account-page .auth-surface button:focus-visible{outline:2px solid #F5F2EB;outline-offset:4px}
.auth-account-page .auth-surface button:disabled{opacity:.6;cursor:wait}
.auth-account-page .auth-surface nav{gap:12px 24px;margin-top:28px;justify-content:center}
.auth-account-page .auth-surface nav a{font:400 max(var(--ui-ocr-min-size),calc(11px - var(--ui-ocr-size-adjustment)))/calc(11px * 1.6) var(--ui-font-ocr);letter-spacing:0;text-decoration:none;color:var(--ink2)}
.auth-account-page .auth-surface nav a:hover{text-decoration:underline;text-underline-offset:4px}
.auth-account-page .auth-surface [role=status]{font:400 12px/1.6 var(--font-ui);color:var(--ink);margin:20px 0 0;overflow-wrap:anywhere}
.auth-account-page .auth-surface [role=status]:empty{display:none}
.auth-link-help{font:400 13px/1.6 var(--font-ui);margin:0 0 24px}
.auth-account-page[data-auth-route=signup] .auth-surface{padding-top:60px;padding-bottom:48px}
.auth-account-page[data-auth-route=signup] .auth-brand{margin-bottom:44px}
@media(max-width:600px){.auth-account-page{padding:32px 16px}.auth-account-page .auth-surface{padding:48px 28px;min-height:660px}.auth-brand{width:min(240px,80%);margin-bottom:56px}.auth-account-page .auth-surface form{gap:24px}.auth-account-page[data-auth-route=signup] .auth-surface{padding:44px 28px}.auth-account-page .auth-surface nav{gap:12px 20px}.landing-surface{gap:32px}}
/* Fixed login composition; the compact submit occupies the password/Google gap. */
.auth-account-page[data-auth-route=login] .auth-surface{position:relative;width:700px;max-width:calc(100vw - 48px);min-width:0;height:auto;min-height:560px;padding:517px 24px 25px}
.auth-account-page[data-auth-route=login] .auth-brand{position:absolute;top:90px;left:50%;transform:translateX(-50%);width:200px;height:40px;margin:0}
.auth-account-page[data-auth-route=login] .auth-brand img{width:200px;height:40px;object-fit:contain}
.auth-account-page[data-auth-route=login] .auth-surface form{position:absolute;inset:0;display:block;pointer-events:none}
.auth-account-page[data-auth-route=login] .ui-info-field{position:absolute;left:50%;transform:translateX(-50%);width:min(450px,calc(100% - 48px));display:block!important;pointer-events:auto}
.auth-account-page[data-auth-route=login] .ui-info-field:first-child{top:241px}
.auth-account-page[data-auth-route=login] .ui-info-field:nth-child(2){top:339px}
.auth-account-page[data-auth-route=login] .ui-info-field>span{position:absolute;bottom:calc(100% + 10px);font:400 12px/16px 'Plus Jakarta Sans',sans-serif;letter-spacing:.1em}
.auth-account-page[data-auth-route=login] .auth-surface .ui-info-input{height:48px;min-height:48px;padding:8px 14px;font:400 max(var(--ui-ocr-min-size),calc(12px - var(--ui-ocr-size-adjustment)))/18px var(--ui-font-ocr)!important;letter-spacing:0!important}
.auth-account-page[data-auth-route=login] .auth-surface .ui-info-input:focus,.auth-account-page[data-auth-route=login] .auth-surface .ui-info-input:focus-visible{outline:none!important;box-shadow:none;border-color:#99958d!important}
.auth-account-page[data-auth-route=login] .auth-surface form>.ui-b2{position:absolute;top:387px;right:max(24px,calc((100% - 450px)/2));margin:0;width:auto;height:32px;min-height:32px;padding:3px 16px;pointer-events:auto}
.auth-account-page[data-auth-route=login] .auth-surface .auth-google{position:absolute;top:437px;left:50%;transform:translateX(-50%);width:min(450px,calc(100% - 48px));height:48px;min-height:48px;margin:0}
.auth-account-page[data-auth-route=login] .auth-surface>nav{position:relative;width:min(450px,100%);margin:0 auto;gap:12px 20px;justify-content:center}
.auth-account-page[data-auth-route=login] .auth-surface>nav a{color:#dedbd5}
.auth-account-page[data-auth-route=login] .auth-surface>[role=status]{position:relative;width:min(450px,100%);margin:16px auto 0;text-align:center;color:#F5F2EB}
.auth-account-page[data-auth-route=login] .auth-link-help{position:absolute;top:155px;left:24px;right:24px;text-align:center}

/* Chromium paints autofill text through an internal first-line style. Keep that
   layer in the same compact font; native password masking remains untouched. */
.auth-page:not(.onboarding-page) input.ui-info-input::first-line{font-family:inherit!important;font-size:inherit!important;font-weight:inherit!important;letter-spacing:inherit!important}

/* Shared auth text entry owns its font token in every state. No Jakarta fallback. */
.auth-page:not(.onboarding-page) input.ui-info-input{--ui-font-ocr:var(--font-mono-product);font-family:var(--ui-font-ocr)!important;}
.auth-page:not(.onboarding-page) input.ui-info-input::placeholder{font-family:inherit!important}
/* Login-only backgrounds; other routes and labels keep their existing styles. */
.auth-account-page[data-auth-route=login] .auth-surface .ui-info-input:focus{background-color:#3b3b3b}
.auth-account-page[data-auth-route=login] .auth-surface .ui-info-input:is(:-webkit-autofill,:autofill):focus{-webkit-box-shadow:0 0 0 1000px #3b3b3b inset!important;box-shadow:0 0 0 1000px #3b3b3b inset!important}
/* The invisible original-size label preserves the submit's intrinsic geometry. */
.auth-account-page[data-auth-route=login] .auth-surface form>.ui-b2{display:grid;place-items:center;transition:background-color var(--ui-motion-fast) var(--ui-ease),color var(--ui-motion-fast) var(--ui-ease)}
.auth-account-page[data-auth-route=login] .auth-surface form>.ui-b2::before{content:attr(data-auth-submit-label);visibility:hidden;grid-area:1/1;font-size:14px;}
.auth-account-page[data-auth-route=login] .auth-submit-label{grid-area:1/1;font-size:max(var(--ui-ocr-min-size),calc(1em - 4pt));line-height:13px;}
.auth-account-page[data-auth-route=login] .auth-surface form>.ui-b2:hover:not(:disabled){background-color:#dedbd5}
.auth-account-page[data-auth-route=login] .auth-surface .auth-google{transition:background-color var(--ui-motion-fast) var(--ui-ease)}
.auth-account-page[data-auth-route=login] .auth-surface .auth-google:hover:not(:disabled){background-color:#3b3b3b}
.auth-account-page[data-auth-route=login] .auth-google img{background:transparent}

/* Signup password subtitle belongs to the heading, above the field. */
body[data-auth-route=signup] .signup-password-step h1{margin-bottom:12px}
body[data-auth-route=signup] .signup-password-step .signup-password-subtitle{margin:0 0 32px}