/* Approved D artwork: cut paper tickets, blue graph paper, tiny enamel bricks. */
body.is-game{color-scheme:light;--ink:#171936;--muted-ink:#455574;--paper:#fff9e5;color:var(--ink);background:#fff6da url('/assets/home-paper.svg') center top/420px auto repeat;min-height:100dvh}
body.is-game .topbar{display:none}
body.is-game #app-main{max-width:418px;padding:8px 14px 12px;margin:0 auto}
body.is-game #game{width:min(100%,max(292px,calc(63.158dvh - 170.526px)));max-width:none;margin:0 auto;container-type:inline-size}
.is-game .arena-heading{height:46px;gap:12px;margin:0 0 8px;position:relative}
.is-game .arena-heading .arena-title{min-width:0;position:relative;align-self:center}
.is-game .arena-heading small{display:block;font-size:9px;font-weight:850;letter-spacing:.35px;color:var(--ink);margin:0 0 2px}
.is-game .arena-heading h2{display:table;position:relative;font-size:24px;line-height:1.22;letter-spacing:.3px;font-weight:950;margin:0;isolation:isolate;white-space:nowrap;-webkit-text-stroke:3px #fff9e5;paint-order:stroke fill;text-shadow:1px 2px 0 #171936}
.is-game .arena-heading h2:after{content:'';position:absolute;z-index:-1;left:-1px;right:-6px;bottom:-3px;height:6px;background:#ff737b;clip-path:polygon(0 25%,97% 0,100% 80%,3% 100%);transform:rotate(-2deg)}
.is-game .memory-stamp{position:absolute;right:-2px;bottom:2px;color:#66bce3;font-size:8px;line-height:1.1;font-weight:850;transform:rotate(-13deg);opacity:.65}
.is-game .icon-button{width:46px;height:46px;min-height:44px;flex:0 0 46px;position:relative;background:#fffbed;color:var(--ink);border:2.5px solid var(--ink);border-radius:13px 9px 12px 10px;box-shadow:3px 4px 0 #ff8180,inset 2px 2px 0 white;padding:9px}
.is-game .icon-button:after{content:'';position:absolute;inset:3px;border:1px solid #c4ddeb;border-radius:7px;pointer-events:none}
.is-game .icon-button svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.is-game #pause-button{box-shadow:3px 4px 0 #ffd14f,inset 2px 2px 0 white}
.is-game .match-score{flex-shrink:0;font-size:17px;font-weight:950;background:#fffbea;border:2px solid var(--ink);border-radius:8px 13px 8px 10px;padding:8px 6px;box-shadow:2px 3px 0 #b598ed}
.is-game .hud{display:grid;grid-template-columns:1fr 1.27fr 1fr;gap:7px;height:62px;margin:0 0 8px;padding:0;background:none;border:0;border-radius:0;align-items:stretch}
.is-game .hud>div{min-width:0;position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5px 3px 6px;filter:drop-shadow(1px 3px 0 #53dbb4)}
.is-game .hud>div:before,.is-game .hud>div:after{content:'';position:absolute;z-index:-1;inset:0;clip-path:polygon(6% 9%,88% 0,98% 15%,100% 86%,88% 97%,10% 100%,0 84%,1% 25%);background:var(--ink)}
.is-game .hud>div:after{inset:2px;background:linear-gradient(125deg,white,#fffdf0)}
.is-game .hud>.hud-stars{filter:drop-shadow(1px 3px 0 #9ecfe2)}
.is-game .hud>.hud-stars:before,.is-game .hud>.hud-stars:after{clip-path:polygon(0 28%,8% 22%,11% 5%,30% 6%,34% 0,86% 4%,92% 21%,100% 26%,98% 87%,91% 100%,7% 98%,0 86%)}
.is-game .hud>.remaining:before,.is-game .hud>.remaining:after{clip-path:polygon(5% 7%,85% 0,100% 17%,98% 84%,90% 100%,8% 94%,0 80%,1% 20%)}
.is-game .hud small{display:flex;align-items:center;justify-content:center;gap:4px;font-size:9px;line-height:13px;color:var(--ink);font-weight:850;white-space:nowrap}
.is-game .hud small svg{width:17px;height:19px;overflow:visible;fill:#5bd8f4;stroke:var(--ink);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.is-game .hud .remaining svg{width:19px;height:17px;fill:#ff7886}
.is-game .hud strong{display:table;position:relative;font-size:27px;line-height:28px;letter-spacing:.4px;font-weight:950;margin:0;font-variant-numeric:tabular-nums}
.is-game .hud .time-ticket strong{font-size:clamp(22px,7.6cqw,27px)}
.is-game .hud strong:after{content:'';position:absolute;bottom:-2px;left:-3px;right:-2px;height:3px;background:#5be1bb;transform:rotate(-2deg);opacity:.8}
.is-game .hud .remaining strong{font-size:28px;color:#ff6479}
.is-game .hud .remaining strong:after{background:#ff9a9e}
.is-game .hud-stars>span{font:900 26px/28px system-ui,sans-serif;letter-spacing:3px;color:#ffcf43;-webkit-text-stroke:1.4px var(--ink);paint-order:stroke fill;text-shadow:0 1px 0 var(--ink);white-space:nowrap}
.is-game #game-stars{display:flex;justify-content:center;gap:3px}
.is-game #game-stars svg{display:block;width:26px;height:28px;overflow:visible}
.is-game .hud-stars small{font-size:7.1px;letter-spacing:-.2px;line-height:13px;margin:2px -2px 0;gap:0}
.is-game .hud-stars.is-opponent>span{font-size:17px;line-height:25px;font-weight:950;letter-spacing:0;color:#8864d8;-webkit-text-stroke:0;text-shadow:none}
.is-game .hud-stars.is-opponent small{font-size:8px}
.is-game .power-hud{position:relative;inset:auto;display:flex;align-items:center;justify-content:space-between;gap:4px;height:28px;min-height:0;margin:0 1px 8px;padding:3px 9px 3px 7px;background:#fffdf0;color:var(--ink);font-size:8px;letter-spacing:0;white-space:nowrap;border:1.6px solid var(--ink);border-radius:4px 11px 5px 7px;box-shadow:2px 2px 0 #9bcfdc;pointer-events:none;z-index:1}
.is-game .power-hud:before{content:'';position:absolute;left:-3px;top:-4px;width:15px;height:8px;transform:rotate(-28deg);background:#55e6b4;clip-path:polygon(0 0,100% 10%,91% 100%,6% 90%)}
.is-game #power-buffs{display:flex;gap:4px;min-width:0}
.is-game .power-chip{display:flex;align-items:center;gap:3px;height:20px;padding:1px 4px 1px 2px;border:1px solid #d6ccb4;border-radius:6px;background:#fffdf3;color:#737488;font-weight:750}
.is-game .power-chip b{width:15px;height:16px;border:1.2px solid var(--ink);border-radius:4px;display:grid;place-items:center;background:var(--chip);color:var(--ink);font:950 12px/1 ui-monospace,monospace;box-shadow:inset 1px 1px 0 #ffffffb3}
.is-game .power-chip.active{border-color:var(--ink);color:var(--ink);background:white}
.is-game .power-chip:not(.active) b{opacity:.58}
.is-game #power-balls{flex-shrink:0;font-size:9px;font-weight:900}
.is-game .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.is-game .board-wrap{position:relative;isolation:isolate;overflow:visible;border:0;border-radius:13px 16px 11px 9px;background:#d2f2ff;box-shadow:none;touch-action:none}
.is-game .board-wrap:before{content:'';position:absolute;z-index:-2;inset:-3px -3px -4px;background:var(--ink);border-radius:15px 17px 10px 11px;transform:rotate(-.15deg);box-shadow:3px 3px 0 #ff7d86,-2px 1px 0 #fffef0}
.is-game .board-wrap:after{content:'';position:absolute;z-index:-3;inset:5px -5px -6px 2px;background:#5ae5c2;border-radius:15px;transform:rotate(.45deg)}
.is-game #board{position:relative;z-index:1;border-radius:11px 14px 8px 7px;background:#d2f2ff}
.is-game .paper-tape{position:absolute;width:36px;height:18px;z-index:0;opacity:.92;box-shadow:1px 2px 1px #17213c16;clip-path:polygon(0 6%,94% 0,100% 86%,6% 100%);pointer-events:none}
.is-game .tape-mint{left:-12px;top:-6px;transform:rotate(-39deg);background:linear-gradient(90deg,#28dca9aa,#6feac5)}
.is-game .tape-pink{right:-12px;top:-6px;transform:rotate(40deg);background:linear-gradient(90deg,#ff7b9d,#ffa6bc)}
.is-game .tape-yellow{left:-12px;bottom:-5px;transform:rotate(44deg);background:linear-gradient(90deg,#ffd644,#ffe87b)}
.is-game .tape-aqua{right:-12px;bottom:-5px;transform:rotate(-40deg);background:linear-gradient(90deg,#60e6bc,#35dcce)}
.is-game .play-controls{display:flex;gap:10px;height:56px;margin-top:12px}
.is-game .arena .drag-zone{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:3px;height:56px;margin:0;padding:6px;background:linear-gradient(110deg,#fffef5,#fff8df);color:var(--ink);border:2px solid var(--ink);border-radius:13px 10px 12px 11px;box-shadow:2px 3px 0 #a7e4d6,inset 2px 2px 0 white;touch-action:none}
.is-game .drag-label{display:flex;align-items:center;justify-content:center;gap:10px;font-size:14px;line-height:20px;font-weight:950;white-space:nowrap}
.is-game .drag-label span{font-size:19px;line-height:20px}
.is-game #drag-hint{font-size:8.5px;line-height:12px;color:var(--muted-ink);font-weight:650;white-space:nowrap}
.is-game .release-ball{position:relative;inset:auto;transform:none;flex:0 0 112px;width:112px;height:56px;min-height:44px;padding:8px 6px;color:var(--ink);font-size:20px;font-weight:950;letter-spacing:.3px;background:#ffd845;border:2px solid var(--ink);border-radius:13px 10px 12px 11px;box-shadow:2px 3px 0 #ff7e8b,inset 0 0 0 3px #fff9dd;text-shadow:1px 1px 0 #fff6c0}
.is-game .release-ball:after{content:'';position:absolute;inset:5px;border:1px dashed #fff7cb;border-radius:6px;pointer-events:none}
.is-game .brick-legend{height:16px;gap:14px;align-items:center;margin:8px 0 0;font-size:8px;font-weight:650;color:#4c5e76}
.is-game .brick-legend i{width:7px;height:7px;border:.7px solid #25354b}
.is-game .brick-legend .normal{background:#ff7783}
.is-game .brick-legend .durable{background:#b58af2}
.is-game .brick-legend .fixed{background:repeating-linear-gradient(135deg,#a3b3b4 0 2px,#61747d 2px 3px)}
.is-game .controls-hint{display:none}
.is-game .game-overlay{z-index:2;border-radius:11px 14px 8px 7px;background:#fff9e5ed;backdrop-filter:blur(3px);padding:24px;color:var(--ink)}
.is-game .game-overlay:not(.ready-overlay){justify-content:flex-start;overflow-y:auto}
.is-game .game-overlay:not(.ready-overlay)>*{flex-shrink:0}
.is-game .game-overlay:not(.ready-overlay)>:first-child{margin-top:auto}
.is-game .game-overlay:not(.ready-overlay)>:last-child{margin-bottom:auto}
.is-game .game-overlay.ready-overlay{background:transparent;backdrop-filter:none;padding:20px 28px 105px}
.is-game .overlay-eyebrow{color:#6886a0;font-size:9px;font-weight:850;letter-spacing:1px}
.is-game .game-overlay h2{font-size:29px;color:var(--ink);margin-bottom:12px;font-weight:950}
.is-game .game-overlay p{color:#4b5f7b}
.is-game .game-overlay .big-score{color:#8060c9;font-weight:950}
.is-game .game-overlay .result-stars{color:#ffd04c;-webkit-text-stroke:1.5px var(--ink);paint-order:stroke fill}
.is-game .result-stars svg{width:35px;height:39px;overflow:visible;margin:0 3px}
.is-game .result-stats{border-color:#d4d3c6;margin:12px 0 15px}
.is-game .result-stats>div{color:#56647a}
.is-game .result-stats strong{color:var(--ink)}
.is-game .primary,.is-game .secondary{min-height:46px;border:2px solid var(--ink);border-radius:9px 12px 9px 11px;box-shadow:2px 3px 0 #a5dcd6;background:#b99aef;color:var(--ink);font-weight:900;text-shadow:none}
.is-game .secondary{background:#fffbed;box-shadow:2px 3px 0 #e2d2bc}
.is-game .game-overlay.ready-overlay button{box-shadow:2px 3px 0 #8067ac}
.is-game .game-overlay.ready-overlay .ready-guide{min-height:44px;width:auto;color:#28445d;border:0;background:#fffbedeb;border-radius:7px;box-shadow:none;padding:8px 15px;font-weight:750;font-size:11px}
.is-game .game-overlay button{margin-top:10px}
.is-game .play-controls .release-ball{background:#ffd845;box-shadow:2px 3px 0 #ff7e8b,inset 0 0 0 3px #fff9dd}
.is-game dialog{background:#fffbeb;color:var(--ink);border:2px solid var(--ink);border-radius:15px 11px 13px 10px;box-shadow:5px 6px 0 #7edec3;padding:25px}
.is-game dialog p,.is-game dialog li{color:#4b5f7b}
.is-game dialog::backdrop{background:#192a425e}
.is-game .power-guide-item>i{background:var(--power-color);color:#171936;border:1.5px solid #171936;box-shadow:1px 2px 0 #17193628}
.is-game .power-guide-item small{color:#62758b}
.is-game button:focus-visible,.is-game [tabindex]:focus-visible{outline:3px solid #8250d6;outline-offset:4px}
@media(max-width:360px){.is-game .memory-stamp{display:none}.is-game .arena-heading h2{font-size:22px}.is-game .hud strong{font-size:22px;letter-spacing:0}.is-game .power-hud{padding-left:4px;padding-right:5px}.is-game .power-chip{padding-right:2px;gap:2px}.is-game #power-buffs{gap:2px}.is-game .release-ball{flex-basis:98px;width:98px;font-size:17px}.is-game .drag-label{font-size:12px;gap:6px}.is-game #drag-hint{font-size:8px}.is-game .hud-stars small{font-size:6.5px}}