/* CUÍCA — a folha inteira existe pra uma coisa: PRETO DE VERDADE.
   #000000 no OLED é pixel desligado — economia de bateria real, e é o
   pilar do jogo. Nada de #0a0a0a, nada de gradiente de fundo. */
* { margin: 0; padding: 0; box-sizing: border-box; }

html, body {
    width: 100%; height: 100%; overflow: hidden;
    background: #000;
    touch-action: none; user-select: none; -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
    display: flex; align-items: center; justify-content: center;
    overscroll-behavior: none;
}

#quadro {
    position: relative;
    width: min(100vw, calc(100vh * (9 / 16)));
    height: 100vh;
    max-width: 100vw; max-height: 100vh;
    background: #000; overflow: hidden; margin: auto;
}

/* sem image-rendering:pixelated aqui: o neon do jogo é curva suave,
   pixelar só serrilharia os anéis */
canvas { display: block; width: 100%; height: 100%; }

@media (min-width: 769px) {
    #quadro {
        border-left: 1px solid rgba(255, 255, 255, .06);
        border-right: 1px solid rgba(255, 255, 255, .06);
    }
}