#mobileControls { display: none; }

@media (pointer: coarse), (max-width: 980px) {
  html, body, #app, #game { width: 100%; height: 100%; overflow: hidden; touch-action: none; }
  #game { display: block; }
  .left-panel, .right-panel, .music-panel, #targetHint { display: none !important; }
  .cockpit-top { height: 8vh; opacity: .48; }
  .cockpit-bottom { height: 14vh; opacity: .45; }
  .cockpit-strut { opacity: .35; }
  .cockpit-reticle-ring, .crosshair { transform: translate(-50%, -50%) scale(.72); }
  .mode-switch { top: max(10px, env(safe-area-inset-top)); left: max(10px, env(safe-area-inset-left)); right: auto; flex-direction: row; gap: 6px; }
  .mode-switch button { min-width: 0; width: auto; height: 38px; padding: 0 11px; }
  .mode-switch button span { display: none; }
  .mode-switch button b { font-size: 12px; }
  .nav-panel { top: max(10px, env(safe-area-inset-top)); right: max(10px, env(safe-area-inset-right)); left: auto; bottom: auto; width: min(49vw, 390px); transform: none; grid-template-columns: minmax(92px, 1fr) auto auto; gap: 5px; }
  .nav-panel select, .nav-panel button { height: 38px; min-width: 0; padding: 0 8px; font-size: 11px; }
  .cockpit-room-open { top: 58px; width: 126px; height: 38px; font-size: 12px; }
  .assistant-panel { right: max(12px, env(safe-area-inset-right)); bottom: calc(112px + env(safe-area-inset-bottom)); transform: scale(.82); transform-origin: right bottom; }
  .assistant-bubble { width: min(76vw, 330px); }
  .galaxy-window, .universe-window { width: 100vw; height: 100dvh; padding: 8px; border: 0; }
  .galaxy-header, .universe-header { min-height: 42px; }
  .galaxy-header span, .universe-header span { display: none; }
  .galaxy-body, .universe-body { grid-template-columns: 1fr; grid-template-rows: minmax(180px, 44vh) minmax(180px, 1fr); gap: 7px; }
  .galaxy-side, .universe-side { min-height: 0; overflow: auto; }
  .galaxy-list, .universe-list { min-height: 90px; }
  .cockpit-drive-pad { width: min(54vw, 390px); min-width: 250px; }
  .cockpit-mascot-wrap { width: min(32vw, 230px); min-width: 150px; }
  .cockpit-chair { width: min(26vw, 210px); }
  .cockpit-controller, .cockpit-cola, .cockpit-phone, .cockpit-salad, .cockpit-fork, .cockpit-snack { display: none; }

  #mobileControls { position: fixed; inset: 0; z-index: 88; display: block; pointer-events: none; color: #dffcff; font-family: "Microsoft YaHei UI", sans-serif; }
  .mobile-look { position: absolute; right: 0; top: 96px; bottom: 0; width: 56%; pointer-events: auto; touch-action: none; }
  .mobile-stick { position: absolute; left: max(22px, env(safe-area-inset-left)); bottom: max(24px, env(safe-area-inset-bottom)); width: 122px; height: 122px; border: 1px solid rgba(132, 236, 255, .32); border-radius: 50%; background: radial-gradient(circle, rgba(56, 200, 230, .15), rgba(4, 16, 34, .36) 62%, rgba(0,0,0,.14)); box-shadow: inset 0 0 24px rgba(68, 220, 255, .12), 0 0 22px rgba(30, 160, 210, .12); pointer-events: auto; touch-action: none; }
  .mobile-stick-knob { position: absolute; left: 40px; top: 40px; width: 40px; height: 40px; border: 1px solid rgba(194, 250, 255, .72); border-radius: 50%; background: rgba(57, 199, 226, .34); box-shadow: 0 0 18px rgba(77, 231, 255, .38); }
  .mobile-actions { position: absolute; right: max(18px, env(safe-area-inset-right)); bottom: max(22px, env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(3, 48px); grid-template-rows: repeat(2, 48px); gap: 9px; pointer-events: auto; }
  .mobile-actions button, .mobile-quick button { border: 1px solid rgba(140, 236, 255, .42); border-radius: 50%; background: rgba(4, 20, 43, .62); color: #e9feff; box-shadow: inset 0 0 14px rgba(63, 207, 255, .13), 0 0 14px rgba(30, 170, 220, .1); font: 700 10px/1 "Microsoft YaHei UI", sans-serif; touch-action: none; }
  .mobile-actions button:active, .mobile-actions button.active, .mobile-quick button:active { background: rgba(74, 221, 241, .46); border-color: #d9ffff; transform: scale(.94); }
  .mobile-actions .fire { grid-row: 1 / 3; grid-column: 3; width: 62px; height: 62px; align-self: center; margin-left: -1px; border-color: rgba(255, 125, 125, .62); background: rgba(117, 15, 39, .62); }
  .mobile-quick { position: absolute; left: max(12px, env(safe-area-inset-left)); top: 58px; display: flex; gap: 7px; pointer-events: auto; }
  .mobile-quick button { width: auto; min-width: 42px; height: 32px; padding: 0 9px; border-radius: 4px; }
  .mobile-orientation { display: none; position: absolute; left: 50%; top: 52%; transform: translate(-50%, -50%); padding: 9px 13px; border: 1px solid rgba(132, 236, 255, .28); border-radius: 5px; background: rgba(3, 12, 29, .72); color: rgba(218, 250, 255, .76); font-size: 11px; pointer-events: none; }
}

@media (pointer: coarse) and (orientation: portrait) {
  .mobile-orientation { display: block; }
  .mobile-stick { width: 108px; height: 108px; }
  .mobile-stick-knob { left: 35px; top: 35px; width: 36px; height: 36px; }
  .mobile-actions { grid-template-columns: repeat(3, 43px); grid-template-rows: repeat(2, 43px); gap: 7px; }
  .nav-panel { width: calc(100vw - 20px); top: 52px; }
  .mode-switch { max-width: calc(100vw - 20px); }
  .cockpit-room-open { display: none; }
}