[hidden]{display:none!important}
.wrap{max-width:820px}.stage{padding:16px}
.turnbar{--tb-msg-lines:2;--tb-st-lines:1;--tb-rt:0;--tb-st-rt:0;margin-bottom:10px}
.turnbar .message{font-size:16px;line-height:24px;height:48px;min-height:48px;margin:0;overflow-wrap:anywhere}.turnbar .status{font-variant-numeric:tabular-nums}
.play-area{max-width:620px;margin:auto}.primary{max-width:320px;display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.primary .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;flex:1;padding:8px 12px}.primary #drop{flex:1.5;font-weight:700}
.primary .btn svg{display:inline-block;flex-shrink:0;width:19px;height:19px;vertical-align:-4px;margin-right:6px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.board-row{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:20px;align-items:start}.board-shell{position:relative;width:100%;max-width:min(320px,max(240px,calc((100svh - 260px) * .58)));margin:auto;aspect-ratio:360/620}
#table{width:100%;height:auto;display:block;border-radius:10px;touch-action:pan-y;cursor:pointer}
.ramp-hit{position:absolute;width:44px;height:44px;min-width:44px;min-height:44px;transform:translate(-50%,-50%);border:2px solid var(--accent);border-radius:50%;background:var(--surface);color:var(--accent);font:700 18px var(--font);padding:0;box-shadow:var(--shadow-piece);cursor:pointer;touch-action:manipulation}
.ramp-hit[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:3px}.ramp-hit:hover{background:var(--bg)}.ramp-hit:focus-visible{outline:3px solid var(--ink);outline-offset:4px}.ramp-hit:active{transform:translate(-50%,-50%) scale(.95)}
.board-shell.locked .ramp-hit{border-color:var(--ink-sub);color:var(--ink-sub);outline:none;cursor:default;box-shadow:none}
.board-shell[data-feedback=success]{outline:3px solid var(--ok);outline-offset:3px;border-radius:10px}.board-shell[data-feedback=miss],.board-shell[data-feedback=timeout]{outline:3px solid var(--ng);outline-offset:3px;border-radius:10px}
.board-note{color:var(--ink-sub);font-size:14px;margin:0 0 12px}.support{min-width:0}.support details{border-bottom:1px solid var(--line);padding:8px 0}.support summary{cursor:pointer;font-weight:600;font-size:16px;min-height:36px;line-height:36px}
.adjust{display:flex;flex-direction:column;gap:8px;padding:8px 2px}.adjust .btn{width:100%;min-height:44px;font-size:16px;padding-inline:8px}.adjust .btn[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:1px}
.hint-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.hint-actions .btn{font-size:16px;min-height:44px;padding:8px 10px}.hint{font-size:16px;line-height:24px;margin:8px 0}.hint:empty{display:none}.records{font-size:14px;line-height:23px;margin:10px 0;color:var(--ink-sub);font-variant-numeric:tabular-nums}
.utility{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0;border-top:1px solid var(--line);padding-top:12px}.utility .btn{font-size:16px;padding:8px 10px;min-height:44px}
#setup{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px}.field{display:flex;align-items:center;gap:12px;margin:8px 0}.field label{font-size:16px;font-weight:600;white-space:nowrap}.field select{appearance:auto;min-height:44px;min-width:100px;max-width:100%;padding:8px 32px 8px 12px;border:1px solid var(--line-strong);border-radius:6px;background:var(--surface);color:var(--ink);font:400 17px var(--font);font-variant-numeric:tabular-nums;color-scheme:light dark}.field select:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.field option{background:var(--surface);color:var(--ink)}
#setup>.controls{flex-basis:100%}.setup-section #setup>.controls{margin-top:0}
#result{padding:12px 0 0;border-top:2px solid var(--ng);margin-top:12px}#result[data-reason=success]{border-color:var(--ok)}#result h2{font-size:21px;margin:0 0 6px;color:var(--ng)}#result[data-reason=success] h2{color:var(--ok)}#result p{margin:0 0 10px;font-size:14px}#result .result-actions{display:flex;gap:8px;flex-wrap:wrap}#result .btn{padding:8px 10px;min-height:44px;font-size:16px}
.article img{width:100%;height:auto}.article figure{margin:20px auto;max-width:580px}.article figcaption{font-size:14px;line-height:1.6;margin-top:8px;color:var(--ink-sub)}.article table{width:100%;border-collapse:collapse}.article td,.article th{border:1px solid var(--line);padding:8px}.ad-gap{height:160px}
.howto-shot{position:relative;max-width:390px;margin:auto}.howto-shot>img{display:block;border:1px solid var(--line);border-radius:6px}.howto-shot .annotation{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.annotation path{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.annotation circle{fill:var(--surface);stroke:var(--accent);stroke-width:1.5}.annotation text{fill:var(--accent);font:700 16px system-ui;text-anchor:middle}
@media(max-width:640px){.stage{padding:10px 8px}.turnbar{--tb-msg-lines:3}.turnbar .message{height:48px;min-height:48px;line-height:24px}.game-title{margin-top:16px}.game-lead{margin-bottom:12px}.primary{max-width:none;gap:6px}.primary .btn{font-size:16px;padding-inline:8px}.board-row{display:block}.board-shell{width:min(100%,300px,max(240px,calc((100svh - 350px) * .58)))}.board-note{text-align:center;margin:8px 0 0}.support{margin-top:10px}.support details{padding:4px 0}.hint-actions{margin:8px 0}.adjust{display:grid;grid-template-columns:1fr 1fr}.utility{gap:6px}.records{margin:8px 0}.field{flex:1;justify-content:space-between;min-width:220px}.field select{min-width:130px}}
@media(prefers-reduced-motion:no-preference){.ramp-hit{transition:background-color .15s,outline-color .15s}}

#result{margin:0 0 10px;padding:8px 0 0}#result h2{font-size:18px}#result p{display:none}#result .result-actions{gap:6px}#result #change{display:none}

.board-shell.locked .ramp-hit{opacity:0}
