/* Mobile overrides only; desktop layout remains unchanged. */
.map-zoom-controls, .mobile-player-close { display: none; }
@media (max-width: 768px), (pointer: coarse) and (max-height: 600px), (max-height: 500px) and (max-width: 1100px) {
  html, body { overscroll-behavior: none; }
  .app, #mapCanvas { height: 100%; height: 100dvh; }
  .map-control { top: calc(8px + env(safe-area-inset-top)); left: calc(8px + env(safe-area-inset-left)); max-width: min(240px, calc(100vw - 24px)); }
  .map-control-head { min-height: 34px; }
  .map-control-body { max-height: min(420px, calc(100dvh - 190px)); overflow-y: auto; touch-action: pan-y; }
  .map-control.collapsed .map-control-body { max-height: 0; overflow: hidden; }
  .map-control-pad button, .map-control-seg button, .map-control-reset { min-height: 40px; }
  .map-control-select { font-size: 16px; min-height: 40px; max-width: 140px; }
  .ping-stats { top: calc(64px + env(safe-area-inset-top)); padding: 5px 8px; max-width: calc(100vw - 24px); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .ping-stats:hover { transform: translateX(-50%); }
  .ping-item .label { font-size: 10px; letter-spacing: 0; }
  .ping-item .value { font-size: 11px; padding: 3px 5px; }
  .ping-item:last-child { display: none; }
  .timeout-warning-container { top: calc(110px + env(safe-area-inset-top)); width: calc(100vw - 32px); box-sizing: border-box; padding: 8px 10px; text-align: center; font-size: 12px; color: #ffd3d3; border-radius: 10px; background: #351c23ed; }
  .gui-bottom { bottom: calc(12px + env(safe-area-inset-bottom)); padding-left: calc(8px + env(safe-area-inset-left)); justify-content: flex-start; height: 48px; box-sizing: border-box; pointer-events: none; }
  .camera-button { min-height: 48px; max-width: min(210px, calc(100vw - 142px)); box-sizing: border-box; pointer-events: auto; }
  .settings-button { position: fixed !important; right: calc(8px + env(safe-area-inset-right)) !important; bottom: calc(12px + env(safe-area-inset-bottom)) !important; width: 48px !important; height: 48px !important; margin: 0 !important; pointer-events: auto; }
  .player-list-settings-button { top: auto !important; right: calc(64px + env(safe-area-inset-right)) !important; left: auto !important; bottom: calc(12px + env(safe-area-inset-bottom)) !important; width: 48px !important; height: 48px !important; transform: none !important; }
  .player-lists { display: none !important; left: calc(8px + env(safe-area-inset-left)); right: calc(8px + env(safe-area-inset-right)); bottom: calc(74px + env(safe-area-inset-bottom)); top: auto !important; width: auto !important; max-height: min(55dvh, 460px); padding: 12px; box-sizing: border-box; transform: none !important; background: #171b23f5; backdrop-filter: none; -webkit-backdrop-filter: none; }
  body.mobile-players-open .player-lists { display: flex !important; opacity: 1 !important; pointer-events: auto !important; }
  .player-lists-header { min-height: 44px; flex-shrink: 0; }
  .mobile-player-close { display: grid; place-items: center; width: 44px; height: 44px; margin-left: auto; border: 0; border-radius: 8px; background: #ffffff13; color: #fff; font-size: 24px; }
  .player-lists-content { min-height: 0; max-height: none; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .player-item { min-height: 56px; }
  .map-zoom-controls { position: fixed; display: flex; flex-direction: column; gap: 6px; right: calc(8px + env(safe-area-inset-right)); bottom: calc(86px + env(safe-area-inset-bottom)); z-index: 1002; }
  .map-zoom-controls button { width: 44px; height: 44px; border: 1px solid #ffffff26; border-radius: 12px; background: #171b23ed; color: #fff; font-size: 23px; touch-action: manipulation; }
  .map-zoom-controls button:last-child { font-size: 12px; }
  body.mobile-players-open .map-zoom-controls, body.mobile-players-open .floor-selector-vertical { display: none; }
  body.setting-open .map-zoom-controls { display: none; }
  .floor-selector-vertical { right: calc(8px + env(safe-area-inset-right)); top: auto; bottom: calc(242px + env(safe-area-inset-bottom)); transform: none; max-height: calc(100dvh - 370px); overflow-y: auto; opacity: 1; touch-action: pan-y; }
  .floor-button { min-height: 44px; min-width: 44px; flex-shrink: 0; }
  .camera-button .lists { max-height: min(55dvh, 380px); overflow-y: auto; touch-action: pan-y; }
  .fps { left: calc(8px + env(safe-area-inset-left)); right: auto; bottom: calc(74px + env(safe-area-inset-bottom)); font-size: 11px; pointer-events: none; }
  .item-box-container { max-width: calc(100vw - 76px); max-height: 40dvh; overflow-y: auto; touch-action: pan-y; }
  .setting { left: 0; top: 0; width: 100vw; height: 100vh; height: 100dvh; max-height: none; max-width: none; border-radius: 0; padding: calc(8px + env(safe-area-inset-top)) calc(8px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(8px + env(safe-area-inset-left)); transform: translateY(105%); background: #141820; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .setting.show { left: 0 !important; top: 0 !important; transform: none !important; }
  .setting .setting-header { flex-direction: column; align-items: stretch; height: auto; padding-bottom: 6px; gap: 4px; }
  .setting .setting-header-left { min-height: 36px; padding-right: 56px; }
  .setting-header-subtitle { display: none; }
  .setting .setting-header-right { display: flex; width: 100%; min-width: 0; }
  .setting-header-menus { display: flex; overflow-x: auto; width: 100%; justify-content: flex-start; touch-action: pan-x; scrollbar-width: none; }
  .setting-header-menu-item { flex: 0 0 auto; min-height: 44px; min-width: 54px; display: grid; place-items: center; margin: 0 2px; padding: 0 8px; box-sizing: border-box; }
  .setting-header-close { position: absolute; right: calc(8px + env(safe-area-inset-right)); top: calc(8px + env(safe-area-inset-top)); display: grid; place-items: center; min-width: 48px; min-height: 44px; margin: 0; }
  .setting-content-container { min-height: 0; flex: 1; overflow: hidden; }
  .setting-content.show { overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; touch-action: pan-y; }
  .my-masonry-grid { display: block !important; }
  .setting-card { width: 100% !important; max-width: 100%; margin-bottom: 10px; box-sizing: border-box; }
  .setting-item { min-height: 44px; }
  .setting-select, .setting input[type="text"], .setting input[type="search"], .setting select { font-size: 16px; }
  .MuiSwitch-input { top: -13px; left: -7px; width: 48px; height: 44px; }
  .item-container > .setting-card, .containers > .setting-card { max-height: calc(100dvh - 140px); }
  button, [role="button"] { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
  .ping-item .value:before { animation: none; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .ping-stats { top: calc(8px + env(safe-area-inset-top)); }
  .timeout-warning-container { top: calc(54px + env(safe-area-inset-top)); }
  .map-control { max-width: 180px; }
  .map-control-body { max-height: calc(100dvh - 130px); }
  .floor-selector-vertical { top: calc(58px + env(safe-area-inset-top)); bottom: auto; right: calc(8px + env(safe-area-inset-right)); flex-direction: row; transform: none; max-height: 48px; max-width: min(240px, calc(100vw - 210px)); overflow-x: auto; overflow-y: hidden; }
  .player-lists { width: min(350px, 48vw) !important; left: auto; max-height: calc(100dvh - 90px); }
  .map-zoom-controls { flex-direction: row; bottom: calc(74px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; } }
