:root { --game-sidebar: 240px; }
.game-site {
  min-height: 100vh;
  background: #0e1520;
  color: #eef3f8;
}
.game-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 10;
  display: flex;
  width: var(--game-sidebar);
  flex-direction: column;
  padding: 1.1rem .8rem;
  border-right: 1px solid #26364a;
  background: linear-gradient(180deg, #111d2b, #0a111b);
}
.game-brand { display: flex; align-items: center; gap: .65rem; padding: .5rem .45rem 1.2rem; border-bottom: 1px solid #26364a; }
.game-brand-mark { display: grid; width: 35px; height: 35px; place-items: center; border-radius: 9px; background: #d6a34a; color: #172435; font-weight: 950; }
.game-brand strong, .game-brand small, .game-nav-item strong, .game-nav-item small { display: block; }
.game-brand strong { font-size: 1rem; letter-spacing: .04em; }
.game-brand small { margin-top: .1rem; color: #8194aa; font-size: .66rem; }
.game-nav { display: grid; gap: .45rem; padding-top: 1rem; }
.game-nav-item { display: flex; align-items: center; gap: .65rem; padding: .7rem; border: 1px solid transparent; border-radius: 8px; color: #9db0c3; text-decoration: none; }
.game-nav-item:hover { background: rgba(149, 180, 207, .08); color: #fff; }
.game-nav-item.active { border-color: rgba(214, 163, 74, .42); background: rgba(214, 163, 74, .12); color: #fff; }
.game-nav-icon { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: 6px; background: rgba(136, 163, 188, .12); font-size: 1rem; }
.game-nav-item.active .game-nav-icon { background: rgba(214, 163, 74, .22); }
.game-nav-item strong { font-size: .84rem; }.game-nav-item small { margin-top: .1rem; color: #71859b; font-size: .65rem; }
.game-sidebar-note { margin: auto .4rem .35rem; color: #71859b; font-size: .7rem; line-height: 1.65; }
.game-main { min-height: 100vh; margin-left: var(--game-sidebar); padding: 2rem; background: #0e1520; }
.game-main .lol-view { max-width: 1320px; margin: 0 auto; }
.game-menu-toggle, .game-menu-close, .game-menu-backdrop { display: none; }

@media (max-width: 760px) {
  .game-sidebar { width: min(80vw, 260px); transform: translateX(-100%); transition: transform .22s ease; }
  .game-sidebar.open { transform: translateX(0); }
  .game-menu-toggle { position: fixed; top: .7rem; left: .7rem; z-index: 8; display: grid; width: 2.35rem; height: 2.35rem; place-items: center; border: 1px solid #3a4c61; border-radius: 7px; background: #152334; color: #edf4fb; }
  .game-menu-close { display: grid; width: 1.7rem; height: 1.7rem; margin-left: auto; place-items: center; border: 0; border-radius: 5px; background: transparent; color: #9db0c3; }
  .game-menu-backdrop.open { position: fixed; inset: 0; z-index: 9; display: block; background: rgba(0,0,0,.48); }
  .game-main { margin-left: 0; padding: 3.8rem .8rem 1.25rem; }
}