.dashboard { --panel:var(--site-surface); --field:var(--site-field); --success:var(--site-success); --warning:var(--site-warning); --error:var(--site-error); }
.dashboard[data-theme="dark"], [data-theme="dark"] .dashboard { --panel:var(--site-surface); --field:var(--site-field); --success:var(--site-success); --warning:var(--site-warning); --error:var(--site-error); }
.dashboard [hidden] { display:none!important; }
.dashboard button, .dashboard input, .dashboard select { font:inherit; }
.dashboard button { cursor:pointer; }
.account-page { padding-bottom:10px; }
.account-hero { display:grid; grid-template-columns:1.5fr 1fr; align-items:center; gap:60px; padding:55px 0 38px; }
.account-hero h1 { font-size:64px; letter-spacing:-3px; margin-bottom:20px; }
.account-hero h1 span { color:var(--orange); }
.account-hero>div>p:last-child { color:var(--muted); font-size:15px; line-height:1.7; max-width:420px; }
.account-note { padding:28px; border:1px solid var(--line); border-radius:12px; background:var(--panel); transform:rotate(2deg); }
.note-symbol { display:block; font-size:39px; color:var(--orange); margin-bottom:18px; }
.account-note .eyebrow { margin-bottom:12px; }
.account-note p:not(.eyebrow) { color:var(--muted); font-size:13px; line-height:1.8; }
.account-note a { display:flex; justify-content:space-between; font-size:12px; font-weight:650; margin-top:20px; }
.account-status { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 20px; background:var(--panel); border:1px solid var(--line); border-radius:9px; margin-bottom:28px; }
.account-status p { font-size:13px; line-height:1.6; margin:0; }
.account-access { display:grid; grid-template-columns:minmax(0,2.15fr) minmax(0,1fr); gap:26px; align-items:start; }
.account-card { padding:28px; border:1px solid var(--line); border-radius:12px; margin-bottom:26px; }
.account-card .eyebrow { color:var(--muted); margin-bottom:12px; }
.account-card h2 { font-size:27px; margin:0 0 18px; }
.account-card p { font-size:13px; line-height:1.8; }
.account-muted { color:var(--muted); }
.account-ok { color:var(--success); }
.account-warn { color:var(--warning); }
.account-error { color:var(--error); }
.account-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:22px; }
.account-grid label, .library-filters label { display:flex; flex-direction:column; gap:8px; font-size:12px; font-weight:600; }
.account-grid label:last-child { grid-column:1/-1; }
.account-grid input, .library-filters input, .library-filters select { width:100%; min-width:0; min-height:44px; border:1px solid var(--line); border-radius:7px; color:var(--ink); background:var(--field); padding:11px 12px; outline:none; font-size:14px; }
.dashboard input:focus-visible, .dashboard select:focus-visible, .dashboard button:focus-visible { outline:3px solid var(--orange); outline-offset:3px; }
.dashboard input::placeholder { color:var(--muted); opacity:1; }
.account-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:23px; }
.account-actions button, .account-save-actions button, .account-status button { min-height:40px; border:1px solid var(--line); border-radius:7px; padding:10px 14px; background:var(--panel); color:var(--ink); font-size:12px; font-weight:600; }
.account-actions button:hover:not(:disabled), .account-save-actions button:hover:not(:disabled), .account-status button:hover { border-color:var(--muted); }
.account-actions .primary-action { background:var(--site-accent); color:var(--site-on-accent); border-color:var(--site-accent); }
.dashboard button:disabled { cursor:not-allowed; opacity:.45; }
.account-code-input { max-width:230px; font-size:24px!important; letter-spacing:.3em; text-align:center; }
.account-help { padding:25px 5px 10px 12px; }
.account-help h2 { font-size:25px; }
.account-help ul { padding:0; margin:24px 0 0; list-style:none; }
.account-help li { padding:17px 0; border-top:1px solid var(--line); }
.account-help strong { display:block; font-size:12px; margin-bottom:7px; }
.account-help li span { display:block; color:var(--muted); font-size:12px; line-height:1.8; }
.library-card { margin-top:16px; }
.library-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.library-heading h2 { margin-bottom:0; }
.account-library-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:var(--panel); border:1px solid var(--line); border-radius:9px; margin:24px 0 20px; }
.account-library-summary>div { padding:23px; }
.account-library-summary>div+div { border-left:1px solid var(--line); }
.account-library-summary strong { display:block; font-size:27px; letter-spacing:-.6px; font-variant-numeric:tabular-nums; }
.account-library-summary span { display:block; font-size:11px; color:var(--muted); margin-top:8px; }
.library-filters { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr) auto; align-items:end; gap:18px; margin:24px 0; }
.library-filters p { color:var(--muted); font-size:11px; white-space:nowrap; }
.library-empty { padding:30px; text-align:center; border:1px dashed var(--line); border-radius:9px; margin:15px 0 0; color:var(--muted); }
.library-empty>span { font-size:30px; color:var(--orange); }
.library-empty h3 { color:var(--ink); font-size:19px; letter-spacing:-.4px; }
.library-empty p { max-width:450px; margin:0 auto 22px; }
.account-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:9px; }
.account-table { border-collapse:collapse; width:100%; text-align:left; font-size:12px; }
.account-table th { background:var(--panel); font-weight:600; color:var(--muted); white-space:nowrap; font-size:10px; }
.account-table th, .account-table td { padding:17px 12px; vertical-align:top; border-bottom:1px solid var(--line); }
.account-table tr:last-child td { border-bottom:0; }
.account-table td:first-child { min-width:170px; max-width:300px; overflow-wrap:anywhere; }
.account-table td:last-child { min-width:170px; }
.account-playtime, .account-play-count { font-variant-numeric:tabular-nums; white-space:nowrap; }
.game-filename { display:block; font-size:10px; margin:7px 0; }
.game-launch { display:inline-block; color:var(--orange); font-weight:650; font-size:11px; padding:7px 0; }
.account-save-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.account-save-actions button { min-height:34px; padding:7px 10px; font-size:11px; }
.system-badge { display:inline-block; font-size:9px; font-weight:600; border:1px solid var(--line); border-radius:5px; padding:5px 7px; }
.account-systems { margin:48px 0; }
.dashboard-systems { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:16px; }
.dashboard-system { grid-column:span 2; display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:24px; border:1px solid var(--line); border-radius:10px; background:var(--panel); transition:transform .18s; }
.dashboard-system:hover { transform:translateY(-4px); }

.system-monogram { display:grid; place-items:center; width:48px; height:48px; font:700 18px ui-monospace,monospace; border-radius:12px; background:#e8edda; color:#354937; margin-bottom:22px; }
.system-nes .system-monogram { background:#f0dfd4; color:#71422c; }
.system-snes .system-monogram { background:#e7e1ed; color:#59456e; }
.system-ds .system-monogram { background:#dfeae6; color:#355e50; }
.system-ps1 .system-monogram { background:#e0e5ed; color:#3d5371; }
.dashboard-system h3 { font-size:21px; letter-spacing:-.6px; margin:16px 0 10px; }
.dashboard-system p { font-size:12px; line-height:1.8; color:var(--muted); margin:0 0 25px; flex:1; }
.system-open { font-size:11px; font-weight:650; }
.local-note { font-size:12px; color:var(--muted); line-height:1.8; margin-top:20px; }
.dashboard-extras { display:flex; align-items:center; gap:22px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:28px 0; }
.dashboard-extras>div { margin-right:auto; }
.dashboard-extras h2 { font-size:23px; }
.dashboard-extras .eyebrow { font-size:9px; margin-bottom:10px; }
.dashboard-extras>a { font-size:12px; font-weight:600; padding:12px 0; }
.dashboard-extras>a span { margin-left:9px; }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:1000px) {
  .account-access { grid-template-columns:minmax(0,1fr); gap:0; }
  .account-help { padding:0 0 25px; }
  .account-help h2 br { display:none; }
  .account-help ul { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
  .dashboard-extras { flex-wrap:wrap; }
  .dashboard-extras>div { width:100%; }
}
@media(max-width:760px) {
  .account-hero { grid-template-columns:1fr; padding:38px 0 28px; gap:18px; }
  .account-hero h1 { font-size:53px; }
  .account-note { transform:none; padding:22px; }
  .note-symbol { float:right; margin:0 0 8px 15px; }
  .account-status { padding:13px; }
  .account-status p { font-size:12px; }
  .account-card { padding:22px 18px; }
  .account-card h2 { font-size:24px; }
  .account-grid { grid-template-columns:1fr; gap:15px; }
  .account-help ul { grid-template-columns:1fr; gap:0; margin-top:16px; }
  .account-help li { padding:14px 0; }
  .library-heading { align-items:flex-start; flex-direction:column; }
  .account-library-summary>div { padding:16px 9px; }
  .account-library-summary strong { font-size:19px; letter-spacing:-.5px; }
  .account-library-summary span { font-size:9px; }
  .library-filters { grid-template-columns:1fr; gap:13px; }
  .library-filters p { margin:0; }
  .library-empty { padding:22px 12px; }
  .account-table-wrap { border:0; overflow:visible; }
  .account-table, .account-table tbody { display:block; }
  .account-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .account-table tr { display:block; border:1px solid var(--line); border-radius:9px; margin-top:15px; padding:12px; }
  .account-table td { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding:10px 0; border:0; font-size:12px; }
  .account-table td:before { content:attr(data-label); color:var(--muted); margin-right:auto; font-size:10px; }
  .account-table td:first-child { display:block; min-width:0; max-width:none; padding-top:4px; border-bottom:1px solid var(--line); }
  .account-table td:first-child:before { display:none; }
  .account-table td:last-child { min-width:0; }
  .account-save-actions { width:100%; margin-top:5px; }
  .dashboard-systems { grid-template-columns:1fr; }
  .dashboard-system { grid-column:auto; }
  .dashboard-system { padding:22px; }
  .dashboard-extras { align-items:stretch; flex-direction:column; gap:8px; }
  .dashboard-extras>a { display:flex; justify-content:space-between; border-top:1px solid var(--line); }
}

.account-card { background:var(--site-surface); }
.system-monogram { background:var(--site-gba); color:var(--site-ink); }
.system-nes .system-monogram { background:var(--site-nes); color:var(--site-ink); }
.system-snes .system-monogram { background:var(--site-snes); color:var(--site-ink); }
.system-ds .system-monogram { background:var(--site-ds); color:var(--site-ink); }
.system-ps1 .system-monogram { background:var(--site-ps1); color:var(--site-ink); }