.player-access { display: flex; align-items: center; gap: 8px; min-width: 0; }
.player-access button, #history-refresh { min-height: 42px; padding: 9px 14px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: white; color: var(--color-primary-ink); font-size: 12px; font-weight: 700; }
.player-access #player-enter { color: white; background: var(--color-primary); border-color: var(--color-primary); }
.player-access #player-enter:hover { background: var(--color-primary-ink); }
.player-access [hidden] { display: none; }
#player-name { max-width: 175px; overflow-wrap: anywhere; background: var(--color-primary-soft); }
#player-name:hover, #history-refresh:hover { background: #E4E5FF; }
dialog { width: min(460px, calc(100% - 28px)); max-height: 90svh; overflow-y: auto; border: 1px solid var(--color-border); border-radius: var(--radius-xl); padding: 28px; background: var(--color-surface); color: var(--color-text); box-shadow: 0 24px 80px #1f294033; }
dialog::backdrop { background: #1F294078; }
.dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.dialog-heading h2 { font-size: 22px; margin: 0; }
.dialog-heading button { display: grid; place-items: center; min-width: 40px; min-height: 40px; padding: 0; border: 0; border-radius: var(--radius-sm); color: var(--color-muted-ink); background: var(--color-background); font-size: 26px; }
dialog p { color: var(--color-muted-ink); font-size: 13px; line-height: 1.8; }
.auth-tabs { display: flex; gap: 7px; padding: 5px; margin: 22px 0; border-radius: var(--radius-md); background: var(--color-background); }
.auth-tabs button { flex: 1; min-height: 44px; border: 1px solid transparent; border-radius: var(--radius-sm); background: transparent; color: #505F7B; font-size: 12px; font-weight: 700; padding: 8px; }
.auth-tabs button[aria-pressed=true] { background: var(--color-primary); color: white; box-shadow: 0 3px 8px #5b5ff822; }
#player-form label { display: block; margin: 16px 0 7px; font-size: 13px; font-weight: 700; }
#player-form input { width: 100%; font-size: 16px; }
#auth-submit { width: 100%; margin-top: 12px; }
#auth-message, #account-status { font-size: 13px; line-height: 1.8; color: #9B3B55; }
#auth-message:empty, #account-status:empty { display: none; }
.pin-note { padding-top: 14px; border-top: 1px solid var(--color-border); margin: 20px 0 0; font-size: 11px; }
#history-list { padding-left: 22px; font-size: 13px; line-height: 1.9; }
#player-total { font-size: 13px; }
@media (max-width: 520px) { .player-access { width: 100%; justify-content: flex-end; } .player-access button { min-height: 38px; font-size: 11px; padding: 8px 11px; } #player-name { max-width: 190px; } dialog { padding: 22px; } }

/* Shared account controls: native links/buttons; no second authentication client. */
.account-user-menu{position:fixed;z-index:1100;overflow:auto;padding:8px;border:1px solid var(--color-border,#DCE4F0);border-radius:18px;background:var(--color-surface,#fff);box-shadow:0 16px 45px #1F294029;color:var(--color-text,#1F2940)}
.account-user-menu[hidden],.account-session-shield[hidden]{display:none!important}
.account-menu-heading{display:grid;gap:4px;padding:12px 12px 14px;border-bottom:1px solid var(--color-border,#DCE4F0);margin-bottom:5px;overflow-wrap:anywhere}.account-menu-heading strong{font-family:var(--font-heading,Sora,sans-serif);font-size:1rem}.account-menu-heading small{color:var(--color-muted-ink,#5D6A82);font-size:.8rem}
.account-menu-item{display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:11px 12px;border:0;border-radius:11px;background:transparent;color:inherit;text-decoration:none;text-align:left;font:600 .9rem var(--font-body,Manrope,sans-serif);cursor:pointer}.account-menu-item:hover{background:var(--color-primary-soft,#EEEEFF)}.account-menu-danger{color:#a52255!important}.account-menu-icon{width:22px;text-align:center;font-size:1.25rem;flex-shrink:0}.account-menu-item:focus-visible{outline:3px solid var(--color-focus,#4549CE);outline-offset:-2px}
.account-management{width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto}.account-management-actions{display:grid;gap:10px;margin-top:18px}.account-management-actions button{min-height:46px}.account-connected{font-size:1rem;line-height:1.6;overflow-wrap:anywhere}.account-session-shield{position:fixed;inset:0;z-index:3000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;background:var(--color-background,#F4F7FC);color:var(--color-text,#1F2940);text-align:center;font-family:var(--font-body,Manrope,sans-serif)}
.session-locked .app-shell,.session-locked .setup-header,.session-locked .setup-scroll,.session-locked dialog:not(.account-session-shield),.session-locked .account-user-menu{visibility:hidden!important}
@media(max-width:600px){.account-user-menu{border-radius:16px}.account-menu-item{min-height:48px}.account-management{padding:18px}.account-management .dialog-heading h2{font-size:1.25rem}}
@media(prefers-reduced-motion:reduce){.account-user-menu,.account-management{animation:none;transition:none}}

.account-session-shield{width:100vw;max-width:none;height:100vh;height:100dvh;max-height:none;margin:0;border:0}.account-session-shield::backdrop{background:var(--color-background,#F4F7FC)}.account-session-shield>.app-dialog-body{flex:initial;display:grid;place-items:center;gap:16px}
:root{--account-safe-left:env(safe-area-inset-left,0px);--account-safe-right:env(safe-area-inset-right,0px);--account-safe-top:env(safe-area-inset-top,0px);--account-safe-bottom:env(safe-area-inset-bottom,0px)}
/* XP notice uses the existing reward screen, with no additional dialog or step. */
.xp-explanation{margin-block:12px;padding:14px;border:1px solid #C7C9FC;border-radius:14px;background:var(--color-primary-soft,#EEEEFF);color:var(--color-primary-ink,#3F43BA);text-align:start}
.xp-explanation[hidden],.reward-dialog.showing-ranking .xp-explanation{display:none!important}.xp-explanation strong{font:700 .95rem var(--font-heading,Sora,sans-serif)}.xp-explanation p{margin:7px 0 0;font-size:.85rem;line-height:1.6;color:var(--color-text,#1F2940)}
