/* Space 2047 HD Edition v5.12.13 — joystick-only mobile screen + information drawer */

/* Remove the minimap and every on-screen control cluster except the joystick. */
#s2047-minimap-wrap,
.s2047-minimap-wrap,
.s2047-action-cluster,
.s2047-help,
.s2047-hud .s2047-actions,
.s2047-command-interface,
.s2047-interaction-radar,
.s2047-hazard-beacon,
.s2047-feedback-caption,
#s2047-combat-hud,
.s2047-combat-hud,
.s2047-combo-hud,
.s2047-diagnostic-attention,
[id*="diagnostic-attention"],
[class*="diagnostic-attention"] {
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* The old title/status box is represented in the drawer instead of the game view. */
.s2047-hud,
.s2047-status {
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Keep only the joystick operational and above the world canvas. */
.s2047-joystick-zone {
  display:grid!important;
  visibility:visible!important;
  pointer-events:auto!important;
  z-index:30!important;
}
#s2047-joystick { pointer-events:auto!important; }

/* One drawer shell. */
#s2047-info-drawer-v51213 {
  position:fixed;
  inset:0;
  z-index:2147483646;
  pointer-events:none;
  font-family:inherit;
}
#s2047-info-drawer-v51213 * { box-sizing:border-box; }

.s2047-info-drawer-launcher {
  pointer-events:auto;
  position:fixed;
  top:max(10px,env(safe-area-inset-top));
  right:max(10px,env(safe-area-inset-right));
  z-index:4;
  min-width:64px;
  min-height:46px;
  padding:10px 12px;
  border:1px solid rgba(143,232,255,.82);
  border-radius:12px;
  background:#071827;
  color:#fff;
  font:800 14px/1 inherit;
  letter-spacing:.08em;
  box-shadow:0 8px 24px rgba(0,0,0,.55);
  touch-action:manipulation;
}

.s2047-info-drawer-shade {
  display:none;
  pointer-events:auto;
  position:fixed;
  inset:0;
  z-index:1;
  padding:0;
  border:0;
  background:rgba(0,5,12,.62);
}
#s2047-info-drawer-v51213[data-open="1"] .s2047-info-drawer-shade { display:block; }

.s2047-info-drawer-panel {
  pointer-events:auto;
  position:fixed;
  z-index:2;
  top:0;
  right:0;
  bottom:0;
  width:min(460px,92vw);
  height:100vh;
  height:100dvh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:#071827;
  color:#eef8ff;
  border-left:1px solid #4ba9ca;
  box-shadow:-14px 0 42px rgba(0,0,0,.82);
  transform:translateX(105%);
  transition:transform .2s ease;
}
#s2047-info-drawer-v51213[data-open="1"] .s2047-info-drawer-panel { transform:translateX(0); }

.s2047-info-drawer-panel>header {
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:max(12px,env(safe-area-inset-top)) 14px 10px;
  border-bottom:1px solid #28566c;
  background:#0a2234;
}
.s2047-info-drawer-panel small { display:block;color:#7eddf8;font-size:10px;letter-spacing:.16em; }
.s2047-info-drawer-panel h2 { margin:2px 0 0;font-size:20px; }
.s2047-info-drawer-close {
  width:46px;
  height:46px;
  padding:0;
  border:0;
  background:transparent;
  color:#fff;
  font:400 34px/1 inherit;
  touch-action:manipulation;
}

.s2047-info-drawer-scroll {
  flex:1 1 auto;
  min-height:0;
  overflow-y:scroll;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
  touch-action:pan-y;
  scrollbar-gutter:stable;
  scrollbar-width:auto;
  padding:8px 18px 16px;
}
.s2047-info-drawer-scroll::-webkit-scrollbar { width:14px; }
.s2047-info-drawer-scroll::-webkit-scrollbar-track { background:#03101b; }
.s2047-info-drawer-scroll::-webkit-scrollbar-thumb { background:#4ba9ca;border:3px solid #03101b;border-radius:10px; }

.s2047-info-drawer-content section { margin:0;padding:15px 0;border-bottom:1px solid #24485a; }
.s2047-info-drawer-content section:last-child { border-bottom:0; }
.s2047-info-drawer-content h3 { margin:0 0 8px;color:#8fe8ff;font-size:16px;line-height:1.35; }
.s2047-info-drawer-content ul { list-style:none;margin:0;padding:0; }
.s2047-info-drawer-content li { margin:0;padding:4px 0;color:#eef8ff;font-size:14px;line-height:1.45;overflow-wrap:anywhere; }
.s2047-info-drawer-content>p { margin:18px 0;line-height:1.5; }

.s2047-info-drawer-arrows {
  flex:0 0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  padding:0 0 max(0px,env(safe-area-inset-bottom));
  border-top:1px solid #28566c;
  background:#28566c;
}
.s2047-info-drawer-arrows button {
  min-height:54px;
  padding:10px;
  border:0;
  background:#0a2234;
  color:#fff;
  font-size:24px;
  font-weight:900;
  touch-action:manipulation;
}
.s2047-info-drawer-arrows button:active { background:#123b55; }

/* Keep all original information boxes hidden; their text is copied into the drawer. */
.s2047-panel,
[id^="s2047-"][id$="-monitor"],
[id^="s2047-"][id$="-panel"],
[id^="s2047-"][id$="-launcher"],
[id^="s2047-"][id$="-launch"],
[class*="s2047-"][class*="-monitor"],
[class*="s2047-"][class*="-panel"] {
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Do not hide the new drawer when broad legacy selectors are present. */
#s2047-info-drawer-v51213,
#s2047-info-drawer-v51213 * {
  visibility:visible!important;
}

@media(max-width:720px) {
  .s2047-info-drawer-panel { width:100vw;max-width:none;border-left:0; }
  .s2047-info-drawer-launcher { top:max(7px,env(safe-area-inset-top));right:max(7px,env(safe-area-inset-right)); }
  .s2047-info-drawer-scroll { padding-left:15px;padding-right:15px; }
  .s2047-joystick-zone { left:4px!important;bottom:max(4px,env(safe-area-inset-bottom))!important; }
}
@media(prefers-reduced-motion:reduce) { .s2047-info-drawer-panel { transition:none; } }

/* Restore interaction after the broad legacy panel-hiding rule. */
#s2047-info-drawer-v51213 .s2047-info-drawer-panel,
#s2047-info-drawer-v51213 .s2047-info-drawer-panel *,
#s2047-info-drawer-v51213 .s2047-info-drawer-launcher,
#s2047-info-drawer-v51213 .s2047-info-drawer-shade {
  pointer-events:auto!important;
}

/* v5.12.16 — hamburger information and options menu. */
.s2047-info-drawer-launcher {
  min-width:62px!important;
  min-height:58px!important;
  padding:8px 10px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
}
.s2047-hamburger-lines { display:grid;gap:4px;width:28px; }
.s2047-hamburger-lines i { display:block;width:28px;height:3px;border-radius:3px;background:currentColor; }
.s2047-info-drawer-launcher b { font-size:10px;line-height:1;letter-spacing:.1em;text-transform:uppercase; }
.s2047-info-drawer-options { display:grid;gap:7px;margin-top:10px; }
.s2047-info-drawer-options button {
  width:100%;
  min-height:44px;
  padding:10px 12px;
  border:1px solid #315d70;
  border-radius:8px;
  background:#0b2638;
  color:#f4fbff;
  text-align:left;
  font-weight:700;
  line-height:1.3;
  touch-action:manipulation;
}
.s2047-info-drawer-options button:active,
.s2047-info-drawer-options button:focus-visible { background:#123b55;outline:2px solid #8fe8ff;outline-offset:1px; }
