/* Gambit Arena dashboard on small screens. Desktop is untouched above 760px; below it the original sidebar
   becomes a slide-in drawer opened from a hamburger bar. Inline template styles need !important. */
.ga-mbar, .ga-scrim { display: none; }
@media (max-width: 760px) {
  .ga-shell { grid-template-columns: minmax(0, 1fr) !important; }
  .ga-main { padding: calc(64px + env(safe-area-inset-top)) 12px 28px !important; gap: 14px !important; max-width: 100% !important; }
  .ga-mbar {
    display: flex; position: fixed; top: 0; left: 0; right: 0; z-index: 40; align-items: center; gap: 10px;
    height: 54px; padding: env(safe-area-inset-top) 12px 0; background: #262421; border-bottom: 2px solid #14130f;
    box-shadow: 0 4px 14px #0007; font-family: Fredoka, Nunito, sans-serif; font-weight: 700; font-size: 20px; color: #fff;
  }
  .ga-mbar span { color: #81b64c; }
  .ga-burger {
    width: 42px; height: 38px; border-radius: 10px; border: 3px solid #232120; background: #454340;
    box-shadow: 0 3px 0 #232120; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; padding: 0; cursor: pointer;
  }
  .ga-burger i { display: block; width: 18px; height: 3px; border-radius: 2px; background: #fff; transition: transform .2s, opacity .2s; }
  html.ga-nav-open .ga-burger i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  html.ga-nav-open .ga-burger i:nth-child(2) { opacity: 0; }
  html.ga-nav-open .ga-burger i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .ga-side {
    position: fixed !important; top: 0 !important; left: 0; bottom: 0; z-index: 62; width: min(270px, 82vw);
    height: 100% !important; padding-top: calc(16px + env(safe-area-inset-top)) !important;
    transform: translateX(-105%); transition: transform .26s cubic-bezier(.2, .8, .3, 1); box-shadow: 8px 0 30px #000b;
  }
  html.ga-nav-open .ga-side { transform: none; }
  .ga-scrim { display: block; position: fixed; inset: 0; z-index: 61; background: #000a; opacity: 0; pointer-events: none; transition: opacity .2s; }
  html.ga-nav-open .ga-scrim { opacity: 1; pointer-events: auto; }
  html.ga-nav-open, html.ga-nav-open body { overflow: hidden; }
  .ga-vsrow { flex-direction: column; gap: 6px !important; }
  .ga-vsrow > div { transform: scale(.82); margin: -18px 0; }
  .ga-wheel { transform: scale(.8); margin: -42px; }
  .ga-lbrow { grid-template-columns: 34px minmax(0, 1fr) 52px 66px 38px !important; gap: 6px !important; padding: 10px 10px !important; font-size: 13px; }
}
@media (max-width: 380px) {
  .ga-wheel { transform: scale(.7); margin: -63px; }
  .ga-vsrow > div { transform: scale(.74); margin: -28px 0; }
}