/* Panoramic scene coordinates are relative to the illustration, not the viewport. */
.room-canvas{width:min(100vw,200dvh);aspect-ratio:2/1;container-type:inline-size;background:#343c31}
.room-world{position:absolute;inset:0 auto 0 0;width:150%;transform:translateX(-17%);transition:transform 1.1s cubic-bezier(.22,.7,.2,1)}
.room-canvas[data-view=bed] .room-world{transform:translateX(-33.3333%)}
.room-art{position:absolute;width:100%;height:100%;display:block}
.room-canvas:after{box-shadow:inset 0 0 55px #171d1840;background:linear-gradient(180deg,#11201d15,transparent 30%,transparent 80%,#14201944)}
.room-hud{top:5%;left:3%;padding:15px 20px;border-left:1px solid #ede4c670;background:linear-gradient(90deg,#23352ee6,#23352eb5 85%,transparent);text-shadow:none}
.room-hud .eyebrow{font-size:10px;letter-spacing:4px;color:#ded4af}.room-hud h1{font-size:clamp(15px,1.55vw,23px);font-weight:500;margin:6px 0 10px}.room-badge{font-size:11px;letter-spacing:1px}.room-date{font-size:12px}.room-date span{font-size:10px}
.room-help{top:5%;right:3%;background:#24382cc9}
.hotspot.computer{left:23%;top:37%;width:14%;height:33%}.hotspot.bed{left:80%;top:39%;width:20%;height:48%}.hotspot.bed .hotspot-caption{bottom:20%;left:45%}
.room-computer-screen{position:absolute;left:24.85%;top:41%;width:10.9%;height:23.9%;z-index:4;background:linear-gradient(150deg,#32615c,#20413d);color:#d1d7b7;box-shadow:inset 0 0 15px #172823;display:flex;flex-direction:column;padding:5px;overflow:hidden;transform:skewY(.4deg)}
.mini-os{font:500 clamp(5px,.55cqw,9px) Roboto,sans-serif;letter-spacing:.8px;opacity:.6;padding:2% 3%;white-space:nowrap}.mini-apps{display:flex;gap:2%;padding:7% 1%;flex:1;align-items:flex-start}.mini-apps button{border:1px solid transparent;border-radius:0;background:transparent;color:#f0e4c3;display:flex;flex:1;min-width:0;align-items:center;flex-direction:column;padding:5% 0;gap:4px}.mini-apps button:hover,.mini-apps button:focus-visible{background:#cbdabc20;border-color:#b7c6a8;filter:none}.mini-apps button>span{font-size:clamp(10px,1.4cqw,24px);line-height:1}.mini-apps small{font-size:clamp(5px,.58cqw,10px);white-space:nowrap}.mini-taskbar{font-size:clamp(5px,.55cqw,9px);color:#3a4b39;background:#adb69b;padding:2% 3%;margin:0 -5px -5px}
.desk-letter{position:absolute;left:39%;top:75%;width:6.4%;height:15%;z-index:4;transform:rotate(-7deg);background:#e9d8b0;color:#4c4a35;border:1px solid #c6ae83;border-radius:0;box-shadow:2px 4px 6px #30261750;text-align:left;padding:1%;display:flex;flex-direction:column;justify-content:center;gap:5px}.desk-letter:hover{transform:rotate(-3deg) translateY(-3px);filter:none;background:#f1e2bd}.desk-letter small{font-size:clamp(5px,.53cqw,9px);white-space:nowrap}.desk-letter b{font-size:clamp(7px,.87cqw,14px);font-weight:500;line-height:1.5}.desk-letter>span{position:absolute;right:10%;bottom:6%;font-size:12px}
.pan-control{position:absolute;z-index:6;top:48%;height:25%;width:5%;min-width:36px;background:linear-gradient(90deg,#14261c66,transparent);color:#f3e6c6;border:0;border-radius:0;font-size:32px;display:flex;align-items:center;gap:3px;padding:8px;opacity:.8}.pan-control span{font-size:11px;writing-mode:vertical-rl;letter-spacing:3px}.pan-left{left:0}.pan-right{right:0;justify-content:flex-end;background:linear-gradient(270deg,#14261c66,transparent)}.room-canvas[data-view=desk] .pan-left,.room-canvas[data-view=bed] .pan-right{opacity:.22}.pan-control:hover,.pan-control:focus-visible{opacity:1!important;filter:none;background:#25382c9c}
.village-window{position:absolute;left:37%;top:18%;width:28%;height:40%;z-index:2;border:0;background:transparent;border-radius:0}.village-window:hover{background:#f4dda409;filter:none}.village-window:focus-visible{outline:1px dashed #f7efd7;outline-offset:-10px}
.village-life{position:absolute;inset:0;pointer-events:none;z-index:1}.delivery-van{position:absolute;left:51.3%;top:43%;width:2.2%;height:3.4%;background:#b9b5a0;border-radius:10% 18% 6% 5%;border-bottom:3px solid #4c4c36;box-shadow:2px 4px 3px #393f3255;transform:skewY(4deg);filter:blur(.35px)}.delivery-van:before,.delivery-van:after{content:'';position:absolute;bottom:-21%;width:18%;height:39%;border-radius:50%;background:#393d31;border:2px solid #797b64}.delivery-van:before{left:10%}.delivery-van:after{right:8%}.delivery-van i{position:absolute;right:3%;top:12%;width:25%;height:48%;background:#657f75;border-right:2px solid #c7c6ad}.delivery-van b{position:absolute;left:25%;top:13%;font-size:clamp(4px,.65cqw,10px);line-height:1;color:#5b6b40}.delivery-van.branded{background:#e2dcc0}.delivery-van.van-1{left:57%;top:50%;background:#738a75;transform:skewY(4deg) scale(.94)}.delivery-van.van-2{left:61%;top:53%;background:#b7a16f;transform:skewY(4deg) scale(1.05)}.parcel-stack{position:absolute;left:58%;top:44%;width:2.3%;height:5%;display:grid;grid-template-columns:1fr 1fr;gap:1px;transform:skewY(5deg)}.parcel-stack i{background:#bc955e;border:1px solid #997545;box-shadow:inset 3px 0 #dac799}
.window-caption{position:absolute;z-index:7;bottom:5%;left:50%;transform:translateX(-50%);width:max-content;max-width:80%;padding:12px 20px;background:#20332ded;color:#f1e6cf;border:1px solid #c3ba9055;font-size:14px;line-height:1.6;text-align:center;pointer-events:none}.workshop-light{position:absolute;left:47%;top:43%;width:.8%;height:2%;opacity:0;background:#f9d27b;box-shadow:0 0 15px 8px #edbc5c77}.winter-home .workshop-light{opacity:1}
.scene-computer{padding:0;background:#305d57;animation:room-to-screen .4s ease-out;transform-origin:28% 57%}.scene-computer .monitor{width:100%;max-width:none;height:100dvh;padding:0;border:0;border-radius:0;box-shadow:none}.monitor:after,.monitor-power{display:none}.scene-computer .desktop{border:0}.scene-computer .workspace{margin:16px 20px}.scene-computer .app-window{box-shadow:3px 4px 0 #1c4a4040}
.workshop-letter{padding:12px 8px;color:#4c5847}.letter-date{font-size:11px;letter-spacing:1px;color:#909276}.workshop-letter h3{font-size:26px;font-weight:500;letter-spacing:-1px;margin:20px 0}.workshop-letter p{line-height:1.9}.goal-amount{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid #d5d6c2}.goal-amount span{color:#737c68}.goal-amount b{font-variant-numeric:tabular-nums}.ending-scene{padding:24px;background:linear-gradient(135deg,#526854,#243d37);color:#ecdfbc;text-align:center;border:1px solid #919e78}.ending-scene.lit{background:linear-gradient(135deg,#8c774a,#314b3a)}.ending-scene>span{font-size:40px}.ending-scene h3{font-size:24px;font-weight:500}.ending-scene p{line-height:1.8}.followups{margin:24px 0 14px;padding-top:16px;border-top:1px solid #d5d8c4;display:flex;flex-wrap:wrap;gap:8px}.followups button{font-size:12px;background:#eef0e3;border:1px solid #c8cfb9;padding:8px 12px;border-radius:2px}.followup-answer{width:100%;margin:6px 0 0;padding:14px 16px;background:#e8eddd;line-height:1.8;font-size:14px;border-left:2px solid #92a17f}
@keyframes room-to-screen{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:scale(1)}}
@media(max-width:760px){.room-hud{padding:7px 10px;top:4%;left:4%}.room-hud h1{font-size:12px;margin:3px 0 6px}.room-hud .eyebrow{font-size:7px}.room-badge{display:none}.room-date{font-size:9px;gap:7px}.room-date span{font-size:8px}.room-help{font-size:9px;top:4%}.mini-apps{gap:0}.mini-apps button{gap:2px}.room-computer-screen{padding:3px}.mini-taskbar{margin:0 -3px -3px}.scene-computer .workspace{margin:7px}.pan-control{font-size:25px;min-width:25px;padding:3px}.pan-control span{font-size:9px}.window-caption{font-size:11px;padding:8px 12px}.hotspot-caption{font-size:10px}.hotspot.computer .hotspot-caption{display:none}.desk-letter{padding:.7%;gap:2px}.desk-letter>span{display:none}}
@media(prefers-reduced-motion:reduce){.room-world{transition:none}.scene-computer{animation:none}}

/* Painted delivery assets share the panorama's light and perspective. */
.delivery-van{left:50%;top:41.4%;width:3.4%;height:6.8%;border:0;border-radius:0;background: url('delivery-truck.webp') center/contain no-repeat;box-shadow:none;transform:none;filter:brightness(.91) saturate(.8)}
.delivery-van.branded{background: url('delivery-truck.webp') center/contain no-repeat}
.delivery-van:before,.delivery-van:after,.delivery-van i{display:none}
.delivery-van b{left:66%;top:34%;color:#607346;font-size:clamp(3px,.4cqw,6px)}
.delivery-van.van-1{left:56%;top:46%;background:url('delivery-truck.webp') center/contain no-repeat;transform:scale(.86);filter:sepia(.3) brightness(.8)}
.delivery-van.van-2{left:60%;top:50%;background:url('delivery-truck.webp') center/contain no-repeat;transform:scale(.94);filter:sepia(.6) saturate(.7) brightness(.88)}
.village-life[data-event=ordinary] .van-0{visibility:hidden}
.parcel-stack{width:1.2%;height:3%;left:58.5%;top:46.5%;filter:blur(.3px);opacity:.88}