.account-page {
  color-scheme: light;
  --bg: #e5e7dc;
  --panel: #f7f7ea;
  --text: #263c35;
  --muted: #586858;
  --line: #bdc7b1;
  --gold: #873b30;
  --cyan: #266b60;
  --danger: #a32b38;
  background: var(--bg);
  color: var(--text);
}
.account-page [hidden] { display: none !important; }
.account-page a { color: var(--cyan); text-underline-offset: 3px; }
.account-page button, .account-page input { min-height: 44px; }
.account-page button {
  color: #fff9ea;
  background: #365a54;
  border: 1px solid #27443d;
  border-radius: 8px;
  box-shadow: 0 2px 0 #213f37;
}
.account-page button:hover:not(:disabled) { background: #436c62; }
.account-page button:disabled { opacity: .6; transform: none; cursor: wait; }
.account-page button.account-secondary { background: #e4e9d5; border-color: #9caa8b; color: var(--text); box-shadow: 0 2px 0 #b5c0a5; }
.account-page button.account-secondary:hover:not(:disabled) { background: #d7e1bf; }
.account-page button.account-text-button { display: block; min-height: 44px; margin: 8px 0 0; padding: 8px 0; color: var(--cyan); border: 0; background: transparent; box-shadow: none; text-align: left; font-weight: 600; }
.account-page button.account-text-button:hover:not(:disabled) { text-decoration: underline; transform: none; }
.account-page :is(button, a, input, textarea):focus-visible { outline: 3px solid #217a93; outline-offset: 3px; }
.account-page :is(h2, .account-message):focus { outline: 2px solid var(--cyan); outline-offset: 4px; }
.account-page .account-skip { position: absolute; z-index: 2; top: -80px; left: 16px; padding: 12px; background: var(--panel); }
.account-page .account-skip:focus { top: 8px; }
.account-page .account-header { max-width: none; padding: 24px max(24px, calc((100vw - 1100px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 4px solid #8f3342; background: #b93d4d; }
.account-page .account-header a { color: #fff6e7; font-size: .9rem; }
.account-page .account-header a:focus-visible { outline-color: #fff6e7; }
.account-page .account-brand { font-size: 1.5rem !important; font-weight: 850; letter-spacing: .17em; line-height: 1.2; }
.account-page .account-brand span { display: block; font-size: .54rem; letter-spacing: .14em; margin-top: 7px; }
.account-page .account-main { max-width: 1148px; padding: 36px 24px 24px; }
.account-page .account-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.account-page h1 { margin-bottom: 12px; font-size: clamp(2rem, 4vw, 2.8rem); }
.account-page h2 { font-size: 1.2rem; margin-bottom: 14px; }
.account-page .account-eyebrow { color: var(--gold); font-size: .68rem; letter-spacing: .14em; font-weight: 800; margin-bottom: 8px; }
.account-page .account-muted, .account-page .account-hint { color: var(--muted); }
.account-page .account-muted { font-size: .92rem; }
.account-page .account-hint { font-size: .8rem; margin-top: 7px; }
.account-page .account-heading p:last-child { margin: 0; }
.account-page .account-panel { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 26px; min-width: 0; }
.account-page .account-auth-grid, body#chimera-console.console-page #account-auth { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; max-width: 520px; margin-inline: auto; }
.account-page .account-auth-nav { display: flex; gap: 10px; margin-bottom: 26px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.account-page .account-auth-nav button { flex: 1; }
.account-page .account-auth-nav button[aria-pressed="true"] { background: #365a54; color: #fff9ea; border-color: #27443d; box-shadow: 0 2px 0 #213f37; }
.account-page .account-auth-nav button[aria-pressed="true"]:hover:not(:disabled) { background: #436c62; color: #fff9ea; }
body#chimera-console.console-page #account-auth :is(#account-google-start, #account-discord-start), body#chimera-console.console-page #account-discord-link { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; min-width: 0; min-height: 48px; padding: 8px 12px; border: 2px solid var(--lcd-ink); border-radius: 0; background: var(--lcd-light); color: var(--lcd-ink); box-shadow: 2px 2px 0 var(--lcd-line); font: 600 .86rem/1.4 var(--lcd-font); letter-spacing: 0; }
body#chimera-console.console-page #account-auth :is(#account-google-start, #account-discord-start):hover:not(:disabled), body#chimera-console.console-page #account-discord-link:hover:not(:disabled) { background: var(--lcd-shade); color: var(--lcd-ink); }
.account-page .account-signin-buttons { display: flex; flex-wrap: wrap; gap: 10px; }
.account-page .account-signin-buttons > button { flex: 1 1 190px; }
.account-page #account-google-start svg { flex: 0 0 28px; width: 28px; height: 28px; padding: 4px; background: #fff; }
.account-page .account-discord-logo { flex: 0 0 28px; width: 28px; height: 28px; padding: 4px; background: #5865f2; }
.account-page #account-discord-connections { margin-top: 20px; }
.account-page #account-discord-link { margin-top: 14px; }
.account-page .account-auth-divider { display: flex; align-items: center; gap: 12px; margin: 18px 0; color: var(--muted); font-size: .78rem; text-align: center; }
.account-page .account-auth-divider::before, .account-page .account-auth-divider::after { content: ''; flex: 1; border-top: 1px solid var(--line); }
.account-page form label { margin-top: 18px; color: var(--text); font-size: .9rem; }
.account-page form :is(input, textarea) { background: #fffef6; color: var(--text); border: 1px solid #98a58e; box-shadow: inset 0 2px 3px #42513108; }
.account-page form :is(input, textarea):focus { border-color: var(--cyan); box-shadow: 0 0 0 3px #32736922; }
.account-page form .account-recovery-choice { display: flex; align-items: center; gap: 12px; }
.account-page form .account-recovery-choice input { flex: 0 0 20px; width: 20px; min-height: 44px; margin: 0; box-shadow: none; }
.account-page .account-password-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; gap: 8px; }
.account-page .account-password-field input { min-width: 0; width: 100%; }
.account-page button.account-password-toggle { min-width: 78px; margin: 0; padding: 8px 10px; font-size: .76rem; }
.account-page form button[type="submit"] { width: 100%; margin-top: 22px; }
.account-page .account-notice, .account-page .account-message { padding: 15px 18px; border: 1px solid #a9b892; border-left: 4px solid var(--cyan); border-radius: 8px; background: #e1e9cb; overflow-wrap: anywhere; }
.account-page .account-message { margin-bottom: 20px; }
.account-page .account-error { background: #fff0e8; border-color: #bd736f; border-left-color: var(--danger); color: #832631; }
.account-page #account-retry { margin-bottom: 20px; }
.account-page .account-token-panel { max-width: 520px; }
.account-page .account-identity { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 20px; border-top: 4px solid var(--cyan); }
.account-page .account-identity h2 { font-size: 1.5rem; margin-bottom: 5px; }
.account-page .account-identity p:last-child { margin-bottom: 0; }
.account-page .account-identity > div { min-width: 0; overflow-wrap: anywhere; }
.account-page .account-duel-actions, .account-page .account-inline-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.account-page .account-duel-actions { justify-content: flex-end; }
.account-page .account-duel-actions > button { flex: 1 1 170px; }
.account-page .account-matchmaking { margin-top: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: #e1e9cb; }
.account-page #account-matchmaking-status { font-weight: 700; margin: 0 0 8px; }
.account-page .account-matchmaking .account-inline-actions { margin-top: 12px; }
.account-page .account-claim-panel { border-color: #b79b5b; background: #fff1cd; margin-bottom: 22px; }
.account-page .account-invitation-panel { margin-bottom: 22px; border-color: #82a18c; }
.account-page .account-invitation-panel .invite { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; margin: 18px 0 12px; }
.account-page .account-invitation-panel .invite strong { grid-column: 1 / -1; font-size: .85rem; }
.account-page .account-invitation-panel .invite input { min-width: 0; background: #fffef6; color: var(--text); border-color: #98a58e; font-size: .85rem; }
.account-page .account-prepare-invitation { margin: 0 0 16px; width: 100%; }
.account-page .account-section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.account-page .account-count { font-size: .8rem; color: var(--muted); }
.account-page .account-empty { padding: 18px; margin: 8px 0 0; background: #edf0df; border: 1px dashed var(--line); border-radius: 9px; color: var(--muted); font-size: .9rem; }
.account-page .account-room-list { list-style: none; margin: 0; padding: 0; }
.account-page .account-room-list li + li { border-top: 1px solid var(--line); }
.account-page .account-room-list a { display: block; padding: 14px 0; min-height: 44px; overflow-wrap: anywhere; }
.account-page .account-room-list strong, .account-page .account-room-list span { display: block; }
.account-page .account-room-list span { color: var(--muted); font-size: .8rem; margin-top: 4px; }
.account-page .account-rooms-pagination { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 12px 0; }
.account-page .account-rooms-pagination button { min-height: 44px; padding: 9px 10px; font-size: .8rem; }
.account-page .account-rooms-pagination span { font-size: .8rem; text-align: center; }
.account-page #account-rooms-count { white-space: nowrap; }
.account-page #account-revoke-confirmation { border-top: 1px solid var(--line); padding-top: 18px; margin-top: 20px; }
.account-page .account-mail-note { max-width: 760px; margin: 0 0 18px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); font-size: .84rem; }
.account-page .account-mail-note strong { color: var(--text); }
.account-page .account-mail-note p { margin: 6px 0 0; }
.account-page .account-screen-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.account-page .account-settings-link { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 8px; font-weight: 700; }
.account-page #account-settings { max-width: 640px; }
.account-page #account-settings .language-picker { display: grid; align-items: start; gap: 8px; max-width: 280px; color: var(--text); }
.account-page #account-settings .language-picker select { min-height: 44px; width: 100%; color: var(--text); background: #fffef6; border-color: #98a58e; }
.account-page #account-settings-back { margin-top: 24px; }
.account-page #account-battles-screen > .account-panel { margin-bottom: 20px; }
.account-page .account-new-battle .account-duel-actions { justify-content: flex-start; }
.account-page #account-title:focus { outline: none; }
.account-page #account-session-content { min-width: 0; }
@media (max-width: 760px) {
  .account-page .account-identity { align-items: stretch; flex-direction: column; }
  .account-page .account-duel-actions { justify-content: stretch; }
  .account-page .account-duel-actions button { flex: 1 1 180px; }
}
@media (max-width: 480px) {
  .account-page .account-header { padding: 20px 18px; align-items: flex-start; gap: 18px; }
  .account-page .account-header > a:last-child { font-size: .75rem; max-width: 100px; text-align: right; }
  .account-page .account-brand { font-size: 1.2rem !important; }
  .account-page .account-brand span { font-size: .45rem; }
  .account-page .account-main { padding: 26px 16px 16px; }
  .account-page .account-heading { align-items: flex-start; flex-direction: column; gap: 16px; }
  .account-page .account-panel { padding: 20px; }
  .account-page .account-auth-nav { gap: 8px; }
  .account-page .account-auth-nav button { font-size: .82rem; padding: 9px; }
  .account-page .account-inline-actions { flex-direction: column; align-items: stretch; }
  .account-page .account-invitation-panel .invite { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .account-page button { transition: none; }
}

/* Account-bound activation codes in the settings screen. */
#account-activation{margin-top:28px;padding-top:22px;border-top:1px solid var(--console-line,#879775)}
#account-activation-form{margin-top:18px}
#account-activation-code{font-family:ui-monospace,monospace;min-width:0;width:100%}
#account-activation-guest,#account-activation-active{margin-top:14px}

/* Sound reuses the numbered LCD settings and the SELECT player's preferences. */
body#chimera-console.console-page #account-sound {margin-top:24px;padding-top:18px;border-top:1px solid var(--lcd-line)}
body#chimera-console.console-page #account-sound-title {margin:0;font:800 .8rem/1.4 var(--lcd-font);text-transform:uppercase;letter-spacing:.08em}
body#chimera-console.console-page #account-sound .account-sound-volume {margin-top:20px}
body#chimera-console.console-page #account-sound-volume {display:block;appearance:none;width:100%;min-height:44px;height:44px;padding:0;margin:4px 0 14px;border:0;background:transparent;box-shadow:none;accent-color:var(--lcd-ink);cursor:pointer}
body#chimera-console.console-page #account-sound-volume::-webkit-slider-runnable-track {height:6px;border:1px solid var(--lcd-line);background:var(--lcd-shade)}
body#chimera-console.console-page #account-sound-volume::-moz-range-track {height:4px;border:1px solid var(--lcd-line);background:var(--lcd-shade)}
body#chimera-console.console-page #account-sound-volume::-webkit-slider-thumb {appearance:none;width:18px;height:22px;margin-top:-9px;border:2px solid var(--lcd-ink);border-radius:0;background:var(--lcd-light);box-shadow:2px 2px 0 var(--lcd-line)}
body#chimera-console.console-page #account-sound-volume::-moz-range-thumb {width:14px;height:18px;border:2px solid var(--lcd-ink);border-radius:0;background:var(--lcd-light);box-shadow:2px 2px 0 var(--lcd-line)}
body#chimera-console.console-page #account-sound-volume:focus-visible {outline:2px solid var(--lcd-ink);outline-offset:3px}
body#chimera-console.console-page #account-sound .account-sound-track-row {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
body#chimera-console.console-page #account-sound .account-sound-track-row>div {flex:1 1 180px;min-width:0}
body#chimera-console.console-page #account-sound-track {margin:0;font:700 .8rem/1.5 var(--lcd-font);overflow-wrap:anywhere}
body#chimera-console.console-page #account-sound-status {margin:4px 0 0;color:var(--lcd-muted);font:.72rem/1.5 var(--lcd-font)}
body#chimera-console.console-page #account-sound-next {min-height:44px;padding:10px 12px;border:1px solid var(--lcd-line);border-radius:0;background:var(--lcd-light);color:var(--lcd-ink);box-shadow:2px 2px 0 var(--lcd-line);font:700 .75rem/1.4 var(--lcd-font)}
body#chimera-console.console-page #account-sound-next:hover:not(:disabled) {background:var(--lcd-shade);border-color:var(--lcd-ink)}

/* Profile: one LCD panel and the same menu rows from identity to sign-out. */
body#chimera-console.console-page :is(#account-profile-screen,#community-main) {font-family:var(--lcd-font);color:var(--lcd-ink)}
body#chimera-console.console-page #account-profile-screen {padding:14px;border:2px solid var(--lcd-ink);border-radius:0;background:var(--lcd-light);box-shadow:3px 3px 0 var(--lcd-line)}
body#chimera-console.console-page #account-profile-screen .account-identity {display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
body#chimera-console.console-page #account-profile-screen #account-trainer-avatar {width:64px;height:64px;box-shadow:0 0 0 2px var(--lcd-ink)}
body#chimera-console.console-page #account-profile-screen .account-identity .account-eyebrow {margin:0 0 4px;color:var(--lcd-accent);font:700 .65rem/1.4 var(--lcd-font);letter-spacing:.1em}
body#chimera-console.console-page #account-profile-screen #account-display-name {margin:0 0 2px;font:800 1.15rem/1.25 var(--lcd-font);letter-spacing:.02em}
body#chimera-console.console-page #account-profile-screen #account-email {margin:0;color:var(--lcd-muted);font-size:.75rem}
body#chimera-console.console-page #account-profile-screen .account-lcd-section {margin:8px 0 0;padding:0;border:0}
body#chimera-console.console-page #account-profile-screen .account-fold > summary {cursor:pointer;list-style:none}
body#chimera-console.console-page #account-profile-screen .account-fold > summary::-webkit-details-marker {display:none}
body#chimera-console.console-page #account-profile-screen .account-fold-body {min-width:0;padding:14px 12px;border:1px solid var(--lcd-line);border-top:0;background:var(--lcd-paper)}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) :is(p,.account-hint) {font-size:.8rem;line-height:1.6}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) .account-muted {margin:0 0 12px;color:var(--lcd-muted)}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) form {display:grid;gap:8px}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) label {margin:4px 0 0;color:var(--lcd-ink);font:700 .76rem/1.4 var(--lcd-font)}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) :is(input:not([type=checkbox]),textarea) {width:100%;min-width:0;min-height:44px;box-sizing:border-box;padding:10px 12px;border:2px solid var(--lcd-line);border-radius:0;background:var(--lcd-light);color:var(--lcd-ink);box-shadow:inset 2px 2px 0 var(--lcd-shade);font:500 .86rem/1.4 var(--lcd-font)}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) :is(input:not([type=checkbox]),textarea):focus {border-color:var(--lcd-ink);outline:none}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) :is(button:not(.account-text-button),a.account-settings-link) {display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;margin:0;padding:10px 14px;border:2px solid var(--lcd-ink);border-radius:0;background:var(--lcd-light);color:var(--lcd-ink);box-shadow:2px 2px 0 var(--lcd-line);font:700 .78rem/1.4 var(--lcd-font);text-align:center;text-decoration:none;transform:none}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) :is(button:not(.account-text-button),a.account-settings-link):hover:not(:disabled) {background:var(--lcd-shade);color:var(--lcd-ink)}
/* Main actions wear the bordeaux of the A/B keys (AGENTS.md, Direction artistique). */
body#chimera-console.console-page :is(#account-profile-screen,#community-main) button[type=submit] {width:100%;margin-top:6px;border-color:var(--lcd-accent-dark);background:var(--lcd-accent);color:var(--lcd-on-accent);box-shadow:2px 2px 0 var(--lcd-accent-dark)}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) button[type=submit]:hover:not(:disabled) {background:var(--lcd-accent-dark);color:var(--lcd-on-accent)}
body#chimera-console.console-page :is(#account-profile-screen,#community-main) button:disabled {opacity:.55;cursor:default}
/* Links, disclosure headings and buttons share a single control style. */
body#chimera-console.console-page #account-profile-screen .account-shortcuts {display:grid;gap:8px;grid-template-columns:minmax(0,1fr);padding-top:14px;border-top:1px solid var(--lcd-line)}
body#chimera-console.console-page #account-profile-screen :is(a,button,summary).account-menu-row {display:flex;align-items:center;justify-content:space-between;gap:10px;box-sizing:border-box;width:100%;min-height:48px;margin:0;padding:10px 12px;border:1px solid var(--lcd-line);border-radius:0;background:var(--lcd-paper);color:var(--lcd-ink);box-shadow:2px 2px 0 var(--lcd-line);font:700 .78rem/1.4 var(--lcd-font);text-align:left;text-decoration:none;transform:none}
body#chimera-console.console-page #account-profile-screen :is(a,button,summary).account-menu-row:hover {border-color:var(--lcd-ink);background:var(--lcd-shade)}
body#chimera-console.console-page #account-profile-screen .account-menu-row:focus-visible {outline:2px solid var(--lcd-accent);outline-offset:3px}
body#chimera-console.console-page #account-profile-screen .account-menu-row > h2 {margin:0;font:inherit;text-transform:none;letter-spacing:normal}
body#chimera-console.console-page #account-profile-screen .account-menu-row b {flex:none;color:var(--lcd-accent);font-size:1rem;line-height:1}
body#chimera-console.console-page #account-profile-screen :is(summary.account-menu-row,#community-idea-open)::after {content:'+';flex:none;color:var(--lcd-accent);font:800 1.1rem/1 var(--lcd-font)}
body#chimera-console.console-page #account-profile-screen :is(.account-fold[open] > summary,#community-idea-open[aria-expanded=true]) {border-color:var(--lcd-line);background:var(--lcd-shade);box-shadow:none}
body#chimera-console.console-page #account-profile-screen :is(.account-fold[open] > summary,#community-idea-open[aria-expanded=true])::after {content:'−'}
body#chimera-console.console-page #account-profile-screen .account-idea-heading {margin:0;font:inherit}
/* Security: every way out of the account, this device's sign-out last. */
body#chimera-console.console-page #account-security #account-revoke-confirmation {margin-top:14px;padding-top:14px;border-top:1px dashed var(--lcd-line)}
body#chimera-console.console-page #account-security .account-inline-actions {display:flex;flex-wrap:wrap;gap:10px}
body#chimera-console.console-page #account-security #account-discord-connections {margin-top:20px;padding-top:16px;border-top:1px dashed var(--lcd-line)}
body#chimera-console.console-page #account-security #account-discord-title {margin:0 0 10px;font:800 .76rem/1.4 var(--lcd-font);text-transform:uppercase;letter-spacing:.06em}
body#chimera-console.console-page #account-profile-screen :is(#account-show-revoke,#account-logout) {display:flex;width:100%}
body#chimera-console.console-page #account-profile-screen #account-logout {margin-top:8px}
