/* Scoped account presentation; linked after the shared game stylesheet. */
#accountDialog{width:min(600px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:0;overflow:auto;scroll-padding-top:86px}
#accountDialog .account-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;background:#1b2a39;border-bottom:1px solid var(--finish-line,#465869)}
#accountDialog .account-header h2{min-width:0;margin:0;font-size:clamp(21px,4vw,28px)}
#accountDialog #accountClose{flex-shrink:0;margin:0;min-height:44px;background:var(--finish-focus,#ffd249);color:#152330;border-color:var(--finish-focus,#ffd249);font-weight:750}
#accountDialog .account-content{padding:18px}
#accountDialog #accountStatus{margin:0 0 14px;color:#fff1ce;font-weight:650;overflow-wrap:anywhere}
#accountDialog #accountStatus:empty{display:none}
#accountDialog .account-auth-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:20px}
#accountDialog .account-auth-options button{min-width:0;margin:0;padding:11px 8px;font-size:15px}
#accountDialog .account-auth-options button[aria-pressed=true]{background:#ffd249;color:#152330;border-color:#ffd249}
#accountDialog #accountAuthTitle,#accountDialog .account-overview h3{margin:0 0 8px;font-size:24px;overflow-wrap:anywhere}
#accountDialog p,#accountDialog label,#accountDialog summary{font-size:16px;line-height:1.5}
#accountDialog label{gap:7px;font-weight:650}
#accountDialog .account-hint{font-size:14px;color:#bdcedb;margin:7px 0 15px}
#accountDialog #accountForm input{font-size:16px}
#accountDialog #accountForm>.account-primary{width:100%;margin:10px 0 0}
#accountDialog .account-primary{background:#ffd249;color:#152330;border-color:#ffd249;font-weight:750}
#accountDialog .account-look-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#accountDialog .account-look-actions button{margin:0;min-width:0;min-height:52px}
#accountDialog details{margin:12px 0;padding:14px}
#accountDialog summary{min-height:28px;font-weight:750}
#accountDialog details h3{margin:16px 0 8px}
#accountDialog .account-danger{margin-top:24px;border-color:#985263}
#accountDialog .account-danger summary,#accountDialog #accountDelete{color:#ffd0d6}
#accountDialog #accountDelete{background:#5b2535;border-color:#a76172}
#accountDialog .account-recovery-note{padding:14px;margin:0 0 18px;border:2px solid #ffd249;border-radius:12px;background:#233744}
#accountDialog .account-recovery-note h3{margin:0 0 8px}
#accountDialog #accountRecovery{height:90px;resize:vertical;font:16px/1.5 monospace;overflow-wrap:anywhere}
@media(max-width:400px){#accountDialog .account-header{padding:14px 12px;gap:8px}#accountDialog #accountClose{padding:10px 12px;font-size:14px}#accountDialog .account-content{padding:14px}#accountDialog .account-auth-options{gap:5px}#accountDialog .account-auth-options button{padding:10px 5px}#accountDialog .account-look-actions{grid-template-columns:1fr}}

/* Keep private verified email addresses inside narrow account dialogs. */
#accountDialog #accountEmailCurrent{overflow-wrap:anywhere}

/* Privacy information is readable before any account details are submitted. */
#accountDialog a[href^="./legal.html"]{color:#ffda77;text-underline-offset:3px}
#accountDialog a[href^="./legal.html"]:focus-visible{outline:3px solid var(--finish-focus,#7ff4fa);outline-offset:3px;border-radius:3px}
