/* The board is the hero; floating controls share one quiet visual language. */
html.game-session,body.game-session{height:100%;overflow:hidden;overscroll-behavior:none}
body.game-session>.app-shell{display:none}
#game-dialog.arcade-game-dialog[open]{position:fixed;inset:0;margin:0;width:100%;height:100dvh;min-width:0;min-height:0;max-width:none;max-height:none;padding:0;border:0;border-radius:0;box-shadow:none;overflow:hidden;overscroll-behavior:none;background:var(--world-sky,#e3f3bb);isolation:isolate}
#game-dialog.arcade-game-dialog::backdrop{background:var(--paper);backdrop-filter:none}
.arcade-game-dialog[data-game=snake]{--world-sky:#e1f2bb;--world-hill:#b3d76c;--world-front:#7fb657;--game-accent:#cde967;--character-x:100%;--character-y:0;--friend-x:100%;--friend-y:100%}
.arcade-game-dialog[data-game=blocks]{--world-sky:#ffd6ac;--world-hill:#ffb580;--world-front:#ee9173;--game-accent:#ffb48a;--character-x:0;--character-y:100%;--friend-x:100%;--friend-y:100%}
.arcade-game-dialog[data-game=breaker]{--world-sky:#c3eaf3;--world-hill:#88d1df;--world-front:#50b7c8;--game-accent:#9adfe9;--character-x:0;--character-y:100%;--friend-x:50%;--friend-y:100%}
.arcade-game-dialog[data-game=memory]{--world-sky:#d5f3d3;--world-hill:#a1dabb;--world-front:#6ebfa2;--game-accent:#a2e1c8;--character-x:50%;--character-y:100%;--friend-x:50%;--friend-y:100%}
.arcade-game-dialog[data-game=catch]{--world-sky:#fff0ae;--world-hill:#eed579;--world-front:#b3cc6e;--game-accent:#ffe17e;--character-x:100%;--character-y:100%;--friend-x:100%;--friend-y:0}
.arcade-world{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;user-select:none}
.world-hill{position:absolute;display:block;width:130%;height:35%;left:-15%;bottom:-14%;border:3px solid #152d2020;border-radius:50% 65% 0 0;background:var(--world-hill);transform:rotate(-4deg)}
.hill-front{left:40%;bottom:-20%;width:100%;height:42%;background:var(--world-front);transform:rotate(8deg)}
.world-sprite{position:absolute;display:block;aspect-ratio:1;background-image:url('./assets/eyecade-world-atlas.png');background-size:300% 200%;background-repeat:no-repeat;pointer-events:none}
.world-leaves{background-position:0 0;width:clamp(200px,25vw,430px);animation:world-sway 8s ease-in-out infinite alternate;transform-origin:top left}
.leaves-left{left:-4%;top:1%;z-index:2}
.leaves-right{right:-6%;bottom:-5%;z-index:2;rotate:180deg;animation-delay:-4s}
.world-cloud{background-position:50% 0;right:2%;top:1%;width:clamp(190px,24vw,370px);animation:world-float 9s ease-in-out infinite alternate;z-index:1}
.world-character{background-position:var(--character-x) var(--character-y);left:0;bottom:4%;width:clamp(170px,25vw,380px);animation:world-bob 5s ease-in-out infinite;transform-origin:bottom center;z-index:3}
.world-friend{background-position:var(--friend-x) var(--friend-y);right:0;bottom:5%;width:clamp(160px,23vw,330px);animation:world-bob 6.5s ease-in-out infinite;animation-delay:-2s;z-index:3}
.world-star{position:absolute;color:#ffca37;font-size:clamp(23px,4vw,55px);-webkit-text-stroke:1.8px var(--ink);line-height:1;animation:world-drift 7s ease-in-out infinite alternate}
.world-star-0{left:8%;top:22%;rotate:-14deg}
.world-star-1{left:18%;top:58%;font-size:28px;animation-delay:-2s}
.world-star-2{right:12%;top:36%;color:#ff886b;animation-delay:-4s}
.world-star-3{right:25%;bottom:9%;font-size:25px;animation-delay:-6s}
.world-star-4{left:37%;top:8%;font-size:24px;animation-delay:-3s}
.world-star-5{left:32%;bottom:4%;font-size:37px;color:#ff886b;animation-delay:-1s}
.world-star-6{right:3%;top:57%;font-size:31px;animation-delay:-5s}
.world-orbit{position:absolute;width:30px;height:30px;border:4px solid #fff7df;border-radius:50%;left:2%;top:45%;animation:world-float 8s ease-in-out infinite alternate}
.orbit-two{width:19px;height:19px;left:auto;right:22%;top:19%;border-width:3px;animation-delay:-5s}
.arcade-game-dialog[data-game=blocks] .world-hill{border-radius:35px 35px 0 0;transform:rotate(-7deg);bottom:-20%}
.arcade-game-dialog[data-game=blocks] .leaves-left{opacity:.8;left:-12%;top:20%;width:22vw}
.arcade-game-dialog[data-game=breaker] .world-leaves{opacity:.7}
.arcade-game-dialog[data-game=memory] .world-friend{scale:-1 1}
@keyframes world-sway{from{transform:rotate(-3deg) translateY(0)}to{transform:rotate(3deg) translateY(7px)}}
@keyframes world-float{from{transform:translate(0,0)}to{transform:translate(-18px,12px)}}
@keyframes world-bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
@keyframes world-drift{from{transform:translateY(0) rotate(-5deg)}to{transform:translateY(-16px) rotate(8deg)}}


/* One shared chrome: clear icons, 44px targets and a light raised edge. */
.arcade-game-shell{position:relative;z-index:1;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:8px;width:100%;height:100%;min-height:0;padding:max(12px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));overflow:hidden;pointer-events:none}
.arcade-game-shell[inert]{visibility:hidden}
.arcade-chrome{justify-self:center;width:min(100%,800px);min-width:0;display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:14px;padding:0 8px;pointer-events:auto}
.arcade-chrome .arcade-back{display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border:1.5px solid #294632;border-radius:50%;background:#fff9eb;box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #e9dfc4,0 2px 0 #839077,0 4px 6px #173c2a12;color:var(--ink)}
.arcade-back .ui-icon{width:21px;height:21px}
.arcade-game-identity{display:flex;align-items:center;gap:10px;min-width:0;justify-content:center}
.arcade-chrome .arcade-game-identity h2{font-family:var(--display-font);font-size:25px;font-weight:800;line-height:1.15;letter-spacing:-.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.arcade-chrome .arcade-game-badge{position:relative;display:block;flex:none;width:36px;height:36px;overflow:hidden;border:1.5px solid #173c2a35;border-radius:11px;transform:rotate(-5deg)}
.arcade-game-badge .portal-art{display:block;width:100%;height:100%}
.arcade-stats{display:flex;align-items:stretch;min-width:0;border:2px solid #294632;border-radius:20px;background:#fff9eb;box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #e9dfc4,0 2px 0 #839077,0 5px 8px #173c2a12;overflow:hidden}
.arcade-stat{position:relative;display:flex;flex:1 1 0;flex-direction:column;justify-content:center;align-items:center;min-width:68px;padding:10px 12px;gap:0}
.arcade-stat+.arcade-stat{border-left:1px solid #173c2a20}
.arcade-chrome .arcade-stats .arcade-score,.arcade-stat-value,.arcade-stats .arcade-status{display:flex;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:0;height:auto;padding:0;border:0;border-radius:0;box-shadow:none;background:none;font-family:var(--display-font);font-size:22px;font-weight:800;line-height:1;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.arcade-stats .ui-icon{width:18px;height:18px;flex:none}.arcade-score .ui-icon,.arcade-best .ui-icon{color:#a77610}
.arcade-stats .arcade-status-progress{position:absolute;bottom:3px;width:42px;height:2px;margin:0}
.arcade-status #arcade-secondary{color:inherit;font-size:inherit;font-variant-numeric:tabular-nums}
.arcade-status-icon{display:flex;align-items:center}
.arcade-game-dialog[data-game=snake] .arcade-status-icon,.arcade-game-dialog[data-game=breaker] .arcade-status-icon{color:#a5453c}
.arcade-status-progress{display:block;overflow:hidden;border-radius:99px;background:#173c2a20}
.arcade-status-progress i{display:block;width:100%;height:100%;background:#416f43;transform-origin:left;border-radius:99px}
.arcade-stage{position:relative;min-width:0;min-height:0;width:100%;height:100%;padding:5px 8px;display:flex;align-items:center;justify-content:center;overflow:hidden;contain:layout size;container-type:size;pointer-events:none}
.arcade-stage .arcade-playfield{flex:none;position:relative;aspect-ratio:1;min-width:0;min-height:0;max-width:none;max-height:none;border:2px solid var(--ink);border-radius:var(--field-radius,24px);box-shadow:0 4px 0 #173c2a40,0 0 0 4px var(--game-accent);overflow:hidden;pointer-events:auto;container-type:size}
.arcade-stage .arcade-canvas{width:100%;height:100%;min-width:0;min-height:0;max-width:none;max-height:none;display:block;touch-action:none}
.arcade-canvas[data-game=blocks]{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.arcade-canvas[data-block-phase=drag]{cursor:grabbing}.arcade-canvas[data-block-phase=landing],.arcade-canvas[data-block-phase=return]{cursor:default}
.arcade-playfield .arcade-live-event{font-size:calc(38px * var(--game-scale,1));top:calc(30px * var(--game-scale,1));color:var(--arcade-common);letter-spacing:.5px}
.arcade-game-dialog[data-play-mode=free] .arcade-live-event{color:var(--ink)}
.arcade-footer{justify-self:center;min-width:0;max-width:100%;pointer-events:auto}
.arcade-dock{display:flex;align-items:center;justify-content:center;gap:8px;padding:5px 6px;border:2px solid #294632;border-radius:999px;background:#fff9eb;box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #e9dfc4,0 2px 0 #839077,0 5px 8px #173c2a12}
.arcade-game-tools{display:flex;align-items:center;gap:5px}
.arcade-dock .arcade-game-tools .icon-button{display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border:1.5px solid #29463280;border-radius:50%;background:#fffcf3;color:var(--ink);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #e9dfc4,0 1px 0 #173c2a35}
.arcade-dock .arcade-game-tools #arcade-pause{background:var(--game-accent);border-color:#294632b0;box-shadow:inset 0 1px 0 #ffffff90,inset 0 -2px 0 #173c2a18,0 1px 0 #173c2a60}
.arcade-dock .icon-button:disabled{opacity:.4;box-shadow:none}
.arcade-dock .arcade-game-tools .icon-button:hover:not(:disabled),.arcade-chrome .arcade-back:hover{background:#edf3d6}
.arcade-chrome .arcade-back:active,.arcade-dock .arcade-game-tools .icon-button:not(:disabled):active{transform:translateY(1px);box-shadow:inset 0 1px 2px #173c2a18}
.arcade-game-tools .ui-icon{width:20px;height:20px}
.arcade-mode-toggle{display:flex;align-items:center;justify-content:center;gap:6px;flex:none;min-height:44px;padding:4px;border:0;border-radius:99px;background:transparent;color:var(--ink);font-size:11.5px;font-weight:800;line-height:1.15;white-space:nowrap;box-shadow:none;cursor:pointer}
.arcade-mode-track{display:block;position:relative;flex:none;width:28px;height:18px;border-radius:20px;background:#bbc6ae}
.arcade-mode-track>span{position:absolute;left:3px;top:3px;width:12px;height:12px;border-radius:50%;background:#fffdf3;box-shadow:0 1px 2px #173c2a30;transition:transform .16s ease}
.arcade-mode-toggle[aria-checked=true] .arcade-mode-track{background:#397c4c}.arcade-mode-toggle[aria-checked=true] .arcade-mode-track>span{transform:translateX(10px)}
.arcade-game-dialog button:focus-visible{outline:2px solid #246db6;outline-offset:3px}
/* Compact invitations teach through a picture and one gesture cue. */
.arcade-stage .arcade-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:12px;background:transparent;pointer-events:auto}
.arcade-overlay[hidden],.arcade-result-art[hidden],.arcade-status-progress[hidden],.arcade-size-notice[hidden]{display:none!important}
.arcade-stage .arcade-overlay-card{width:min(330px,94%);max-width:none;padding:21px;border:2px solid var(--ink);border-radius:24px;text-align:center;background:#fff9eb;box-shadow:0 5px 0 #173c2a25,0 10px 22px #173c2a0d}
.arcade-stage .arcade-overlay-card:not([data-reaction]){display:grid;grid-template-columns:102px minmax(0,1fr);gap:8px 14px;align-items:center;text-align:left;width:min(380px,96%);padding:20px}
.arcade-overlay-card:not([data-reaction]) .arcade-overlay-decoration{grid-column:1;grid-row:1 / span 3}
.arcade-stage .arcade-overlay-card h3{font-family:var(--display-font);font-size:23px;font-weight:800;line-height:1.15;letter-spacing:-.6px;margin:0 0 8px}
.arcade-overlay-card:not([data-reaction]) h3{grid-column:2;grid-row:1;margin:0}
.arcade-stage .arcade-overlay-card p{font-size:18px;line-height:1.35;color:#496344;margin:0 0 17px;letter-spacing:0}
.arcade-overlay-card:not([data-reaction]) p{grid-column:2;grid-row:2;margin:0;font-size:14px;font-weight:600}
.arcade-overlay-card p:empty{display:none}
.arcade-stage .arcade-overlay-card .button{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-width:0;min-height:44px;padding:10px 13px;border:2px solid var(--ink);border-radius:14px;background:var(--game-accent);box-shadow:inset 0 1px 0 #ffffff80,0 3px 0 #29463280;font-size:15px;font-weight:800;line-height:1.15}
.arcade-overlay-card .button .ui-icon{width:18px;height:18px}
.arcade-stage .arcade-overlay-card .button:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 1px 2px #173c2a12,0 1px 0 #29463280}
@media(hover:hover){.arcade-stage .arcade-overlay-card .button:hover:not(:disabled){filter:brightness(1.04)}}
.arcade-overlay-card:not([data-reaction]) .button{grid-column:2;grid-row:3;margin-top:3px;font-size:14px}
.arcade-intro-art,.block-demo-art{position:relative;display:block;width:102px;height:108px;margin:0;overflow:hidden;border:1.5px solid #173c2a70;border-radius:19px;transform:rotate(-4deg)}
.arcade-intro-art .portal-art{display:block;width:100%;height:100%}
.memory-pair-demo{display:flex;align-items:center;justify-content:center;width:102px;height:108px;gap:0;margin:0}
.memory-demo-card{display:block;flex:0 0 53px;height:67px;padding:3px;background:#fff7df;border:2px solid var(--ink);border-radius:9px;box-shadow:0 3px 0 #173c2a30;transform:rotate(-10deg)}
.memory-demo-card+.memory-demo-card{transform:translateY(-4px) rotate(10deg)}
.memory-portrait{display:block;position:relative;overflow:hidden;width:100%;aspect-ratio:1;margin:auto}
.memory-portrait img{position:absolute;display:block;left:0;top:0;width:300%;height:400%;max-width:none}
.block-demo-art .block-demo{display:none}.block-pause-art{height:100%}
.arcade-stage .arcade-overlay-card[data-tutorial=blocks]{grid-template-columns:1fr;width:min(340px,96%);text-align:center;gap:8px}
.arcade-overlay-card[data-tutorial=blocks] .block-demo-art{grid-column:1;grid-row:1;width:100%;height:154px;border:0;border-radius:0;transform:none;overflow:visible}
.arcade-overlay-card[data-tutorial=blocks] .block-demo{display:block;width:100%;height:100%}.arcade-overlay-card[data-tutorial=blocks] .block-pause-art{display:none}
.arcade-overlay-card[data-tutorial=blocks] h3{grid-column:1;grid-row:2}.arcade-overlay-card[data-tutorial=blocks] p{grid-column:1;grid-row:3}.arcade-overlay-card[data-tutorial=blocks] .button{grid-column:1;grid-row:4}
.demo-piece{animation:block-demo-drag 4.6s ease-in-out infinite}.demo-finger{animation:block-demo-finger 4.6s ease-in-out infinite}.demo-row{animation:block-demo-clear 4.6s ease-in-out infinite}.demo-spark{animation:block-demo-spark 4.6s ease-in-out infinite;transform-origin:50% 50%}
@keyframes block-demo-drag{0%,16%{transform:translateY(66px);opacity:1}49%,63%{transform:translateY(0);opacity:1}76%,94%{transform:translateY(0);opacity:0}100%{transform:translateY(66px);opacity:1}}
@keyframes block-demo-finger{0%,16%{transform:translateY(0);opacity:1}49%,58%{transform:translateY(-66px);opacity:1}65%,94%{transform:translateY(-66px);opacity:0}100%{transform:translateY(0);opacity:1}}
@keyframes block-demo-clear{0%,63%{opacity:1}76%,94%{opacity:0}100%{opacity:1}}
@keyframes block-demo-spark{0%,60%,83%,100%{opacity:0}68%,76%{opacity:1}}
.arcade-result-art{width:220px;max-width:100%;height:132px;margin:0 auto 11px}.arcade-result-art svg{display:block;width:100%;height:100%}
.arcade-result-badge[hidden],.arcade-result-facts[hidden]{display:none!important}
.arcade-stage .arcade-overlay-card{position:relative}
.arcade-result-badge{position:absolute;top:-14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;white-space:nowrap;padding:6px 11px;border:1.5px solid var(--ink);border-radius:99px;background:#ffe17e;color:var(--ink);font-size:12px;font-weight:800;box-shadow:0 2px 0 #173c2a25}.arcade-result-badge .ui-icon{width:15px;height:15px}
.arcade-result-facts{font-size:13px;font-weight:700;color:#496344;margin:-7px 0 15px}
.arcade-size-notice{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;padding:14px;background:var(--world-sky);text-align:center}
.arcade-size-card{width:min(350px,100%);padding:18px;border:2px solid var(--ink);border-radius:22px;background:#fff9eb;box-shadow:0 4px 0 #173c2a25}
.arcade-size-card>.ui-icon{width:38px;height:38px;margin:0 auto 9px}.arcade-size-card h3{font:800 21px var(--display-font);margin:0 0 7px}.arcade-size-card p{font-size:13px;line-height:1.35;margin-bottom:13px;color:var(--muted)}.arcade-size-card .button{min-height:44px;min-width:0;padding:10px 16px;background:var(--game-accent)}
body[data-age-band=older] .world-character,body[data-age-band=older] .world-friend,body[data-age-band=older] .world-star{display:none}
@media(max-width:600px){
 .arcade-game-shell{padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));gap:6px}
 .arcade-chrome{grid-template-columns:44px minmax(0,1fr);padding:0 2px;gap:8px 9px}.arcade-chrome .arcade-game-identity{justify-content:flex-start;gap:8px}.arcade-chrome .arcade-game-identity h2{font-size:22px}.arcade-chrome .arcade-game-badge{width:31px;height:31px}
 .arcade-chrome .arcade-stats{grid-column:1 / -1;justify-self:center;min-width:0;max-width:100%}.arcade-stat{padding:8px 10px}.arcade-chrome .arcade-stats .arcade-score,.arcade-stat-value,.arcade-stats .arcade-status{font-size:20px}.arcade-stage{padding:5px 4px}
 .world-leaves{width:200px}.leaves-left{left:-60px;top:12%}.leaves-right{right:-60px;bottom:10%}.world-cloud{right:-30px;top:10%;width:180px}.world-character{width:155px;left:-15px;bottom:8%}.world-friend{width:145px;right:-10px;bottom:9%}
}
@media(max-width:360px){.arcade-chrome .arcade-game-badge{display:none}.arcade-chrome .arcade-game-identity h2{font-size:21px}.arcade-dock{gap:6px}.arcade-game-tools{gap:4px}.arcade-mode-toggle{font-size:11px;gap:5px;padding:3px}.arcade-mode-track{width:26px}.arcade-mode-toggle[aria-checked=true] .arcade-mode-track>span{transform:translateX(8px)}}
/* Landscape uses the free space beside the square, with full-size controls. */
@media(min-width:480px) and (max-height:560px) and (min-aspect-ratio:1.3){
 .arcade-game-shell{grid-template-columns:minmax(94px,1fr) minmax(0,min(56vw,calc(100dvh - 22px),calc(100vw - 240px))) minmax(108px,1fr);grid-template-rows:minmax(0,1fr);gap:8px;padding:10px}
 .arcade-chrome{grid-column:1;grid-row:1;align-self:center;display:flex;flex-direction:column;gap:8px;padding:0;width:100%;max-height:100%}.arcade-game-identity{flex-direction:column;gap:6px}.arcade-chrome .arcade-game-badge{display:block;width:28px;height:28px}.arcade-chrome .arcade-game-identity h2{font-size:17px;white-space:normal;overflow-wrap:anywhere}
 .arcade-chrome .arcade-stats{flex-direction:column;min-width:86px;max-width:100%;flex-shrink:0;border-radius:18px}.arcade-stat{min-width:0;padding:5px 10px;gap:3px}.arcade-stat+.arcade-stat{border-left:0;border-top:1px solid #173c2a20}.arcade-chrome .arcade-stats .arcade-score,.arcade-stat-value,.arcade-stats .arcade-status{font-size:18px}.arcade-chrome .arcade-game-identity{align-items:center;justify-content:center}
 .arcade-stage{grid-column:2;grid-row:1;padding:3px;height:100%}.arcade-footer{grid-column:3;grid-row:1;align-self:center;width:100%}.arcade-dock{flex-direction:column;gap:8px;padding:9px 5px;border-radius:24px;width:max-content;max-width:100%}.arcade-mode-toggle{font-size:11px;gap:5px;padding:0;white-space:normal}.arcade-mode-toggle>span:last-child{max-width:47px;text-align:left}.arcade-mode-track{width:25px}
 .arcade-game-tools{display:grid;grid-template-columns:repeat(2,44px);gap:6px}.arcade-dock .arcade-game-tools #arcade-pause{grid-column:1 / -1;justify-self:center}
 .world-cloud{top:-28%;right:-40px;width:180px;opacity:.55}.world-character,.world-friend{width:150px;bottom:-18%;opacity:.35}.world-leaves{opacity:.3}.world-star{opacity:.5}
}
@container(max-height:360px){
 .arcade-stage .arcade-overlay-card[data-reaction]{display:grid;grid-template-columns:100px minmax(0,1fr);gap:7px 11px;align-items:center;width:min(350px,96%);padding:14px;text-align:left}
 .arcade-overlay-card .arcade-result-art{grid-column:1;grid-row:1 / span 2;width:100px;height:66px;margin:0}.arcade-stage .arcade-overlay-card[data-reaction] h3{grid-column:2;grid-row:1;font-size:20px;margin:0}.arcade-stage .arcade-overlay-card[data-reaction] p{grid-column:2;grid-row:2;font-size:14px;line-height:1.3;margin:0}.arcade-stage .arcade-overlay-card[data-reaction] .button{grid-column:1 / -1;grid-row:4;margin-top:3px}.arcade-result-facts{grid-column:2;grid-row:3;margin:0;font-size:12px}
 .arcade-stage .arcade-overlay-card[data-tutorial=blocks]{grid-template-columns:112px minmax(0,1fr);gap:6px 10px;padding:14px;text-align:left}.arcade-overlay-card[data-tutorial=blocks] .block-demo-art{grid-column:1;grid-row:1 / span 3;height:136px}.arcade-overlay-card[data-tutorial=blocks] h3{grid-column:2;grid-row:1;font-size:20px}.arcade-overlay-card[data-tutorial=blocks] p{grid-column:2;grid-row:2;font-size:13px}.arcade-overlay-card[data-tutorial=blocks] .button{grid-column:2;grid-row:3}
}
@media(prefers-reduced-motion:reduce){.arcade-world *,.block-demo *{animation:none!important}.arcade-mode-track>span{transition:none}.demo-piece{transform:translateY(0)}.demo-finger,.demo-spark{display:none}}
.arcade-result-art>svg{animation:result-arrive .42s cubic-bezier(.2,.8,.2,1) both;transform-origin:50% 90%}
.arcade-result-art .result-character-main{animation:result-settle .55s ease-out both;transform-box:fill-box;transform-origin:50% 100%}
.arcade-result-art .result-character-friend{animation:result-settle .6s .05s ease-out both;transform-box:fill-box;transform-origin:50% 100%}
.arcade-result-art .result-eye{animation:result-blink 4.8s 1.8s infinite;transform-box:fill-box;transform-origin:center}
.arcade-result-art .result-spark{animation:result-twinkle 3.4s .4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes result-arrive{from{opacity:0;transform:translateY(9px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes result-settle{0%{transform:translateY(5px) scale(.96,1.02)}55%{transform:translateY(-2px) scale(1.02,.98)}100%{transform:translateY(0) scale(1)}}
@keyframes result-blink{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.12)}}
@keyframes result-twinkle{0%,100%{transform:scale(.93)}50%{transform:scale(1.08) translateY(-1px)}}
@media(prefers-reduced-motion:reduce){.arcade-result-art,.arcade-result-art *{animation:none!important}}

#game-dialog.arcade-game-dialog.arcade-page-pointer{touch-action:none}
.arcade-dock .arcade-mode-toggle{display:grid;place-items:center;width:44px;height:44px;padding:0;border:1.5px solid #294632;border-radius:50%;background:#fffdf1;box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #e9dfc4,0 2px 0 #839077;color:var(--ink)}.arcade-dock .arcade-mode-toggle .ui-icon{width:22px;height:22px}.arcade-dock .arcade-mode-toggle[aria-checked=true]{background:#e0efcf;color:#2f7348}.arcade-daily-stat .ui-icon{color:#4f834b}.arcade-daily-stat[data-complete=true] .ui-icon{color:#c38020}.arcade-chrome .arcade-stat{min-width:60px;padding-inline:10px}.arcade-chrome .arcade-daily-stat .arcade-stat-value{font-size:18px}
@media(max-width:620px){.arcade-chrome .arcade-stats{max-width:100%;width:max-content}.arcade-chrome .arcade-stat{min-width:58px;padding-inline:10px}.arcade-chrome .arcade-daily-stat .arcade-stat-value{font-size:17px}.arcade-daily-stat .ui-icon{width:15px;height:15px}}
@media(max-width:360px){.arcade-chrome .arcade-stat{padding-inline:7px;min-width:54px}}
.arcade-chrome .arcade-stat{flex:1 1 auto}
@media(max-width:420px){.arcade-chrome .arcade-stat{min-width:52px;padding-inline:8px}.arcade-chrome .arcade-stats .arcade-score,.arcade-chrome .arcade-stat-value,.arcade-chrome .arcade-stats .arcade-status{font-size:18px;gap:5px}.arcade-chrome .arcade-stats .ui-icon{width:16px;height:16px}.arcade-chrome .arcade-daily-stat .arcade-stat-value{font-size:17px}}
/* Small themed worlds frame the board; all illustration stays behind it. */
.world-scene{position:absolute;display:block;width:clamp(190px,23vw,320px);height:auto;overflow:visible;pointer-events:none;filter:drop-shadow(0 4px 0 #193d2c0c);transform-origin:50% 85%;animation:scene-breathe 10s ease-in-out infinite;contain:layout style}
.world-scene-left{left:-12px;top:11%;rotate:-3deg}.world-scene-right{right:-12px;bottom:4%;width:clamp(210px,25vw,350px);rotate:3deg;animation-delay:-4s}
.arcade-world .world-character{width:clamp(150px,20vw,280px);left:1%;bottom:2%;animation-duration:8s}.arcade-world .world-star{font-size:clamp(20px,2.8vw,35px);-webkit-text-stroke:1.4px var(--ink);animation-duration:12s}.arcade-world .world-star-0{left:20%;top:12%}.arcade-world .world-star-1{left:12%;top:57%;font-size:22px}.arcade-world .world-star-2{right:8%;top:17%;font-size:24px}.arcade-world .world-orbit{display:none}
.arcade-game-dialog[data-game=snake] .world-character,.arcade-game-dialog[data-game=breaker] .world-character{display:none}.arcade-game-dialog[data-game=breaker] .world-scene-left{top:17%;left:-4px}.arcade-game-dialog[data-game=breaker] .world-scene-right{bottom:7%;right:-2px}.arcade-game-dialog[data-game=memory] .world-scene-left{top:9%}.arcade-game-dialog[data-game=blocks] .world-scene-left{top:8%;left:-8px}.arcade-game-dialog[data-game=catch] .world-scene-left{top:11%;left:-4px}
.arcade-world .world-scene{opacity:1}
@keyframes scene-breathe{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(-5px) rotate(.6deg)}}
@media(max-width:760px){.world-scene-left,.arcade-game-dialog[data-game=breaker] .world-scene-left,.arcade-game-dialog[data-game=memory] .world-scene-left,.arcade-game-dialog[data-game=blocks] .world-scene-left,.arcade-game-dialog[data-game=catch] .world-scene-left{width:170px;left:-30px;top:12%;rotate:-6deg}.world-scene-right,.arcade-game-dialog[data-game=breaker] .world-scene-right{width:165px;right:-28px;bottom:9%;rotate:5deg}.arcade-world .world-character{width:130px;left:-12px;bottom:8%}.arcade-world .world-star-0{left:auto;right:18%;top:22%;font-size:19px}.arcade-world .world-star-1,.arcade-world .world-star-2{display:none}}
@media(min-width:480px) and (max-height:560px) and (min-aspect-ratio:1.3){.world-scene-left,.arcade-game-dialog[data-game=breaker] .world-scene-left,.arcade-game-dialog[data-game=memory] .world-scene-left,.arcade-game-dialog[data-game=blocks] .world-scene-left,.arcade-game-dialog[data-game=catch] .world-scene-left{width:145px;left:-36px;top:-18%}.world-scene-right,.arcade-game-dialog[data-game=breaker] .world-scene-right{width:150px;right:-38px;bottom:-23%}.arcade-world .world-character{display:none}.arcade-world .world-star{display:none}}
@media(prefers-reduced-motion:reduce){.world-scene{animation:none}}
@media(min-width:480px) and (max-height:560px) and (min-aspect-ratio:1.3){.arcade-world .world-scene-left{display:none}}

/* Opaque, expressive characters; the board remains clear of decoration. */
.arcade-game-dialog[data-game=snake] .world-scene-left{width:clamp(230px,26vw,355px);top:auto;bottom:8%;left:-12px;rotate:-4deg}
.arcade-game-dialog[data-game=snake] .world-scene-right{width:clamp(230px,25vw,345px);bottom:7%;right:-14px;rotate:3deg}
.decor-blink{transform-box:fill-box;transform-origin:center;animation:decor-blink 6s 1.2s infinite}
.decor-apple-bob{transform-box:fill-box;transform-origin:center;animation:decor-apple-bob 4s ease-in-out infinite}
@keyframes decor-blink{0%,92%,96%,100%{transform:scaleY(1)}94%{transform:scaleY(.1)}}
@keyframes decor-apple-bob{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-7px) rotate(5deg)}}
@media(max-width:760px){.arcade-game-dialog[data-game=snake] .world-scene-left{width:190px;left:-36px;bottom:7%;top:auto}.arcade-game-dialog[data-game=snake] .world-scene-right{width:180px;right:-35px;bottom:auto;top:12%}}
@media(min-width:480px) and (max-height:560px) and (min-aspect-ratio:1.3){.arcade-game-dialog[data-game=snake] .world-scene-right{width:150px;right:-38px;bottom:-23%;top:auto}}
@media(prefers-reduced-motion:reduce){.decor-blink,.decor-apple-bob{animation:none}}