:root{
  --bg:#0b1220;
  --fg:#e6eef8;
  --accent:#61dafb;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--fg);display:flex;align-items:center;justify-content:center;height:100vh}
.pong{width:90vw;max-width:900px;text-align:center}
.pong__header h1{margin:0 0 .25rem;font-size:1.5rem}
.hint{margin:0 0 1rem;color:#9fb3c8;font-size:.9rem}
#board{background:linear-gradient(180deg,#06101a 0%, #091822 100%);display:block;margin:0 auto;border-radius:6px;box-shadow:0 8px 30px rgba(0,0,0,.6)}
.pong__controls{margin-top:.75rem;display:flex;gap:1rem;align-items:center;justify-content:center}
button{background:var(--accent);color:#012028;border:none;padding:.5rem .75rem;border-radius:6px;cursor:pointer}
label{font-size:.9rem;color:#cfe8f6}

/* score */
.score{position:absolute;left:50%;transform:translateX(-50%);top:12px;color:var(--fg);font-weight:600}