/* A single accessible input, with six decorative cells for the email code. */
.code-entry{container-type:inline-size;position:relative;min-width:0;height:66px;border:1px solid #52685a;border-radius:13px;background:#0c1813;overflow:hidden;transition:border-color .16s,box-shadow .16s}
.code-cells{height:100%;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;padding:4px;pointer-events:none}
.code-cells span{display:grid;place-items:center;background:#15251e;border-radius:5px;font:500 var(--text-code)/1 var(--font-code);font-variant-numeric:tabular-nums;color:#f4f5ef;min-width:0}
.code-entry:focus-within{border-color:#c5fa70;box-shadow:0 0 0 2px #c5fa7026}
.code-entry:focus-within .is-current{box-shadow:inset 0 -2px #c5fa70}
.code-entry:focus-within .is-selected{background:#344d3e}
.code-entry:has([aria-invalid=true]){border-color:#e7a398}
.code-entry input.otp{position:absolute;inset:0;width:100%;height:100%;min-height:0!important;max-width:100%;margin:0;border:0!important;padding:0!important;background:transparent!important;color:transparent!important;caret-color:transparent;font-size:var(--text-code)!important;font-family:var(--font-code);font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:calc((100cqi - 3px)/6 - 1ch)!important;text-indent:calc(4px + ((100cqi - 3px)/6 - 5px - 1ch)/2);box-shadow:none!important;outline:0!important;text-align:left!important;border-radius:inherit}
.code-entry input::selection{background:transparent}
.email-spam-hint{display:flex;gap:12px;align-items:flex-start;padding:14px 15px;border:1px solid #809c50;border-radius:11px;background:#c5fa7009;color:#ecf2e8;min-width:0}
.email-spam-hint>svg{width:22px;height:22px;flex-shrink:0;color:#c5fa70;margin-top:1px}
.email-spam-hint strong{font-size:var(--text-label);line-height:1.45;font-weight:600}
.email-spam-hint p{margin:5px 0 0;font-size:var(--text-helper);line-height:1.5;color:#b2c1b6}
.email-code-screen .email-code-main{display:grid;place-items:center;min-height:0;flex:1}
.public-entry.email-code-screen .guest-main{padding:28px 20px;max-width:100%;width:100%;margin:0}
.email-code-screen .auth-card.email-code-card{width:100%;max-width:440px;min-width:0;padding:24px;border:1px solid #304b38;border-radius:24px;background:#0d2117;color:#f4f5ef;animation:code-card-enter .2s ease-out both}
.email-code-card .back{min-height:36px;margin:0 0 6px;padding:0;color:#b0bfb4;font-size:var(--text-label);gap:8px}
.email-code-card .back svg{width:21px;height:21px}
.code-envelope{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 18px;border:1px solid #52705b;border-radius:15px;background:#b4dfb80a;color:#b7c8bd}
.code-envelope svg{width:29px;height:29px}
.email-code-card .heading{margin:0 0 14px;text-align:center}
.email-code-screen .email-code-card h1{font:500 var(--text-auth-title)/1.35 var(--font-display);letter-spacing:-.035em;text-wrap:balance}
.code-recipient{text-align:center;margin-bottom:22px}
.code-recipient>.muted{margin:0 0 4px;color:#b2c1b6;font-size:var(--text-label)}
.code-address{display:flex;justify-content:center;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0}
.code-address .email-display{min-width:0;font-size:var(--text-control);line-height:1.45;margin:0;font-weight:650;overflow-wrap:anywhere}
.code-address .text-button{min-height:28px;padding:0;font-size:var(--text-helper);color:#bdccc2;text-decoration-style:dashed;text-underline-offset:4px}
.email-code-card>.email-spam-hint{margin-bottom:20px}
.email-code-card .stack{gap:0}
.email-code-card .field{font-size:var(--text-label);font-weight:500;gap:7px;margin:0}
.email-code-card .code-lifetime{margin:10px 0 24px;font-size:var(--text-caption);color:#b2c1b6;font-variant-numeric:tabular-nums}
.code-feedback:not([hidden]){font-size:var(--text-helper);margin:0 0 18px;line-height:1.5}
.email-code-card .code-submit{position:relative;min-height:50px;margin:0;border:0;border-radius:28px;background:#c5fa70;color:#15230d;font-size:var(--text-control);font-weight:650;justify-content:center}
.code-submit>svg{position:absolute;right:19px;width:20px;height:20px}
.email-code-card .code-submit:disabled{background:#304337!important;color:#a3b4a8!important;border-color:transparent!important;opacity:1}
.email-code-card .stack>.text-button{min-height:44px;margin:10px 0 0;padding:8px 0;color:#b2c1b6;font-size:var(--text-label);text-align:center;justify-content:center;font-variant-numeric:tabular-nums}
.email-code-card .stack>button.text-button:disabled{opacity:1;text-decoration:none;background:transparent!important;color:#b2c1b6!important;border:0!important}
.email-code-screen .code-help-link{display:inline-flex;align-items:center;min-height:44px;font-size:var(--text-helper);color:#b2c1b6;text-underline-offset:4px}
.public-entry.email-code-screen .public-footer{margin-top:0;padding:16px 20px 24px;font-size:var(--text-caption)}
.payment-email-gate .email-spam-hint{margin:8px 0 16px}
@keyframes code-card-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:640px){
 .public-entry.email-code-screen .guest-main{padding:14px 16px 18px;align-content:start}
 .email-code-screen .auth-card.email-code-card{padding:20px;border-radius:22px}
 .code-envelope{width:50px;height:50px;margin-bottom:16px}
 .code-recipient{margin-bottom:20px}
 .code-address{column-gap:8px;row-gap:0}
 .email-code-card .code-lifetime{margin-bottom:22px}
 .email-code-screen .email-spam-hint{padding:12px;gap:10px}
 .public-entry.email-code-screen .public-footer{gap:10px 18px;font-size:var(--text-caption);padding:10px 16px 20px}
}
@media(prefers-reduced-motion:reduce){.email-code-card,.code-entry{animation:none!important;transition:none!important}}