/* Game palettes apply equally to menus and restart confirmations. */
:root {
  --menu-surface:#171c23;--menu-button:#242c35;--menu-ink:#edf2f5;
  --menu-muted:#abb5bf;--menu-accent:#b7d9eb;--menu-on-accent:#172538;
}
:root[data-menu-game="arrows"] {--menu-surface:#e7f1fb;--menu-button:#d3e3f2;--menu-ink:#203247;--menu-muted:#52677e;--menu-accent:#36638a;--menu-on-accent:#ffffff;}
:root[data-menu-game="breakout"] {--menu-surface:#171b22;--menu-button:#242c36;--menu-ink:#fff7eb;--menu-muted:#bdc3ce;--menu-accent:#ffab65;--menu-on-accent:#22180e;}
:root[data-menu-game="brick-breaker"] {--menu-surface:#231e1a;--menu-button:#342b23;--menu-ink:#fff7eb;--menu-muted:#c9b9a6;--menu-accent:#efab62;--menu-on-accent:#291b10;}
:root[data-menu-game="color-blast"] {--menu-surface:#1e2546;--menu-button:#303961;--menu-ink:#f4efff;--menu-muted:#bfc6e5;--menu-accent:#b8a5fa;--menu-on-accent:#241b40;}
:root[data-menu-game="flow"] {--menu-surface:#1a1f2b;--menu-button:#2a3242;--menu-ink:#f1f5ff;--menu-muted:#b3bfd3;--menu-accent:#8db9f5;--menu-on-accent:#16243a;}
:root[data-menu-game="forklifts"] {--menu-surface:#252820;--menu-button:#363b2e;--menu-ink:#fff5dd;--menu-muted:#c0c5ac;--menu-accent:#f2c45e;--menu-on-accent:#292310;}
:root[data-menu-game="harbor"] {--menu-surface:#142f39;--menu-button:#204653;--menu-ink:#e4f5f4;--menu-muted:#adcbd0;--menu-accent:#88d5cf;--menu-on-accent:#12322f;}
:root[data-menu-game="library"] {--menu-surface:#2c241c;--menu-button:#403426;--menu-ink:#f4ead4;--menu-muted:#cbb899;--menu-accent:#dfbb7e;--menu-on-accent:#302311;}
:root[data-menu-game="maze"] {--menu-surface:#203334;--menu-button:#304747;--menu-ink:#f0ecda;--menu-muted:#b9cbc3;--menu-accent:#86d9dc;--menu-on-accent:#133438;}
:root[data-menu-game="nuts"] {--menu-surface:#292237;--menu-button:#3d324e;--menu-ink:#f5efff;--menu-muted:#c7b9d9;--menu-accent:#cfb0f0;--menu-on-accent:#30203f;}
:root[data-menu-game="parking"] {--menu-surface:#203b49;--menu-button:#305362;--menu-ink:#f0f8fc;--menu-muted:#b7cfd9;--menu-accent:#a6d6ec;--menu-on-accent:#173846;}
:root[data-menu-game="penguin-path"] {--menu-surface:#e6f6fc;--menu-button:#d0e9f3;--menu-ink:#173c56;--menu-muted:#45697d;--menu-accent:#266b88;--menu-on-accent:#ffffff;}
:root[data-menu-game="pipes"] {--menu-surface:#101e2e;--menu-button:#20364b;--menu-ink:#eff8ff;--menu-muted:#afc6db;--menu-accent:#8bcbdc;--menu-on-accent:#142d38;}
:root[data-menu-game="screwdom"] {--menu-surface:#fff4d7;--menu-button:#eee0bc;--menu-ink:#594421;--menu-muted:#7b6540;--menu-accent:#7d5928;--menu-on-accent:#ffffff;}
:root[data-menu-game="sokoban"] {--menu-surface:#263024;--menu-button:#394632;--menu-ink:#edf4df;--menu-muted:#bdcdb0;--menu-accent:#b9d58e;--menu-on-accent:#26331b;}
:root[data-menu-game="starfling"] {--menu-surface:#141326;--menu-button:#282341;--menu-ink:#f5f0ff;--menu-muted:#c0b5dc;--menu-accent:#c2a5fb;--menu-on-accent:#241936;}
:root[data-menu-game="trains"] {--menu-surface:#f3f1df;--menu-button:#e0e6d1;--menu-ink:#244640;--menu-muted:#526e63;--menu-accent:#3b6d5e;--menu-on-accent:#ffffff;}
:root[data-menu-game="vials"] {--menu-surface:#172e3b;--menu-button:#254655;--menu-ink:#e3fffa;--menu-muted:#afcfcf;--menu-accent:#91dfd2;--menu-on-accent:#163a34;}
:root[data-menu-game="voxel-blast"] {--menu-surface:#192d43;--menu-button:#2b435d;--menu-ink:#f0f8ff;--menu-muted:#bacfe3;--menu-accent:#83c9ec;--menu-on-accent:#17364a;}

/* One compact, flat layout for game menus and restart confirmations. */
.standard-menu-panel.standard-menu-panel {
  box-sizing:border-box!important;position:relative!important;width:min(360px,calc(100vw - 32px))!important;
  max-height:calc(100dvh - 32px)!important;overflow:auto!important;padding:16px!important;
  border:1px solid color-mix(in srgb,var(--menu-accent) 30%,transparent)!important;border-radius:10px!important;background:var(--menu-surface)!important;
  color:var(--menu-ink)!important;box-shadow:0 16px 60px #0005!important;text-align:left!important;
  font-family:system-ui,sans-serif!important;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;
}
.standard-menu-panel .standard-menu-header {
  position:static!important;display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:12px!important;width:100%!important;height:auto!important;min-height:36px!important;margin:0 0 16px!important;
  padding:0!important;border:0!important;background:none!important;box-shadow:none!important;transform:none!important;
}
.standard-menu-panel .standard-menu-header h2 {
  position:static!important;flex:1!important;min-width:0!important;margin:0!important;padding:0!important;
  color:inherit!important;font:600 20px/1.25 system-ui,sans-serif!important;text-align:left!important;
  letter-spacing:normal!important;text-transform:none!important;text-shadow:none!important;
}
.standard-menu-panel button {box-sizing:border-box!important;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.standard-menu-panel button.standard-menu-close {
  position:static!important;display:grid!important;place-items:center!important;flex:none!important;
  width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;padding:7px!important;margin:0!important;
  border:0!important;border-radius:4px!important;background:transparent!important;color:inherit!important;
  box-shadow:none!important;transform:none!important;cursor:pointer!important;
}
.standard-menu-panel svg {display:block!important;width:22px!important;height:22px!important;flex:none!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.standard-menu-panel button.standard-menu-action {
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:14px!important;
  width:100%!important;height:auto!important;min-height:52px!important;margin:8px 0 0!important;padding:12px 16px!important;
  border:1px solid color-mix(in srgb,var(--menu-accent) 20%,transparent)!important;border-radius:6px!important;background:var(--menu-button)!important;color:var(--menu-ink)!important;
  font:500 16px/1.3 system-ui,sans-serif!important;letter-spacing:normal!important;text-transform:none!important;
  text-align:left!important;box-shadow:none!important;text-shadow:none!important;transform:none!important;cursor:pointer!important;
}
.standard-menu-panel .standard-confirm-actions {
  display:flex!important;flex-direction:row!important;align-items:stretch!important;gap:10px!important;
  width:100%!important;margin:18px 0 0!important;padding:0!important;
}
.standard-menu-panel .standard-confirm-actions button {
  display:flex!important;align-items:center!important;justify-content:center!important;flex:1 1 0!important;
  width:0!important;min-width:0!important;height:auto!important;min-height:46px!important;margin:0!important;padding:10px!important;
  border:1px solid color-mix(in srgb,var(--menu-accent) 20%,transparent)!important;border-radius:6px!important;background:var(--menu-button)!important;color:var(--menu-ink)!important;
  font:500 16px/1.3 system-ui,sans-serif!important;letter-spacing:normal!important;text-transform:none!important;box-shadow:none!important;transform:none!important;cursor:pointer!important;
}
.standard-menu-panel .standard-confirm-actions .standard-confirm-accept {background:var(--menu-accent)!important;border-color:var(--menu-accent)!important;color:var(--menu-on-accent)!important}
.standard-menu-panel button:focus-visible {outline:2px solid var(--menu-accent)!important;outline-offset:2px!important}
.standard-menu-panel button:hover {filter:brightness(1.12)}
.standard-menu-panel > p,.standard-menu-panel .menu-confirm p {color:var(--menu-muted)!important;font:14px/1.5 system-ui,sans-serif!important}
.standard-menu-panel #confirmTitle,.standard-menu-panel #restartTitle,.standard-menu-panel .menu-confirm h3 {display:block;font:600 18px/1.3 system-ui,sans-serif!important;margin:0 0 10px!important}
#pause-screen > .standard-menu-panel {pointer-events:auto}
@media(max-height:400px){.standard-menu-panel.standard-menu-panel{padding:12px!important}.standard-menu-panel .standard-menu-header{margin-bottom:8px!important}}

/* Color only: keep each game's placement and hit area intact. */
:root[data-menu-game] :is(#menuButton, #pause-btn, body > button#menu) {
  background:var(--menu-surface)!important;color:var(--menu-ink)!important;
  border-color:color-mix(in srgb,var(--menu-accent) 35%,transparent)!important;
}
.standard-menu-action > svg {color:var(--menu-accent)!important}
.standard-menu-panel::backdrop {background:#060b14b8}
