:root {
  --tartary-mobile-rail-height: 74px;
  --tartary-mobile-hud-height: 70px;
  --tartary-mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
  --tartary-mobile-safe-top: env(safe-area-inset-top, 0px);
}

html.tartary-mobile-safe-shell,
html.tartary-mobile-safe-shell body {
  width: 100%;
  height: 100dvh;
  min-height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
  -webkit-text-size-adjust: 100%;
}

html.tartary-mobile-safe-shell body {
  touch-action: manipulation;
}

html.tartary-mobile-safe-shell .operator-grid {
  width: 100vw;
  height: 100dvh;
  min-height: 100dvh;
  padding: 0;
  overflow: hidden;
}

html.tartary-mobile-safe-shell .tactical-panel {
  inset: 0;
  border-radius: 0;
  padding: 0;
}

html.tartary-mobile-safe-shell .tactical-viewport,
html.tartary-mobile-safe-shell .tartary-viewport {
  width: 100%;
  height: 100%;
  min-height: 100dvh;
}

html.tartary-mobile-safe-shell .operator-menu-shell {
  top: calc(8px + var(--tartary-mobile-safe-top));
  left: 8px;
  z-index: 80;
}

html.tartary-mobile-safe-shell .operator-menu-toggle {
  min-width: 44px;
  height: 44px;
  border-radius: 14px;
  justify-content: center;
  padding: 0 12px;
}

html.tartary-mobile-safe-shell .operator-menu-toggle__sigil {
  font-size: 1.06rem;
}

html.tartary-mobile-safe-shell .operator-menu-drawer {
  width: min(82vw, 260px);
  max-height: calc(100dvh - 120px);
  overflow: auto;
}

html.tartary-mobile-safe-shell .tactical-label {
  top: calc(10px + var(--tartary-mobile-safe-top));
  left: 50%;
  transform: translateX(-50%);
  max-width: calc(100vw - 112px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  z-index: 60;
  font-size: 0.72rem;
  padding: 6px 10px;
}

html.tartary-mobile-safe-shell .tactical-hud {
  top: calc(58px + var(--tartary-mobile-safe-top));
  left: 8px;
  right: 8px;
  width: auto;
  max-width: none;
  max-height: 104px;
  overflow: hidden;
  z-index: 50;
  padding: 8px 10px;
  font-size: 0.62rem;
  opacity: 0.76;
}

html.tartary-mobile-safe-shell #hudEngineLine,
html.tartary-mobile-safe-shell #hudPerfLine {
  display: none;
}

.tartary-mobile-hud {
  position: fixed;
  top: calc(8px + var(--tartary-mobile-safe-top));
  right: 8px;
  z-index: 90;
  width: min(46vw, 220px);
  min-height: 48px;
  padding: 8px 10px;
  border: 1px solid rgba(240, 191, 104, 0.42);
  border-radius: 14px;
  color: var(--text, #f5ead4);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 28%),
    rgba(8, 5, 4, 0.86);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(4px);
  pointer-events: none;
}

.tartary-mobile-hud__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.tartary-mobile-hud__row--sub {
  margin-top: 5px;
  color: var(--muted, #c6b69a);
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 0.58rem;
}

.tartary-mobile-hud__title {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--gold, #f0bf68);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  font-weight: 800;
}

.tartary-mobile-hud__badge {
  flex: 0 0 auto;
  border: 1px solid rgba(240, 191, 104, 0.42);
  border-radius: 999px;
  padding: 2px 6px;
  color: #1d1208;
  background: linear-gradient(135deg, var(--gold, #f0bf68), var(--amber, #e0aa55));
  font-size: 0.52rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.tartary-mobile-action-rail {
  position: fixed;
  left: 8px;
  right: 8px;
  bottom: calc(8px + var(--tartary-mobile-safe-bottom));
  z-index: 95;
  height: var(--tartary-mobile-rail-height);
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
  padding: 6px;
  border: 1px solid rgba(240, 191, 104, 0.38);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 28%),
    rgba(7, 5, 4, 0.9);
  box-shadow: 0 -16px 44px rgba(0, 0, 0, 0.46);
  backdrop-filter: blur(5px);
}

.tartary-mobile-action {
  min-width: 0;
  min-height: 56px;
  border: 1px solid rgba(240, 191, 104, 0.34);
  border-radius: 14px;
  color: var(--text, #f5ead4);
  background: rgba(21, 12, 7, 0.92);
  display: grid;
  place-items: center;
  gap: 1px;
  font-family: var(--font-ui, Georgia, serif);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.58rem;
  font-weight: 900;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.tartary-mobile-action span {
  font-size: 1.05rem;
  line-height: 1;
}

.tartary-mobile-action strong {
  font-size: 0.56rem;
}

.tartary-mobile-action:active {
  transform: translateY(1px);
  border-color: rgba(240, 191, 104, 0.82);
  background: rgba(56, 34, 17, 0.96);
}

.tartary-mobile-action--pending {
  opacity: 0.62;
}

html.tartary-mobile-safe-shell .console-panel,
html.tartary-mobile-safe-shell .dispatch-panel {
  display: none;
}

html.tartary-mobile-safe-shell.tartary-mobile-log-open .console-panel,
body.tartary-mobile-safe-shell.tartary-mobile-log-open .console-panel {
  display: block;
  left: 8px;
  right: 8px;
  bottom: calc(var(--tartary-mobile-rail-height) + 20px + var(--tartary-mobile-safe-bottom));
  width: auto;
  height: min(42dvh, 280px);
  z-index: 94;
  opacity: 0.96;
  border-radius: 16px;
}

html.tartary-mobile-safe-shell .world-map-overlay__panel {
  width: calc(100vw - 16px);
  height: calc(100dvh - 24px - var(--tartary-mobile-safe-top) - var(--tartary-mobile-safe-bottom));
  max-width: none;
  max-height: none;
  margin: calc(8px + var(--tartary-mobile-safe-top)) 8px calc(8px + var(--tartary-mobile-safe-bottom));
  border-radius: 18px;
}

html.tartary-mobile-safe-shell .world-map-overlay__legend,
html.tartary-mobile-safe-shell .world-map-overlay__status {
  font-size: 0.62rem;
}

html.tartary-mobile-safe-shell .world-map-overlay__close,
html.tartary-mobile-safe-shell .inventory-satchel__close,
html.tartary-mobile-safe-shell .barter-ledger__close {
  min-width: 44px;
  min-height: 44px;
}

html.tartary-mobile-safe-shell .inventory-satchel {
  left: 10px;
  right: 10px;
  top: max(18px, calc(12px + var(--tartary-mobile-safe-top)));
  width: auto;
  max-width: none;
  max-height: calc(100dvh - 28px - var(--tartary-mobile-safe-top) - var(--tartary-mobile-safe-bottom));
  border-radius: 18px;
}

html.tartary-mobile-safe-shell input,
html.tartary-mobile-safe-shell textarea,
html.tartary-mobile-safe-shell select,
html.tartary-mobile-safe-shell button {
  font-size: 16px;
}

@media (max-width: 420px) {
  .tartary-mobile-hud {
    width: min(50vw, 184px);
    padding: 7px 8px;
  }

  .tartary-mobile-hud__badge {
    display: none;
  }

  html.tartary-mobile-safe-shell .tactical-hud {
    max-height: 86px;
    font-size: 0.56rem;
  }

  .tartary-mobile-action strong {
    font-size: 0.52rem;
  }
}

html.tartary-mobile-minimal-touch-ui {
  --tartary-mobile-rail-height: 64px;
}

html.tartary-mobile-minimal-touch-ui.show-asset-admission-debug .asset-admission-debug-ribbon,
html.tartary-mobile-minimal-touch-ui.landmark-sandbox-active .landmark-sandbox-ribbon,
html.tartary-mobile-minimal-touch-ui.zone-landmarks-active .zone-landmarks-ribbon {
  display: none !important;
}

/* 0I-R1 ultra-minimal UI: remove top-right mobile QA status card. */
html.tartary-mobile-minimal-touch-ui .tartary-mobile-hud,
html.tartary-mobile-minimal-touch-ui #tartaryMobileHud {
  display: none !important;
}

/* Remove leftover debug/landmark cargo banners on mobile. */
html.tartary-mobile-minimal-touch-ui body.zone-landmarks-active .tartary-viewport::before,
html.tartary-mobile-minimal-touch-ui body.zone-landmarks-active #tartaryViewport::before,
html.tartary-mobile-minimal-touch-ui body.show-asset-admission-debug .tartary-viewport::before,
html.tartary-mobile-minimal-touch-ui body.show-asset-admission-debug #tartaryViewport::before,
html.tartary-mobile-minimal-touch-ui body.landmark-sandbox-active .tartary-viewport::before,
html.tartary-mobile-minimal-touch-ui body.landmark-sandbox-active #tartaryViewport::before,
html.tartary-mobile-minimal-touch-ui body::before {
  content: none !important;
  display: none !important;
}

/* Keep the desktop tactical HUD from dominating the phone top edge.
   This does not delete data; it just reduces the mobile overlay footprint. */
html.tartary-mobile-minimal-touch-ui .tactical-hud {
  max-width: min(42vw, 340px) !important;
  max-height: 64px !important;
  opacity: 0.62 !important;
  font-size: 0.52rem !important;
  overflow: hidden !important;
}

@media (max-width: 480px) {
  html.tartary-mobile-minimal-touch-ui .tactical-hud {
    max-width: calc(100vw - 86px) !important;
    max-height: 54px !important;
    opacity: 0.58 !important;
  }
}

/* 0I-R2: stronger mobile world-map containment. */
html.tartary-mobile-minimal-touch-ui .world-map-overlay__panel {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  transform: none !important;
}

/* 0I-R3 overlay declutter:
   Mobile should feel like a game screen, not a desktop QA dashboard. */

html.tartary-mobile-minimal-touch-ui,
body.tartary-mobile-minimal-touch-ui {
  --tartary-mobile-compass-size: 52px;
}

html.tartary-mobile-minimal-touch-ui:not(.tartary-mobile-show-debug-hud) #tacticalHud,
html.tartary-mobile-minimal-touch-ui:not(.tartary-mobile-show-debug-hud) .tactical-hud {
  display: none !important;
}

html.tartary-mobile-minimal-touch-ui .tactical-label {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translate(-50%, -8px) scale(0.98) !important;
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease !important;
  pointer-events: none !important;
}

html.tartary-mobile-minimal-touch-ui.tartary-mobile-zone-label-pulse .tactical-label {
  opacity: 0.92 !important;
  visibility: visible !important;
  transform: translate(-50%, 0) scale(1) !important;
}

html.tartary-mobile-minimal-touch-ui #tacticalBanner.tactical-banner:not(.tactical-banner--off),
html.tartary-mobile-minimal-touch-ui .tactical-banner:not(.tactical-banner--off) {
  display: grid !important;
  opacity: 0.94 !important;
  z-index: 90 !important;
}

html.tartary-mobile-minimal-touch-ui #tartaryMobileAlphaBadge,
html.tartary-mobile-minimal-touch-ui .tartary-mobile-alpha-badge,
html.tartary-mobile-minimal-touch-ui #tartaryMobileHud,
html.tartary-mobile-minimal-touch-ui .tartary-mobile-hud,
html.tartary-mobile-minimal-touch-ui .tartary-mobile-pwa-badge,
html.tartary-mobile-minimal-touch-ui [data-tartary-mobile-pwa-badge] {
  display: none !important;
}

html.tartary-mobile-minimal-touch-ui .tartary-camera-compass {
  top: calc(10px + env(safe-area-inset-top, 0px)) !important;
  right: max(10px, env(safe-area-inset-right, 0px)) !important;
  left: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  width: var(--tartary-mobile-compass-size) !important;
  height: var(--tartary-mobile-compass-size) !important;
  padding: 0 !important;
  gap: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  pointer-events: none !important;
  z-index: 86 !important;
  display: grid !important;
  place-items: center !important;
}

html.tartary-mobile-minimal-touch-ui .tartary-camera-compass .compass-lines,
html.tartary-mobile-minimal-touch-ui .tartary-camera-compass .camera-lines,
html.tartary-mobile-minimal-touch-ui .tartary-camera-compass [data-compass-lines],
html.tartary-mobile-minimal-touch-ui .tartary-camera-compass > :not(.compass-rose) {
  display: none !important;
}

html.tartary-mobile-minimal-touch-ui .tartary-camera-compass .compass-rose {
  width: var(--tartary-mobile-compass-size) !important;
  height: var(--tartary-mobile-compass-size) !important;
  border-radius: 999px !important;
  border: 1px solid rgba(240, 191, 104, 0.62) !important;
  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.32),
    inset 0 0 10px rgba(0, 0, 0, 0.18) !important;
}

html.tartary-mobile-minimal-touch-ui body.show-asset-admission-debug .tartary-viewport::before,
html.tartary-mobile-minimal-touch-ui body.landmark-sandbox-active .tartary-viewport::before,
html.tartary-mobile-minimal-touch-ui body.zone-landmarks-active .tartary-viewport::before,
body.tartary-mobile-minimal-touch-ui.show-asset-admission-debug .tartary-viewport::before,
body.tartary-mobile-minimal-touch-ui.landmark-sandbox-active .tartary-viewport::before,
body.tartary-mobile-minimal-touch-ui.zone-landmarks-active .tartary-viewport::before,
body.tartary-mobile-alpha.show-asset-admission-debug .tartary-viewport::before,
body.tartary-mobile-alpha.landmark-sandbox-active .tartary-viewport::before,
body.tartary-mobile-alpha.zone-landmarks-active .tartary-viewport::before,
html.tartary-mobile-minimal-touch-ui .asset-admission-debug-ribbon,
html.tartary-mobile-minimal-touch-ui .landmark-sandbox-ribbon,
html.tartary-mobile-minimal-touch-ui .zone-landmarks-ribbon,
body.tartary-mobile-minimal-touch-ui .asset-admission-debug-ribbon,
body.tartary-mobile-minimal-touch-ui .landmark-sandbox-ribbon,
body.tartary-mobile-minimal-touch-ui .zone-landmarks-ribbon {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

html.tartary-mobile-minimal-touch-ui [class*="debug-ribbon"],
html.tartary-mobile-minimal-touch-ui [class*="landmark-ribbon"],
html.tartary-mobile-minimal-touch-ui [class*="asset-admission"] {
  display: none !important;
}

html.tartary-mobile-minimal-touch-ui .operator-menu-shell {
  top: calc(8px + env(safe-area-inset-top, 0px)) !important;
  left: max(8px, env(safe-area-inset-left, 0px)) !important;
  z-index: 84 !important;
}

@media (max-width: 480px) {
  html.tartary-mobile-minimal-touch-ui,
  body.tartary-mobile-minimal-touch-ui {
    --tartary-mobile-compass-size: 44px;
  }

  html.tartary-mobile-minimal-touch-ui .tactical-label {
    max-width: calc(100vw - 112px) !important;
    font-size: 0.60rem !important;
    padding: 4px 8px !important;
  }
}

/* 0J: mobile-only cleanup for desktop ground selection visuals.
   The actual terrain ring is a Three.js mesh and is hidden in JS. These selectors
   catch DOM/SVG/CSS remnants if a future renderer surfaces them as elements. */
html.tartary-mobile-minimal-touch-ui .terrain-selected-ring,
html.tartary-mobile-minimal-touch-ui [data-terrain-selected-ring],
html.tartary-mobile-minimal-touch-ui [data-selection-kind="terrain"],
html.tartary-mobile-minimal-touch-ui [data-tartary-ground-selection="true"] {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* 0J: mobile console title should be short and location-share friendly. */
html.tartary-mobile-minimal-touch-ui #eventsPanel .panel-bar__title[data-mobile-console-loc-title="true"] {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.86rem;
  white-space: nowrap;
}

@media (max-width: 480px) {
  html.tartary-mobile-minimal-touch-ui #eventsPanel .panel-bar__title[data-mobile-console-loc-title="true"] {
    font-size: 0.74rem;
    letter-spacing: 0.06em;
  }
}