.mobile-nav, .mobile-section-select { display: none; }

@media (max-width: 760px) {
  html[data-mobile-nav] {
    scroll-behavior: auto;
    --mobile-nav-height: calc(72px + env(safe-area-inset-bottom, 0px));
    --mobile-top: calc(56px + env(safe-area-inset-top, 0px));
    scroll-padding-top: calc(var(--mobile-top) + 16px);
    scroll-padding-bottom: calc(var(--mobile-nav-height) + 16px);
  }
  html[data-mobile-nav] body { padding-bottom: var(--mobile-nav-height); }
  html[data-mobile-nav] .hud {
    height: var(--mobile-top); gap: 12px; padding: env(safe-area-inset-top, 0px) 16px 0;
  }
  html[data-mobile-nav] .hud .hud-nav { display: none; }
  html[data-mobile-nav] .hud-mark { flex-shrink: 0; font-size: 22px; gap: 8px; }
  html[data-mobile-nav] .hud-mark em, html[data-mobile-nav] .hud-stats .stat { display: none; }
  html[data-mobile-nav] .hud-stats { margin-left: auto; gap: 8px; }
  html[data-mobile-nav] .pad-body .hud-stats .chip { display: inline-flex; font-size: 8px; }
  .mobile-section-select {
    display: block; min-width: 0; width: 142px; height: 44px; margin-left: auto;
    padding: 0 5px; border: 0; border-bottom: 1px solid #394338;
    background: #080909; color: #bbc6b5; font: 12px var(--sans); border-radius: 0;
  }
  .mobile-section-select option { background: #080909; color: #f1f0e9; }
  .mobile-nav {
    position: fixed; z-index: 650; inset: auto 0 0; display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    height: var(--mobile-nav-height);
    padding: 4px max(8px, env(safe-area-inset-right, 0px)) env(safe-area-inset-bottom, 0px) max(8px, env(safe-area-inset-left, 0px));
    background: #0b0e0d; border-top: 1px solid #343d31;
    box-shadow: 0 -8px 28px #0005;
  }
  .mobile-nav-item {
    position: relative; min-width: 0; min-height: 64px; display: flex;
    flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    text-decoration: none; color: #9ba697; font: 500 10px/1.2 var(--mono);
    letter-spacing: 0; -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  }
  .mobile-nav-icon { display: grid; place-items: center; width: 34px; height: 30px; }
  .mobile-nav-item svg { width: 21px; height: 21px; stroke-width: 1.6; }
  .mobile-nav-item[aria-current] { color: #ffad68; }
  .mobile-nav-item[aria-current]::before {
    content: ''; position: absolute; top: -5px; width: 22px; height: 2px; background: #ff8a42;
  }
  .mobile-nav-item:active { background: #ffffff0a; }
  .mobile-nav-launch .mobile-nav-icon {
    width: 40px; height: 32px; color: #11130c; background: #f3aa65;
    border: 1px solid #ffdba1; border-radius: 4px;
    box-shadow: inset 0 -3px 0 #ca783c;
  }
  .mobile-nav-launch svg { width: 22px; height: 22px; stroke-width: 2; }
  .mobile-nav-item:focus-visible, .mobile-section-select:focus-visible { outline: 2px solid #b4ddba; outline-offset: -3px; }
  .modal-open .mobile-nav, .mobile-keyboard-open .mobile-nav { visibility: hidden; pointer-events: none; }
  body:has(> .wallet-modal) { overflow: hidden; }
  body:has(> .wallet-modal) .mobile-nav { visibility: hidden; pointer-events: none; }

  /* Room for thumb targets and the OS home indicator, without covering content. */
  html[data-mobile-nav] .icon-button { min-width: 44px; min-height: 44px; }
  html[data-mobile-nav] .btn { min-height: 44px; white-space: normal; text-align: center; line-height: 1.4; }
  html[data-mobile-nav] .seg button, html[data-mobile-nav] .rule,
  html[data-mobile-nav] button.frow, html[data-mobile-nav] button.row-ledger { min-height: 44px; }
  html[data-mobile-nav] .seg button { font-size: 11px; }
  html[data-mobile-nav] input, html[data-mobile-nav] textarea,
  html[data-mobile-nav] .holder-toolbar select { font-size: 16px; }
  .pad-search { min-height: 48px; }
  .pad-back { min-height: 44px; margin-bottom: 12px; }
  .pad-footer { padding-bottom: 28px; }
  .foot { padding-bottom: 32px; }
  .pad { padding-bottom: 40px; }
  .explorer-status, #token-status { overflow-wrap: anywhere; }
  .tk-ident { flex-basis: 240px; }
  .tk-fig b { overflow-wrap: anywhere; }
  .copy { min-width: 44px; min-height: 44px; }
  .explorer-toolbar > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .explorer-toolbar .btn { font-size: 11px; }
  .holder-toolbar label { flex: 1; }
  .holder-toolbar select { min-height: 44px; min-width: 0; }
  .holder-toolbar .btn { font-size: 11px; }

  .modal { padding: 0; place-items: end center; background: #000a; backdrop-filter: none; }
  .modal-card {
    width: 100%; max-width: 600px; max-height: calc(100dvh - env(safe-area-inset-top, 0px) - 16px);
    padding: 8px 20px calc(22px + env(safe-area-inset-bottom, 0px));
    border: 1px solid #484c3b; border-top: 2px solid #ff9951; border-radius: 8px 8px 0 0;
    overscroll-behavior: contain; scroll-padding: 16px;
  }
  .modal-card::before { content: ''; display: block; margin: 0 auto 6px; width: 32px; height: 3px; background: #5f6859; }
  .modal-head { position: sticky; top: -8px; z-index: 1; background: #0c0c0e; padding-block: 4px; }
  .modal-head h2 { font-size: 20px; }
  .modal-card .launch-form label { margin-top: 16px; font-size: 11px; }
  .modal-card .launch-form input { height: 48px; }
  .modal-card .launch-actions .btn { width: 100%; min-height: 48px; font-size: 12px; }
  .launch-record { overflow-wrap: anywhere; white-space: pre-wrap; }
  .launch-status { font-size: 12px; }

  /* The console opens above the tab bar; its old floating tab is redundant. */
  html[data-mobile-nav] .drawer { bottom: var(--mobile-nav-height); }
  html[data-mobile-nav] .drawer[data-open='false'] .drawer-tab { display: none; }
  html[data-mobile-nav] .drawer-tab { min-height: 40px; }
  html[data-mobile-nav] .drawer[data-open='true'] .drawer-body { height: min(52dvh, 420px); }
  html[data-mobile-nav] .term-input { min-width: 0; min-height: 44px; font-size: 16px; }
  html[data-mobile-nav].mobile-keyboard-open .drawer { bottom: 0; }
}

@media (max-width: 600px) {
  /* Reserve visible space for the next section above the persistent navigation. */
  html[data-mobile-nav] .launch-world { height: 414px; min-height: 0; }
  html[data-mobile-nav] .launch-copy { top: 58px; }
  html[data-mobile-nav] .launch-copy h1 { font-size: 78px; margin-bottom: 17px; }
  html[data-mobile-nav] .launch-copy h2 { font-size: 27px; }
  html[data-mobile-nav] .launch-copy p { margin-bottom: 18px; }
  html[data-mobile-nav] .launch-copy .btn { font-size: 11px; padding-inline: 10px; }
  html[data-mobile-nav] .pad-stats { padding-block: 15px; gap: 14px 10px; }
  html[data-mobile-nav] .registry-section { padding-top: 26px; }
  html[data-mobile-nav] .hero { height: 560px; min-height: 0; }
  html[data-mobile-nav] .hero-copy { top: 56px; }
  html[data-mobile-nav] .hero .wordmark { font-size: 78px; }
  html[data-mobile-nav] .hero .tagline { font-size: 23px; margin-top: 16px; }
  html[data-mobile-nav] .hero .lede { font-size: 12px; margin-top: 12px; }
  html[data-mobile-nav] .seal-stage { top: 236px; bottom: 124px; }
  html[data-mobile-nav] .seal-caption { bottom: -2px; }
  html[data-mobile-nav] .hero .cta { top: 403px; gap: 8px; }
  html[data-mobile-nav] .hero .btn { font-size: 10px; }
  html[data-mobile-nav] .hero-footer { height: 48px; }
  html[data-mobile-nav] .hero-footer .icon-button { flex-shrink: 0; }
}

@media (max-width: 360px) {
  html[data-mobile-nav] .hud { padding-inline: 12px; gap: 8px; }
  html[data-mobile-nav] .hud-mark { font-size: 19px; gap: 6px; }
  .mobile-section-select { width: 120px; font-size: 11px; }
  html[data-mobile-nav] .hero .wordmark, html[data-mobile-nav] .launch-copy h1 { font-size: 69px; }
  html[data-mobile-nav] .hero .tagline { font-size: 20px; }
  html[data-mobile-nav] .launch-copy .btn { font-size: 10px; }
  .mobile-nav-item { font-size: 9px; }
  html[data-mobile-nav] .pad-body .hud-stats .chip { display: none; }
}

@media (max-height: 600px) and (orientation: landscape) and (max-width: 760px) {
  html[data-mobile-nav] { --mobile-nav-height: calc(58px + env(safe-area-inset-bottom, 0px)); }
  .mobile-nav-item { min-height: 50px; flex-direction: row; gap: 5px; }
  .mobile-nav-icon { width: 26px; }
  .modal-card { max-height: calc(100dvh - 8px); }
}