body[data-page="lobby"] .sidebar { height:100dvh; overflow:hidden; }
body[data-page="lobby"] .sidebar > .nav { flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden; align-content:start; padding:2px 5px 3px 0; scrollbar-width:thin; scrollbar-color:#304f6b transparent; }
body[data-page="lobby"] .sidebar > .account { flex-shrink:0; margin-top:0; padding-top:10px; }
body[data-page="lobby"] .sidebar > .music-player { max-height:35dvh; overflow-y:auto; }
.lobby-nav-group { min-width:0; }
.lobby-nav-group > summary { position:relative; display:flex; align-items:center; gap:13px; min-height:55px; padding:0 16px; border:1px solid #1e3a57; border-radius:13px; background:rgba(12,28,48,.72); color:#edf5ff; font-size:15px; font-weight:750; cursor:pointer; list-style:none; }
.lobby-nav-group > summary::-webkit-details-marker { display:none; }
.lobby-nav-group > summary:hover { border-color:#2389c5; background:#102a48; }
.lobby-nav-group > summary:focus-visible { outline:2px solid #ffd23f; outline-offset:-3px; }
.lobby-nav-group[open] > summary { border-color:#387298; background:#102a48; }
.lobby-group-arrow { margin-left:auto; font-size:20px; line-height:1; transition:transform .18s; }
.lobby-nav-group[open] .lobby-group-arrow { transform:rotate(180deg); }
.lobby-nav-items { display:grid; gap:6px; margin:8px 0 2px 12px; padding-left:8px; border-left:2px solid #294a66; }
.nav .lobby-nav-items button { width:100%; min-height:46px; padding:0 10px; font-size:12px; gap:7px; transform:none; border-radius:10px; }
.nav .lobby-nav-items button:hover { transform:none; }
.lobby-group-badge { display:none; width:8px; height:8px; flex:none; border-radius:50%; background:#ff4b55; box-shadow:0 0 8px #ff4b5580; }
.lobby-nav-group:has(.nav-badge[style*="block"]) .lobby-group-badge { display:block; }
@media (max-height:800px) {
  body[data-page="lobby"] .pk-brand--sidebar { margin-bottom:16px; }
  body[data-page="lobby"] .nav { gap:7px; }
  body[data-page="lobby"] .nav > button,
  .lobby-nav-group > summary { min-height:48px; font-size:14px; }
}
@media (max-height:650px) {
  body[data-page="lobby"] .pk-brand--sidebar { margin-bottom:12px; }
  body[data-page="lobby"] .nav { gap:6px; }
  body[data-page="lobby"] .nav > button,
  .lobby-nav-group > summary { min-height:46px; }
}
