.app-shell .main-nav.room-navigation { bottom: auto; width: min(340px,calc(100vw - 24px)); min-height: 60px; padding: 6px 8px 6px 16px; display: flex; flex-wrap: nowrap; justify-content: space-between; gap: 12px; overflow: visible; border-radius: 19px; z-index: 65; }
.navigation-current { display: flex; align-items: center; gap: 11px; min-width: 0; color: #52714e; }
.navigation-current .nav-icon { margin: 0; width: 26px; height: 26px; flex: 0 0 26px; }
.navigation-current strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.navigation-toggle { display: grid; place-items: center; width: 46px; height: 46px; min-width: 46px; border: 1px solid #c5d2b7; border-radius: 13px; background: #edf2df; color: #507449; cursor: pointer; }
.navigation-toggle svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.navigation-toggle:hover, .navigation-toggle[aria-expanded="true"] { background: #dfe8cc; }
.navigation-toggle:focus-visible { outline: 3px solid #ba9145; outline-offset: 2px; }
.navigation-links { position: absolute; top: calc(100% + 8px); right: 0; width: min(360px,calc(100vw - 24px)); max-height: calc(100dvh - 160px); overflow: auto; overscroll-behavior: contain; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; padding: 9px; border: 1px solid #bdcba9; border-radius: 20px; background: #fffdf0; box-shadow: 0 5px 0 #c8d2b3,0 12px 28px #334b3424; }
.navigation-links[hidden] { display: none !important; }
.app-shell .room-navigation .navigation-links .nav-button { display: flex; flex: initial; align-items: center; justify-content: center; flex-direction: column; gap: 5px; width: 100%; min-width: 0; min-height: 68px; padding: 8px 5px; margin: 0; border-radius: 13px; }
.app-shell .room-navigation .navigation-links .nav-button[hidden] { display: none; }
.app-shell .room-navigation .nav-label { white-space: normal; line-height: 1.2; font-size: 12px; }
@media(max-width:700px) {
  .app-shell .main-nav.room-navigation { width: min(310px,calc(100vw - 24px)); min-height: 58px; padding-block: 5px; }
  .navigation-current strong { font-size: 14px; }
  .navigation-links { width: 100%; max-height: calc(100dvh - 150px); }
}

.audio-permission-actions { display:flex; flex-wrap:wrap; gap:8px; margin-block:12px; }
.audio-permission-actions [hidden], .desktop-audio-settings[hidden] { display:none; }
.desktop-audio-settings { margin-top:18px; padding-top:14px; border-top:1px solid #c8d7be; }
.desktop-fullscreen-option { display:flex; align-items:flex-start; gap:9px; margin-top:16px; line-height:1.5; }
.room-settings .desktop-fullscreen-option input[type="checkbox"] { width:18px; height:18px; min-height:18px; flex:0 0 18px; padding:0; margin:5px 0 0; }
.desktop-fullscreen-option > span { flex:1; }
.desktop-fullscreen-option small { display:block; color:#748469; }
[data-audio-reactions] { scroll-margin-top:155px; }