/* Window geometry follows the original 1672 x 941 room. Furniture stays above the view. */
.world-window{position:absolute;inset:0;pointer-events:none;overflow:hidden;opacity:0;transition:opacity 2s;mask-image:url("assets/world/window-mask.svg");mask-size:100% 100%;-webkit-mask-image:url("assets/world/window-mask.svg");-webkit-mask-size:100% 100%}
.world-window.ready{opacity:1}
.world-landscape{position:absolute;left:20.9%;top:0;width:72.8%;height:54.6%;overflow:hidden;background:#101e2c;filter:brightness(calc(.32 + var(--daylight,0) * .57)) saturate(.82)}
.world-landscape img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 8s ease-in-out;transform:scale(1.015)}
.world-landscape img.visible{opacity:1}
.world-landscape::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,#aacddd12,transparent 35%,#09192922),linear-gradient(0deg,#0a172944,transparent 55%);box-shadow:inset 0 -6px 14px #06132177}
html[data-time-of-day=dawn] .world-landscape,html[data-time-of-day=dusk] .world-landscape{filter:brightness(calc(.32 + var(--daylight,0) * .57)) saturate(.8) sepia(.2)}
.world-controls{display:flex;gap:14px;align-items:center;margin-top:5px;pointer-events:auto;flex-wrap:wrap}
.world-controls button{background:transparent;color:#b8c8d6;font-size:12px;padding:3px 0;min-height:44px;border-bottom:1px solid #b8c8d633}
#world-place{font:12px/1.5 Arial,'Microsoft YaHei',sans-serif;color:#c8d4df;letter-spacing:.04em;text-shadow:0 2px 5px #000}
#world-place small{color:#93aabb;font-size:10px}
.world-controls button:disabled{opacity:.5}
.world-window.manual .world-landscape img,.still .world-landscape img{transition:opacity 1s ease!important}
.coin::after{content:"";position:absolute;width:52%;height:29%;left:27%;top:23%;border-radius:50%;border:2px solid #c8d1d5;background:radial-gradient(ellipse at 32% 22%,#f1f5f5,#aab9c3 35%,#536777 70%,#9baab5);box-shadow:inset 0 0 0 2px #697d8a,0 3px 2px #0009;transform:rotate(-8deg);pointer-events:none}
.coin-face{background:radial-gradient(circle at 28% 23%,#f5f8f8,#b2c0c9 40%,#546878 85%);border:2px solid #d5e0e5;box-shadow:inset 0 0 0 5px #768b9b,inset 0 0 0 7px #d1dce2,0 16px 26px #0004;color:#263e50;font-size:32px;text-shadow:0 1px #ffffff88}
@media(max-width:700px){.world-controls{gap:12px;margin-top:0}.world-controls button{font-size:11px}.world-controls #world-place{flex-basis:100%;font-size:11px}#sound-hint{bottom:210px}#object-index{bottom:230px;max-height:45svh}.room-footer{bottom:16px}.room-caption #hint{display:none}}
@media(prefers-reduced-motion:reduce){.world-window{transition:opacity 1s!important}.world-landscape img{transition:opacity 1s!important}}
/* Continuous camera drift; weather is independently animated on glass. */
.world-landscape img{animation:world-breathe 34s ease-in-out infinite alternate;transform-origin:center}
@keyframes world-breathe{from{transform:scale(1.045) translate(-.7%,.2%)}to{transform:scale(1.12) translate(.8%,-.6%)}}
.world-window[data-scene=aurora] .world-landscape{filter:brightness(.88) saturate(.85)}
.coin::after{width:93%;height:43%;left:3%;top:17%;border-color:var(--coin-light);background:radial-gradient(ellipse at 32% 22%,var(--coin-light),var(--coin-mid) 38%,var(--coin-dark) 85%);box-shadow:inset 0 0 0 2px var(--coin-dark),0 3px 3px #000b}
.coin-emblem{position:absolute;left:22%;top:18%;width:54%;height:36%;z-index:1;color:var(--coin-ink);transform:rotate(-8deg);pointer-events:none}
.coin-emblem svg{width:100%;height:100%}
.coin-face{width:124px;height:124px;background:radial-gradient(circle at 28% 23%,var(--coin-light),var(--coin-mid) 40%,var(--coin-dark) 85%);border-color:var(--coin-light);box-shadow:inset 0 0 0 5px var(--coin-dark),inset 0 0 0 7px var(--coin-mid),0 16px 26px #0004;color:var(--coin-ink)}
.coin-face svg{width:76%;height:76%}
.coin-studio{text-align:center}.coin-studio #coin-result{font-size:14px;color:#bdcad6;min-height:24px}.coin-studio .action{margin:0 0 22px}
.coin-choices{margin:14px 0 0;padding:20px 0 0;border:0;border-top:1px solid #a6b6c329;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.coin-choices legend{font-size:13px;color:#aab8c5;padding-right:16px}
.coin-choices button{display:flex;align-items:center;gap:9px;background:#adc9dc08;border:1px solid #adc9dc22;border-radius:4px;padding:10px;min-height:60px;text-align:left;font-size:12px}
.coin-choices button[aria-pressed=true]{border-color:#e8d5a4;background:#dac99513}
.coin-choices button i{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--swatch-ink);background:radial-gradient(circle at 25% 25%,var(--swatch-light),var(--swatch-mid) 45%,var(--swatch-dark));border:1px solid var(--swatch-light)}
.coin-choices svg{width:26px;height:26px}.coin-choices button:disabled{opacity:.55}
.coin-face.tossing{animation:coin-toss 1s ease-in-out!important}
.coin-face.changing{animation:coin-change 1s ease-in-out!important}
@keyframes coin-toss{0%{transform:translateY(0) rotateY(0)}45%{transform:translateY(-38px) rotateY(720deg) rotateZ(10deg)}100%{transform:translateY(0) rotateY(1440deg)}}
@keyframes coin-change{0%,100%{opacity:1}50%{opacity:.2}}
.still .world-landscape img,.still .world-window::after{animation:none!important}
@media(max-width:700px){.coin-choices{grid-template-columns:repeat(2,1fr)}.world-landscape img{animation-duration:42s}}
@media(prefers-reduced-motion:reduce){.world-landscape img,.world-window::after{animation:none!important}.coin-face.tossing{animation:coin-change 1s ease-in-out!important}}
.still .coin-face.tossing{animation:coin-change 1s ease-in-out!important}
.world-window.fx-paused img,.world-window.fx-paused::after{animation-play-state:paused!important}

#music-picker{position:fixed;right:5%;bottom:95px;z-index:16;width:300px;max-height:65svh;overflow:auto;padding:18px;background:#0d1928f5;border:1px solid #92a5b33d;box-shadow:0 20px 70px #0007;backdrop-filter:blur(15px)}
#music-picker .music-heading{display:flex;justify-content:space-between;align-items:center;color:#e3d5b8;font:19px Georgia,'Songti SC',serif}#music-picker p{font-size:11px;color:#9cb1c3}#music-picker button{background:none;color:#cad8e2}#music-picker .music-heading button{min-width:44px;min-height:44px;font-size:24px}#music-picker>button{display:block;width:100%;padding:12px;text-align:left;border:1px solid transparent;min-height:58px;transition:background 1s}#music-picker>button[aria-pressed=true]{border-color:#d8c59155;background:#dac99514}#music-picker strong{font-size:13px;font-weight:400}#music-picker small{display:block;font-size:11px;color:#90a6b9;margin-top:3px}.controls{flex-wrap:wrap;justify-content:flex-end;gap:18px}
@media(max-width:700px){#music-picker{right:24px;left:24px;width:auto;bottom:150px}.controls{justify-content:space-between;gap:6px 16px}.controls button{font-size:11px}}

/* Restore the original Rain Room rain canvas over the changing landscapes. */
.world-ready .window-weather{visibility:visible}
.world-landscape img{filter:none}
/* Machined metal: milled rim, brushed face, relief highlights and a real thickness shadow. */
.coin-face{position:relative;isolation:isolate;border:1px solid var(--coin-light);border-radius:50%;background:radial-gradient(ellipse at 29% 20%,#ffffffa6,transparent 35%),repeating-conic-gradient(from 12deg,#ffffff22 0deg,#0000000d 4deg,#ffffff11 7deg,#00000018 11deg),radial-gradient(circle at 45% 42%,var(--coin-light),var(--coin-mid) 58%,var(--coin-dark) 94%);box-shadow:inset 0 0 0 3px var(--coin-dark),inset 0 0 0 4px var(--coin-light),inset 0 0 0 8px var(--coin-mid),inset 0 0 0 9px #ffffff55,0 2px 0 var(--coin-dark),0 4px 0 var(--coin-mid),0 6px 0 var(--coin-dark),0 9px 5px #0008,0 22px 26px #0006;transform:perspective(500px) rotateX(12deg);overflow:hidden}
.coin-face::before{content:'';position:absolute;inset:10px;border-radius:50%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.74' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='.35'/%3E%3C/svg%3E");opacity:.34;mix-blend-mode:soft-light;pointer-events:none}
.coin-face::after{content:'';position:absolute;inset:0;border-radius:50%;border:5px solid transparent;background:repeating-conic-gradient(var(--coin-light) 0deg 1deg,var(--coin-dark) 1deg 3deg) border-box;mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);mask-composite:exclude;pointer-events:none}
.coin-face svg{position:relative;z-index:1;width:68%;height:68%;color:var(--coin-dark);stroke-width:2.7;filter:drop-shadow(.7px 1px .25px #ffffffc9) drop-shadow(-.5px -.7px .2px #0009);opacity:.87}
.coin-face.tossing{animation:coin-metal-toss 1s ease-in-out!important}
@keyframes coin-metal-toss{0%{transform:perspective(500px) translateY(0) rotateX(12deg) rotateY(0);filter:brightness(1)}45%{transform:perspective(500px) translateY(-40px) rotateX(20deg) rotateY(720deg) rotateZ(12deg);filter:brightness(1.3)}100%{transform:perspective(500px) translateY(0) rotateX(12deg) rotateY(1440deg);filter:brightness(1)}}
.coin::after{background:radial-gradient(ellipse at 27% 18%,#ffffffb3,transparent 35%),repeating-conic-gradient(#ffffff33 0deg,#0002 4deg,#fff1 7deg),linear-gradient(160deg,var(--coin-light),var(--coin-mid) 48%,var(--coin-dark) 86%);border:1px solid var(--coin-light);box-shadow:inset 0 0 0 2px var(--coin-dark),inset 0 0 0 3px #ffffff6b,0 2px 0 var(--coin-mid),0 3px 0 var(--coin-dark),1px 6px 5px #000a}
.coin-emblem{color:var(--coin-dark);filter:drop-shadow(.4px .6px .2px #fff9) drop-shadow(-.3px -.3px .15px #0008)}
.coin-choices button i{background:radial-gradient(ellipse at 25% 20%,#fff8,transparent 45%),repeating-conic-gradient(#ffffff22 0deg,#0001 5deg,#fff1 9deg),linear-gradient(135deg,var(--swatch-light),var(--swatch-mid) 60%,var(--swatch-dark));box-shadow:inset 0 0 0 2px var(--swatch-dark),0 2px 0 var(--swatch-dark),0 4px 6px #0006}
.coin-choices svg{filter:drop-shadow(.4px .6px .2px #fff9)}
@media(prefers-reduced-motion:reduce){.coin-face.tossing{animation:coin-change 1s ease-in-out!important}}.still .coin-face.tossing{animation:coin-change 1s ease-in-out!important}
