.bowling-area { max-width:560px; }
.controls { display:flex; flex-direction:column; gap:12px; margin-bottom:10px; }
.stats { display:flex; gap:18px; color:var(--muted); font-size:14px; flex-wrap:wrap; }
.stats b { color:var(--ink); font-size:17px; }
.power { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:13px; }
.power input { flex:1; max-width:220px; accent-color:var(--blue); }
.power span { color:var(--ink); font-weight:700; min-width:22px; }
.actions { display:flex; gap:8px; }
.msg { min-height:22px; color:var(--orange); font-weight:700; font-size:14px; margin-bottom:6px; }
.scoreboard { width:100%; border-collapse:collapse; margin-bottom:12px; font:600 12px ui-monospace,monospace; }
.scoreboard th, .scoreboard td { border:1px solid var(--rule); padding:4px 2px; text-align:center; }
.scoreboard th { color:var(--muted); font-weight:600; font-size:10px; }
.scoreboard td.rolls { color:var(--ink); }
.scoreboard td.score { color:var(--blue); font-weight:700; }
.scoreboard td.active { background:var(--bluewash); }
.lane-wrap { text-align:center; }
#board { display:block; width:100%; max-width:480px; aspect-ratio:480/600; margin:0 auto; border:1px solid var(--rule); background:var(--panel); touch-action:none; }
.over-panel { max-width:360px; margin:14px auto 0; padding:24px; text-align:center; }
.over-panel h2 { margin:0 0 6px; letter-spacing:-.03em; }
.record-msg { color:var(--orange); font-weight:700; margin:0 0 6px; }
.over-panel p { color:var(--muted); font-size:14px; margin:0; }
.over-stats { display:flex; justify-content:center; gap:28px; margin:16px 0; }
.over-stats b { display:block; font-size:26px; }
.over-stats span { color:var(--muted); font-size:12px; }
@media (max-width:780px) { .controls { align-items:stretch; } .actions { justify-content:center; } }