/* O1 entry and opening fight. Keep the established menu and HUD IDs. */
.flow-play .onboarding-session { margin-bottom: 10px !important; }
.flow-play > .flow-selects { margin-bottom: 14px; }
.flow-play > .flow-room { margin: 0 0 14px; }
.flow-play > .flow-room[hidden] { display: none; }
.flow-play > .entry-quality { margin-top: 12px !important; }
#flow-preview-badge { color: #ffe0a0; border-color: #ffe0a0; }
#lock-overlay #play-button { letter-spacing: .08em; }
@media (max-width: 1023.98px) and (min-aspect-ratio: 13/10) {
  .flow-play { display: grid; grid-template-columns: minmax(145px,.7fr) minmax(0,2fr); gap: 8px; }
  .flow-play > .onboarding-session, .flow-play > .flow-selects { margin: 0 !important; }
  .flow-play > :is(.flow-room,.flow-map-card,.entry-quality) { grid-column: 1 / -1; }
  .flow-selects .mode-hint { display: none; }
}

.touch-coach {
  position: fixed; z-index: 35; pointer-events: none; max-width: 190px;
  padding: 5px 7px; border-left: 2px solid #d1e59d; border-radius: 3px;
  background: #101a13ed; color: #f2f6e6; font: 600 11px/16px system-ui;
}
.touch-coach[hidden] { display: none; }
/* The combat-height band belongs to targets. Vitals and ammunition stay on
   opposite top edges; secondary information is available in Kit / pause. */
@media (max-width: 1023.98px) {
  html.touch-controls #hud-stack [data-hud-slot="navigation"] { display: none; }
  html.touch-controls #hud-stack :is([data-hud-slot="vitals"],[data-hud-slot="weapon"]) {
    position: fixed; top: calc(var(--safe-top) + 8px); bottom: auto;
    width: min(22vw,160px); max-height: none; padding: 5px 6px; gap: 3px;
  }
  html.touch-controls #hud-stack [data-hud-slot="vitals"] { left: calc(var(--safe-left) + 8px); }
  html.touch-controls #hud-stack [data-hud-slot="weapon"] { right: calc(var(--safe-right) + 62px); display: grid; grid-template-columns: 1fr; }
  html.touch-controls #hud-stack .ammo-readout strong { font-size: 24px; }
  html.touch-controls #hud-stack .ammo-readout { gap: 5px; }
  html.touch-controls #hud-stack :is(#progression-counter,#ability-hud,#killstreak-counter,.streak-track,.hud-equipment,#reload-status,#round-time) { display: none; }
  html.touch-controls #hud-stack [data-hud-slot="objective"] { position: fixed; top: calc(var(--safe-top) + 8px); left: calc(var(--safe-left) + min(22vw,160px) + 20px); width: calc(100vw - 2 * min(22vw,160px) - 92px); max-width: none; }
  html.touch-controls #hud-stack #war-objective { grid-template-columns: minmax(0,1fr); grid-template-rows: 16px 14px 3px; height: 44px; }
  html.touch-controls #hud-stack #war-objective-state { grid-column: 1; grid-row: 2; font-size: 10px; }
  html.touch-controls #hud-stack #war-objective-bar { grid-row: 3; }
  html.touch-controls #hud-stack :is(#war-objective-meta,#war-objective-brief) { display: none; }
  html.touch-controls #hud-stack [data-hud-slot="match"] { width: 48px; }
  html.touch-controls #hud-stack #weapon-counter { font-size: 11px; }
  html.touch-controls #hud-stack #touch-pause { width: 48px; height: 48px; }
}
@media (max-width: 1023.98px) and (max-aspect-ratio: 13/10) {
  html.touch-controls #hud-stack [data-hud-slot="objective"] { position: fixed; top: calc(var(--safe-top) + 78px); left: 22vw; width: 56vw; }
  html.touch-controls #hud-stack #hud-toasts { top: calc(var(--safe-top) + 128px); }
  html.touch-controls #hud-stack .hud-feedback [data-hud-slot="prompts"] { top: calc(var(--safe-top) + 172px); }
  html.touch-controls #hud-stack [data-hud-slot="weapon"] { width: 32vw; }
  html.touch-controls #hud-stack [data-hud-slot="vitals"] { width: 120px; }
}

/* O2: controls occupy the upper HUD reserve, outside aim and thumb regions. */
#hud-stack #controls-help { display: none !important; }
#onboarding-checklist { position: fixed; top: 92px; left: calc(12vw + 14px);
  width: calc(22vw - 42px); display: grid; gap: 3px; pointer-events: none; z-index: 36; }
#onboarding-checklist > div { width: fit-content; max-width: 100%; box-sizing: border-box;
  padding: 3px 7px; border-left: 2px solid #cee59d; background: #101a13ed; color: #f2f6e6;
  font: 600 11px/15px system-ui; border-radius: 3px; }
#onboarding-checklist #coach-enemy { border-color: #ffa884; color: #ffd3ad; }
#onboarding-checklist #coach-cover { border-color: #ffa884; }
#onboarding-checklist [hidden], #onboarding-checklist[hidden], #first-death-direction[hidden] { display: none !important; }
#personal-xp-ticker { position: fixed; left: calc(50% + 108px); top: calc(50% - 28px);
  width: 190px; display: grid; gap: 3px; pointer-events: none; z-index: 38; }
#personal-xp-ticker > div { font: 700 12px/16px system-ui; color: #e4f4bc; padding: 3px 6px;
  background: #142016dd; border-left: 2px solid #d1e59d; border-radius: 3px; }
#first-death-direction { position: fixed; z-index: 151; top: 90px; left: 50%; transform: translateX(-50%);
  margin: 0; padding: 8px 12px; max-width: calc(100vw - 32px); width: max-content;
  background: #1c211eed; color: #fff1cd; font: 600 14px/20px system-ui; pointer-events: none; }
@media (max-width: 1023.98px) and (max-aspect-ratio: 13/10) {
  /* Portrait: the caption layer (prompts slot, top 172px) may stack lines; cap it to two lines here and start the
     checklist below its two-line extent so hints and captions never share pixels (idle gate found caption-layer vs
     coach-move/-ads/-cover overlaps at 218px). */
  #caption-layer .caption-line:nth-child(n+3) { display: none !important; }
  #onboarding-checklist { top: 246px; left: 12px; width: calc(100vw - 24px); gap: 2px; }
  #onboarding-checklist > div { font-size: 10px; line-height: 13px; padding: 1px 6px; }
  #personal-xp-ticker { width: calc(50vw - 116px); }
  #personal-xp-ticker > div { font-size: 10px; line-height: 13px; padding: 3px; overflow-wrap: anywhere; }
  #first-death-direction { font-size: 12px; }
}
@media (max-width: 1023.98px) and (min-aspect-ratio: 13/10) {
  #onboarding-checklist { top: 66px; left: 12px; transform: none; width: 275px; gap: 2px; }
  #onboarding-checklist > div { font-size: 10px; line-height: 12px; padding: 2px 5px; }
  #personal-xp-ticker { left: auto; right: 8px; top: 66px; width: 148px; }
  /* MP4 owns the left session reserve; O2 hints use the space alongside it. */
  html.touch-controls:has(#mp-status) #onboarding-checklist {
    left: calc(var(--safe-left) + 270px);
    width: min(275px, calc(100vw - var(--safe-left) - var(--safe-right) - 436px));
  }
}

#first-enemy-edge { position: fixed; top: 42%; pointer-events: none; z-index: 37; }
#first-enemy-edge > div { padding: 3px 6px; border-left: 2px solid #ffa884; background: #201813ed;
  color: #ffd3ad; font: 700 10px/14px system-ui; }
#first-enemy-edge[hidden] { display: none !important; }

#round-end-panel #personal-xp-ticker { position: static; width: auto; display: flex; flex-wrap: wrap; margin: 10px 0; }
#round-end-panel #personal-xp-ticker > div { font-size: 11px; line-height: 15px; }
