/* Brain Quiz — edge-device/accessibility polish. Broadcast-studio identity remains in style.css. */
.game-bar{
  padding-left:max(12px,env(safe-area-inset-left));
  padding-right:max(12px,env(safe-area-inset-right));
  padding-top:max(6px,env(safe-area-inset-top));
}
.screen{
  padding-left:max(18px,env(safe-area-inset-left));
  padding-right:max(18px,env(safe-area-inset-right));
  padding-bottom:max(18px,env(safe-area-inset-bottom));
}
.hud{
  padding-left:max(12px,env(safe-area-inset-left));
  padding-right:max(12px,env(safe-area-inset-right));
}
.quiz{
  left:max(12px,env(safe-area-inset-left));
  right:max(12px,env(safe-area-inset-right));
  bottom:max(12px,env(safe-area-inset-bottom));
}
.icon-btn,.hud-btn,.menu-actions button,.q-answers button,.q-lifelines button{min-width:44px;min-height:44px}
.back-link:focus-visible,.icon-btn:focus-visible,.hud-btn:focus-visible,.q-answers button:focus-visible,.q-lifelines button:focus-visible{
  outline:3px solid #ffd24a;
  outline-offset:3px;
}
#screen-how .panel,#screen-leaderboard .panel,#screen-pause .panel,#screen-gameover .panel{
  max-height:calc(100dvh - 72px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  overflow:auto;
  overscroll-behavior:contain;
}

@media(max-width:430px){
  .game-bar{gap:.4rem}
  .game-bar-title{font-size:.72rem;letter-spacing:.06em}
  .hud-top{gap:5px}
  .hud-chip{padding:.28rem .4rem}
  .q-lifelines{gap:6px}
  .q-lifelines button{padding:.45rem .5rem;font-size:.7rem}
}

@media(max-height:560px) and (orientation:landscape){
  .quiz{top:max(8px,env(safe-area-inset-top));bottom:max(8px,env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain}
  .q-text{font-size:clamp(1rem,3.5vw,1.45rem);margin-block:6px}
  .q-answers{gap:6px}
  .q-answers button{min-height:44px;padding:.45rem .7rem}
  .q-lifelines{margin-top:6px}
  #screen-menu .panel{max-height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
}

@media(prefers-reduced-motion:reduce){
  .quiz *, .hud *, .screen *{scroll-behavior:auto!important}
  .q-timerbar i,.toast,.countdown{transition:none!important;animation:none!important}
}