/* ═══════════════════════════════════════════
   MOBILE — single breakpoint, no !important creep
   max-width: 768px
   ═══════════════════════════════════════════ */
@media (max-width: 768px) {

  /* Rail hidden on mobile */
  #rail { display: none; }

  /* ── Cover panel: full-width centred ── */
  #c0 .panel {
    width: calc(100vw - 2rem);
    left: 1rem;
    top: 50%;
    transform: translate(0, -50%);
    max-height: calc(100dvh - var(--hdr-h) - 2rem);
    overflow-y: auto;
  }
  #c0 .panel.in { transform: translate(0, -50%); }

  /* ── All other panels: top of screen, full width ── */
  .ch:not(#c0) .panel {
    left: 0;
    right: 0;
    top: calc(var(--hdr-h) + 6px);
    width: 100%;
    max-height: 46dvh;
    overflow-y: auto;
    transform: translateY(-6px);
  }
  .ch:not(#c0) .panel.in { transform: translateY(0); }

  /* Right-anchored panels (ch2, ch5): reset to left-flush */
  #c2 .panel, #c5 .panel {
    left: 0;
    right: 0;
    transform: translateY(-6px);
  }
  #c2 .panel.in, #c5 .panel.in { transform: translateY(0); }

  .pglass { padding: 14px 16px 12px; }

  /* ── Analysis panel: slides up from bottom as sheet ── */
  .apanel {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    width: 100%;
    max-height: 52dvh;
    transform: translateY(100%);
    border-top: 2px solid var(--cyan);
    background: rgba(2,4,14,0.97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-left: none;
    border-right: none;
    border-bottom: none;
    z-index: 80;
    overflow-y: auto;
    transition: transform 0.35s var(--ease-out), opacity 0.35s;
  }

  /* Open state from .ao (button-driven, not hover) */
  .panel.ao .apanel { transform: translateY(0); opacity: 1; pointer-events: all; }

  /* Right-anchored apanel on mobile: same bottom sheet */
  #c2 .panel .apanel, #c5 .panel .apanel {
    right: 0; left: 0;
    border-right: none;
    border-top: 2px solid var(--amber);
    transform: translateY(100%);
  }
  #c2 .panel.ao .apanel, #c5 .panel.ao .apanel { transform: translateY(0); }

  .aglass { padding: 14px 16px; border-left: none; border-top: none; }
  #c2 .panel .aglass, #c5 .panel .aglass { border-right: none; }

  /* ── Modal: slides up from bottom ── */
  .modal { align-items: flex-end; }
  .mbox {
    width: 100%;
    max-height: calc(100dvh - var(--hdr-h));
    border-left: none; border-right: none; border-bottom: none;
    border-top: 2px solid var(--cyan);
    padding: 18px 16px;
  }
  .choice-grid { grid-template-columns: 1fr; }

  /* ── Orb ── */
  #orb { --orb-size: 90px; --orb-size-sm: 38px; }

  /* ── Nav: tighter ── */
  .nb { font-size: 8.5px; padding: 4px 6px; }
  #logo { font-size: 9.5px; }

  /* ── Panel headings: smaller ── */
  .panel h2 { font-size: 16px; }

  /* Prevent any horizontal overflow */
  .ch, #sw { overflow-x: hidden; }
}