@font-face{font-family:MoonSay;src:url('/assets/fonts/site-variable-1.woff2') format('woff2');font-weight:100 900;font-display:swap}.verification-flow *{box-sizing:border-box}body.verification-flow{margin:0;min-height:100svh;color:#243f50;font-family:MoonSay,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:linear-gradient(90deg,#06172b55,transparent 85%),url('/assets/moonlight.webp') center/cover fixed}.verification-flow header{height:88px;max-width:1220px;margin:auto;padding:18px 24px;display:flex;align-items:center;gap:40px;color:#f7f3e7}.verification-flow .brand{display:flex;gap:10px;align-items:center;color:inherit;text-decoration:none}.verification-flow .brand i{position:relative;display:block;width:36px;height:36px;overflow:hidden;border-radius:50%;filter:drop-shadow(0 0 5px #ffd67a66)}.verification-flow .brand img{position:absolute;width:142.22%;height:142.22%;left:50%;top:50%;transform:translate(-50%,-50%)}.verification-flow .brand strong{font:600 24px/1.1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;letter-spacing:-.8px}.verification-flow .brand small{display:block;font-size:10px;font-weight:400;letter-spacing:.15px;color:#dedbd0;margin-top:4px}.verification-flow nav{display:flex;gap:32px}.verification-flow nav a{font-size:15px;color:#d4dcee;text-decoration:none;padding:10px 0}.verification-flow nav a:hover{color:#f4d799}.verification-flow main{min-height:calc(100svh - 88px);display:grid;place-items:center;padding:24px 20px 100px}.verification-flow .verification-card{width:min(100%,540px);padding:32px 40px 30px;border-radius:26px;border:1px solid #ffffffb0;background:linear-gradient(140deg,#e6edf2f7,#ccdae4f5);box-shadow:inset 0 1px 1px #fff,0 24px 70px #03132740;backdrop-filter:blur(16px)}.verification-flow .steps{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:600;color:#7a8e9a;margin-bottom:28px}.verification-flow .steps .complete{color:#3d776c}.verification-flow .steps .active{color:#2b4b60}.verification-flow .line{height:1px;background:#9aaeb550;flex:1}.verification-flow .status-icon{width:46px;height:46px;display:grid;place-items:center;background:#eae5d5;border:1px solid #d3c7a8;border-radius:15px;margin-bottom:19px;color:#8a7442}.verification-flow .status-icon svg{width:25px;height:25px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.verification-flow .success{background:#cde3dc;border-color:#acd0c2;color:#357663}.verification-flow .eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;margin:0 0 10px;color:#627b8a}.verification-flow h1{font-size:36px;font-weight:650;letter-spacing:-1.4px;line-height:1.15;margin:0 0 20px}.verification-flow .intro{font-size:17px;color:#587180;margin:0 0 7px;line-height:1.5}.verification-flow .email{font-size:21px;font-weight:600;letter-spacing:-.35px;overflow-wrap:anywhere;margin:0}.verification-flow .explain{font-size:16px;line-height:1.7;color:#587180;margin:19px 0 25px}.verification-flow .resend-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #a0b3bf60;padding-top:20px}.verification-flow .resend-row span{font-size:12px;color:#687e8d}.verification-flow .resend-row span:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#b69a5b;margin-right:7px}.verification-flow button,.verification-flow a{touch-action:manipulation}.verification-flow button{font:inherit;cursor:pointer}.verification-flow .resend-row button{min-height:42px;padding:9px 14px;border:1px solid #8da6b8;border-radius:9px;background:#eff4f86b;color:#31556e;font-size:13px;font-weight:600;white-space:nowrap}.verification-flow .resend-row button:disabled{cursor:default;color:#788e9d;border-color:#a9bbc5a0;background:#e2eaf05c}.verification-flow details{margin-top:18px;font-size:12px;color:#627c8d;line-height:1.7}.verification-flow summary{cursor:pointer;padding:5px 0}.verification-flow details p{margin:8px 0}.verification-flow details a{color:#31556e}.verification-flow .success-intro{font-size:23px;font-weight:500;margin:0;color:#31556b}.verification-flow .primary{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(110deg,#315970,#213e52);color:#fff;text-decoration:none;min-height:54px;padding:14px 20px;border-radius:11px;font-size:16px;font-weight:600;box-shadow:inset 0 1px #ffffff18,0 5px 14px #203f5415}.verification-flow .primary span{font-size:23px;font-weight:400}.verification-flow .primary:hover{background:#315a72}.verification-flow .footnote{font-size:12px;color:#718895;margin:20px 0 0}.verification-flow .preview-tools{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:7px;padding:8px 12px;border-radius:12px;background:#07192de8;border:1px solid #a6c1d330;color:#c2d1dc;font-size:10px;max-width:calc(100% - 24px);flex-wrap:wrap;justify-content:center}.verification-flow .preview-tools>span{letter-spacing:1px;padding-right:5px}.verification-flow .preview-tools button{border:1px solid #8ba9bd44;border-radius:6px;background:#234057;color:#e2ecf3;font-size:11px;padding:7px 10px}.verification-flow .preview-tools output:empty{display:none}.verification-flow [hidden]{display:none!important}.verification-flow :focus-visible{outline:2px solid #c49c4e;outline-offset:4px}@media(max-width:600px){.verification-flow header{padding:18px 20px;gap:25px}.verification-flow .brand strong{font-size:22px}.verification-flow nav{gap:20px}.verification-flow nav a{font-size:13px}.verification-flow main{padding:18px 16px 110px}.verification-flow .verification-card{padding:27px 25px;border-radius:22px}.verification-flow h1{font-size:32px}.verification-flow .email{font-size:19px}.verification-flow .steps{font-size:11px;gap:9px}.verification-flow .explain{font-size:15px}.verification-flow .resend-row{gap:8px}.verification-flow .resend-row span{font-size:11px}.verification-flow .resend-row button{font-size:12px;padding:9px 10px}.verification-flow .preview-tools>span{display:none}}

body.verification-flow{display:block;padding:0}.verification-flow>header{position:relative;inset:auto;width:auto;justify-content:flex-start}.verification-flow>main{max-width:none;width:100%;margin:0;min-height:calc(100svh - 88px);display:grid;place-items:center;padding:24px 20px 100px}.verification-flow .verification-card{width:min(100%,540px);max-width:540px;min-height:0;height:auto;text-align:left;padding:32px 40px 30px}.verification-flow #screen h2,.verification-flow h1{font-size:36px;font-weight:650;letter-spacing:-1.4px;line-height:1.15;margin:0 0 20px}.verification-flow .intro{font-size:17px;line-height:1.5;margin:0 0 7px}.verification-flow .steps{justify-content:initial;margin:0 0 28px}.verification-flow footer,.verification-flow moonsay-account{display:none}.verification-flow #notice:empty,.verification-flow #error:empty{display:none}.verification-flow #notice,.verification-flow #error{font-size:14px;line-height:1.6}.verification-flow #recovery-actions a{display:block;margin-top:16px;font-size:15px}.verification-flow .success-intro{font-size:23px;font-weight:500;margin:0;color:#31556b}.verification-flow .primary{width:100%;margin:0}.verification-flow [hidden]{display:none!important}@media(max-width:600px){.verification-flow>main{padding:18px 16px 40px}.verification-flow .verification-card{padding:27px 25px}.verification-flow #screen h2,.verification-flow h1{font-size:32px}.verification-flow>header{padding:18px 20px;gap:25px}.verification-flow>header .brand{display:flex}.verification-flow>header nav{gap:20px}.verification-flow>header nav a{font-size:13px}}

.verification-flow>header>.brand{display:grid;grid-template-columns:36px auto;gap:0 10px}.verification-flow>header>.brand i{grid-row:1 / span 2}.verification-flow>header>.brand>span{grid-column:2;font:400 10px/1.1 sans-serif;letter-spacing:.15px;margin-top:4px}.verification-flow>header .brand strong{grid-column:2}.verification-flow #screen .success-intro{font-size:23px}.verification-flow #screen .primary{font-size:16px}.verification-flow #screen .steps{font-size:12px}.verification-flow #screen .eyebrow{font-size:10px}.verification-flow #screen .explain{font-size:16px}.verification-flow #screen .footnote{font-size:12px}.verification-flow .steps span{white-space:nowrap}
body.verification-flow>header{position:relative;inset:auto;width:100%;max-width:1220px;margin:0 auto;justify-content:flex-start;height:88px;padding:18px 24px;gap:40px}
body.verification-flow>main{display:grid;grid-template-columns:minmax(0,1fr);place-items:center;align-content:center;width:100%;max-width:none;min-height:calc(100svh - 88px);margin:0;padding:24px 20px 100px}
body.verification-flow .verification-card{width:540px;max-width:100%;min-height:0;height:auto}
body.verification-flow .account-greeting{display:none}
@media(max-width:600px){body.verification-flow>header{padding:18px 20px;gap:25px}body.verification-flow>main{padding:18px 16px 40px}body.verification-flow .verification-card{padding:27px 25px}}

#confirm-form{display:grid;gap:12px;text-align:left;margin-top:24px}#confirm-form label{font-size:16px;font-weight:600}#confirm-form input{box-sizing:border-box;width:100%;min-height:48px;border:1px solid #849aa7;border-radius:10px;background:#f5f8fa;color:#203744;padding:12px 14px;font:inherit}#confirm-form .explain{font-size:14px;margin:4px 0 12px}#confirm-form[hidden]{display:none}

#recovery-actions:not([hidden]){display:flex;flex-wrap:wrap;gap:16px;align-items:center}#recovery-actions a{font-size:16px;color:#294b60}#recovery-actions .primary{flex-basis:100%;color:white;justify-content:center}#resend-address{width:100%;box-sizing:border-box}

/* Both the waiting tab and link callback use identical navigation geometry. */
body.verification-flow>header>nav{display:flex;align-items:center;gap:32px;margin:0;padding:0;height:auto}
body.verification-flow>header>nav>a{display:block;font:400 15px/1.5 MoonSay,sans-serif;padding:10px 0;margin:0;border:0;border-bottom:1px solid transparent;color:#d4dcee;text-decoration:none}
@media(max-width:600px){body.verification-flow>header>nav{gap:20px}body.verification-flow>header>nav>a{font-size:13px}}

/* One card footprint across verification and sign-in states. Extra errors or
   expanded help may grow the card instead of clipping usable controls. */
body.verification-flow .verification-card{width:540px;min-height:580px;height:auto;margin:0;padding:32px 40px 30px;background:linear-gradient(140deg,#e6edf2f7,#ccdae4f5);border:1px solid #ffffffb0;border-radius:26px;box-shadow:inset 0 1px 1px #fff,0 24px 70px #03132740;overflow:visible}
body.verification-flow.is-signin>main{display:grid;place-items:center;align-content:center;min-height:calc(100svh - 88px);padding:24px 20px 100px;margin:0;max-width:none}
body.verification-flow.is-signin .panel{max-width:min(100%,540px);min-width:0}
body.verification-flow .signin-stage{height:18px;font-size:10px;letter-spacing:2px;color:#627b8a}
body.verification-flow.is-signin #screen h2{font-size:36px;line-height:1.15;margin:0 0 20px;letter-spacing:-1.4px}
body.verification-flow.is-signin #identity-form{margin-top:20px}
body.verification-flow.is-signin #identity-form label{font-size:14px;margin:12px 0 6px}
body.verification-flow.is-signin #identity-form input:not([type=checkbox]){min-height:46px;height:46px;font-size:16px}
body.verification-flow.is-signin .remember-email{margin:12px 0!important;font-size:13px!important}
body.verification-flow.is-signin .primary{justify-content:center;min-height:50px;padding:12px 18px}
body.verification-flow.is-signin .actions{font-size:13px;margin-top:16px}
body.verification-flow.is-signin #verification-help{font-size:13px;margin-top:10px}
body.verification-flow #confirm-form .explain{display:none}
@media(max-width:600px){body.verification-flow .verification-card{min-height:640px;padding:27px 25px;border-radius:22px}body.verification-flow.is-signin>main{padding:18px 16px 40px}body.verification-flow.is-signin #screen h2{font-size:32px}}

@media(min-width:601px){body.verification-flow .verification-card{padding:28px 40px}body.verification-flow .steps{margin-bottom:18px}body.verification-flow .status-icon{width:40px;height:40px;margin-bottom:14px;border-radius:12px}body.verification-flow.is-signin #screen h2{margin-bottom:12px}body.verification-flow.is-signin #identity-form{margin-top:12px}body.verification-flow.is-signin #identity-form label{margin-top:8px}body.verification-flow.is-signin .actions{margin-top:12px}}

/* Keep sign-in dimensions; let shorter verification states fit their content. */
body.verification-flow:not(.is-signin) .verification-card{min-height:0}

/* Balance recovery links between the message and the resend button. */
.verification-card:has(#recovery-actions:not([hidden])):has(#confirm-form[hidden]) #confirmation-text{margin-bottom:0}
.verification-flow #recovery-actions:not([hidden]){margin-top:24px;row-gap:32px}
.verification-flow #recovery-actions a{margin-top:0;line-height:1.5}

/* Shared square desktop footprint; preserve the approved sign-in card. */
@media(min-width:601px){body.verification-flow:not(.is-signin) .verification-card{min-height:540px}}
.verification-flow .verification-card:has(.success-intro) .explain{margin-bottom:32px}
.verification-flow .verification-card:has(.success-intro) .footnote{margin-top:38px;margin-bottom:12px}

/* Account for text line-box leading so visible text/action gaps balance. */
.verification-flow #confirm-form{margin-top:24px}
.verification-flow #confirm-form .primary{margin-top:12px}

/* Match the homepage Download MoonSay key: metallic face, shallow edge,
   two-pixel hover lift and the same 160ms highlight response. No geometry changes. */
:is(body.verification-flow .verification-card .primary,body.is-signup #identity-form .primary){
 background:linear-gradient(145deg,#456d84 0%,#31566e 48%,#213e52 100%);
 color:#fff;box-shadow:inset 0 1px 0 #ffffff77,inset 0 0 0 1px #a7c4d43d,0 2px 0 #193344,0 5px 10px #142c3c20;
 text-shadow:0 1px 0 #102b4166;transform:translateY(0);
 transition:transform .16s,box-shadow .16s,filter .16s;
}
:is(body.verification-flow .verification-card .primary,body.is-signup #identity-form .primary):is(:hover,:focus-visible):not(:disabled){
 background:linear-gradient(145deg,#456d84 0%,#31566e 48%,#213e52 100%);
 transform:translateY(-2px);filter:brightness(1.04);
 box-shadow:inset 0 1px 0 #ffffff77,inset 0 0 0 1px #a7c4d43d,0 2px 0 #193344,0 7px 13px #142c3c30;
}
:is(body.verification-flow .verification-card .primary,body.is-signup #identity-form .primary):active:not(:disabled){transform:translateY(0);filter:brightness(.99);box-shadow:inset 0 1px 0 #ffffff55,0 1px 0 #193344,0 3px 6px #142c3c20}
:is(body.verification-flow .verification-card .primary,body.is-signup #identity-form .primary):disabled{transform:none;filter:none;cursor:default;box-shadow:inset 0 1px 0 #ffffff33,0 1px 0 #193344;opacity:.6}
@media(prefers-reduced-motion:reduce){:is(body.verification-flow .verification-card .primary,body.is-signup #identity-form .primary){transition:none}:is(body.verification-flow .verification-card .primary,body.is-signup #identity-form .primary):is(:hover,:focus-visible):not(:disabled){transform:none}}

#confirm-form .password-label-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}#signup-reset-link{font-size:13px;color:#31556e}

/* Password recovery uses the shared account card and button treatment. */
.is-forgot #screen .status-icon{margin-bottom:18px}
body.is-forgot #screen form{margin-top:24px}
body.is-forgot #screen form .primary.wide{margin-top:18px;min-height:50px;border-radius:11px}

body.is-forgot #screen form .primary.wide{justify-content:center;text-align:center}body.is-forgot .actions{margin-top:24px}

/* Let recovery content determine height instead of reserving signup space. */
body.verification-flow.is-forgot .verification-card{min-height:0;padding:28px 40px}
body.is-forgot #screen .status-icon{margin-bottom:14px}
body.is-forgot #screen form{margin-top:20px}
body.is-forgot .actions{margin-top:20px}
@media(max-width:600px){body.verification-flow.is-forgot .verification-card{padding:25px}body.verification-flow.is-forgot>main{padding:18px 16px 40px}}

/* Explicit resend page matches the native account workflow. */
.is-email-verification #verification-form{margin-top:24px;text-align:left}
.is-email-verification #verification-form label{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
.is-email-verification #resend-address{display:block;min-height:48px;padding:12px 14px;border:1px solid #849aa7;border-radius:10px;background:#f5f8fa;color:#203744;font:inherit}
.is-email-verification .verification-actions{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-top:24px}
.is-email-verification .verification-actions button{min-height:44px;font-size:13px;padding:12px 14px;white-space:nowrap}
.is-email-verification .verification-send{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.is-email-verification #verification-countdown{color:#597485;font-size:13px;min-height:0}
.is-email-verification #verification-countdown:empty{display:none}
.is-email-verification #verification-delivery{font-size:14px;line-height:1.6;color:#597485;margin:20px 0 0}
.is-email-verification #verification-delivery:empty{display:none}
.is-email-verification #error{color:#a8212b}
@media(max-width:480px){.is-email-verification .verification-actions{flex-direction:column-reverse;align-items:stretch;gap:14px}.is-email-verification .verification-send{align-items:stretch}.is-email-verification .verification-actions button{width:100%}.is-email-verification #verification-countdown{text-align:right}}

/* Keep the resend form compact; status messages may still grow the card. */
body.verification-flow.is-email-verification .verification-card:has(#verification-form){min-height:0}
@media(min-width:601px){body.verification-flow.is-email-verification .verification-card:has(#verification-form){min-height:421px}}
