/* Ajustes compartilhados para celular, tablet, computador e telão. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { min-width: 0; min-height: 100svh; }
img, video, canvas { max-width: 100%; }
input, select, textarea { max-width: 100%; }
button, a, p, h1, h2, h3, h4, label, li { overflow-wrap: anywhere; }
button, select, input:not([type="checkbox"]):not([type="radio"]) { min-height: 44px; }
button { white-space: normal; }
main, section, article, aside, .content, .panel-stack,
.layout, .shell, .container, .card, .panel { min-width: 0; }
@media (max-width: 1024px) {
 body.host-large-mode .app { width: 100%; padding: 18px 16px 28px; }
 body.host-large-mode .monitor-grid { grid-template-columns: minmax(0, 1fr); }
 body.host-large-mode .topbar-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .topbar-title, .summary-chip, .quick-card, .quiz-list-main,
 .rank-main, .player-main, .admin-content, .room-list { min-width: 0; }
}
@media (max-width: 600px) {
 input, select, textarea { font-size: 16px !important; }
 body.host-large-mode .app { padding: 12px 10px 24px; }
 body.host-large-mode .topbar,
 body.host-large-mode .hero,
 body.host-large-mode .panel,
 body.host-large-mode .menu-section,
 body.host-large-mode .team-config-shell { padding: 16px; }
 body.host-large-mode .topbar-title h1,
 body.host-large-mode .hero-main h2,
 body.host-large-mode .panel h2 { font-size: clamp(24px, 7vw, 32px); }
 body.host-large-mode .topbar-title p,
 body.host-large-mode .panel-header p,
 body.host-large-mode .panel-note,
 body.host-large-mode #quizStatus,
 body.host-large-mode #status { font-size: 15px; }
 .menu-row, .match-controls-body, .match-primary-actions, .match-secondary-actions,
 .quiz-toolbar, .room-switcher, .monitor-filters, .quiz-list-toolbar,
 .toolbar-grid, .admin-filters, .filters-grid { grid-template-columns: minmax(0, 1fr); }
 .match-flow { border-right: 0; padding-right: 0; }
 .match-controls-heading, .match-controls-footer,
 .quiz-manager-head, .panel-header { flex-wrap: wrap; }
 .match-controls-footer { flex-direction: column; align-items: stretch; }
 .quiz-stats, .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
 .quiz-list-main { min-width: 0; flex-basis: 100%; }
 .quiz-list-actions { width: 100%; justify-content: stretch; }
 .quiz-list-actions button { flex: 1 1 130px; }
 .pin-number-wrap { flex-wrap: wrap; }
 .pin-display strong { font-size: clamp(25px, 9vw, 38px) !important; }
 .fullscreen-btn { bottom: calc(10px + env(safe-area-inset-bottom)); right: calc(10px + env(safe-area-inset-right)); }
 body.correcao-visivel #justificativaBox { max-height: none; padding: 16px; }
}
@media (max-width: 360px) {
 .quiz-stats, .hero-grid, .mini-summary { grid-template-columns: minmax(0, 1fr); }
 .summary-chip { padding: 10px !important; }
 .match-mode-badge { white-space: normal; }
}
@media (max-height: 520px) and (orientation: landscape) {
 .topbar { position: static; }
 body, body.player-game-active { overflow-y: auto; }
 #telaLogin, .play-main, #rankingBox, #fimJogoJogador { height: auto; max-height: none; }
}

/* Mantém a pergunta próxima aos controles no celular. */
@media (max-width: 600px) {
 body.player-game-active .play-top,
 body.player-game-active .player-insight { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
 body.player-game-active .play-top .mini-card:last-child { grid-column: 1 / -1; }
 body.player-game-active .mini-card,
 body.player-game-active .insight-card { min-width: 0; padding: 8px 10px; }
 body.player-game-active .mini-card span,
 body.player-game-active .insight-card span { font-size: 15px; }
 body.player-game-active .play-tools { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
 body.player-game-active .countdown-badge { grid-column: 1 / -1; margin: 0; width: 100%; }
 body.host-large-mode .performance-panel { min-height: 0; }
}

@media (max-width: 600px) {
 #fimJogoJogador {
  inset: 0;
  border-radius: 0;
  background: #081127;
  padding: calc(16px + env(safe-area-inset-top)) 16px calc(24px + env(safe-area-inset-bottom));
  overscroll-behavior: contain;
 }
 .final-shell h2 { font-size: clamp(24px, 7vw, 32px); line-height: 1.15; }
 .final-podio-card { min-height: 0; padding: 16px; }
 .final-podio-card strong, .final-card span { font-size: 22px; }
}