.login-page{min-height:100svh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 18% 36%,#66465e55,transparent 52%),radial-gradient(ellipse at 85% 14%,#62454f1f,transparent 42%),#17111e}
.login-page .site-header{width:100%;border-bottom:0}
.login-brand-nav{display:flex;align-items:center;gap:14px}
.login-layout{flex:1;display:grid;grid-template-columns:minmax(0,1fr) 380px;align-items:center;gap:clamp(64px,9vw,140px);width:min(1100px,calc(100% - 96px));min-height:calc(100svh - 88px);padding:38px 0 76px}
.login-story{position:relative;min-width:0;text-align:center;isolation:isolate}
.login-story::before{content:"";position:absolute;z-index:-1;inset:-28px 4% 12px;border:1px solid #d8b78720;border-bottom:0;border-radius:260px 260px 0 0;background:linear-gradient(180deg,#d0a87808,transparent 82%);mask-image:linear-gradient(#000 65%,transparent)}
.login-story .eyebrow{margin:20px 0 20px;font-size:10px;letter-spacing:.2em;font-weight:500}
.login-story h1{margin:0;font:400 clamp(44px,4.5vw,64px)/1.1 var(--serif);letter-spacing:-.045em}
.login-story h1 em{display:block;margin-top:4px;color:#e4c798;font-weight:400}
.login-cards{position:relative;height:292px;width:390px;max-width:100%;margin:28px auto 0;isolation:isolate}
.login-cards::before{content:"";position:absolute;inset:8px -8% -10px;background:radial-gradient(ellipse,#c0917533,transparent 65%)}
.login-orbit{position:absolute;left:0;top:23%;width:100%;height:62%;border:1px solid #d8b7873d;border-radius:50%;transform:rotate(-17deg)}
.login-orbit::after{content:"";position:absolute;inset:-12px 10px;border:1px solid #d8b78720;border-radius:50%;transform:rotate(34deg)}
.login-card{position:absolute;top:20px;left:calc(50% - 68px);width:136px;height:auto;aspect-ratio:7/12;border-radius:7px;box-shadow:0 18px 36px #08040c80}
.card-left{transform:translate(-83px,16px) rotate(-17deg)}
.card-right{transform:translate(83px,16px) rotate(17deg)}
.card-middle{transform:translateY(-5px) rotate(-4deg)}
.login-star{position:absolute;right:8px;top:16px;color:var(--gold);font-size:29px}
.login-star::after{content:"✧";position:absolute;right:335px;top:194px;font-size:18px}
.login-caption{margin:12px 0 0;color:#c5ae96;font-size:9px;letter-spacing:.18em}
.login-panel{position:relative;min-width:0;padding:20px 0 40px;border:0;background:transparent;text-align:center}
.login-panel::before{content:"";position:absolute;left:calc(clamp(64px,9vw,140px)/-2);top:12%;bottom:12%;width:1px;background:linear-gradient(transparent,#d8b7872e,transparent)}
.login-panel .login-seal{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 20px;border:0;background:none}
.login-panel h2{margin:0 0 32px;font:400 36px/1.2 var(--serif);letter-spacing:-.035em;text-wrap:balance}
.login-providers{display:grid;gap:12px}
.social-button{display:grid;grid-template-columns:20px minmax(0,200px);align-items:center;justify-content:center;gap:8px;text-align:center;width:100%;min-height:56px;padding:14px 16px;border:0;border-radius:11px;background:#f7f3ed;color:#231d24;font-size:14px;font-weight:500;line-height:20px;box-shadow:0 8px 22px #0b071431;transition:background .18s,box-shadow .18s,transform .18s}
.social-button img,.social-button svg{width:20px;height:20px;flex:none;object-fit:contain}
.social-button:hover{background:#fff;box-shadow:0 12px 26px #0b07144d;transform:translateY(-1px)}
.social-button:active{background:#eee8e1;transform:translateY(0)}
.social-button:disabled{cursor:not-allowed;background:#ded7dc;color:#554a57;box-shadow:none;transform:none}
.login-consent-section{margin-top:22px;padding:12px;border:1px solid transparent;border-radius:12px;background:#ffffff04;text-align:left}
.login-consent{display:flex;align-items:flex-start;gap:11px;margin:0;color:#d5c7d6;font-size:13px;line-height:1.55;text-align:left;cursor:pointer}
.login-consent input{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:var(--gold);cursor:pointer}
.login-consent-section:focus-within:not(.is-invalid){border-color:#d9ba8e70;background:#d9ba8e0a}
.login-consent a{color:#f1cfa0;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.login-consent a:hover{color:#fff0d7}
.login-consent-section.is-invalid{border-color:#e6a5a96b;background:#d8838c0d}
.login-consent-error{margin:10px 0 0 31px;color:#f1b9bf;font-size:12px;line-height:1.5}
.login-consent-section.is-shaking{animation:consent-nudge .34s ease-out}
@keyframes consent-nudge{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}
@media(prefers-reduced-motion:reduce){.login-consent-section.is-shaking{animation:none}}
.login-preview{margin-top:22px;padding:16px 18px;border:0;border-radius:12px;background:#130d1ca8;text-align:left}
.login-preview p{margin:0;color:#dccde4;font-size:12px;line-height:1.7}
.preview-continue{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;margin-top:9px;color:#ebc99b;font-size:13px;text-decoration:underline;text-underline-offset:4px}
.preview-continue:hover{color:#fff0d7}
.email-choice{display:flex;align-items:center;justify-content:center;gap:12px;min-height:56px;margin-top:22px;border:1px solid #d9ba8e99;border-radius:11px;color:#f3d9b6;font-size:14px;font-weight:650;transition:background .18s,border-color .18s}
.email-choice:hover{background:#d9ba8e13;border-color:#d9ba8e}
.email-choice svg{flex:none}
.email-auth{text-align:left}
.login-back{flex:none;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #d9ba8e55;border-radius:50%;background:#ffffff08;color:#f1d7b4;cursor:pointer;transition:background .18s,border-color .18s}
.login-back:disabled{cursor:wait;opacity:.45}
.login-back:hover:not(:disabled){background:#d9ba8e22;border-color:#d9ba8e99}
.email-intro{margin:0 0 18px;color:#cfc0d2;font-size:13px;line-height:1.5;text-align:center;overflow-wrap:anywhere}
.email-intro strong{color:#fff7ef;font-weight:650}
.email-auth-form{display:grid;gap:9px;margin-top:0}
.email-auth-form[hidden]{display:none}
.email-auth-form label{color:#e1d5e4;font-size:12px}
.email-auth-form input{width:100%;min-width:0;min-height:48px;padding:12px 14px;border:1px solid #a18aa255;border-radius:10px;background:#150f1e;color:#fff7ef;font:500 16px/1.4 var(--sans);outline:none}
.email-auth-form input::placeholder{color:#98899e}
.email-auth-form input:focus-visible{border-color:#d7b47f;box-shadow:0 0 0 3px #d7b47f20}
.email-auth-button{display:flex;align-items:center;justify-content:center;min-height:48px;margin-top:3px;padding:12px 16px;border:1px solid #e5c99d;border-radius:10px;background:linear-gradient(135deg,#ead4b1,#c8a675);color:#24192b;font:700 14px/1.3 Nunito,"Avenir Next",Avenir,sans-serif;cursor:pointer;transition:filter .18s,transform .18s}
.email-auth-button:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px)}
.email-auth-button:disabled{cursor:not-allowed;opacity:.7}
.email-resend-button{justify-self:center;min-height:36px;padding:6px 10px;border:0;background:transparent;color:#e5c99d;font:600 12px/1.4 Nunito,"Avenir Next",Avenir,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.email-resend-button:disabled{cursor:not-allowed;opacity:.45}
.email-auth-status{display:flex;align-items:flex-start;gap:9px;margin:14px 0 0;padding:12px 13px;border:1px solid #c7aa7540;border-radius:10px;background:#140e1caa;color:#e9d8c3;font-size:13px;line-height:1.65;overflow-wrap:anywhere}
.email-auth-status[data-state="error"]{border-color:#d97886;background:#35151dcc;color:#ffe0e4;font-weight:700;box-shadow:0 0 0 1px #d9788626}
.email-auth-status[data-state="error"]::before{content:"!";display:inline-flex;align-items:center;justify-content:center;flex:0 0 19px;width:19px;height:19px;margin-top:1px;border:1px solid #f3a6b0;border-radius:50%;color:#ffe0e4;font-size:12px;font-weight:800;line-height:1}
.email-auth-status[data-state="success"]{border-color:#91bd9a55;color:#c9e8cf}
@media(max-width:900px){
 .login-layout{grid-template-columns:1fr;gap:28px;width:min(440px,calc(100% - 48px));min-height:0;padding:24px 0 48px}
 .login-story{display:grid;grid-template-columns:minmax(0,1fr) 116px;align-items:center;text-align:left;column-gap:16px;padding:10px 0 22px}
 .login-story::before{inset:-12px -24px -6px;border:0;border-radius:0;background:radial-gradient(ellipse at 85% 45%,#c091751a,transparent 70%);mask-image:none}
 .login-story .eyebrow{margin:0 0 12px;font-size:9px;letter-spacing:.12em}
 .login-story h1{font-size:36px}
 .login-cards{grid-column:2;grid-row:1/3;width:116px;height:128px;margin:0}
 .login-card{top:17px;left:calc(50% - 29px);width:58px;border-radius:4px}
 .card-left{transform:translate(-26px,7px) rotate(-17deg)}
 .card-right{transform:translate(26px,7px) rotate(17deg)}
 .card-middle{transform:translateY(-4px) rotate(-4deg)}
 .login-orbit{left:-7%;width:114%}
 .login-star{right:0;top:-4px;font-size:19px}
 .login-orbit::after,.login-star::after,.login-caption{display:none}
 .login-panel{padding:0}
 .login-panel::before,.login-panel .login-seal{display:none}
 .login-panel h2{font-size:30px;margin-bottom:26px}
 .login-consent{font-size:12px}
}
@media(max-width:420px){
 .login-page .site-header{gap:10px;padding:16px 24px}
 .login-layout{width:calc(100% - 48px);gap:20px;padding-top:16px}
 .login-story{grid-template-columns:minmax(0,1fr) 96px;column-gap:10px}
 .login-story h1{font-size:clamp(27px,7.8vw,32px)}
 .login-story .eyebrow{font-size:8px;letter-spacing:.07em}
 .login-cards{width:96px}
 .login-orbit{left:0;width:100%}
 .login-panel h2{font-size:28px}
 .social-button,.email-choice{min-height:52px;padding-inline:12px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){.social-button,.email-auth-button,.email-choice,.login-back{transition:none}.social-button:hover,.email-auth-button:hover:not(:disabled){transform:none}}

/* Match the homepage brand footer, with the operator alongside the copyright. */
#site-footer.login-footer{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:34px;width:100%;margin:0;padding:42px clamp(24px,6.2vw,110px) 22px;background:#180d27;border-top:1px solid #6e527e55;color:#d4c5df;font:14px/1.65 var(--sans)}
#site-footer .footer-brand{width:100%;max-width:1180px;margin:0 auto;display:flex;flex-direction:column;align-items:flex-start;gap:15px}
#site-footer .footer-wordmark{display:inline-flex;align-items:center;width:max-content;max-width:100%;text-decoration:none}
#site-footer .footer-wordmark img{display:block;width:clamp(118px,13vw,152px);height:auto;object-fit:contain}
#site-footer .footer-description{max-width:420px;margin:0;color:#cbbbd8;font-size:14px;line-height:1.65}
#site-footer .footer-emblems{display:flex;align-items:center;gap:12px;margin-top:2px;color:#d8b982}
#site-footer .footer-emblem{display:grid;place-items:center;width:28px;height:28px;border:1px solid #c8a87555;border-radius:50%;background:#f0d6a90a}
#site-footer .footer-emblem svg{display:block;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
#site-footer .footer-emblem-star svg{fill:#d8b982;fill-opacity:.8}
#site-footer .footer-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;width:100%;max-width:1180px;margin:0 auto;padding-top:17px;border-top:1px solid #6e527e55}
#site-footer .footer-company{display:grid;gap:5px;max-width:100%}
#site-footer .footer-bottom p{margin:0;color:#a997b9;font-size:12px;line-height:1.5}
#site-footer .footer-bottom .clareia-legal-links{flex-basis:auto;justify-content:flex-end;gap:8px 18px;margin:0 0 0 auto}
#site-footer .footer-bottom .clareia-legal-links a{color:#a997b9;font-size:11px;text-decoration:none}
#site-footer .footer-bottom .clareia-legal-links a:hover{color:#e8c991}
@media(max-width:600px){
 #site-footer.login-footer{gap:26px;padding-top:32px;padding-bottom:18px}
 #site-footer .footer-brand{gap:13px}
 #site-footer .footer-description{max-width:340px;font-size:13px}
 #site-footer .footer-bottom{align-items:stretch;flex-direction:column;gap:10px}
 #site-footer .footer-bottom p{font-size:11px}
 #site-footer .footer-bottom .clareia-legal-links{align-self:flex-end;gap:8px 14px}
}

.password-fields{display:grid;gap:9px}
.password-fields[hidden],.email-mode-links button[hidden],.password-hint[hidden]{display:none}
.password-hint{margin:0;color:#bdaec6;font-size:12px;line-height:1.6}
#reset-intro{margin-top:16px}
.password-visibility,.email-mode-links button{border:0;background:transparent;color:#e5c99d;font:inherit;font-size:13px;cursor:pointer;min-height:38px;padding:6px 0;text-underline-offset:4px}
.password-visibility{justify-self:end;min-height:32px;font-size:12px}
.email-mode-links{display:grid;justify-items:center;gap:2px;margin-top:12px;text-align:center}
.email-mode-links button:hover,.password-visibility:hover{text-decoration:underline}
.email-mode-links button:disabled,.password-visibility:disabled{opacity:.5;cursor:wait}
.email-mode-links button:focus-visible,.password-visibility:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.email-auth-form input{font-size:16px}