#screen-game { padding: 0; }
.game-stage {
  position: relative; width: 100%; height: 100%;
  display: flex; flex-direction: column;
}
.hud-top {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  background: linear-gradient(180deg, rgba(10,8,6,0.92), rgba(10,8,6,0.6));
  border-bottom: 1px solid var(--panel-border);
  flex-wrap: wrap; z-index: 3;
}
.hud-chip { display: flex; align-items: center; gap: 5px; font-weight: 700; font-size: .85rem; color: var(--gold-bright); background: rgba(0,0,0,0.35); padding: 5px 9px; border-radius: 6px; white-space: nowrap; }
.hud-hp { flex: 1 1 160px; min-width: 120px; display: flex; align-items: center; gap: 6px; }
.hud-hp-bar { flex: 1; height: 14px; background: rgba(0,0,0,0.5); border-radius: 7px; overflow: hidden; border: 1px solid rgba(255,255,255,0.15); }
.hud-hp-fill { height: 100%; background: #5fae4a; transition: width .2s; }
.hud-hp-text { font-size: .72rem; color: #e8e2d0; white-space: nowrap; }
.hud-icons { display: flex; gap: 6px; margin-left: auto; }
.icon-btn { width: 34px; height: 34px; border-radius: 50%; background: rgba(0,0,0,0.4); border: 1px solid var(--panel-border); font-size: 1rem; display: flex; align-items: center; justify-content: center; }

.canvas-wrap { position: relative; flex: 1; min-height: 0; touch-action: none; background: #000; }
#game-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

#boss-bar-wrap { position: absolute; top: 8px; left: 50%; transform: translateX(-50%); width: min(420px, 84vw); text-align: center; z-index: 4; }
#boss-name { color: #ff8a8a; font-weight: 700; font-size: .8rem; letter-spacing: 1px; text-shadow: 0 0 8px rgba(200,30,30,0.8); }
.boss-hp-bar { height: 16px; background: rgba(0,0,0,0.6); border: 1px solid #8a1f2b; border-radius: 8px; overflow: hidden; margin-top: 3px; }
#boss-hp-fill { height: 100%; background: linear-gradient(90deg, #8a1f2b, #ff5a5a); transition: width .2s; }

#wave-banner { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: rgba(0,0,0,0.55); z-index: 6; text-align: center; }
#wave-banner-title { font-size: 1.8rem; color: var(--gold-bright); letter-spacing: 2px; }
#wave-banner-enemies { color: #d8cdb4; font-size: .85rem; max-width: 80vw; }
#wave-banner-countdown { font-size: 3.2rem; color: #fff; font-weight: 700; text-shadow: 0 0 16px rgba(255,200,80,0.7); }

.bottom-bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: center; padding: 10px; background: rgba(10,8,6,0.85); border-top: 1px solid var(--panel-border); z-index: 3; }
.auto-toggle { display: flex; align-items: center; gap: 6px; font-size: .75rem; color: #b8a888; }
#btn-start-wave { padding: 10px 22px; font-size: .95rem; }
#btn-start-wave:disabled { opacity: .4; }

@media (max-height: 460px) and (orientation: landscape) {
  .hud-top { padding: 5px 8px; gap: 6px; }
  .hud-chip { font-size: .72rem; padding: 3px 6px; }
  .icon-btn { width: 28px; height: 28px; }
  .bottom-bar { padding: 5px; }
  #btn-start-wave { padding: 7px 16px; font-size: .8rem; }
}

body.in-game .site-header, body.in-game .site-footer, body.in-game .seo-content, body.in-game .ad-slot { display: none; }
