.pong-area { max-width:700px; }
.controls { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.mode-group, .actions { display:flex; gap:8px; }
.mode.active { border-color:var(--blue); color:var(--blue); background:var(--bluewash); }
.board { display:block; width:100%; max-width:640px; aspect-ratio:8/5; margin:0 auto; border:1px solid var(--rule); background:var(--panel); }
.over-panel { max-width:340px; margin:14px auto 0; padding:24px; text-align:center; }
.over-panel h2 { margin:0; letter-spacing:-.03em; }
@media (max-width:780px) { .controls { flex-direction:column; align-items:stretch; } .mode-group, .actions { justify-content:center; } }