.game-section{padding:110px 0 100px;border-top:1px solid var(--line)}
.game-heading{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:end;margin:35px 0 42px}
.game-heading h2{font-size:clamp(64px,8.6vw,140px);font-weight:400;line-height:.92;letter-spacing:-.075em;margin:0}
.game-heading h2 span{color:var(--accent)}
.game-intro{max-width:330px;justify-self:end;font-size:18px;line-height:1.5;margin:0 0 5px}
.pong{position:relative;background:var(--ink);color:var(--paper)}
.pong-topline{display:flex;justify-content:space-between;padding:22px 28px 0;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#b5b8b1}
.pong-topline span:first-child::before{content:'';display:inline-block;width:7px;height:7px;background:var(--accent);margin-right:9px}
.pong-court{position:relative;aspect-ratio:16/9;margin:0 12%;outline:none}
.pong-court:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.pong-court canvas{display:block;width:100%;height:100%;touch-action:pan-y}
.pong[data-state=playing] canvas{touch-action:none;cursor:none}
.pong-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(22,24,23,.90);text-align:center;padding:24px}
.pong-message{font-size:clamp(28px,4vw,60px);font-weight:400;line-height:1.08;letter-spacing:-.045em;margin:0 0 14px}
.pong-detail{font-size:13px;color:#b5b8b1;line-height:1.5;margin:0 0 28px}
.pong-start{border:0;background:var(--paper);color:var(--ink);padding:15px 26px;min-width:148px;min-height:48px;font:inherit;font-size:15px;cursor:pointer}
.pong-start:hover{background:var(--accent);color:white}
.pong-start:focus-visible,.pong-actions button:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.pong-score-labels{position:absolute;top:27%;left:27%;right:27%;display:flex;justify-content:space-between;pointer-events:none;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#b5b8b1}
.pong-score-labels span:first-child{color:#ff7057}
.pong-bottomline{border-top:1px solid #3a3d38;margin:0 28px;padding:20px 0;display:flex;gap:20px;justify-content:space-between;align-items:center}
.pong-instructions{font-size:12px;color:#b5b8b1;line-height:1.65;margin:0}
.pong-instructions kbd{font:inherit;color:var(--paper)}
.pong-touch-hint{display:none}
.pong-actions{display:flex;gap:24px;flex-shrink:0}
.pong-actions button{font:inherit;font-size:12px;min-height:34px;border:0;border-bottom:1px solid #6c7068;padding:4px 0;color:var(--paper);background:none;cursor:pointer}
.pong-actions button:disabled{opacity:.35;cursor:default}
.pong-sound::before{content:'';display:inline-block;width:5px;height:5px;margin-right:7px;background:#6c7068}
.pong-sound[aria-pressed=true]::before{background:var(--accent)}
.pong-status{font-size:12px;color:var(--muted);display:flex;justify-content:space-between;margin-top:15px;gap:20px}
.pong-status p{margin:0}
@media(pointer:coarse){.pong-key-hint{display:none}.pong-touch-hint{display:inline}}
@media(max-width:800px){.game-section{padding:75px 0}.game-heading{grid-template-columns:1fr;gap:25px}.game-intro{justify-self:start;max-width:340px;font-size:16px}.pong-court{margin:0 5%}.pong-topline{padding:20px 20px 0}.pong-bottomline{margin:0 20px}.pong-actions{gap:18px}}
@media(max-width:600px){.game-heading h2{font-size:clamp(58px,15.5vw,88px)}.game-heading{margin:28px 0 32px}.pong-court{aspect-ratio:1/1.05;margin:8px 10px 0}.pong-topline{font-size:9px;padding:20px 15px 0}.pong-bottomline{margin:0 16px;align-items:flex-start;flex-direction:column;gap:10px;padding:15px 0}.pong-actions{width:100%;justify-content:space-between}.pong-detail{max-width:220px}.pong-score-labels{top:17%;left:27%;right:25%}.pong-status{font-size:10px}.pong-overlay{padding:14px}}

.pong-actions button{min-width:44px;min-height:44px;padding:10px 4px;touch-action:manipulation}
@media(max-width:600px){.pong-actions{gap:12px}.pong-actions button{font-size:13px}}
