/* ==========================================================================
   JOGOSRÁPIDOS — pongball.css
   ========================================================================== */
.pongball-jogo { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; width: 100%; }
.pongball-placar { display: flex; align-items: center; gap: 1rem; justify-content: center; }
.pongball-placar__lado { display: flex; flex-direction: column; align-items: center; }
.pongball-placar__nome { font-size: 0.75rem; color: var(--smoke); text-transform: uppercase; letter-spacing: 0.1em; }
.pongball-placar__pontos { font-family: var(--font-title); font-weight: 700; font-size: clamp(2rem, 6vw, 2.75rem); color: var(--snow); line-height: 1; }
.pongball-placar__vs { font-size: 1.25rem; color: var(--steel); font-weight: 600; }
.pongball-arena { position: relative; width: 100%; max-width: 600px; aspect-ratio: 16/10; border-radius: 0.75rem; overflow: hidden; border: 2px solid var(--graphite); }
.pongball-arena canvas { display: block; width: 100%; height: 100%; }
.pongball-acoes { margin-top: 0.25rem; }
.pongball-modal { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; }
.pongball-modal__fundo { position: absolute; inset: 0; background: rgba(0,0,0,0.7); }
.pongball-modal__corpo { position: relative; background: var(--graphite); border-radius: 1rem; padding: 1.5rem; max-width: 320px; width: 90%; text-align: center; z-index: 1; display: flex; flex-direction: column; gap: 0.75rem; }
.pongball-fim-icone { font-size: 3rem; color: var(--yellow); }
.pongball-fim-titulo { font-family: var(--font-title); font-size: 1.5rem; margin: 0; color: var(--snow); }
.pongball-fim-placar { font-size: 2rem; font-weight: 700; color: var(--yellow); margin: 0; }