/* Each side owns a disjoint column. Flow, rather than guessed pixel offsets,
   reserves space even while a status is fading. Crowded stacks can scroll. */
body.faunara-game #faunaraHud.fa-hud-flow {
  inset: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right))
    max(12px, env(safe-area-inset-bottom), var(--fa-touch-reserve, 0px)) max(12px, env(safe-area-inset-left));
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  z-index: 52;
}
.fa-hud-column { display:flex; flex-direction:column; gap:12px; min-width:0; min-height:0; }
.fa-hud-stack {
  display:flex; flex-direction:column; align-items:flex-start; gap:12px;
  min-width:0; min-height:0; max-width:100%; padding:5px;
  overflow:auto; overscroll-behavior:contain; scrollbar-width:thin;
  pointer-events:auto; align-self:flex-start; flex:0 1 auto;
}
.fa-hud-right .fa-hud-stack { align-items:flex-end; align-self:flex-end; }
.fa-hud-bottom { margin-top:auto; }
.fa-hud-stack:empty { display:none; }
/* Specificity intentionally wins over legacy device rules and inline offsets. */
body.faunara-game #faunaraHud .fa-hud-stack > .fa-hud-item {
  position:relative !important; inset:auto !important; transform:none !important;
  flex-shrink:0; min-width:0 !important; max-width:100% !important;
  margin:0; overflow-wrap:anywhere; white-space:normal;
}
body.faunara-game #faunaraHud .fa-hud-item:is([hidden], .hidden) { display:none !important; }
body.faunara-game #faunaraHud .player-vitals { flex-wrap:wrap; letter-spacing:.06em; }
body.faunara-game #faunaraHud .berry-slots { flex-wrap:wrap; justify-content:flex-end; pointer-events:auto; }
body.faunara-game #faunaraHud .trainer-stamina { width:min(240px, 100%); }
.trainer-stamina label[hidden] { display:none !important; }
#playerHearts[hidden] { display:none !important; }
.trainer-stamina progress { min-width:0; max-width:55%; }
body.faunara-game #faunaraHud .faunara-contextual-hud { width:min(440px, 100%) !important; }
.fa-hud-stack .faunara-contextual-hud:has(> :not([hidden])) { display:flex; flex-direction:column; gap:8px; }
.fa-hud-stack .faunara-contextual-hud:not(:has(> :not([hidden]))) { display:none; }
.fa-hud-stack .faunara-cube-bar, .fa-hud-stack .faunara-hud-actions { flex-wrap:wrap; }
.fa-hud-stack .fa-team-slots { flex-wrap:wrap; }
.fa-hud-stack .fa-battle-team label { flex-wrap:wrap; }
.fa-hud-stack .fa-battle-team select { min-width:0; max-width:100%; }
/* Hit feedback joins notifications; animation never crosses a sibling's box. */
#faunaraHud .fa-hud-stack #hitPop:not(.show) { display:none; }
#faunaraHud .fa-hud-stack #hitPop.show { animation:faHudHit .32s ease-out; }
@keyframes faHudHit { 0%,100% { opacity:0; } 30%,70% { opacity:1; } }
@media (max-width:600px) and (orientation:portrait) {
  body.faunara-game #faunaraHud.fa-hud-flow { display:flex; flex-direction:column; gap:12px; overflow:auto; pointer-events:none; padding:5px; }
  .fa-hud-column { flex:none; display:contents; }
  .fa-hud-stack { flex:none; overflow:visible; width:100%; padding:0; }
  .fa-hud-right .fa-hud-stack { align-items:flex-start; align-self:stretch; }
  .fa-hud-right .fa-hud-top { order:-1; }
  .fa-hud-bottom { margin-top:0; }
  .fa-hud-right .fa-hud-bottom { order:1; }
}