#music-toggle{top:22px;right:184px;bottom:auto;z-index:5;width:44px;height:44px;opacity:1;background:var(--glass);color:var(--glass-ink);border:1px solid var(--glass-line);backdrop-filter:blur(20px);box-shadow:var(--glass-shadow)}.joined #music-toggle{right:238px}#music-toggle.playing{background:#465d48;color:#fff}
#music-panel{position:fixed;inset:12px 12px 12px auto;width:min(390px,calc(100% - 24px));height:calc(100svh - 24px);max-height:none;max-width:none;margin:0;padding:24px;border-radius:22px;overflow:auto;background:var(--glass);color:var(--glass-ink);border:1px solid var(--glass-line);backdrop-filter:blur(24px) saturate(110%);-webkit-backdrop-filter:blur(24px) saturate(110%);box-shadow:var(--glass-shadow);font:14px/1.5 'Alegreya Sans',system-ui,sans-serif}#music-panel::backdrop{background:#0b1b2010;backdrop-filter:blur(2px)}#music-panel header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}#music-panel h1{font:400 25px Georgia;margin:0}#music-panel header p{font-size:12px;opacity:.7;margin:7px 0 24px}#music-panel button{position:static;width:auto;height:auto;opacity:1;backdrop-filter:none;box-shadow:none;background:var(--field-bg);color:var(--glass-ink);border:1px solid var(--glass-line);font:13px 'Alegreya Sans',system-ui,sans-serif;border-radius:14px;padding:11px 14px}#music-panel #close-music{width:30px;height:30px;padding:0;font-size:24px;border-radius:50%;background:transparent;flex-shrink:0}
#sound-options{display:flex;flex-direction:column;gap:10px}#music-panel .sound-choice{width:100%;text-align:left;display:flex;align-items:center;gap:12px;padding:15px}.sound-mark{font:24px 'Alegreya Sans',system-ui,sans-serif;width:30px;text-align:center;opacity:.7}.sound-choice strong{font-weight:500;font-size:14px}.sound-choice small{display:block;font-size:11px;opacity:.65;margin-top:4px}.sound-choice[aria-checked="true"]{outline:2px solid var(--accent);outline-offset:1px;background:#96ac7d26!important}
.music-player{margin-top:20px;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center}#music-panel #music-play{grid-column:1/-1;width:100%;background:#465d48;color:#fff;border-radius:22px;height:44px}.music-player label,.music-player output{font-size:11px}.music-player input{width:100%;accent-color:#7c966c}#music-status{min-height:18px;font-size:11px;opacity:.75;margin:12px 0 5px}.music-credit{font-size:10px;opacity:.6;margin:0}
.karaoke-card{margin-top:26px;padding-top:22px;border-top:1px solid var(--glass-line)}.karaoke-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.karaoke-heading h2{font:400 21px Georgia;margin:0}.karaoke-heading span{font-size:9px;border:1px solid var(--glass-line);padding:3px 7px;border-radius:12px;opacity:.65}.karaoke-card p{font-size:12px;opacity:.7}.karaoke-card label{font-size:11px}.karaoke-card input{display:block;margin:7px 0 12px;width:100%;padding:11px;border:1px solid var(--glass-line);border-radius:10px;background:var(--field-bg);color:var(--glass-ink);font:13px 'Alegreya Sans',system-ui,sans-serif}.karaoke-card input::placeholder{color:inherit;opacity:.5}#karaoke-link{display:block;text-align:center;text-decoration:none;color:var(--glass-ink);font-size:12px;border:1px solid var(--glass-line);border-radius:22px;padding:10px;background:var(--field-bg)}
@media(max-width:520px){#music-panel{padding:20px}#games-toggle{left:12px;top:12px;width:36px;height:36px}#music-toggle,#animate,#time,#profile-toggle,#map-toggle{top:12px;width:36px;height:36px}#map-toggle{right:12px}#profile-toggle{right:54px}#time{right:54px}#animate{right:96px}#music-toggle{right:138px}.joined #time{right:96px}.joined #animate{right:138px}.joined #music-toggle{right:180px}}

/* Keep every scene control in one compact top row on narrow Safari/PWA viewports. */
@media(max-width:600px){
  #music-toggle,.joined #music-toggle,
  #animate,.joined #animate,
  #time,.joined #time,
  #chat-toggle,.joined #chat-toggle,
  #notifications-toggle,.joined #notifications-toggle,
  #map-toggle,.joined #map-toggle{top:max(12px,env(safe-area-inset-top));width:36px;height:36px}
  #map-toggle,.joined #map-toggle{right:12px}
  #notifications-toggle,.joined #notifications-toggle{right:52px}
  #chat-toggle,.joined #chat-toggle{right:92px}
  #time,.joined #time{right:132px}
  #animate,.joined #animate{right:172px}
  #music-toggle,.joined #music-toggle{right:212px}
}

#rain-screen{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;opacity:0;transition:opacity .6s}.raining #rain-screen{opacity:1}.raining #music-toggle{background:#46636a;color:#f0f5ed}
#music-search{display:block;width:100%;margin:0 0 10px;padding:10px 12px;border:1px solid var(--glass-line);border-radius:12px;background:var(--field-bg);color:var(--glass-ink);font:12px 'Alegreya Sans',system-ui,sans-serif}#music-search::placeholder{color:inherit;opacity:.55}#music-filters{display:flex;gap:5px;flex-wrap:wrap}#music-panel #music-filters button{padding:6px 10px;font-size:10px;border-radius:16px}#music-filters button[aria-pressed="true"]{background:#465d48!important;color:#fff!important}#music-count{font-size:10px;opacity:.6;margin:8px 0}#sound-options{max-height:310px;overflow:auto;padding:3px;scrollbar-width:thin;scrollbar-color:#7d927066 transparent}#music-panel .sound-choice{padding:12px;gap:9px}.sound-choice small{font-size:10px}.sound-choice .track-meta{font-size:9px;opacity:.55;margin-top:5px}.music-player .music-transport{grid-column:1/-1;display:flex;gap:8px}.music-transport #music-play{flex:1;width:auto!important}.music-transport #music-previous,.music-transport #music-next{width:40px;font-size:22px;padding:5px}.music-credit summary{cursor:pointer;opacity:.8}.music-credit p{font-size:10px;margin:7px 0}.music-credit a{color:inherit;font-size:10px}#music-audio{display:none}
