/* Compact settings menu anchored at the upper right. */
.topbar{justify-content:flex-end;pointer-events:none}
.top-actions{pointer-events:auto;gap:8px}
.settings-root{position:relative;flex:none}
.settings-trigger{display:grid;place-items:center;width:46px;height:46px;padding:0;border:1px solid #e0d3a678;border-radius:50%;background:#152820dc;color:#f3e7c6;cursor:pointer;touch-action:manipulation}
.settings-trigger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.settings-trigger:hover,.settings-trigger[aria-expanded="true"]{background:#2c4a3beF}
.settings-menu{position:absolute;top:calc(100% + 10px);right:0;width:min(290px,calc(100vw - 24px));max-height:calc(100dvh - 90px);overflow:auto;padding:16px;border:1px solid #d8c79599;border-radius:18px;background:#142a23ed;box-shadow:0 12px 34px #0008;color:#f6efd9;font:inherit}
.settings-menu[hidden]{display:none}
.settings-heading{margin:0 0 10px;font-size:19px;font-weight:700}
.settings-label{display:block;margin:13px 0 7px;font-size:13px;color:#d4cba9}
.settings-menu .language-select{display:block;width:100%;min-height:42px;text-align:left;font-size:15px;letter-spacing:0}
.settings-menu .controls{position:static;display:flex;flex-direction:column;gap:7px;transform:none;white-space:normal}
.settings-menu .control{width:100%;min-height:44px;height:auto;justify-content:flex-start;padding:9px 13px;border-radius:12px;font-size:15px;gap:10px;background:#ffffff0c;backdrop-filter:none}
.settings-menu #soundButton{order:0}.settings-menu #avatarButton{order:1}
.settings-modes{display:flex;gap:7px}.settings-modes button{flex:1;min-width:0;min-height:42px;padding:7px;border:1px solid #d4c28a80;border-radius:11px;background:#ffffff0b;color:#f6efd9;font:inherit;font-size:13px;cursor:pointer;touch-action:manipulation}
.settings-modes button[aria-pressed="true"]{background:#e3cd98;color:#24362d}
.settings-status{margin:8px 0 0;font-size:12px;line-height:1.4;color:#ebc890}.settings-status:empty{display:none}
#soundPanel.panel,#avatarPanel.panel{position:fixed;z-index:15;top:max(75px,calc(env(safe-area-inset-top) + 65px));right:max(12px,env(safe-area-inset-right));bottom:auto;max-height:calc(100dvh - max(90px,env(safe-area-inset-top) + 80px));overflow:auto}
@media (max-height:520px){.settings-trigger{width:38px;height:38px}.settings-trigger svg{width:19px;height:19px}.settings-menu{top:calc(100% + 4px);max-height:calc(100dvh - 54px);padding:10px 12px}.settings-heading{margin-bottom:3px;font-size:16px}.settings-label{margin:7px 0 4px}.settings-menu .controls{gap:4px}.settings-menu .control{min-height:37px;padding:5px 10px}.settings-menu .language-select,.settings-modes button{min-height:36px}#soundPanel.panel,#avatarPanel.panel{top:48px;max-height:calc(100dvh - 55px)}}


/* Cover the available browser viewport and keep controls clear of display cutouts. */
html,body{width:100%;height:100%;background:#15221f}
html:fullscreen{width:100%;height:100%;background:#15221f}
html:-webkit-full-screen{width:100%;height:100%;background:#15221f}
html:fullscreen::backdrop{background:#15221f}
#app,#world{background:#15221f}
.topbar{padding-top:max(18px,env(safe-area-inset-top));padding-right:max(18px,env(safe-area-inset-right))}

/* Settings temporarily replace touch gameplay controls rather than sitting
   underneath the jump button, joystick or chat bar. */
@media (pointer:coarse){
  body.goyo-settings-open :is(.preview-jump,.mobile-joystick,.chat-dock,.chat-history){visibility:hidden;pointer-events:none}
  body.goyo-settings-open .topbar{z-index:160}
}
html.touch-phone body.goyo-settings-open :is(.preview-jump,.mobile-joystick,.chat-dock,.chat-history){visibility:hidden;pointer-events:none}
html.touch-phone body.goyo-settings-open .topbar{z-index:160}
@media (pointer:coarse) and (max-height:600px){
  .settings-menu{max-height:calc(100dvh - max(18px,env(safe-area-inset-top)) - 50px - max(8px,env(safe-area-inset-bottom)));overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  #soundPanel.panel,#avatarPanel.panel{max-height:calc(100dvh - 48px - max(8px,env(safe-area-inset-bottom)));overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
}