/* This release changes only Bandenball's own menu, HUD and cabinet. */
/* Connection settings stay in the lobby so they cannot cover the lower paddle. */
body.pong-session:has(#pong-screen:not([hidden])) :is(#mx-connect-bar,.mx-update-banner,#maxim-lobby-return) {display:none!important}
body.mx-redesign #pong-screen {
  --world-glow:#72f5c1;--world-deep:#123441;
  color:#edf8f1!important;
}
body.mx-redesign #pong-screen::before {
  background:radial-gradient(ellipse at 88% 4%,#72f5c112,transparent 50%),linear-gradient(140deg,#132a39,#0b1829)!important;
  opacity:1!important;
}
body.mx-redesign #pong-screen::after {opacity:.12!important}
body.mx-redesign #pong-screen .extra-header {
  border:1px solid #36535f!important;border-left:3px solid #72f5c1!important;
  background:linear-gradient(115deg,#16303d,#101f31)!important;
  box-shadow:0 10px 28px #06102033!important;
}
body.mx-redesign #pong-screen .extra-header::after {opacity:.3}
body.mx-redesign #pong-screen .extra-header h1 {color:#f1f8ec!important;text-shadow:none!important}
body.mx-redesign #pong-screen .extra-header h1 em {color:#72f5c1!important}
body.mx-redesign #pong-screen .extra-header p {max-width:720px;color:#bfd2d4!important;line-height:1.65!important}
body.mx-redesign #pong-screen .extra-header>span {color:#8dbaaf!important;letter-spacing:.15em}
body.mx-redesign #pong-screen .mx-versus-names {
  border-color:#365564!important;background:#0e2231!important;color:#d8e9e4!important;
  box-shadow:none!important;
}
body.mx-redesign #pong-screen .mx-versus-names [data-side="0"] {color:#72f5c1!important}
body.mx-redesign #pong-screen .mx-versus-names [data-side="1"] {color:#ff947b!important}
body.mx-redesign #pong-screen .extra-toolbar {
  background:#0e2030!important;border:1px solid #304957!important;padding:10px!important;
  box-shadow:none!important;gap:12px!important;
}
body.mx-redesign #pong-screen .extra-modes {flex-wrap:wrap;gap:7px!important}
body.mx-redesign #pong-screen .extra-choice {
  min-height:44px!important;background:#172e3f!important;border:1px solid #3a5364!important;
  color:#c6d8dc!important;border-radius:10px!important;box-shadow:none!important;
  padding:10px 14px!important;font-size:12px!important;line-height:1.3;
}
body.mx-redesign #pong-screen .extra-choice:hover {border-color:#89b1ac!important;background:#1e3b49!important}
body.mx-redesign #pong-screen .extra-choice.active {
  background:#204839!important;border-color:#72f5c1!important;color:#c9ffe9!important;
  box-shadow:inset 0 0 0 1px #72f5c115!important;
}
body.mx-redesign #pong-screen .extra-choice:focus-visible,
body.mx-redesign #pong-screen button:focus-visible {outline:2px solid #c7ffe8!important;outline-offset:3px}
body.mx-redesign #pong-screen .extra-controls,
body.mx-redesign #pong-screen .extra-footnote {color:#b4cbcd!important;line-height:1.65!important}
body.mx-redesign #pong-screen .extra-footnote {margin-top:14px!important;font-size:12px!important}
body.mx-redesign #pong-screen #pong-arena {
  border-color:#4b716e!important;background:#112432!important;
  box-shadow:0 3px 0 #06121f,0 18px 36px #030d1b55!important;
}
body.mx-redesign #pong-screen #pong-arena::before,
body.mx-redesign #pong-screen #pong-arena::after {display:none!important}
body.mx-redesign #pong-screen .extra-hud {
  background:#091b2aed!important;border:1px solid #416270!important;border-radius:10px!important;
  color:#cee2df!important;box-shadow:0 3px 12px #030b1833!important;
  backdrop-filter:none!important;letter-spacing:.035em!important;gap:9px!important;
}
body.mx-redesign #pong-screen .extra-hud>span:first-child {color:#a5e9cf!important}
body.mx-redesign #pong-screen .extra-hud>span:last-child {color:#ffc1ac!important}
body.mx-redesign #pong-screen .extra-hud b {color:#f8f9ea!important;font-variant-numeric:tabular-nums;font-size:17px!important}
body.mx-redesign #pong-screen #pong-hud-status {color:#a6bec6!important;font-size:9px!important;letter-spacing:.07em!important}
body.mx-redesign #pong-screen #pong-quickpause {
  background:#152d3eed!important;border:1px solid #5a7885!important;color:#e4f5ee!important;
  box-shadow:none!important;border-radius:10px!important;min-height:40px!important;
}
body.mx-redesign #pong-screen .extra-overlay {
  background:#071321e8!important;backdrop-filter:none!important;
}
body.mx-redesign #pong-screen .extra-modal {
  background:linear-gradient(145deg,#1b3543,#102332)!important;
  border:1px solid #4b6f77!important;border-top:3px solid #72f5c1!important;
  border-radius:20px!important;box-shadow:0 22px 60px #020a1855!important;
  padding:25px!important;
}
body.mx-redesign #pong-screen .extra-modal h2 {color:#f4f6e9!important;line-height:1.15!important}
body.mx-redesign #pong-screen .extra-modal p {color:#c1d5d6!important;line-height:1.65!important}
body.mx-redesign #pong-screen .extra-badge {color:#91ecc9!important}
body.mx-redesign #pong-screen .extra-symbol {
  color:#72f5c1!important;text-shadow:none!important;line-height:1.2!important;margin:9px 0;
}
body.mx-redesign #pong-screen .extra-start {
  background:#72f5c1!important;color:#102e29!important;border:1px solid #a7ffdc!important;
  box-shadow:0 4px 0 #397e69!important;border-radius:12px!important;
  min-height:48px!important;letter-spacing:.035em!important;
}
body.mx-redesign #pong-screen .extra-start:hover {background:#9cfdcf!important}
body.mx-redesign #pong-screen .game-exit-button {
  color:#bed5d6!important;border-color:#476270!important;background:#163041!important;
  border-radius:10px!important;min-height:43px!important;box-shadow:none!important;
}
@media(max-width:640px) {
  body.mx-redesign #pong-screen .extra-toolbar {padding:8px!important}
  body.mx-redesign #pong-screen .extra-modes {width:100%}
  body.mx-redesign #pong-screen .extra-choice {flex:1 1 auto;padding:9px 10px!important;font-size:11px!important}
  body.mx-redesign #pong-screen .extra-modal {padding:20px 17px!important}
  body.mx-redesign #pong-screen .extra-hud {padding:7px 9px!important;font-size:9px!important;gap:6px!important}
  body.mx-redesign #pong-screen #pong-hud-status {font-size:8px!important;letter-spacing:0!important}
}
@media(prefers-reduced-motion:reduce) {
  body.mx-redesign #pong-screen,body.mx-redesign #pong-screen * {animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
