.ring-shell:focus{outline:none}.ring-stage{display:flex;justify-content:center;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.ring-board{position:relative;width:min(98cqw,calc((100svh - 230px)*.90909),760px);aspect-ratio:800/880;max-width:100%}#ring-art,.ring-targets{position:absolute;inset:0;width:100%;height:100%}#ring-art{pointer-events:none;overflow:visible}.ring-targets{pointer-events:none}.ring-hit{position:absolute;transform:translate(-50%,-50%);border:0;border-radius:50%;padding:0;background:transparent;pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent}.ring-hit:disabled{opacity:1}.ring-hit:focus-visible{outline:2px solid #ffe3a0;outline-offset:3px}.ring-controls{display:grid;grid-template-columns:52px minmax(0,1fr) 52px;gap:8px;margin:6px 12px max(12px,env(safe-area-inset-bottom))}.ring-controls button{font-size:28px;min-height:48px;margin:0;padding:0}.ring-controls select{min-width:0;min-height:48px;border:1px solid #967b42;border-radius:12px;background:#111b2b;color:#ffe0a1;padding:0 10px;font:700 16px Arial}.ring-solved{margin:8px 12px;text-align:center}.ring-solved h2{font:700 23px Georgia;color:#f6d995;margin:4px}.ring-solved p{font-size:14px;color:#d7c7aa}.ring-solved>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ring-solved button{margin:0;min-height:48px}.ring-controls[hidden],.ring-solved[hidden]{display:none}.ring-hint{animation:ring-blink .75s ease-in-out infinite}@keyframes ring-blink{50%{opacity:.35}}.scorebar #level-cycle{min-height:44px;border-radius:0;margin:0;touch-action:manipulation}.reduced-motion .ring-hint{animation:none;filter:brightness(1.5)}@media(prefers-reduced-motion:reduce){.ring-hint{animation:none;filter:brightness(1.5)}}@media(min-width:600px) and (orientation:portrait) and (pointer:coarse){.ring-board{width:min(90cqw,calc((100svh - 240px)*.90909),760px)}.ring-controls{margin-inline:24px;grid-template-columns:60px 1fr 60px}}
/* The shared secondary button has a 150px minimum; local arrow cells must override it. */
.ring-shell{min-width:0}.ring-stage{position:relative;isolation:isolate;overflow:visible}.ring-board.ring-dragging #ring-art{overflow:hidden}.ring-board{width:min(98cqw,calc((100svh - 274px - env(safe-area-inset-bottom))*.90909),760px)}
.ring-controls{box-sizing:border-box;width:100%;max-width:100%;grid-template-columns:48px minmax(0,1fr) 48px;align-items:stretch;margin:8px 0 0;gap:8px}
.ring-controls>.secondary-button{box-sizing:border-box;min-width:0;width:100%;height:48px;padding:0;font-size:27px;line-height:1}
.ring-controls>select{box-sizing:border-box;width:100%;max-width:100%;min-width:0;height:48px;padding:0 30px 0 10px;font-size:16px;text-overflow:ellipsis;appearance:none;background:#111b2b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23efd18c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 10px center}
.ring-solved>div{grid-template-columns:repeat(2,minmax(0,1fr))}.ring-solved button{min-width:0}
.ring-message{box-sizing:border-box;display:flex;align-items:center;justify-content:center;min-height:38px;margin:0 2px 2px;padding:5px 8px;border:1px solid #8d76423d;border-radius:10px;color:#e8d9b8;background:#111a2970;text-align:center;font:500 13px/1.35 Arial;overflow-wrap:anywhere}
.ring-pin-blocked{animation:ring-stop-flash .4s ease-in-out 3}@keyframes ring-stop-flash{50%{opacity:.4}}
@media(min-width:600px) and (orientation:portrait) and (pointer:coarse){.ring-board{width:min(90cqw,calc((100svh - 285px - env(safe-area-inset-bottom))*.90909),760px)}.ring-controls{grid-template-columns:56px minmax(0,1fr) 56px;margin-inline:0}.ring-controls>.secondary-button,.ring-controls>select{height:52px}.ring-message{font-size:14px}}
@media(prefers-reduced-motion:reduce){.ring-pin-blocked{animation:none}}

.ring-hit{min-width:44px;min-height:44px}

/* Keep native selection/callouts off every descendant, including SVG text and buttons. */
.ring-stage,.ring-stage *{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent}
.ring-board{overscroll-behavior:contain}
