/* Focused, physical play surfaces. Only one activity exists at a time. */
/* Hidden wins over later per-game display overrides, including alphabet and cat. */
#game #playroom-focus[hidden],#game #playroom-nav[hidden]{display:none!important}.playroom-scene #needs,.playroom-scene #speech,.playroom-scene #cozy-dock{display:none!important}.playroom-scene #clock,.playroom-scene #money{display:none}.playroom-scene .hud{max-width:900px;right:12px;left:12px;margin:auto;box-shadow:0 3px 16px #25475d16;background:#edf5f3ed}.playroom-scene .hotspot .scene-caption{display:none}.playroom-scene .hotspot:hover .scene-caption,.playroom-scene .hotspot:focus-visible .scene-caption{display:block;padding:5px 9px;background:#fff4d9;border-radius:7px;text-shadow:none;z-index:4;max-width:140px}.playroom-scene .hotspot:before{width:9px;height:9px;border-width:2px;opacity:.83}.playroom-scene .hotspot{border:0!important}.playroom-scene .status-line #movement-hint,.playroom-scene .status-line #info{display:none}.playroom-scene #room-canvas{touch-action:none}.playroom-scene .status-line{justify-content:flex-end;left:12px;right:auto;bottom:5px;font-size:11px}
#playroom-nav{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);display:flex;gap:7px;padding:6px;background:#edf5f2e8;border:1px solid #adc5c7;border-radius:30px;z-index:4}#playroom-nav button{min-height:42px;padding:5px 22px;border:0;background:transparent;box-shadow:none;font-size:15px}#playroom-nav button:hover{background:#d9e8e8}.playroom-playing #play-ui,.playroom-playing #room,.playroom-playing #playroom-nav,.playroom-playing #world{visibility:hidden;pointer-events:none}
#playroom-focus{position:absolute;inset:0;z-index:8;display:grid;grid-template-rows:auto minmax(0,1fr) auto minmax(24px,auto);background:#e8d7b8;color:#284b5f;padding:18px max(18px,env(safe-area-inset-left)) max(10px,env(safe-area-inset-bottom));gap:10px;overflow:hidden;font-family:Thmanyah,sans-serif}#playroom-focus button{min-height:44px;border:1px solid #709298;box-shadow:0 2px 0 #294b5924;background:#f9f1dc;border-radius:10px;padding:7px 17px;color:#294f65;font-family:inherit;font-size:16px;line-height:1.25;touch-action:manipulation}#playroom-focus button:hover{background:#fff9e8}#playroom-focus button:focus-visible{outline:3px solid #417fa3;outline-offset:3px}#playroom-focus button:disabled{opacity:.4;cursor:default}.play-head{display:flex;align-items:center;gap:18px;max-width:1200px;width:100%;margin:auto}.play-head h1{font-size:24px;margin:0 0 2px;line-height:1.2}.play-head p{font-size:16px;margin:0;line-height:1.5}.play-head .back-to-room{flex:none;background:#28546d!important;color:#fff5df!important;border-color:#28546d!important}.play-save{margin-right:auto;font-size:12px}#play-stage{position:relative;min-height:0;display:flex;align-items:center;justify-content:center;overflow:auto;padding:10px;width:100%;max-width:1240px;margin:auto}#play-tools{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;max-width:1200px;margin:auto}#play-feedback{margin:0 auto;max-width:1050px;font-size:16px;text-align:center;min-height:24px;line-height:1.4}#playroom-focus .primary{background:#28546d;color:#fff6df;border-color:#28546d}.play-canvas-shell{position:relative;aspect-ratio:var(--ratio);width:min(100%,calc((100dvh - 190px)*var(--ratio)));max-height:100%;overflow:hidden;border-radius:22px;box-shadow:0 10px 24px #71553d25;border:1px solid #9d8469}.play-canvas-shell canvas{display:block;width:100%;height:100%;touch-action:none;user-select:none}.activity-blocks,.activity-marble{background:radial-gradient(ellipse at 50% 35%,#f1e6d0,#dbbe96)!important}
/* The cover and the opened pages stay tangible, never a text dialog. */
.activity-library,.activity-book{background:radial-gradient(ellipse at 50% 30%,#d3b084,#af815d)!important}.book-shelf{display:flex;align-items:center;justify-content:center;gap:6vw;max-width:1000px;width:100%;padding:30px 25px 55px;position:relative}.book-shelf:after{content:'';position:absolute;bottom:25px;left:0;right:0;height:25px;background:linear-gradient(#b27e4b,#8e5e37);border-radius:3px;box-shadow:0 12px 12px #67452845;z-index:0}#playroom-focus .story-cover{position:relative;z-index:1;background:var(--book-color);border:0;width:38%;max-width:330px;padding:0 0 25px;box-shadow:8px 7px 0 #f7edd1,12px 12px 0 #5d4939,18px 20px 20px #422d3a35;border-radius:3px 12px 12px 3px;overflow:hidden;transform:rotate(-3deg);color:#fff6df;transition:transform .2s}#playroom-focus .story-cover:nth-child(2){transform:rotate(3deg)}#playroom-focus .story-cover:hover{transform:translateY(-8px) rotate(0)}.cover-art{display:block;aspect-ratio:1;min-height:150px;background-size:200% 200%;margin:15px 16px 15px 24px;border:3px solid #f9eac380;border-radius:4px}.story-cover b{display:block;font-size:clamp(19px,2.5vw,30px);padding:0 13px}.story-cover small{display:block;font-size:14px;margin-top:8px}.cover-spine{position:absolute;left:0;top:0;bottom:0;width:14px;background:#0002;box-shadow:inset -2px 0 2px #fff3}.open-book{width:min(1120px,100%);display:grid;direction:ltr;grid-template-columns:1fr 1fr;align-items:center;background:#fff6df;border-radius:8px 16px 16px 8px;box-shadow:0 4px #e6d8b7,0 9px #eee1c4,0 14px #5e7055,0 20px 35px #3d332947;position:relative;padding:22px 28px;gap:35px;margin:6px 0 23px;min-height:440px}.open-book:after{content:'';position:absolute;top:0;bottom:0;width:24px;left:calc(50% - 12px);background:linear-gradient(90deg,#0000,#95765518,#7e604726,#fff6,#0000);pointer-events:none}.book-art{width:100%;aspect-ratio:var(--art-ratio,1.3333);background-size:200% 200%;border-radius:3px;box-shadow:0 2px 5px #66543a16}.book-page{direction:rtl;text-align:right;position:relative;padding:12px 15px 28px;align-self:stretch;display:flex;flex-direction:column;justify-content:center}.book-page h2{font-size:clamp(24px,2.6vw,34px);margin:8px 0 16px;color:#8e503f}.book-page p{font-size:clamp(20px,2vw,27px);line-height:1.85;margin:0;color:#3d504c}.book-number{position:absolute;bottom:0;left:0;color:#a18c67;font-size:15px}.page-corner{position:absolute;left:-8px;bottom:-15px;width:25px;height:25px;background:linear-gradient(45deg,#d5c7a8 50%,#fff8e9 51%);border-radius:0 0 5px 0}.turning{animation:bookturn .3s ease-out}@keyframes bookturn{from{opacity:.55;transform:perspective(1200px) rotateY(-4deg)}to{opacity:1;transform:perspective(1200px) rotateY(0)}}#book-count{min-width:60px;text-align:center;font-size:18px}
/* Crayons and board. */
.activity-drawing{background:#d4c09f!important}.board-frame{border:15px solid #b77e4b;border-top-color:#c59059;border-bottom-color:#926039;box-shadow:inset 0 0 0 2px #735338,0 12px 25px #71523440;border-radius:9px;background:#f7f2df}.paper-frame{border:15px solid #f7edd6;box-shadow:0 12px 25px #71523440;transform:rotate(-.4deg);background:#fffaf0;border-radius:2px}.ink-tray,.draw-actions{display:flex;gap:7px;align-items:center;justify-content:center}.ink-tray{padding:8px 14px;background:#ae7950;border-radius:9px;box-shadow:inset 0 2px 3px #70472855}#playroom-focus .ink{border:3px solid #fff8;width:40px;min-height:40px;height:40px;padding:0;border-radius:50%;background:var(--ink);box-shadow:0 2px 0 #0003}#playroom-focus .ink:hover{background:var(--ink);transform:translateY(-2px)}#playroom-focus .ink.selected{outline:3px solid #284e66;outline-offset:3px;transform:translateY(-4px)}#draw-erase.selected{background:#284e66;color:white}
/* Wooden rings. */
.ring-board{position:relative;width:min(900px,100%);aspect-ratio:2;background:#dcc5a1;border:13px solid #ba936a;border-radius:25px;display:flex;padding:20px 12px 30px;box-shadow:0 15px 20px #674d3025}#playroom-focus .ring-peg{position:relative;background:transparent;border:0;box-shadow:none;flex:1;border-radius:10px}.peg-stick{position:absolute;left:calc(50% - 8px);bottom:24%;width:16px;height:64%;background:linear-gradient(90deg,#ba864e,#edc68c,#b68650);border-radius:10px}.peg-base{position:absolute;left:3%;right:3%;bottom:20%;height:8%;background:#a7774c;border-radius:50%}.wood-ring{position:absolute;display:block;left:50%;transform:translateX(-50%);height:13%;border-radius:50%;box-shadow:inset 0 4px 0 #fff4,inset 0 -5px 0 #0002,0 4px 4px #654a3d40;border:1px solid #855c4330;transition:bottom .2s}#playroom-focus .ring-peg.holding{outline:3px dashed #325b6e;outline-offset:-5px}.ring-peg.holding .wood-ring:last-of-type{transform:translate(-50%,-25px)}.ring-peg b{position:absolute;bottom:0;left:0;right:0;font-size:18px}
/* Picture pieces remain photographic illustrations. */
.puzzle-layout{display:flex;align-items:center;gap:35px;max-width:1000px;width:100%;justify-content:center}.puzzle-frame{width:65%;max-width:660px;aspect-ratio:4/3;background:#ac8459;border:12px solid #ad8054;border-radius:8px;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;box-shadow:0 12px 20px #64493330}#playroom-focus .puzzle-tile{padding:0;border:0;box-shadow:inset 0 0 0 1px #fff4;overflow:hidden;min-height:0;border-radius:3px;position:relative;background:none}.puzzle-tile span{display:block;width:100%;height:100%;background-image:url('assets/playroom/cloud-panels.webp');background-size:600% 600%}.puzzle-tile.selected{outline:5px solid #f0c460!important;outline-offset:-5px;transform:scale(.94)}.puzzle-reference{width:24%;background:#fff3d7;padding:12px 12px 8px;box-shadow:0 6px 12px #67462c30;transform:rotate(4deg)}.puzzle-reference span{display:block;aspect-ratio:4/3;background-size:200% 200%}.puzzle-reference small{display:block;text-align:center;margin-top:8px;font-size:14px}
/* Soft toys have their own physical floor; cushions visibly travel. */
.activity-plush #play-stage{flex-direction:column;justify-content:center;gap:14px}.plush-intro{display:flex;align-items:center;gap:12px;flex:none}.plush-portrait{width:65px;height:65px;background-image:url('assets/playroom/plush-sprites.webp');background-size:200% 200%}.plush-intro b{font-size:23px}.plush-floor{width:min(980px,100%);height:min(390px,43vh);position:relative;border-radius:50%;background:repeating-radial-gradient(ellipse,#d89974 0 4px,#dfaa83 5px 8px);box-shadow:0 9px 15px #8c694530}#playroom-focus .cushion-hide{position:absolute;bottom:0;width:33.333%;height:100%;border:0;box-shadow:none;background:transparent;padding:0;transition:left .7s ease-in-out}.plush-friend{position:absolute;left:18%;width:64%;aspect-ratio:1;bottom:16%;background-image:url('assets/playroom/plush-sprites.webp');background-size:200% 200%;transform:scale(.85);transition:transform .4s}.cushion-cover{position:absolute;left:6%;bottom:8%;width:88%;height:68%;border-radius:35%;background:linear-gradient(155deg,#b7c8d6,#7a9db6);box-shadow:inset 0 0 0 6px #d4dfdf99,inset 0 0 0 9px #6c8ba577,0 12px 9px #71523c35;transition:transform .5s,opacity .4s}.cushion-hide:nth-child(2) .cushion-cover{background:linear-gradient(155deg,#e9cc96,#c69f68)}.cushion-hide:nth-child(3) .cushion-cover{background:linear-gradient(155deg,#c9b7d7,#a183b6)}.cushion-hide.revealed .cushion-cover{transform:translateY(-96%) rotate(-10deg);opacity:.45}.cushion-hide.revealed .plush-friend{transform:scale(1)}
@media(max-width:650px){#playroom-focus{padding:10px 8px max(8px,env(safe-area-inset-bottom));gap:7px}.play-head{gap:10px;align-items:flex-start}.play-head h1{font-size:20px;margin-top:3px}.play-head p{font-size:14px;line-height:1.45}.play-head .back-to-room{font-size:12px!important;padding:7px 9px!important;min-width:72px;min-height:45px!important}.play-save{display:none}#play-stage{padding:6px 2px;align-items:center}#play-tools{gap:6px}#playroom-focus button{font-size:14px;min-height:44px;padding:8px 12px}#play-feedback{font-size:14px;line-height:1.4;min-height:38px;max-width:96%}.play-canvas-shell{width:100%;max-height:none;border-radius:14px}.activity-blocks #play-stage,.activity-marble #play-stage,.activity-puppets #play-stage{align-items:center}.activity-blocks #play-tools button{font-size:13px;padding:7px 9px}.playroom-scene .hud{right:6px;left:6px}.playroom-scene .place-name b{font-size:19px}#playroom-nav{bottom:28px;padding:4px;gap:2px;width:300px;justify-content:center}#playroom-nav button{min-height:43px;padding:4px 22px}.book-shelf{gap:23px;padding:15px 14px 45px}.story-cover{width:45%!important;padding-bottom:17px!important}.cover-art{margin:10px 10px 12px 15px;min-height:0;aspect-ratio:.8}.story-cover b{font-size:19px;padding:0 8px}.story-cover small{font-size:12px;padding:0 9px;line-height:1.5}.activity-book #play-stage{align-items:flex-start;overflow:auto;padding:0 8px}.open-book{display:flex;flex-direction:column;gap:0;padding:15px 15px 24px;min-height:0;border-radius:5px 12px 12px 5px;margin:8px 0 20px;box-shadow:4px 3px #e6d8b7,7px 7px #eee1c4,10px 10px #5e7055}.open-book:after{left:4px;width:9px;opacity:.6}.book-art{flex:none;max-width:100%;margin:0}.book-page{padding:12px 3px 15px;display:block}.book-page h2{font-size:24px;margin:2px 0 7px}.book-page p{font-size:19px;line-height:1.8}.book-number{bottom:-8px;font-size:13px}.page-corner{bottom:-16px;left:-10px}.activity-book #play-tools{width:100%;display:grid;grid-template-columns:1fr auto 1fr;gap:5px}.activity-book #book-shelf{grid-column:1/-1;max-width:150px;justify-self:center;min-height:36px;font-size:13px;padding:5px 14px;background:transparent;border-color:#856a4f}.activity-book #play-feedback{display:none}.activity-book{grid-template-rows:auto minmax(0,1fr) auto!important}.board-frame{border-width:10px;border-radius:5px}.paper-frame{border-width:10px}.activity-drawing #play-tools{flex-direction:column;gap:10px;width:100%}.ink-tray{gap:7px;padding:8px 10px}#playroom-focus .ink{width:36px;height:36px;min-height:36px;border-width:2px}.draw-actions{gap:5px;width:100%}.draw-actions button{font-size:12px!important;padding:7px 8px!important}.ring-board{aspect-ratio:1.4;border-width:8px;padding:10px 5px 22px}.ring-peg b{font-size:15px}.peg-stick{width:12px;left:calc(50% - 6px)}.puzzle-layout{flex-direction:column;gap:18px}.puzzle-frame{width:96%;border-width:8px;gap:3px}.puzzle-reference{width:36%;padding:7px}.puzzle-reference small{font-size:11px;margin-top:4px}.plush-intro b{font-size:20px}.plush-floor{height:260px}.plush-portrait{width:50px;height:50px}.cushion-cover{height:46%;bottom:10%}.plush-friend{bottom:15%}#playroom-focus .cushion-hide{transition-duration:.85s}}
@media(max-height:560px) and (min-width:651px){#playroom-focus{gap:5px;padding:8px 12px}.play-head h1{font-size:19px}.play-head p{font-size:13px}.play-canvas-shell{width:min(100%,calc((100dvh - 150px)*var(--ratio)))}#play-feedback{font-size:13px;min-height:20px}#playroom-focus button{min-height:37px;font-size:13px}.open-book{min-height:0;padding:13px 20px;gap:25px;max-width:800px}.book-page h2{font-size:20px;margin:3px 0 6px}.book-page p{font-size:16px;line-height:1.6}.book-art{max-height:240px}.book-shelf{max-width:560px}.cover-art{min-height:0;max-height:180px}.story-cover b{font-size:19px}.story-cover small{font-size:12px}}
@media(prefers-reduced-motion:reduce){.turning{animation:none}.cushion-hide,.cushion-cover,.plush-friend{transition-duration:.01s!important}}
.play-save{display:block!important;font-size:12px;color:#596e69;margin-top:2px;min-height:14px}.play-save.error{color:#923d31;background:#fff4da;padding:3px 7px;border-radius:4px}
.draft-recovery{position:absolute;inset:10px;z-index:4;overflow:auto;margin:auto;max-width:650px;max-height:650px;background:#f6efd9;border:2px solid #9a805d;border-radius:18px;padding:20px;text-align:center;box-shadow:0 10px 40px #24445460}.draft-recovery h2{margin:0}.draft-recovery p{line-height:1.7}.draft-previews{display:flex;gap:12px;justify-content:center}.draft-previews figure{margin:0;width:46%}.draft-previews canvas{width:100%;border:7px solid #b2814c;border-radius:3px}.draft-recovery button{margin:10px 4px;min-height:44px}
@media(max-width:650px){.ink-tray{gap:3px;padding:8px}#playroom-focus .ink{width:44px;height:44px;min-height:44px}.play-head p{font-size:14px}}
.book-ribbon{position:absolute;top:-5px;right:35px;width:19px;height:45px;background:#af594a;z-index:2;clip-path:polygon(0 0,100% 0,100% 100%,50% 83%,0 100%);box-shadow:2px 2px 3px #73564133;pointer-events:none}
@media(max-width:650px){.open-book{border-right:10px solid #496555;border-top:3px solid #496555;border-bottom:3px solid #496555;border-radius:3px 12px 12px 3px;padding-right:12px;background:linear-gradient(90deg,#fff7df 90%,#e9dcc0);box-shadow:-2px 2px #d6c9a8,-4px 4px #fff1d2,-6px 6px #d6c9a8,-8px 8px #f9e9c8,-10px 10px #496555,2px 12px 16px #47352d45}.open-book:after{left:auto;right:0;width:13px;background:linear-gradient(90deg,#84664300,#84664330);opacity:1}.book-ribbon{right:24px;height:37px;width:16px}.page-corner{width:30px;height:30px;left:-12px;bottom:-17px;box-shadow:1px -1px 2px #8b72542b}.activity-book #play-stage{padding-left:17px;padding-right:10px}}
.play-head{direction:ltr}.play-head>div{direction:rtl;text-align:right;flex:1}.play-head .back-to-room{order:0}
.ramp-select{display:flex;gap:5px}#playroom-focus .ramp-select button{min-width:62px;padding:7px 10px}#playroom-focus .ramp-select button[aria-pressed=true]{background:#28546d;color:#fff5df}
@media(max-width:650px){#playroom-focus.portrait-play{grid-template-rows:auto auto auto auto;align-content:start;gap:8px}.portrait-play #play-stage{padding:3px 2px;overflow:hidden;align-items:center}.portrait-play #play-tools{margin:0 auto}.portrait-play #play-feedback{margin:0 auto}.portrait-play .play-canvas-shell{border-radius:18px}.portrait-play .play-head{min-height:76px}.portrait-play .play-head p{font-size:14px}.portrait-play .ramp-select{flex-basis:100%;justify-content:center}.portrait-play .ramp-select button{min-width:70px!important}}
/* The activity viewport owns its size. Children never drive their own measured bounds. */
#play-stage{margin:0 auto;align-self:stretch;min-width:0;min-height:0;flex-shrink:0}.play-canvas-shell{flex:none;max-height:none;max-width:none}#play-tools{width:100%;min-width:0}#playroom-focus.portrait-play{align-content:start}
.play-audio{display:flex;gap:6px;direction:rtl;flex:none}#playroom-focus .play-audio button{font-size:12px;min-height:40px;padding:6px 10px;background:#f7eed8;border-color:#bd9d76;box-shadow:none}#playroom-focus .play-audio button[aria-pressed=true]{background:#315e6c;color:#fff6df;border-color:#315e6c}
@media(max-width:800px){.play-head{flex-wrap:wrap}.play-audio{flex-basis:100%;justify-content:flex-end}#playroom-focus .play-audio button{min-height:40px;font-size:12px}.play-head>div{min-width:0}}
#playroom-focus.compact-play{display:flex;flex-direction:column;overflow-y:auto;align-items:center}.compact-play .play-head,.compact-play #play-stage,.compact-play #play-tools,.compact-play #play-feedback{flex:none;flex-shrink:0;margin:0 auto}.compact-play #play-stage{overflow:hidden}
/* Painterly toy surfaces share the room's generated brushwork. */
.ring-board{aspect-ratio:1.5;width:min(900px,100%,calc((100dvh - 280px)*1.5));border:0;background:url('assets/playroom/painted/surfaces.webp') 100% 100%/200% 200%;padding:20px 12px 30px;border-radius:14px}.peg-stick,.peg-base{opacity:0}.wood-ring{background-color:transparent!important;border:0;box-shadow:none;height:auto!important;aspect-ratio:var(--sprite-ratio,2.25);border-radius:0}.ring-peg b{padding:3px 9px;background:#fff1cfb8;border-radius:12px;bottom:1%;left:25%;right:25%;font-size:15px}
.plush-floor{background:url('assets/playroom/painted/stages.webp') 100% 100%/200% 200%;border-radius:18px;height:min(430px,48vh)}.cushion-cover{height:auto!important;aspect-ratio:var(--sprite-ratio,1.7);background-color:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;bottom:15%;width:94%;left:3%}.plush-friend{width:60%;left:20%}.cushion-hide.revealed .cushion-cover{transform:translateY(-105%) rotate(-6deg);opacity:1}.puzzle-frame{border-image:url('assets/playroom/painted/surfaces.webp') 45 round;border-width:12px}.board-frame,.paper-frame{border-color:#b47a43;box-shadow:0 9px 20px #77503355}.board-frame{background:#fbf1d8;border-image:url('assets/playroom/painted/surfaces.webp') 45 round}
.activity-library #play-stage{align-items:flex-start;overflow:auto}.book-shelf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:40px 30px;padding:20px 25px 40px;max-width:1100px}.book-shelf:after{display:none}#playroom-focus .story-cover{width:100%;max-width:none;height:100%;min-height:295px;transform:rotate(-1deg);padding-bottom:18px}#playroom-focus .story-cover:nth-child(2n){transform:rotate(1deg)}.story-cover b{font-size:22px}.story-cover small{font-size:13px}.cover-art{aspect-ratio:.9;min-height:0}.cover-spine{left:auto;right:0;box-shadow:inset 2px 0 3px #fff3}.activity-book #play-tools{direction:ltr}.open-book{perspective:1800px;transform-style:preserve-3d;overflow:visible}.book-leaf{position:absolute;left:0;top:0;bottom:0;width:50%;transform-origin:100% 50%;background:#fff6df;z-index:5;backface-visibility:hidden;pointer-events:none;box-shadow:4px 3px 12px #60492d44;border-radius:5px;animation:arabic-leaf-right .62s ease-in-out forwards}.book-cover-leaf{background:var(--cover);padding:20px;color:#fff6df}.leaf-art{display:block;width:100%;height:76%;background-size:200% 200%;border-radius:3px}.book-leaf b{display:block;padding:12px;font-size:27px;text-align:center}.book-page-leaf{padding:18px}.book-page-leaf .leaf-art{height:100%}.book-leaf.leaf-back{animation-name:arabic-leaf-left;transform-origin:0 50%;left:50%}@keyframes arabic-leaf-right{0%{transform:rotateY(0);opacity:1}80%{opacity:1}100%{transform:rotateY(170deg);opacity:0}}@keyframes arabic-leaf-left{0%{transform:rotateY(0);opacity:1}100%{transform:rotateY(-170deg);opacity:0}}
@media(max-width:850px){.book-shelf{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.book-shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px;padding:15px 12px 30px}#playroom-focus .story-cover{width:100%!important;min-height:265px}.story-cover b{font-size:19px}.cover-art{aspect-ratio:.9}.book-leaf{width:100%;left:0;transform-origin:100% 50%}.book-leaf.leaf-back{left:0;transform-origin:0 50%}.ring-board{aspect-ratio:1.5;width:100%;padding:12px 6px 25px}.plush-floor{height:285px}.ring-peg b{font-size:12px;left:12%;right:12%}}
@media(prefers-reduced-motion:reduce){.book-leaf{display:none}}
/* Do not sample a contact sheet as a CSS border; the board uses nine-sliced painted frame pixels. */
.board-frame{border:0;border-image:none;background:#b57a43}.puzzle-frame{border:12px solid #ad8054;border-image:none}#playroom-focus .ring-peg:hover,#playroom-focus .cushion-hide:hover{background:transparent}#playroom-focus .story-cover:hover{background:var(--book-color);color:#fff6df}.story-cover b{text-shadow:0 1px 1px #452c3b55}
.activity-puzzle #play-stage{align-items:flex-start}
@media(max-width:650px){#playroom-focus.activity-rings,#playroom-focus.activity-puzzle,#playroom-focus.activity-plush{display:flex;flex-direction:column;overflow-y:auto;align-items:center}.activity-rings #play-stage,.activity-puzzle #play-stage,.activity-plush #play-stage{height:auto;flex:none;align-items:flex-start;overflow:visible}.activity-rings #play-tools,.activity-puzzle #play-tools,.activity-plush #play-tools,.activity-rings .play-head,.activity-puzzle .play-head,.activity-plush .play-head{flex:none;margin:0 auto}.activity-rings #play-feedback,.activity-puzzle #play-feedback,.activity-plush #play-feedback{flex:none}.activity-plush #play-stage{align-items:center}.play-audio button{min-height:44px!important}}
.ring-board{padding-left:3%;padding-right:3%}.wood-ring{height:13%!important;aspect-ratio:auto}
/* Screenshot corrections: preserve each illustrated panel, including turning leaves. */
#playroom-focus .cover-art{aspect-ratio:var(--art-ratio,1.5);height:auto;min-height:0;max-height:none;flex:none;background-size:200% 200%;background-repeat:no-repeat}
#playroom-focus .story-cover{display:flex;flex-direction:column;justify-content:flex-start;min-height:0;padding-bottom:20px;align-self:start}
#playroom-focus .story-cover .cover-art{align-self:stretch;flex:none;margin-top:18px}
#playroom-focus .story-cover b{margin-top:auto}.book-art{align-self:center;height:auto;min-height:0;max-height:none;flex:none}
.book-leaf{display:flex;flex-direction:column;justify-content:center}.book-leaf .leaf-art,.book-page-leaf .leaf-art{height:auto;flex:none;aspect-ratio:var(--art-ratio,1.5);background-size:200% 200%;background-repeat:no-repeat}
/* Posts and rings use the same uncropped board coordinates. Ring holes reveal the post behind. */
.ring-board{padding:0;aspect-ratio:1.5;overflow:hidden;isolation:isolate;min-width:0}
#playroom-focus .ring-peg{position:absolute;top:12%;bottom:0;width:31.5%;height:88%;left:0;transform:translateX(-50%);padding:0;min-height:0;border-radius:18px;outline:none;overflow:visible}
#playroom-focus .ring-peg:focus-visible{outline:3px solid #3c6d80;outline-offset:-6px}
#playroom-focus .ring-peg.holding{outline:none;filter:drop-shadow(0 0 4px #ffefaa)}
#playroom-focus .ring-peg .wood-ring{height:auto!important;aspect-ratio:var(--sprite-ratio,2.2);bottom:auto;box-shadow:none;max-width:none;transition:transform .2s}
#playroom-focus .ring-peg.holding .wood-ring:last-of-type{transform:translate(-50%,-18px);filter:drop-shadow(0 5px 2px #5d3d292e)}
.ring-goal{position:absolute;z-index:10;left:81.5%;top:1.5%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;color:#385b53;font-size:16px;pointer-events:none}
.ring-goal img{width:27px;height:40px;object-fit:contain}.ring-goal b{background:#fff4d9dd;padding:5px 9px;border-radius:8px}
/* The instruction belongs above the cushions; covers never leave the bounded floor. */
.activity-plush .play-head{position:relative;z-index:3}.activity-plush #play-feedback{text-align:right;font-size:16px;padding:8px 0 0;min-height:30px;max-width:none;margin:0}
.activity-plush #play-stage{align-items:center;justify-content:flex-start;overflow:auto;padding-top:4px}
.plush-intro{position:relative;z-index:2;background:#fff2d9e6;padding:5px 16px;border-radius:8px;max-width:100%}
.plush-floor{isolation:isolate;overflow:hidden;width:min(900px,100%);height:auto;aspect-ratio:1.65;min-height:210px;flex:none}
#playroom-focus .cushion-hide{top:0;height:100%;bottom:auto;overflow:hidden}.cushion-cover{bottom:10%;width:88%;left:6%}
.cushion-hide.revealed .cushion-cover{transform:translateY(-120%) rotate(-6deg)}.plush-friend{bottom:8%;width:60%;left:20%}
@media(max-width:650px){#playroom-focus .story-cover{min-height:0!important;padding-bottom:16px!important}.book-shelf{align-items:start}.cover-art{margin:12px 10px 10px!important}.ring-board{width:100%;aspect-ratio:1.5;padding:0}.ring-goal{font-size:11px;gap:2px}.ring-goal img{width:18px;height:28px}.ring-goal b{padding:3px 4px}.activity-plush #play-feedback{font-size:14px}.plush-floor{aspect-ratio:1.25;min-height:240px}.plush-intro b{font-size:18px}.plush-portrait{width:42px;height:42px}.plush-intro{gap:7px}.cushion-hide.revealed .cushion-cover{transform:translateY(-120%) rotate(-6deg)}}

#play-tools.theatre-tools{direction:ltr}#play-tools.theatre-tools .control-label{display:block!important;font-size:12px}#play-tools.theatre-tools .painted-control{width:62px;min-height:60px}#play-tools.theatre-tools .control-art{width:39px;height:39px}.activity-tangram #play-tools .control-label{display:block!important}

/* The shaft passes in front of the rear rim, then disappears behind the front lip. */
.ring-post-front{position:absolute;top:-13.6363636364%;width:317.4603174603%;height:113.6363636364%;background:url('assets/playroom/painted/surfaces.webp') 100% 100%/200% 200%;pointer-events:none}
#playroom-focus .ring-peg.holding .wood-ring:last-of-type{transform:translate(-50%,-30%)}
.ring-goal{inset:0;left:0;top:0;transform:none;display:block;width:auto;height:auto}
.ring-goal img{position:absolute;left:81.5%;top:7%;width:5.4%;height:auto;aspect-ratio:5/6;transform:translateX(-17.333333%);object-fit:contain}
.ring-goal b{position:absolute;left:81.5%;top:1%;transform:translateX(-50%);font-size:clamp(11px,1.6vw,16px);padding:3px 6px}

/* Direct theatre controls live on the stage; optional story/reset live in settings. */
#game #playroom-focus.fit-activity.puppet-direct{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto minmax(0,1fr)!important}
#game #playroom-focus.fit-activity.puppet-direct #play-tools{display:none!important}
#game #playroom-focus.fit-activity.puppet-direct #play-feedback{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#game #playroom-focus.fit-activity.puppet-direct #play-stage{grid-column:1;grid-row:2}
#game #playroom-focus.fit-activity.puppet-direct canvas{touch-action:none;cursor:grab}
#game #playroom-focus.fit-activity.puppet-direct canvas:active{cursor:grabbing}
/* Story options stay inside short screens; only this optional menu may scroll. */
#game #playroom-focus.fit-activity.puppet-direct .play-audio{box-sizing:border-box;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 #playroom-focus.fit-activity.puppet-direct.short-play .play-audio{grid-template-columns:repeat(3,76px)!important}
#game #playroom-focus.fit-activity.puppet-direct.short-play .play-audio button{height:64px!important;padding:3px!important;min-height:64px!important;gap:2px!important}