/* AeroSphere mobile layout — keeps the globe primary and moves controls into touch-friendly sheets. */
@media (max-width: 760px) {
  :root { --mobile-header: 62px; --app-visual-height: 100vh; }

  html, body, #app { width:100%; height:100%; min-height:100%; }
  body { overscroll-behavior:none; -webkit-text-size-adjust:100%; }

  .topbar {
    height:calc(var(--mobile-header) + env(safe-area-inset-top));
    padding:env(safe-area-inset-top) 10px 0;
    gap:8px;
    position:relative;
  }
  .stage {
    height:calc(var(--app-visual-height, 100vh) - var(--mobile-header) - env(safe-area-inset-top));
    min-height:320px;
    position:relative;
    overflow:hidden;
  }
  #spaceCanvas {
    position:absolute;
    inset:0;
    width:100%!important;
    height:100%!important;
    min-width:100%;
    min-height:100%;
    display:block;
    touch-action:none;
  }

  .brand { min-width:0; flex:1; gap:8px; overflow:hidden; }
  .brand-mark,.brand-mark img { width:34px!important; height:34px!important; flex:0 0 34px; }
  .brand-name { font-size:16px; white-space:nowrap; }
  .brand-tag,.topnav { display:none!important; }

  .top-actions { margin-left:auto; gap:6px; flex:0 0 auto; }
  .top-actions > button,
  .mobile-search-toggle {
    min-width:42px;
    min-height:42px;
    height:42px;
    padding:0 10px;
    border-radius:10px;
  }
  #solarButton { font-size:10px; padding:0 9px; }
  #layersButton { font-size:17px; }

  .search-wrap {
    display:flex!important;
    position:fixed;
    z-index:80;
    top:calc(var(--mobile-header) + env(safe-area-inset-top) + 8px);
    left:10px;
    right:10px;
    width:auto!important;
    min-height:44px;
    padding:10px 13px;
    background:rgba(5,14,24,.97);
    box-shadow:0 14px 40px rgba(0,0,0,.42);
    opacity:0;
    transform:translateY(-8px) scale(.985);
    pointer-events:none;
    transition:opacity .18s ease,transform .18s ease;
  }
  body.mobile-search-open .search-wrap {
    opacity:1;
    transform:translateY(0) scale(1);
    pointer-events:auto;
  }
  .search-wrap input { font-size:16px; }

  .live-badge {
    top:10px;
    max-width:calc(100% - 28px);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:9px;
    letter-spacing:.8px;
    padding:6px 9px;
  }
  body.mobile-search-open .live-badge { top:62px; }
  .zoom-card { display:none!important; }

  .panel.layers-panel {
    position:absolute;
    top:auto!important;
    left:8px!important;
    right:8px;
    bottom:calc(8px + env(safe-area-inset-bottom));
    width:auto!important;
    max-height:min(72vh,590px);
    overflow:auto;
    border-radius:16px;
    transform:translateY(0);
    opacity:1;
    transition:transform .24s ease,opacity .2s ease;
  }
  .panel.layers-panel.collapsed {
    transform:translateY(calc(100% + 24px))!important;
    opacity:0;
    pointer-events:none;
  }
  .panel-head,.drawer-head { padding:13px 14px; }
  .toggle-list { padding:4px 0; }
  .switch-row { min-height:44px; padding:9px 14px; }
  .switch-row i { flex:0 0 32px; }
  .full { min-height:44px; }

  .bottom-dock { display:none!important; }

  .selection-card {
    left:8px!important;
    right:8px!important;
    top:auto!important;
    bottom:calc(8px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-height:min(58vh,520px);
    overflow:auto;
    border-radius:16px;
    padding:16px;
  }
  .selection-card h2 { font-size:19px; padding-right:28px; }
  .selection-card p { margin-bottom:12px; }
  .stat-grid { gap:7px; }
  .stat { padding:8px; }
  .selection-actions { gap:7px; flex-wrap:wrap; }
  .selection-actions button { min-height:44px; }

  .drawer,.left-drawer,.comms-drawer {
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    border:0!important;
    border-radius:0;
    padding-bottom:env(safe-area-inset-bottom);
  }
  .drawer-content { padding:13px; height:calc(100% - 106px); }
  .drawer-tabs { overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .drawer-tabs::-webkit-scrollbar { display:none; }
  .tab { min-height:42px; flex:1; }
  .aircraft-view.model-view { height:min(34vh,240px); min-height:180px; }
  .telemetry { gap:7px; }

  .comms-head { padding:14px; }
  .comms-player,.comms-match,.comms-search-wrap,.comms-note { margin-left:10px!important; margin-right:10px!important; }
  .comms-list { padding-left:10px!important; padding-right:10px!important; padding-bottom:calc(18px + env(safe-area-inset-bottom))!important; }
  .comms-feed-row { min-height:48px; }

  .modal { padding:8px; align-items:end; }
  .modal-card {
    width:100%;
    max-height:80vh;
    border-radius:16px 16px 0 0;
    padding:18px 16px calc(18px + env(safe-area-inset-bottom));
  }

  .toast {
    top:auto;
    bottom:calc(16px + env(safe-area-inset-bottom));
    max-width:calc(100% - 20px);
    text-align:center;
    white-space:normal;
    border-radius:12px;
    transform:translate(-50%,12px);
  }
  .toast.show { transform:translate(-50%,0); }

  button,.icon-button,.primary-compact,.secondary,.primary,.ghost,.close { touch-action:manipulation; }
}

@supports (height: 100dvh) {
  @media (max-width: 760px) {
    :root { --app-visual-height: 100dvh; }
  }
}

@media (max-width: 390px) {
  .brand-name { font-size:15px; }
  #solarButton { max-width:70px; line-height:1.05; }
  .stat-grid { grid-template-columns:1fr; }
  .selection-actions { display:grid; grid-template-columns:1fr; }
  .selection-actions > * { width:100%; }
  .comms-feed-row { grid-template-columns:50px 1fr; }
  .comms-feed-action { display:none; }
}

@media (max-width: 900px) and (max-height: 500px) and (orientation: landscape) {
  :root { --mobile-header:54px; }
  .brand-mark,.brand-mark img { width:30px!important; height:30px!important; }
  .selection-card {
    left:auto!important;
    right:8px!important;
    top:8px!important;
    bottom:8px!important;
    width:min(330px,44vw)!important;
    max-height:none;
  }
  .panel.layers-panel {
    left:8px!important;
    right:auto!important;
    bottom:8px;
    width:min(290px,42vw)!important;
    max-height:calc(100% - 16px);
  }
  .live-badge { max-width:46vw; }
  .aircraft-view.model-view { height:180px; }
}