/* Base da pagina-host para os modais COMPARTILHADOS do hub (1.2.84).
 *
 * O deposito/saque/perfil (HubModals, #hub-modal-root) e o cadastro/login (HubAuth,
 * #hub-auth-root) sao os mesmos componentes em todos os jogos, mas dependem da base
 * que public/skills/play.css aplica a pagina de Bubble, Flappy e Block Blast (fonte,
 * cor, box-sizing, botoes e inputs). A tela do Jewels Blitz nao carrega play.css (o
 * visual do jogo e o do v0.3.1), entao o modal caia nos padroes do navegador.
 *
 * Esta folha replica SOMENTE as regras genericas do play.css, com os mesmos valores,
 * escopadas aos roots dos modais. :where() mantem a especificidade no nivel de
 * elemento, igual ao play.css: as classes de hub-modals.css continuam mandando, como
 * nas paginas dos outros jogos. Carregar ANTES de hub-modals.css. Nao vale para o jogo.
 */
:where(#hub-modal-root, #hub-auth-root) {
  --bg: #070d25; --surface: #101a3a; --line: #293961; --text: #f2f5ff; --muted: #b5bfda; --accent: #ffcf00; --ink: #111c3b;
  color-scheme: dark;
  font-family: ui-sans-serif, system-ui, sans-serif;
  color: var(--text);
}
:where(#hub-modal-root, #hub-auth-root) * { box-sizing: border-box; }
:where(#hub-modal-root, #hub-auth-root) a { color: inherit; text-decoration: none; }
:where(#hub-modal-root, #hub-auth-root) :where(button, input) { font: inherit; }
:where(#hub-modal-root, #hub-auth-root) button { cursor: pointer; }
:where(#hub-modal-root, #hub-auth-root) button:disabled { opacity: .5; cursor: not-allowed; }
:where(#hub-modal-root, #hub-auth-root) [hidden] { display: none !important; }
:where(#hub-modal-root, #hub-auth-root) :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
:where(#hub-modal-root, #hub-auth-root) :where(button, input) { border-radius: 10px; }
:where(#hub-modal-root, #hub-auth-root) button { min-height: 44px; font-weight: 700; padding: 10px 16px; border: 1px solid transparent; }
:where(#hub-modal-root, #hub-auth-root) input[type=number] { width: 100%; background: var(--bg); border: 1px solid var(--line); padding: 12px; color: var(--text); margin-top: 7px; }
:where(#hub-modal-root, #hub-auth-root) h1 { margin: 0; font-size: 32px; letter-spacing: -1px; }
:where(#hub-modal-root, #hub-auth-root) h2 { font-size: 17px; margin: 0 0 18px; }
:where(#hub-modal-root, #hub-auth-root) progress { width: 100%; height: 10px; margin-top: 18px; accent-color: var(--accent); }
@media (max-width: 760px) { :where(#hub-modal-root, #hub-auth-root) h1 { font-size: 25px; } }
@media (prefers-reduced-motion: reduce) { :where(#hub-modal-root, #hub-auth-root) * { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }
