/* Shared palette, fonts and gold action button from the lobby/settings panels. */
.account-open{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 13px;min-height:40px;border:1px solid rgba(201,154,53,.6);border-radius:12px;background:linear-gradient(180deg,rgba(74,49,23,.9),rgba(35,23,13,.95));box-shadow:inset 0 1px 0 rgba(255,233,174,.1),0 3px 8px #0003;color:#f6ead2;font:600 15px var(--display);white-space:nowrap}.account-open:hover{border-color:var(--gold);background:rgba(201,154,53,.18)}.account-open svg{width:21px;height:21px;fill:#e9b84a;flex:none}
.account-dialog{box-sizing:border-box;width:min(510px,calc(100vw - 36px));max-width:calc(100vw - 36px);max-height:calc(100dvh - 36px);padding:0;border:1.5px solid #c99a35;border-radius:16px;background:linear-gradient(180deg,rgba(36,24,15,.99),rgba(22,15,10,.99));color:#f6ead2;box-shadow:0 0 0 5px rgba(14,9,6,.9),0 0 0 6.5px rgba(201,154,53,.45),0 40px 90px #0009;font:600 15px/1.5 var(--text);overflow:hidden;overscroll-behavior:contain}.account-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.account-dialog::backdrop{background:rgba(10,7,4,.65);backdrop-filter:blur(3px)}
.account-head{display:flex;align-items:center;gap:13px;padding:20px 24px;border-bottom:1px solid rgba(201,154,53,.3)}.account-head>div{min-width:0;flex:1}.account-head small{display:block;margin-bottom:5px;color:#c99a35;font:800 10px var(--text);letter-spacing:.19em}.account-dialog h2{margin:0;font:700 29px/1.1 var(--display);overflow-wrap:anywhere}.account-emblem{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:13px;border:1px solid rgba(201,154,53,.4);background:radial-gradient(circle at 50% 20%,#78502d77,#2a1a0e)}.account-emblem svg{width:27px;height:27px;fill:#e9b84a}.account-dialog .account-close{width:36px;height:36px;flex:none;padding:0;border:0;border-radius:10px;background:transparent;color:#f6ead2;font:32px/1 var(--text)}.account-close:hover{background:rgba(255,255,255,.06)}
.account-body{min-height:0;overflow:auto;padding:20px 24px 10px;scrollbar-width:thin;scrollbar-color:#8e6429 transparent}.account-dialog label{display:grid;gap:7px;margin:13px 0;color:#d9c7a3;font:700 13px/1.4 var(--text)}.account-dialog input,.account-dialog select{box-sizing:border-box;min-width:0;width:100%;min-height:45px;padding:10px 12px;border:1px solid rgba(201,154,53,.45);border-radius:9px;background:rgba(0,0,0,.28);color:#fff3d4;font:600 16px var(--text);color-scheme:dark;transition:border-color .15s,box-shadow .15s}.account-dialog input:focus,.account-dialog select:focus{outline:none;border-color:#e9b84a;box-shadow:0 0 0 3px rgba(201,154,53,.14)}.account-dialog select option{background:#24180f;color:#fff3d4}
.account-dialog button:not(.gold-btn):not(.account-close){min-height:40px;padding:9px 14px;border:1px solid rgba(201,154,53,.6);border-radius:10px;background:rgba(0,0,0,.2);color:#f6ead2;font:600 15px var(--display);cursor:pointer}.account-dialog button:not(.gold-btn):not(.account-close):hover{background:rgba(201,154,53,.12);border-color:#e9b84a}.account-dialog button:disabled{opacity:.55;cursor:wait}.account-dialog .account-primary{width:100%;margin:12px 0 10px;min-height:46px;font-size:19px}.account-dialog .account-danger{color:#ffb4a0!important;border-color:#a9513e!important;background:rgba(169,81,62,.12)!important}.account-dialog .account-note{margin:15px 0;color:#cdbb98;font:600 13px/1.6 var(--text)}.account-dialog .account-email{overflow-wrap:anywhere;color:#ffdd83;font-size:17px}
.account-tabs{position:relative;isolation:isolate;display:flex;gap:8px;padding:5px;background:rgba(0,0,0,.23);border:1px solid rgba(201,154,53,.2);border-radius:13px}.account-dialog .account-tabs button{position:relative;z-index:1;flex:1;min-width:0;border-color:transparent!important;background:transparent!important;font:600 17px var(--display)!important}.account-dialog .account-tabs button[aria-pressed=true]{color:#fff3d4}.account-actions{display:grid;gap:9px;margin-top:18px}.account-dialog .account-check{display:flex;align-items:center;gap:10px}.account-check input{width:20px;min-height:20px;flex:none;accent-color:#e9b84a}.account-dialog [role=status]{min-height:20px;margin:13px 0 3px;color:#ffdd83;font:600 13px/1.5 var(--text);white-space:pre-line}.account-dialog footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 24px;border-top:1px solid rgba(201,154,53,.3);background:rgba(0,0,0,.12)}.account-dialog footer button:first-child{font-size:13px!important}.account-dialog :focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(max-width:600px){.account-open{padding:7px 9px;font-size:12px;gap:5px}.account-open svg{width:18px;height:18px}.account-head{padding:16px 18px;gap:10px}.account-dialog h2{font-size:25px}.account-body{padding:16px 18px 8px}.account-dialog footer{padding:12px 18px;gap:8px}.account-dialog footer button{padding:8px 11px!important}.account-dialog{width:calc(100vw - 28px);max-width:calc(100vw - 28px);max-height:calc(100dvh - 28px)}}@media(max-width:390px){.account-open span{display:none}.account-open{width:36px;padding:7px}}
@media(prefers-reduced-motion:no-preference){.account-dialog[open]{animation:modalIn .3s var(--ease-spring)}}

.account-dialog .account-age-check{display:flex;align-items:center;gap:12px;margin:18px 0 8px;padding:12px 14px;border:1px solid rgba(201,154,53,.3);border-radius:10px;background:rgba(201,154,53,.05);color:#f6ead2;cursor:pointer;font:600 14px/1.5 var(--text)}.account-age-check input[type=checkbox]{appearance:none;position:relative;display:grid;place-content:center;width:21px;height:21px;min-height:21px;padding:0;flex:none;border:1.5px solid #b98b35;border-radius:5px;background:rgba(0,0,0,.35);cursor:pointer}.account-age-check input[type=checkbox]:checked{background:linear-gradient(180deg,#ffe58a,#f2a51f);border-color:#ffcf5a}.account-age-check input[type=checkbox]:checked::after{content:"";display:block;width:6px;height:11px;margin-top:-3px;border:solid #2a1606;border-width:0 2px 2px 0;transform:rotate(45deg)}.account-age-check input[type=checkbox]:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* One shared tab highlight and an accordion keep the two auth modes connected. */
.account-tab-highlight{position:absolute;z-index:0;top:5px;bottom:5px;left:5px;width:calc((100% - 18px)/2);border:1px solid #c99a35;border-radius:10px;background:linear-gradient(180deg,rgba(160,110,30,.45),rgba(110,74,20,.35));box-shadow:inset 0 1px 0 rgba(255,228,145,.08);pointer-events:none;transition:transform .32s cubic-bezier(.22,1,.36,1),opacity .18s ease}.account-tabs[data-active=signup] .account-tab-highlight{transform:translateX(calc(100% + 8px))}.account-tabs[data-active=reset] .account-tab-highlight{opacity:0}.account-dialog .account-tabs button{transition:color .2s ease}
.account-signup-fields{display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;transition:grid-template-rows .36s cubic-bezier(.22,1,.36,1),opacity .16s ease,visibility 0s linear .36s}.account-signup-fields.is-open{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows .36s cubic-bezier(.22,1,.36,1),opacity .24s ease .06s,visibility 0s}.account-signup-inner{min-height:0;overflow:hidden;display:flow-root}.account-signup-inner>label:last-child{margin-bottom:8px}.account-dialog .account-primary{transition:filter .18s ease,box-shadow .18s ease}
@media(prefers-reduced-motion:reduce){.account-tab-highlight,.account-signup-fields,.account-signup-fields.is-open,.account-dialog .account-tabs button,.account-dialog .account-primary{transition:none!important}.account-dialog[open]{animation:none!important}}

/* A quiet, integrated visibility control with a full keyboard/touch target. */
.account-password-field{margin:13px 0}
.account-dialog .account-password-field>label{margin:0 0 7px}
.account-password-wrap{position:relative}
.account-dialog .account-password-wrap input{display:block;padding-right:61px}
.account-password-wrap::after{content:"";position:absolute;right:49px;top:50%;width:1px;height:18px;transform:translateY(-50%);background:linear-gradient(transparent,rgba(201,154,53,.28),transparent);pointer-events:none}
.account-dialog .account-password-wrap button.account-password-toggle:not(.gold-btn):not(.account-close){position:absolute;top:50%;right:6px;transform:translateY(-50%);display:grid;place-items:center;box-sizing:border-box;width:36px;height:36px;min-height:36px;margin:0;padding:8px;border:1px solid transparent;border-radius:8px;background:transparent;box-shadow:none;color:#bca77e;line-height:1;transition:color .18s ease,background .18s ease,border-color .18s ease}
.account-dialog .account-password-wrap button.account-password-toggle:not(.gold-btn):not(.account-close):hover{color:#ffe2a0;background:rgba(201,154,53,.08);border-color:rgba(201,154,53,.15)}
.account-dialog .account-password-wrap button.account-password-toggle[aria-pressed=true]{color:#e9bd63;background:rgba(201,154,53,.06)}
.account-dialog .account-password-wrap button.account-password-toggle:focus-visible{outline:2px solid #e9b84a;outline-offset:-2px;background:rgba(201,154,53,.08)}
.account-password-toggle svg{display:block;width:20px;height:20px;stroke-width:1.5;pointer-events:none}
.account-eye-slash{visibility:hidden}.account-password-toggle[aria-pressed=true] .account-eye-slash{visibility:visible}
@media(prefers-reduced-motion:reduce){.account-dialog .account-password-wrap button.account-password-toggle{transition:none!important}}

.account-dialog .account-field-hint{margin:-5px 0 4px;color:#ac9c7c;font:500 12px/1.5 var(--text)}
.account-dialog .account-name-status{min-height:18px;margin:0 0 7px;color:#cdbb98;font:600 12px/1.5 var(--text)}
.account-dialog .account-name-suggestions{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:-2px 0 9px;color:#cdbb98;font:600 12px/1.4 var(--text)}.account-dialog .account-name-suggestions[hidden]{display:none}.account-dialog .account-name-suggestions button{min-height:0;margin:0;padding:4px 10px;border-radius:999px;font:700 12px/1.3 var(--text)}
.account-dialog .account-name-status[data-state=available]{color:#b7d5a1}.account-dialog .account-name-status[data-state=taken],.account-dialog .account-name-status[data-state=invalid]{color:#f2b6a4}
.account-dialog .account-player-name{margin:8px 0 0;color:#ffe2a0;font:700 25px/1.2 var(--display)}

/* Google / Apple under the email form, in each brand's own button colors. */
.account-or{display:flex;align-items:center;gap:12px;margin:4px 0 12px;color:#ac9c7c;font:600 12px var(--text);text-transform:uppercase;letter-spacing:.12em}.account-or::before,.account-or::after{content:"";flex:1;height:1px;background:rgba(201,154,53,.3)}
.account-social{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:12px}
.account-dialog .account-social button:not(.gold-btn):not(.account-close){display:flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:9px 12px;font:600 15px var(--text)}.account-social svg{width:19px;height:19px;flex:none}
.account-dialog .account-social .account-google:not(.gold-btn){background:#fff;border-color:#dadce0;color:#1f1f1f}.account-dialog .account-social .account-google:not(.gold-btn):hover{background:#f1f3f4;border-color:#dadce0}
.account-dialog .account-social .account-apple:not(.gold-btn){background:#000;border-color:#000;color:#fff}.account-dialog .account-social .account-apple:not(.gold-btn):hover{background:#1c1c1c;border-color:#333}
@media(max-width:420px){.account-social{grid-template-columns:1fr}}