/* Shape Drop keeps the established aqua/gold shell around a deep, clear playfield. */
:is(#shape-drop,#shape-slice,#games-hub){box-sizing:border-box;width:min(520px,calc(100vw - 12px));height:min(940px,calc(100dvh - 12px));max-width:calc(100vw - 12px);max-height:calc(100dvh - 12px);margin:auto;padding:7px 9px 10px;border:14px solid transparent;border-image:url('assets/menu-panel-v240.webp') 70 fill / 14px / 0 stretch;border-radius:25px;background:transparent;color:#07516c;overflow:hidden;font-family:Nunito,sans-serif;box-shadow:0 18px 60px #00192da0;text-align:center}
:is(#shape-drop,#shape-slice,#games-hub)[open]{display:flex;flex-direction:column;gap:7px}:is(#shape-drop,#shape-slice,#games-hub)::backdrop{background:#002442b3;backdrop-filter:blur(4px)}:is(#shape-drop,#shape-slice,#games-hub) *{box-sizing:border-box}
:is(#shape-drop,#shape-slice,#games-hub) button{font-family:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}:is(#shape-drop,#shape-slice,#games-hub) button:focus-visible,:is(#shape-drop,#shape-slice,#games-hub) canvas:focus-visible{outline:none}:is(#shape-drop,#shape-slice,#games-hub) button:disabled{opacity:.5;cursor:default}
:is(#shape-drop,#shape-slice,#games-hub) .drop-header{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;flex:none;height:44px}:is(#shape-drop,#shape-slice,#games-hub) h2{margin:0;font-size:26px;line-height:1.1;font-weight:1000;color:#07516c}
:is(#shape-drop,#shape-slice,#games-hub) .drop-icon{width:44px;height:44px;min-height:44px;padding:0;border:0;box-shadow:none;background:transparent center/contain no-repeat}:is(#shape-drop,#shape-slice,#games-hub) .drop-icon-close{background-image:url('assets/close-v45.webp')}:is(#shape-drop,#shape-slice,#games-hub) .drop-icon-pause{background-image:url('assets/pause-v30.webp')}
:is(#shape-drop,#shape-slice,#games-hub) .drop-action{display:grid;place-items:center;min-height:50px;width:210px;max-width:100%;aspect-ratio:3;margin:0 auto;padding:8px 18px;background:transparent url('assets/action-v45.webp') center/contain no-repeat;border:0;box-shadow:none;color:#694800;font-weight:1000;font-size:21px;text-shadow:0 1px #fff7b9}
:is(#shape-drop,#shape-slice,#games-hub) .drop-secondary{background:#e2faff;border:2px solid #5cbbd0;box-shadow:none;border-radius:15px;padding:10px 24px;min-height:44px;color:#07516c;font-weight:900;font-size:16px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-sprite{display:inline-block;width:42px;height:42px;background-repeat:no-repeat;flex:none;vertical-align:middle;pointer-events:none}
:is(#shape-drop,#shape-slice,#games-hub)[data-view='menu']{height:fit-content;max-height:calc(100dvh - 12px);width:min(430px,calc(100vw - 12px));overflow:auto;scrollbar-width:none}:is(#shape-drop,#shape-slice,#games-hub) .drop-game-card{display:flex;flex-direction:column;align-items:center;gap:7px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-preview-board{position:relative;width:100%;height:200px;border:2px solid #78e9f3;border-radius:20px;overflow:hidden;background:linear-gradient(#b3f5ff13 1px,transparent 1px),linear-gradient(90deg,#b3f5ff13 1px,transparent 1px),radial-gradient(ellipse at 40% 5%,#0d5774,#05243d);background-size:34px 34px,34px 34px,100% 100%;box-shadow:inset 0 -6px 22px #001629}
:is(#shape-drop,#shape-slice,#games-hub) .drop-preview-piece{position:absolute;width:57px;height:57px;z-index:1;filter:drop-shadow(0 4px 4px #00172788)}:is(#shape-drop,#shape-slice,#games-hub) .drop-preview-trail{position:absolute;top:0;left:54%;height:20%;width:3px;background:linear-gradient(transparent,#65dfff);box-shadow:0 0 12px #3be7ff}
:is(#shape-drop,#shape-slice,#games-hub) .drop-eyebrow{font-size:11px;font-weight:1000;letter-spacing:2px;margin:5px 0 0;color:#177b92}:is(#shape-drop,#shape-slice,#games-hub) .drop-game-card h3{font-size:34px;font-weight:1000;margin:0;line-height:1.1}:is(#shape-drop,#shape-slice,#games-hub) .drop-description{font-size:14px;margin:0;color:#226c82}:is(#shape-drop,#shape-slice,#games-hub) .drop-copy{font-size:13px;line-height:1.4;margin:0 4px;color:#28687d;max-width:320px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-match-example{display:grid;grid-template-columns:32px 12px 32px auto;align-items:center;justify-content:center;gap:4px 7px;margin:5px 0}:is(#shape-drop,#shape-slice,#games-hub) .drop-match-example .drop-sprite{width:32px;height:32px}:is(#shape-drop,#shape-slice,#games-hub) .drop-match-example span:last-child,:is(#shape-drop,#shape-slice,#games-hub) .drop-match-example span:nth-child(4){font-size:13px;text-align:left;font-weight:900;margin-left:4px}:is(#shape-drop,#shape-slice,#games-hub) .drop-best-summary{font-size:15px;margin:2px 0 4px;font-weight:900}
:is(#shape-drop,#shape-slice,#games-hub) .drop-hud{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:none;padding:0 9px;min-height:45px}:is(#shape-drop,#shape-slice,#games-hub) .drop-score-box{display:flex;flex-direction:column;align-items:flex-start;min-width:65px}:is(#shape-drop,#shape-slice,#games-hub) .drop-score-box>span{font-weight:1000;font-size:10px;letter-spacing:1.5px;color:#347c91}:is(#shape-drop,#shape-slice,#games-hub) .drop-score-box>strong{font-size:27px;line-height:1.1;font-weight:1000;font-variant-numeric:tabular-nums}
:is(#shape-drop,#shape-slice,#games-hub) .drop-next{display:flex;align-items:center;gap:4px;color:#347c91;font-size:10px;font-weight:1000;letter-spacing:1px}:is(#shape-drop,#shape-slice,#games-hub) .drop-next .drop-sprite{width:30px;height:30px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-stage{position:relative;flex:1;min-height:0;width:100%;overflow:hidden}:is(#shape-drop,#shape-slice,#games-hub) .drop-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none;border-radius:16px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-timer{height:5px;background:#c0e8ee;border-radius:9px;overflow:hidden;flex:none;margin:0 8px}:is(#shape-drop,#shape-slice,#games-hub) .drop-timer>span{height:100%;width:100%;display:block;transform-origin:left;background:linear-gradient(90deg,#139cbd,#47d8d3);border-radius:9px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-help{display:flex;flex-direction:column;gap:1px;flex:none;font-size:12px;line-height:1.25;font-weight:900;min-height:30px}:is(#shape-drop,#shape-slice,#games-hub) .drop-auto-label{font-size:10px;color:#478194;font-variant-numeric:tabular-nums}
:is(#shape-drop,#shape-slice,#games-hub) .drop-controls{display:grid;grid-template-columns:44px minmax(100px,1fr) 44px 44px;align-items:center;gap:6px;flex:none;padding:0 4px;min-height:54px}:is(#shape-drop,#shape-slice,#games-hub) .drop-controls .drop-action{width:100%;min-height:50px;max-height:70px;font-size:21px;padding:4px 10px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-nudge{width:44px;height:44px;min-height:44px;padding:0;border:1px solid #71c6d7;background:linear-gradient(#f6ffff,#bfeaf4);border-radius:14px;box-shadow:0 3px 0 #69aaba;color:#07516c;font-size:33px;line-height:1;font-weight:900}:is(#shape-drop,#shape-slice,#games-hub) .drop-rotate{font-size:26px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-overlay{position:absolute;inset:0;z-index:4;background:#002b49bd;backdrop-filter:blur(3px);display:grid;place-items:center;padding:15px;border-radius:18px}
:is(#shape-drop,#shape-slice,#games-hub) .drop-panel{display:flex;flex-direction:column;align-items:center;gap:12px;width:min(350px,100%);max-height:100%;overflow:auto;padding:22px 12px;border:16px solid transparent;border-image:url('assets/menu-panel-v240.webp') 70 fill / 16px / 0 stretch;background:transparent;border-radius:22px;box-shadow:0 10px 35px #00152766}:is(#shape-drop,#shape-slice,#games-hub) .drop-panel p{margin:0;font-size:14px;line-height:1.35}:is(#shape-drop,#shape-slice,#games-hub) .drop-panel .drop-eyebrow{font-size:10px}:is(#shape-drop,#shape-slice,#games-hub) .drop-result-score{font-size:65px;line-height:1;font-weight:1000;color:#087e9a}:is(#shape-drop,#shape-slice,#games-hub) .drop-result-best{font-weight:1000}:is(#shape-drop,#shape-slice,#games-hub) .drop-reward{color:#8c6010;font-weight:900;background:#fff2b4;border-radius:20px;padding:8px 16px}:is(#shape-drop,#shape-slice,#games-hub) .drop-save-note{font-size:12px!important}
@media(max-height:650px){:is(#shape-drop,#shape-slice,#games-hub){gap:3px!important;border-width:10px;border-image-width:10px;padding:3px 5px 6px}:is(#shape-drop,#shape-slice,#games-hub) .drop-preview-board{height:120px}:is(#shape-drop,#shape-slice,#games-hub) .drop-game-card{gap:4px}:is(#shape-drop,#shape-slice,#games-hub) .drop-game-card h3{font-size:28px}:is(#shape-drop,#shape-slice,#games-hub) .drop-match-example{margin:0}:is(#shape-drop,#shape-slice,#games-hub) .drop-copy{font-size:12px}:is(#shape-drop,#shape-slice,#games-hub) .drop-hud{min-height:35px}:is(#shape-drop,#shape-slice,#games-hub) .drop-score-box>strong{font-size:23px}:is(#shape-drop,#shape-slice,#games-hub) .drop-panel{gap:7px;padding:10px}:is(#shape-drop,#shape-slice,#games-hub) .drop-help{min-height:25px;font-size:10px}}
@media(orientation:landscape) and (max-height:550px){:is(#shape-drop,#shape-slice,#games-hub)[data-view='play']{width:min(860px,calc(100vw - 12px));display:grid;grid-template-columns:160px 1fr 175px;grid-template-rows:44px 1fr 20px 50px;gap:6px}:is(#shape-drop,#shape-slice,#games-hub) .drop-header{grid-column:1;grid-row:1}:is(#shape-drop,#shape-slice,#games-hub) .drop-header h2{font-size:20px}:is(#shape-drop,#shape-slice,#games-hub) .drop-header-spacer{width:0}:is(#shape-drop,#shape-slice,#games-hub) .drop-header{grid-template-columns:44px 1fr}:is(#shape-drop,#shape-slice,#games-hub) .drop-hud{grid-column:1;grid-row:2;flex-direction:column;justify-content:center;align-items:center;gap:15px}:is(#shape-drop,#shape-slice,#games-hub) .drop-score-box{align-items:center}:is(#shape-drop,#shape-slice,#games-hub) .drop-stage{grid-column:2;grid-row:1/5;height:100%}:is(#shape-drop,#shape-slice,#games-hub) .drop-timer{grid-column:3;grid-row:3}:is(#shape-drop,#shape-slice,#games-hub) .drop-help{grid-column:3;grid-row:2;align-self:center;line-height:1.5}:is(#shape-drop,#shape-slice,#games-hub) .drop-controls{grid-column:3;grid-row:4;grid-template-columns:44px 1fr 44px;padding:0;gap:3px}:is(#shape-drop,#shape-slice,#games-hub) .drop-rotate{grid-column:2;grid-row:2;position:absolute;right:75px;top:15px}:is(#shape-drop,#shape-slice,#games-hub) .drop-controls .drop-action{font-size:16px;min-width:65px;padding:0}}

:is(#shape-drop,#shape-slice,#games-hub) .drop-game-card>.drop-action{width:260px;font-size:20px;white-space:nowrap}

:is(#shape-drop,#shape-slice,#games-hub):not([open]){display:none!important}

.mini-run-coins{display:flex;align-items:center;justify-content:center;gap:4px;color:#ffe89a;font:1000 17px Nunito,sans-serif;text-shadow:0 2px 3px #164254;white-space:nowrap;font-variant-numeric:tabular-nums;pointer-events:none}
.mini-run-coins img{width:24px;height:24px;object-fit:contain}
.mini-run-coins strong{max-width:65px;overflow:hidden;text-overflow:ellipsis}

:is(#shape-drop,#shape-slice,#games-hub) button:focus-visible{filter:brightness(1.08)}

/* Pause and completion menus reuse the main game's intact 2:3 frame and gold action artwork. */
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-overlay:has(:is(.drop-pause-panel,.drop-result-panel)){background:#002940b8;backdrop-filter:blur(3px);padding:18px}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel:is(.drop-pause-panel,.drop-result-panel){
 --pause-width:min(380px,calc(100vw - 36px),calc((100dvh - 36px)*2/3));
 width:var(--pause-width);height:calc(var(--pause-width)*1.5);max-width:none;max-height:none;
 flex:none;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
 gap:16px;margin:0;padding:42px 30px 28px;border:0;border-image:none;border-radius:24px;
 background:transparent url('assets/menu-panel-v240.webp') center/contain no-repeat;
 box-shadow:0 16px 54px #001f4770;color:#12465b;text-align:center;overflow:auto;scrollbar-width:thin;
}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel:is(.drop-pause-panel,.drop-result-panel) h2{margin:0 0 12px;padding:0 8px;color:#07566d;font:1000 28px/1.18 Nunito,sans-serif;text-shadow:0 2px #fff}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel:is(.drop-pause-panel,.drop-result-panel) p{margin:0;color:#366778;font-size:14px;line-height:1.3}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel:is(.drop-pause-panel,.drop-result-panel) :is(.drop-action,.drop-secondary){
 display:flex;align-items:center;justify-content:center;flex:none;width:min(100%,270px);height:auto;min-height:44px;aspect-ratio:3;margin:0 auto;padding:8px 16px;
 border:0;border-radius:0;background:transparent url('assets/action-v45.webp') center/contain no-repeat;box-shadow:none;
 color:#684200;font:1000 18px/1.15 Nunito,sans-serif;text-shadow:0 1px #fff4b0;
}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel:is(.drop-pause-panel,.drop-result-panel) button:active{filter:brightness(.9)}
@media(max-height:650px){
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel:is(.drop-pause-panel,.drop-result-panel){padding:30px 22px 22px;gap:10px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel:is(.drop-pause-panel,.drop-result-panel) h2{font-size:24px;margin-bottom:6px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel:is(.drop-pause-panel,.drop-result-panel) :is(.drop-action,.drop-secondary){font-size:16px}
}

/* Completion uses the same blue panel and gold buttons, with room for rewards. */
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel{padding:28px 24px;gap:8px;justify-content:center}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel h2{margin:0}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel .drop-result-score{font-size:64px;color:#087e9a;line-height:1}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel .drop-reward{background:#fff2b4;color:#8c6010;padding:6px 12px;border-radius:20px}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel :is(.drop-action,.drop-secondary){width:min(100%,220px);font-size:17px}
@media(max-height:650px){
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel{padding:18px 20px;gap:5px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel .drop-result-score{font-size:48px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel :is(.drop-action,.drop-secondary){width:min(100%,200px);font-size:16px}
}
@media(max-height:500px){
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel{gap:4px;padding:14px 18px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel :is(.drop-action,.drop-secondary){width:min(100%,180px);min-width:0;font-size:14px;padding:4px;min-height:44px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel h2{font-size:22px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel .drop-result-score{font-size:42px}
}

/* Two-action pause menus size to their contents; preserve the frame corners. */
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-pause-panel{
 width:min(340px,calc(100vw - 36px));height:auto;max-height:calc(100dvh - 36px);
 padding:16px 14px;gap:12px;border:22px solid transparent;
 border-image:url('assets/menu-panel-v240.webp') 70 fill / 22px / 0 stretch;
 background:none;clip-path:inset(0 round 23px);justify-content:center;
}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-pause-panel h2{margin:0 0 4px}
:is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-pause-panel :is(.drop-action,.drop-secondary){width:min(100%,230px)}
@media(max-height:500px){
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-pause-panel{padding:8px 12px;gap:8px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-pause-panel :is(.drop-action,.drop-secondary){width:180px}
 :is(#shape-drop,#shape-slice,#piano-flow)[data-view='play'] .drop-panel.drop-result-panel p{font-size:12px}
}