/* All primary game surfaces fit the visible viewport. Optional settings open over it. */
#game #playroom-focus.fit-activity{position:fixed!important;inset:auto!important;top:var(--play-top,0px)!important;left:var(--play-left,0px)!important;width:var(--play-vw,100vw)!important;height:var(--play-vh,100dvh)!important;box-sizing:border-box;display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr) auto auto!important;gap:5px!important;padding:max(6px,env(safe-area-inset-top)) max(6px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))!important;overflow:hidden!important;align-items:stretch!important}
#game #playroom-focus[hidden]{display:none!important}
#game .fit-activity .play-head{position:relative!important;inset:auto!important;display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px!important;grid-template-rows:44px auto!important;align-items:center!important;gap:3px 6px!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;background:transparent!important;min-height:0!important}
#game .fit-activity .play-head>div{display:contents!important}#game .fit-activity .play-head h1{grid-column:2;grid-row:1;align-self:start;margin:2px 0 0;font-size:19px!important;line-height:23px;text-align:center}#game .fit-activity .play-head p{grid-column:1/-1;grid-row:2;display:block!important;margin:0!important;font-size:13px!important;line-height:17px!important;text-align:center}#game .fit-activity .play-save{grid-column:2;grid-row:1;align-self:end;text-align:center;font-size:10px!important;line-height:12px}
#game .fit-activity #play-close{grid-column:1;grid-row:1;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;padding:2px!important}#game .fit-activity #play-close .control-art{width:34px!important;height:34px!important;max-width:34px!important;max-height:34px!important}#game .fit-activity #play-close .control-label{display:none!important}
#game .fit-activity #play-options{grid-column:3;grid-row:1;width:44px;height:44px;min-width:44px;min-height:44px;padding:6px;color:#315b54;border:1px solid #a48b63;border-radius:12px;background:#fff0d3;display:grid;place-items:center}
#game .fit-activity .play-audio{position:absolute!important;top:48px!important;right:0!important;left:auto!important;z-index:50;display:grid!important;grid-template-columns:repeat(2,76px)!important;gap:5px!important;padding:9px!important;background:#fff1d5!important;border:2px solid #b99a66;border-radius:14px;box-shadow:0 6px 18px #453c4933;max-width:calc(100vw - 16px)}#game .fit-activity .play-audio[hidden]{display:none!important}#game .fit-activity .play-audio button{width:76px!important;min-height:64px!important;margin:0!important}#game .fit-activity .play-audio .control-label{display:block!important;font-size:11px!important;line-height:13px}#game .fit-activity .play-audio .control-art{width:32px!important;height:32px!important}

#game .fit-activity .play-audio{max-height:calc(var(--play-vh,100dvh) - max(6px,env(safe-area-inset-top)) - max(6px,env(safe-area-inset-bottom)) - 52px);overflow-y:auto;overscroll-behavior:contain}
#game .game-reset-confirm{max-height:calc(100dvh - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)));overflow-y:auto}#game .game-reset-confirm button{min-width:120px}

#game .fit-activity #play-stage{grid-column:1;grid-row:2;width:100%!important;height:100%!important;max-width:none!important;min-width:0!important;min-height:0!important;box-sizing:border-box;padding:0!important;margin:0!important;overflow:hidden!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;flex:none!important;position:relative}
#game .fit-activity #play-tools{grid-column:1;grid-row:3;position:static!important;inset:auto!important;transform:none!important;width:100%!important;min-width:0!important;min-height:0!important;height:auto!important;max-height:none!important;box-sizing:border-box;display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:center!important;gap:4px!important;margin:0!important;padding:0!important;overflow:visible!important;background:transparent!important}
#game .fit-activity #play-tools .painted-control{width:52px!important;min-width:44px!important;min-height:48px!important;height:48px!important;padding:2px!important;margin:0!important;gap:0!important}#game .fit-activity #play-tools .control-art{width:28px!important;height:28px!important;max-width:28px!important;max-height:28px!important;object-fit:contain}#game .fit-activity #play-tools .control-label{display:block!important;font-size:10px!important;line-height:12px!important;white-space:nowrap}#game .fit-activity #play-tools button:not(.painted-control){min-height:44px;min-width:44px;padding:4px 8px;font-size:13px}
#game .fit-activity #play-feedback{grid-column:1;grid-row:4;display:block!important;min-height:0!important;max-width:none!important;box-sizing:border-box;padding:0!important;margin:0!important;font-size:13px!important;line-height:17px!important;text-align:center}#game .fit-activity #play-feedback:empty{display:none!important}
#game .fit-activity .play-canvas-shell{flex:none!important;max-width:100%;max-height:100%;margin:0!important;border-width:1px!important;overflow:hidden}#game .fit-activity .play-canvas-shell canvas{width:100%;height:100%;display:block}
#game .fit-activity .plush-intro{padding:2px 8px;gap:6px;min-height:34px;flex:none}#game .fit-activity .plush-portrait{width:32px;height:32px}#game .fit-activity .plush-intro b{font-size:15px;line-height:18px}#game .fit-activity .plush-floor{min-height:0!important;max-height:100%;min-width:0;flex:none;aspect-ratio:auto!important;margin:0!important;box-shadow:none}#game .fit-activity .cushion-hide{min-width:44px;min-height:44px}#game .fit-activity.activity-plush #play-stage{flex-direction:column!important}
#game .fit-activity .ring-board{flex:none;min-width:0!important;min-height:0!important;margin:0!important;max-height:100%;padding:0!important}
#game .fit-activity .puzzle-layout{width:100%;height:100%;gap:8px!important;display:flex;flex-direction:row!important;justify-content:center;align-items:center}#game .fit-activity .puzzle-frame{flex:none;max-width:none;border-width:5px!important;gap:3px;box-sizing:border-box}#game .fit-activity .puzzle-reference{flex:none;padding:3px!important;transform:none;box-sizing:border-box}#game .fit-activity .puzzle-reference small{font-size:10px;margin:3px 0 0}
#game .fit-activity .game-counter{font-size:14px;line-height:20px;min-height:20px;flex:none;margin:0}#game .fit-activity .rhythm-progress{min-height:20px;height:20px;gap:6px;flex:none}#game .fit-activity .rhythm-progress i{width:16px;height:16px}
#game .fit-activity .fishing-board,#game .fit-activity .rhythm-board,#game .fit-activity .rail-board{min-width:0!important;min-height:0!important;max-width:100%!important;flex:none;box-sizing:border-box;margin:0!important}#game .fit-activity.activity-fishing #play-stage,#game .fit-activity.activity-rhythm #play-stage,#game .fit-activity.activity-railway #play-stage{flex-direction:column!important}
#game .fit-activity .rail-board{padding:6px;border-width:4px;gap:4px}#game .fit-activity .rail-cell{min-width:44px;min-height:44px;padding:0!important}#game .fit-activity .note-key span{font-size:11px;bottom:-17px}
#game .fit-activity.activity-alphabet .play-head p{display:none!important}#game .fit-activity.activity-alphabet #play-feedback{display:none!important}#game .fit-activity.activity-alphabet #play-tools{height:44px!important;gap:8px!important}#game .fit-activity .toddler-small{width:44px;height:44px;min-width:44px;min-height:44px}#game .fit-activity .toddler-board{width:var(--fit-board-w,100%)!important;height:var(--fit-board-h,100%)!important;max-width:100%;max-height:100%;aspect-ratio:auto!important;box-shadow:none}
#game .fit-activity.activity-cat{grid-template-rows:auto minmax(0,1fr)!important}#game .fit-activity.activity-cat #play-stage{padding:0!important;overflow:hidden!important}#game .fit-activity.activity-cat .cat-frame{width:100%!important;height:100%!important;min-height:0!important;border:0}#game .fit-activity.activity-cat #play-tools,#game .fit-activity.activity-cat #play-feedback{display:none!important}
#game .fit-activity .ink-tray{display:flex;flex-wrap:wrap;justify-content:center;gap:3px}#game .fit-activity .ink{width:44px;height:44px;min-width:44px;min-height:44px}#game .fit-activity .draw-actions{display:flex;gap:3px;flex-wrap:wrap;justify-content:center}
#game .fit-activity.short-play:not(.activity-cat){grid-template-columns:minmax(0,1fr) 124px!important;grid-template-rows:44px minmax(0,1fr) auto!important;column-gap:6px!important}#game .fit-activity.short-play .play-head{grid-column:1/-1;grid-row:1;grid-template-rows:44px!important}#game .fit-activity.short-play .play-head p{display:none!important}#game .fit-activity.short-play #play-stage{grid-column:1;grid-row:2}#game .fit-activity.short-play #play-tools{grid-column:2;grid-row:2/4;align-self:center;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;justify-items:center;gap:3px!important}#game .fit-activity.short-play #play-feedback{grid-column:1;grid-row:3;font-size:12px!important;line-height:15px!important}#game .fit-activity.short-play.activity-alphabet #play-tools{grid-template-columns:1fr!important;height:auto!important}#game .fit-activity.short-play.activity-alphabet{grid-template-columns:minmax(0,1fr) 48px!important}#game .fit-activity.short-play.activity-cat{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:44px minmax(0,1fr)!important}#game .fit-activity.short-play.activity-cat .play-head p{display:none!important}
#game .fit-activity .toy-hit-layer{position:absolute;left:0;top:0;width:100%;height:100%}#game .fit-activity .toy-hit-layer>img{width:100%;height:100%;display:block;pointer-events:none}#game .fit-activity.short-play .rhythm-board,#game .fit-activity.short-play .fishing-board{overflow:hidden}#game .fit-activity.short-play .note-key span{display:none}#game .fit-activity #play-tools .game-counter,#game .fit-activity #play-tools .rhythm-progress,#game .fit-activity #play-tools .surface-caption{grid-column:1/-1;width:100%;font-size:14px;line-height:18px;text-align:center;min-height:18px;flex-basis:100%}#game .fit-activity.short-play.activity-drawing{grid-template-columns:minmax(0,1fr) 192px!important}#game .fit-activity.short-play.activity-drawing #play-tools{grid-template-columns:1fr!important}#game .fit-activity.short-play.activity-drawing .ink-tray{display:grid;grid-template-columns:repeat(4,44px);gap:3px}#game .fit-activity.short-play.activity-drawing .draw-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px}
#game .fit-activity .ink-tray{padding:0!important;gap:3px!important}#game .fit-activity .rotate-play-hint{position:absolute;inset:54px 8px 8px;z-index:40;display:grid;place-items:center;text-align:center;padding:18px;background:#f8edcf;border:2px solid #c5a77b;border-radius:16px;font-size:22px;line-height:1.6;color:#315b54}#game .fit-activity .rotate-play-hint[hidden]{display:none!important}

#game .fit-activity .play-head p{padding:0!important;background:none!important;border:0!important}#game .fit-activity .play-head p:before{display:none!important}
#game .fit-activity .rotate-play-hint{padding:12px;font-size:18px;line-height:24px}#game .fit-activity .rotate-play-hint>div{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:12px;max-width:440px}#game .fit-activity .rotate-play-hint svg{width:44px;height:54px}#game .fit-activity .rotate-play-hint p{margin:0}

#game .activity-rhythm .note-key:disabled{pointer-events:none}
#game #play-stage:focus-visible{outline:3px dashed #6a9487;outline-offset:-4px}

/* Illuminate the original painted wood, clipped to each actual bar silhouette. */
#game .rhythm-bar-lights{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
#game .rhythm-bar-light{opacity:0;filter:brightness(1.5) saturate(1.08);transition:opacity 100ms ease-out}
#game .rhythm-bar-light.lit{opacity:1}
#game .activity-rhythm .note-key.flash{box-shadow:none!important;background:transparent!important}
#game .activity-rhythm .note-key span{display:none}
@media(prefers-reduced-motion:reduce){#game .rhythm-bar-light{transition:none}}
/* Compact, readable confirmation keeps both choices visible on phones. */
#game .game-reset-confirm{box-sizing:border-box;width:min(520px,calc(100vw - max(12px,env(safe-area-inset-left)) - max(12px,env(safe-area-inset-right))));padding:16px;font-size:16px;line-height:1.45}
#game .game-reset-confirm h2{font-size:21px;line-height:1.35;margin:0 0 10px}
#game .game-reset-confirm p{margin:0 0 12px}
#game .game-reset-confirm button{min-height:44px;min-width:120px;margin:4px;padding:9px 12px;font:inherit}
