/* Small, tactile games that belong to the same room and glass control system. */
.room-toy-art{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 5px 4px #14252b38)}
.room-living-thumb{display:block;position:relative;width:100%;height:100%}.room-living-thumb img{width:100%;height:100%;object-fit:contain}.room-living-thumb>i{position:absolute;top:25%;left:43%;color:#ffe8ab;font-style:normal;text-shadow:0 0 9px #fff5cd;animation:roomTwinkle 3s ease-in-out infinite}
.room-play{max-width:690px;margin:auto;color:var(--text,#244a55)}.room-play-intro{font-size:15px;line-height:1.5;max-width:560px;margin:10px auto 18px}.room-play-stage{position:relative;isolation:isolate;padding:20px;border:1px solid #b7a27177;border-radius:22px;background:linear-gradient(145deg,#fff5d96b,#7eb9c31c);overflow:hidden;min-height:180px;box-shadow:inset 0 1px #fff6}.room-play-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:18px 0 4px}.room-play-actions button,.room-paint-pots button,.room-music-keys button{min-height:40px}.room-play-status{min-height:2.8em;margin:16px 0 2px;font-size:15px;line-height:1.4;color:var(--text,#244a55)}.room-play-record-note{display:block;opacity:.7;font-size:11px;line-height:1.5}.room-play-meter{display:flex;justify-content:space-between;gap:12px;font:13px/1.5 system-ui;color:inherit;opacity:.8}.room-game-hint{font:13px/1.6 system-ui;text-align:center;max-width:500px;margin:16px auto 8px}
html[data-theme=dark] .room-play{color:#ecdfb9}html[data-theme=dark] .room-play-stage{background:radial-gradient(ellipse at 25% 0,#284d64bb,transparent 75%),#0926338f;border-color:#bca36b69;box-shadow:inset 0 1px #eaf9ff20}html[data-theme=dark] .room-play-status{color:#ecdfb9}
.alchemy-lab{display:flex;justify-content:center;align-items:center;gap:55px;padding:28px 0}.alchemy-target{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:14px}.alchemy-target i{width:82px;height:82px;border-radius:28% 37% 35% 29%;background:var(--paint);box-shadow:inset 3px 4px 14px #fff7,inset -3px -5px 8px #0002,0 4px 12px #0002;border:2px solid #e0c491}.alchemy-target span{font:12px system-ui;opacity:.8}.alchemy-bowl{width:150px;height:126px;border-radius:9px 9px 68px 68px;border:2px solid #bbdeda;position:relative;overflow:hidden;background:linear-gradient(115deg,#f5fffeaa,#4cb9c12a 25%,#9bdddf33 70%,#daf9f6a8);box-shadow:inset 4px 0 12px #ffffff75,0 12px 15px #18303922}.alchemy-bowl:after{content:'';position:absolute;left:10%;top:6%;height:56%;width:8%;border-radius:50%;background:#fff8;transform:rotate(6deg)}.alchemy-liquid{position:absolute;inset:30% 3% 3%;background:var(--mixture);border-radius:35% 40% 60% 50% / 7% 8% 65% 65%;transition:background .4s;box-shadow:inset 0 5px 14px #f9ffff60;animation:roomLiquid 3s ease-in-out infinite}.alchemy-bowl span{position:absolute;top:53%;left:50%;transform:translate(-50%,-50%);color:white;font-size:30px;text-shadow:0 2px 5px #0004}.alchemy-bowl.is-solved{box-shadow:0 0 25px #62c2b46b}.room-paint-pots{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.room-paint-pots button:before{content:'';display:inline-block;width:18px;height:18px;border-radius:50%;background:var(--pot);box-shadow:inset 1px 1px 4px #fff9,0 0 0 1px #896c4c88;margin-right:7px;vertical-align:middle}.room-paint-pots button[aria-pressed=true]{outline:2px solid #cca75e;outline-offset:3px}
.room-stars-board{position:relative;width:min(100%,350px);aspect-ratio:1;margin:18px auto;background:radial-gradient(circle at 45% 45%,#355c8b,#173349 65%,#102331);border-radius:50%;border:1px solid #bbaa7880;box-shadow:inset 0 0 40px #9bd3e619,0 4px 15px #0002}.room-stars-board svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.room-stars-board line{stroke:#b9d5d95c;stroke-width:.7;stroke-dasharray:1.7 2.3}.room-stars-board line.is-traced{stroke:#ffe0a1;stroke-dasharray:none;stroke-width:1.1;filter:drop-shadow(0 0 2px #fff19c)}.room-star-node{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;border:0!important;background:none!important;box-shadow:none!important;padding:0!important;color:#fff3c7;font-size:32px;line-height:1;cursor:pointer;text-shadow:0 0 9px #fff3bb88}.room-star-node small{position:absolute;left:50%;top:35px;transform:translateX(-50%);font:11px system-ui;color:#dce9ed}.room-star-node.is-current{color:white;filter:drop-shadow(0 0 7px #9efff7)}.room-star-node:focus-visible{outline:2px solid #fff2c7;border-radius:50%}
.room-living-gallery{position:relative;max-width:430px;margin:auto;filter:drop-shadow(0 8px 12px #00192355)}.room-living-gallery>img{width:100%;display:block;transition:filter 1.5s}.room-living-gallery.is-day>img{filter:sepia(.22) brightness(1.45) saturate(.7)}.room-living-stars{position:absolute;left:20%;top:20%;width:60%;display:flex;justify-content:space-between;color:#fff9d6;text-shadow:0 0 9px #fff;animation:roomTwinkle 3s infinite}.room-living-stars i{font-style:normal;animation:roomTwinkle 4.2s infinite reverse}.room-living-gallery.is-day .room-living-stars{opacity:.15}.room-living-firefly{position:absolute;top:45%;left:30%;width:4px;height:4px;background:#fffacb;border-radius:50%;box-shadow:0 0 12px 3px #ffe89baa;animation:roomFirefly 8s ease-in-out infinite}
.room-dragon-nest{width:min(100%,290px);height:255px;margin:auto;position:relative;animation:roomBreathe 3.5s ease-in-out infinite}.room-dragon-nest.mood-happy{animation:roomHappy 1.2s ease-in-out infinite}.room-dragon-nest.mood-awake{animation:roomBreathe 1.5s ease-in-out infinite}.room-dragon-bubble{position:absolute;top:8%;right:5%;font:22px Georgia;color:#be9143;text-shadow:0 1px #fff7}.room-dragon-nest.mood-happy .room-dragon-bubble{color:#efb3cd}.room-emotion-canvas{position:relative;min-height:255px;display:grid;place-items:center;border-radius:16px;background:radial-gradient(ellipse,#7d99a52c,transparent 72%);text-align:center;font:italic 19px Georgia;padding:30px}.room-emotion-canvas>span:first-child{opacity:.6}.room-magic-particle{position:absolute;left:var(--px);bottom:15%;font-size:22px;color:var(--color);pointer-events:none;text-shadow:0 0 7px currentColor;z-index:5;animation:roomParticle 2s var(--delay) ease-out both}
.room-music-box{width:190px;height:170px;margin:0 auto}.room-music-keys{display:flex;justify-content:center;gap:8px}.room-music-keys button{min-width:50px;height:65px;background:linear-gradient(#fff8,transparent 35%),var(--key)!important;color:#143c48!important;border:1px solid #b3a17c!important;border-radius:8px 8px 16px 16px!important;box-shadow:inset 2px 2px 5px #fff9,inset -2px -3px 5px #0002,0 4px 0 #425c6370!important}.room-music-keys button:active{transform:translateY(3px)}.room-note-line{min-height:45px;font:13px/1.6 system-ui;text-align:center;padding:18px 8px 0}
.room-orbit-globe{position:relative;width:230px;height:250px;margin:10px auto 0;perspective:700px}.room-orbit-sphere{position:absolute;inset:10px 18px 48px;border:3px solid #c8a468;border-radius:50%;overflow:hidden;box-shadow:inset -25px -10px 35px #021923cc,inset 9px 9px 22px #acf6eb99,0 0 26px #63bcc840;background:radial-gradient(ellipse at 35% 30%,#4385a2,#173e61 65%);transform:rotateY(calc(var(--turn)*.15))}.room-orbit-sphere:before,.room-orbit-sphere:after{content:'';position:absolute;inset:0;border:1px solid #d6debd66;border-radius:50%;transform:scaleX(.45)}.room-orbit-sphere:after{transform:scaleY(.4)}.room-orbit-sphere i{position:absolute;inset:5%;border:1px dashed #bbdfd0a0;border-radius:45%;transform:rotate(var(--turn));transition:transform .3s}.room-orbit-sphere b,.room-orbit-sphere em{position:absolute;left:15%;top:25%;color:#fff0b5;text-shadow:0 0 6px #ffe9c9;transform:rotate(var(--turn));transition:transform .3s;font-size:32px}.room-orbit-sphere em{top:58%;left:45%;font-size:20px}.room-orbit-globe>span{position:absolute;bottom:10px;left:65px;width:100px;height:18px;border-radius:50%;background:linear-gradient(#e8ce8c,#89663d);box-shadow:0 4px 5px #0003}.room-orbit-globe>span:before{content:'';position:absolute;bottom:12px;left:45px;width:10px;height:34px;background:linear-gradient(90deg,#976e36,#f8dc9b,#947035)}.room-globe-slider{display:flex;align-items:center;justify-content:center;gap:15px;font:13px system-ui}.room-globe-slider input{width:55%;accent-color:#329ca6}.room-globe-title{text-align:center;font-size:22px;margin:20px 0 8px}.room-globe-fact{max-width:450px;margin:auto;text-align:center;line-height:1.5;font-size:15px}
.room-hourglass-display{width:210px;margin:auto;text-align:center}.room-hourglass-display>svg{width:180px;height:190px;margin:auto}.room-hourglass-time{font:36px/1.3 Georgia;font-variant-numeric:tabular-nums}.room-hourglass-progress{height:7px;border-radius:10px;background:#86babc44;margin:12px 0;overflow:hidden}.room-hourglass-progress i{display:block;height:100%;background:linear-gradient(90deg,#a5d8c4,#e3c479);border-radius:10px;transition:width .25s linear}
.room-hourglass-display .room-sand-top{transform-origin:100px 81px;transform:scaleY(var(--remaining));transition:transform .25s linear}.room-hourglass-display .room-sand-bottom{transform-origin:100px 140px;transform:scaleY(calc(1 - var(--remaining)));transition:transform .25s linear}.room-hourglass-display .room-sand-stream{opacity:0;stroke-dasharray:1 3}.room-hourglass-display.is-running .room-sand-stream{opacity:1;animation:roomSand .4s linear infinite}@keyframes roomSand{to{stroke-dashoffset:-8}}
.market-play-tag{position:absolute;left:12px;bottom:12px;padding:5px 9px;border-radius:20px;background:#153d4ded;color:#f1e4be;border:1px solid #c9b68180;font:11px/1.3 system-ui}.market-product-art{position:relative}.market-product-art .room-toy-art{width:80%;height:90%;max-height:210px;margin:auto}.market-product-art .room-living-thumb{width:85%;height:90%;margin:auto}
@keyframes roomTwinkle{0%,100%{opacity:.4}50%{opacity:1}}@keyframes roomLiquid{0%,100%{transform:rotate(-1deg)}50%{transform:rotate(1deg)}}@keyframes roomFirefly{0%,100%{transform:translate(0,0);opacity:.4}30%{transform:translate(80px,-30px);opacity:1}60%{transform:translate(160px,10px);opacity:.5}}@keyframes roomBreathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.015)}}@keyframes roomHappy{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(2deg) translateY(-7px)}}@keyframes roomParticle{0%{opacity:0;transform:translate(0,0) scale(.5)}15%{opacity:1}100%{opacity:0;transform:translate(var(--drift),calc(-1*var(--rise))) scale(1.1) rotate(40deg)}}
@media(max-width:500px){.room-play-stage{padding:14px}.alchemy-lab{gap:25px}.alchemy-bowl{width:115px;height:105px}.alchemy-target i{width:65px;height:65px}.room-play-actions{gap:8px}.room-play-actions button{font-size:13px;padding-inline:12px}.room-music-keys{gap:5px}.room-music-keys button{min-width:40px;padding:8px}.room-play-meter{font-size:11px}.room-stars-board{max-width:270px}.room-play-intro{font-size:14px}}
.room-paint-dot{display:inline-block;width:16px;height:16px;border-radius:50%;margin-right:6px;vertical-align:-3px;box-shadow:inset 1px 2px 4px #fffa,0 0 0 1px #685a42aa}
.room-music-box>.room-painted-toy,.room-dragon-nest>.room-painted-toy{width:100%;height:100%;object-fit:contain}.market-product-art>.room-painted-toy{width:85%;height:90%;max-height:210px;object-fit:contain;margin:auto;filter:drop-shadow(0 5px 4px #14252b38)}
html body .room-play .room-music-keys button{min-width:50px;height:65px;background:linear-gradient(#ffffff8a,transparent 35%),var(--key)!important;color:#143c48!important;border:1px solid #b3a17c!important;border-radius:8px 8px 16px 16px!important;box-shadow:inset 2px 2px 5px #fff9,inset -2px -3px 5px #0002,0 4px 0 #425c6370!important}
@media(max-height:850px){.room-stars-board{width:245px;margin:12px auto}.room-play-stage{padding:14px}.room-play-intro{margin:8px auto 12px;font-size:14px}.room-game-hint{margin:10px auto 5px}.room-play-actions{margin-top:12px}.room-play-status{min-height:1.5em;margin-top:10px}.room-play-meter{font-size:12px}.alchemy-lab{padding:18px 0}.room-orbit-globe{height:210px;width:210px}.room-orbit-sphere{bottom:37px}.room-emotion-canvas{min-height:180px}.room-dragon-nest{height:200px;width:230px}}
@media(prefers-reduced-motion:reduce){.room-play *, .room-living-thumb>i{animation:none!important;transition:none!important}.room-magic-particle{display:none}}
.room-orbit-globe{width:min(100%,230px);height:auto;aspect-ratio:23/25}.room-orbit-sphere{inset:4% 8% 19%}.room-orbit-globe>span{bottom:4%;left:28%;width:44%;height:7%}.room-orbit-globe>span:before{left:45%;width:10%;height:190%;bottom:65%}.room-stars-board{width:min(100%,350px)}.room-hourglass-display{max-width:100%}.room-play-stage{min-width:0}.room-globe-slider{min-width:0}.room-globe-slider input{min-width:0}
@media(max-height:850px){.room-stars-board{width:min(100%,245px)}}
@media(max-width:500px){html body .room-play .room-music-keys button{min-width:0;flex:1;padding:8px 3px!important;font-size:12px}.room-music-keys{max-width:290px;margin:auto}.alchemy-lab{gap:18px}.alchemy-bowl{width:44%;flex-shrink:0}.alchemy-target{min-width:0}.room-play-actions button{max-width:100%;white-space:normal}.room-play-meter{flex-wrap:wrap}}