/* Small Riot UI v1. Theme through --sr-* variables. Board cells are game-owned. */
:root{--sr-ink:var(--ink,#26304e);--sr-accent:var(--accent,#615cbb);--sr-paper:#fff9ed;--sr-edge:#d8c6e0;--sr-shadow:#35264b25}
button{-webkit-tap-highlight-color:transparent}
button:not(.cell){min-width:48px;min-height:48px;border-radius:16px;font-size:18px;font-weight:750;box-shadow:0 3px 0 var(--sr-shadow),inset 0 1px 0 #fff8;transition:transform .1s,box-shadow .1s;touch-action:manipulation}
button:not(.cell):active:not(:disabled){transform:translateY(2px) scale(.97);box-shadow:0 1px 0 var(--sr-shadow)}
button:focus-visible{outline:3px solid var(--sr-accent);outline-offset:3px}
.sr-mode-pills{padding:4px;gap:4px;border-radius:21px;display:flex}
.sr-mode-pills button{flex:1;min-height:48px;border:0;border-radius:17px;box-shadow:none}
.sr-mode-pills .active{box-shadow:0 2px 6px #24183530,inset 0 1px 0 #fff8}
button.sr-switch{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:10px 12px;color:var(--sr-ink);background:var(--sr-paper);border:2px solid var(--sr-edge);font-size:18px;text-align:left}
.sr-control-icon{font-size:24px;line-height:1;min-width:24px;text-align:center}
.sr-icon{width:24px;height:24px;min-width:24px;flex:none;display:inline-block;vertical-align:middle}
.sr-icon-label{display:inline-flex;align-items:center;justify-content:center;gap:6px}
button .sr-icon{width:24px;height:24px;min-width:24px}
button.icon-button .sr-icon{width:32px;height:32px;min-width:32px}
.sr-level-badge{display:flex;align-items:center;justify-content:center}
.sr-level-badge .sr-icon{width:24px;height:24px}
.sr-switch-track{flex:none;width:40px;height:24px;border-radius:99px;background:#918799;box-shadow:inset 0 2px 3px #0003;position:relative;margin-left:auto}
.sr-switch-track::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff9ef;box-shadow:0 1px 3px #0004;transition:transform .14s}
.sr-switch[aria-checked=true] .sr-switch-track{background:var(--sr-accent)}
.sr-switch[aria-checked=true] .sr-switch-track::after{transform:translateX(16px)}
.sr-sheet{border-radius:28px;padding:24px;max-height:calc(100dvh - 32px);overscroll-behavior:contain}
.sr-sheet .close{min-width:48px;min-height:48px;font-size:28px;margin:-12px -10px 0 0}
.sr-sheet>.sr-switch{margin:12px 0}
.sr-level-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(54px,1fr));gap:10px}
.sr-level-grid button.sr-level-tile{min-height:64px;padding:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:18px;border:2px solid var(--sr-edge)}
.sr-level-badge{font-size:18px;line-height:20px}
.sr-level-tile.current{outline:3px solid var(--sr-accent);outline-offset:1px}
.sr-level-tile.passed{background:#e5f0db;color:#375136}
.sr-hud{position:absolute;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));display:flex;gap:12px;align-items:center;pointer-events:none}
.sr-hud-value{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;color:#fff7dd;background:#182337df;border-radius:14px;padding:8px 12px;text-shadow:0 1px 2px #000}
.sr-hud-label{font-size:14px}
.sr-number-pop{animation:sr-number-pop .2s ease-out}@keyframes sr-number-pop{50%{transform:scale(1.13)}}
@media(max-width:740px){.sr-sheet{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:calc(100dvh - 24px);border-radius:28px 28px 0 0;padding:20px 20px max(20px,env(safe-area-inset-bottom));border-bottom:0}.sr-sheet:before{content:'';display:block;width:38px;height:4px;border-radius:4px;background:#8b779366;margin:-8px auto 10px}.sr-sheet h2{font-size:25px}.sr-sheet p{font-size:16px}}
@media(prefers-reduced-motion:reduce){button:not(.cell),.sr-switch-track::after{transition:none}.sr-number-pop{animation:none}}
html[data-reduced=true] .sr-number-pop{animation:none}

.sr-level-tile>span:first-child{font-size:22px}.sr-level-tile:disabled{opacity:.6}
@media(max-width:740px){.sr-level-grid button.sr-level-tile{min-height:76px}}
