/* Compact arcade rows, shared with the existing main-menu controls. */
#menuGateway .menu-gateway-button.quick-play-gateway,
#menuGateway .menu-gateway-button.sol-play-gateway,
#menuGateway .menu-gateway-button.rival-run-gateway,
#menuGateway .menu-gateway-button.king-city-gateway,
#menuGateway .menu-gateway-button.sol-challenges-gateway,
#menuGateway .menu-gateway-button.profile-gateway {
  grid-column: 1 / -1;
  box-sizing: border-box;
  min-width: 0;
  min-height: 43px;
  height: 43px;
  padding: 7px 15px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
#menuGateway .quick-play-gateway > strong,
#menuGateway .sol-play-gateway > strong,
#menuGateway .rival-run-gateway > strong,
#menuGateway .king-city-gateway > strong,
#menuGateway .sol-challenges-gateway > strong,
#menuGateway .profile-gateway > strong {
  flex: 0 0 auto;
  font-size: 18px;
  line-height: 1;
  white-space: nowrap;
}
#menuGateway .quick-play-gateway > span,
#menuGateway .sol-play-gateway > span,
#menuGateway .rival-run-gateway > span,
#menuGateway .king-city-gateway > span,
#menuGateway .sol-challenges-gateway > span,
#menuGateway .profile-gateway > span {
  min-width: 0;
  max-width: 58%;
  font-size: 11px;
  line-height: 1.12;
  text-align: right;
  text-wrap: balance;
}
/* Each mode has its own arcade-cabinet palette, rather than a shared spectrum.
   Garage retains its original charcoal-and-gold finish. */
#menuGateway .story-mode-gateway {
  --arcade-left: #8ee7bd; --arcade-mid: #5ccad9; --arcade-right: #aa8ee6;
  --arcade-edge: #d8f1e0; --arcade-base: #24444c;
  --arcade-title: #102b30; --arcade-copy: #142d38;
  --arcade-title-shadow: 0 1px 0 #ffffff50;
}
#menuGateway .rival-run-gateway {
  --arcade-left: #163e79; --arcade-mid: #27879b; --arcade-right: #f5d475;
  --arcade-edge: #d9d8ad; --arcade-base: #174b64;
  --arcade-title-shadow: 0 2px 0 #122d48;
}
#menuGateway .king-city-gateway {
  --arcade-left: #891759; --arcade-mid: #fa565c; --arcade-right: #ffdd66;
  --arcade-edge: #ffc282; --arcade-base: #8b303b;
}
#menuGateway .quick-play-gateway {
  --arcade-left: #47266f; --arcade-mid: #9b3ad7; --arcade-right: #f596d4;
  --arcade-edge: #dca7f2; --arcade-base: #492661;
  --arcade-title-shadow: 0 2px 0 #331c50;
  --arcade-copy: #251631;
}
#menuGateway .sol-challenges-gateway {
  --arcade-left: #126e64; --arcade-mid: #21bba4; --arcade-right: #b1ead2;
  --arcade-edge: #8ee2d3; --arcade-base: #185c53;
  --arcade-title-shadow: 0 2px 0 #114a43;
  --arcade-copy: #102c27;
}
#menuGateway .sol-play-gateway {
  --arcade-left: #ffe86a; --arcade-mid: #bed953; --arcade-right: #45c77d;
  --arcade-edge: #e8f59d; --arcade-base: #397548;
  --arcade-title: #183e31; --arcade-copy: #102c22;
  --arcade-title-shadow: 0 1px 0 #ffffff60;
}
#menuGateway :is(.story-mode-gateway,.quick-play-gateway,.sol-play-gateway,.rival-run-gateway,.king-city-gateway,.sol-challenges-gateway) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 2px solid var(--arcade-edge);
  border-radius: 11px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.36),transparent 38% 64%,rgba(0,0,0,.2)),
    linear-gradient(103deg,var(--arcade-left) 0%,var(--arcade-mid) 45%,var(--arcade-right) 92%);
  box-shadow: 0 3px 0 var(--arcade-base),0 7px 20px rgba(0,0,0,.3),
    inset 0 2px 1px rgba(255,255,255,.5),inset 0 -5px 9px rgba(0,0,0,.15);
  animation: none;
}
#menuGateway :is(.story-mode-gateway,.quick-play-gateway,.sol-play-gateway,.rival-run-gateway,.king-city-gateway,.sol-challenges-gateway)::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 4px 0;
  width: auto;
  height: auto;
  opacity: 1;
  transform: none;
  clip-path: none;
  border: 0;
  border-radius: inherit;
  background: repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.065) 3px 4px);
  pointer-events: none;
}
#menuGateway :is(.story-mode-gateway,.quick-play-gateway,.sol-play-gateway,.rival-run-gateway,.king-city-gateway,.sol-challenges-gateway)::after {
  content: none;
}
#menuGateway :is(.story-mode-gateway,.quick-play-gateway,.sol-play-gateway,.rival-run-gateway,.king-city-gateway,.sol-challenges-gateway) > strong {
  position: relative;
  z-index: 1;
  color: var(--arcade-title, #fff7df);
  text-shadow: var(--arcade-title-shadow, 0 2px 0 #752628);
}
#menuGateway :is(.story-mode-gateway,.quick-play-gateway,.sol-play-gateway,.rival-run-gateway,.king-city-gateway,.sol-challenges-gateway) > span {
  position: relative;
  z-index: 1;
  padding: 0;
  color: var(--arcade-copy, #141b17);
  background: transparent;
  text-shadow: var(--arcade-copy-shadow, none);
}
#menuGateway :is(.story-mode-gateway,.quick-play-gateway,.sol-play-gateway,.rival-run-gateway,.king-city-gateway,.sol-challenges-gateway):focus-visible {
  outline: 3px solid #fff0ae;
  outline-offset: 3px;
}
@media(max-width:760px) {
  #menuGateway .menu-gateway-button.quick-play-gateway,
  #menuGateway .menu-gateway-button.sol-play-gateway,
  #menuGateway .menu-gateway-button.rival-run-gateway,
  #menuGateway .menu-gateway-button.king-city-gateway,
  #menuGateway .menu-gateway-button.sol-challenges-gateway,
  #menuGateway .menu-gateway-button.profile-gateway {
    min-height: 40px; height: 40px; padding: 6px 14px; gap: 9px;
  }
  #menuGateway .quick-play-gateway > strong,
  #menuGateway .sol-play-gateway > strong,
  #menuGateway .rival-run-gateway > strong,
  #menuGateway .king-city-gateway > strong,
  #menuGateway .sol-challenges-gateway > strong,
  #menuGateway .profile-gateway > strong { font-size: clamp(15px,4.5vw,18px); }
  #menuGateway .quick-play-gateway > span,
  #menuGateway .sol-play-gateway > span,
  #menuGateway .rival-run-gateway > span,
  #menuGateway .king-city-gateway > span,
  #menuGateway .sol-challenges-gateway > span,
  #menuGateway .profile-gateway > span { font-size: 9px; line-height: 1.15; }
}

/* Each race category owns a row so 1P and 2P stay paired at every width. */
#quickPlayOptions .arcade-mode-pair {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
  margin-top: 8px;
}
#quickPlayOptions .arcade-mode-pair .action {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 10px;
  font-size: 13px;
  white-space: normal;
}
#quickPlayOptions .arcade-mode-pair .action[hidden],
#quickPlayOptions #extrasPanel[hidden] {
  display: none;
}
#quickPlayOptions .arcade-story-modes .menu-section-label {
  margin-bottom: 0;
  font-size: 12px;
}
body.phone-layout #quickPlayOptions #quickPlayModeRow,
body.phone-layout #quickPlayOptions #arcadeCircuitRow {
  grid-template-columns: minmax(0,1fr);
}
body.phone-layout #quickPlayOptions #arcadeOrbRow,
body.phone-layout #quickPlayOptions #arcadeDrivingRow {
  display: none;
}