/* Revision 3 (spec 16) scenes: the dance stage, the fireplace room and the winter windowsill. */
body.scene-dance3d,body.scene-hearth2d,body.scene-windowglobe3d{min-height:100dvh;overflow-x:hidden;color:#fff4de}
body.scene-dance3d{background:var(--dance-backdrop,none) center/cover no-repeat,radial-gradient(ellipse at 50% 30%,#5b1a1c 0,#2a0c10 60%,#12060a 100%);background-attachment:fixed}
body.scene-dance3d[data-holiday-code=HolidayCnyDragon]{background:var(--dance-backdrop,none) center/cover no-repeat,radial-gradient(ellipse at 50% 30%,#164a3c 0,#0b2a22 60%,#051510 100%);background-attachment:fixed}
body.scene-dance3d main,body.scene-hearth2d main,body.scene-windowglobe3d main{height:100dvh;min-height:520px;overflow:hidden}
body.scene-dance3d #physical-stage,body.scene-hearth2d #physical-stage,body.scene-windowglobe3d #physical-stage{height:100%;min-height:0;max-height:none;isolation:isolate}
body.scene-dance3d #scene-poster,body.scene-hearth2d #scene-poster,body.scene-windowglobe3d #scene-poster{object-fit:cover;padding:0}
body.scene-dance3d .quiet-tools button,body.scene-hearth2d .quiet-tools button,body.scene-windowglobe3d .quiet-tools button{color:#fff4de;text-shadow:0 1px 4px #0008}
body.scene-dance3d .quiet-tools>span,body.scene-hearth2d .quiet-tools>span,body.scene-windowglobe3d .quiet-tools>span{color:#fff4de;opacity:.8}
body.scene-dance3d .handling,body.scene-hearth2d .handling,body.scene-windowglobe3d .handling{display:block;bottom:max(6%,env(safe-area-inset-bottom));z-index:3}
body.scene-dance3d[data-phase=opening] .handling,body.scene-dance3d[data-phase=revealed] .handling,body.scene-hearth2d[data-phase=revealed] .handling,body.scene-windowglobe3d[data-phase=opening] .handling,body.scene-windowglobe3d[data-phase=revealed] .handling{display:none}
body.scene-dance3d .handling button,body.scene-hearth2d .handling button,body.scene-windowglobe3d .handling button,body.scene-dance3d #after-reveal button,body.scene-hearth2d #after-reveal button,body.scene-windowglobe3d #after-reveal button{background:#fff1d2;color:#5b1418;border-radius:999px;font:500 15px Arial,sans-serif;padding:12px 22px;min-height:46px;text-decoration:none;box-shadow:0 6px 24px #0006}
body.scene-dance3d[data-holiday-code=HolidayCnyDragon] .handling button,body.scene-dance3d[data-holiday-code=HolidayCnyDragon] #after-reveal button{color:#0d4a37}
body.scene-hearth2d .handling button,body.scene-hearth2d #after-reveal button,body.scene-windowglobe3d .handling button,body.scene-windowglobe3d #after-reveal button{color:#3a1d12}
body.scene-dance3d .handling span,body.scene-hearth2d .handling span,body.scene-windowglobe3d .handling span{display:none}
body.scene-dance3d #after-reveal,body.scene-hearth2d #after-reveal,body.scene-windowglobe3d #after-reveal{bottom:max(5%,env(safe-area-inset-bottom));z-index:3}
body.scene-dance3d #after-reveal nav,body.scene-hearth2d #after-reveal nav,body.scene-windowglobe3d #after-reveal nav{gap:10px}
.dance-hint,.scene-hint{position:absolute;left:50%;top:max(9%,calc(env(safe-area-inset-top) + 64px));transform:translateX(-50%);z-index:3;margin:0;padding:8px 16px;border-radius:999px;background:#0000004a;color:#fff4de;font:13px/1.35 Arial,sans-serif;letter-spacing:.03em;text-align:center;max-width:88vw;backdrop-filter:blur(4px);pointer-events:none;transition:opacity .6s}
body[data-phase=opening] .dance-hint{opacity:0}
.scene-title{position:absolute;left:0;right:0;top:max(3%,calc(env(safe-area-inset-top) + 42px));z-index:2;text-align:center;pointer-events:none;margin:0;font:italic 600 clamp(28px,4.6vw,56px)/1.05 Stationery,Georgia,serif;color:#fff4de;text-shadow:0 3px 16px #0009}
.globe-backdrop{position:absolute;inset:0;z-index:0;background:#0c1a3a center/cover no-repeat;pointer-events:none}
.globe-backdrop canvas,.globe-frost{position:absolute;inset:0;pointer-events:none}
.globe-frost{z-index:1}
body.scene-windowglobe3d #physical-canvas{z-index:2}
body.scene-windowglobe3d .handling,body.scene-windowglobe3d #after-reveal,body.scene-windowglobe3d .scene-hint{z-index:4}
body.scene-windowglobe3d[data-phase=revealed] .scene-hint,body.scene-hearth2d[data-phase=revealed] .scene-hint{opacity:0}
body.scene-hearth2d{background:#2a0e0c}
body.scene-hearth2d #physical-canvas{display:none}
.hearth-room{position:absolute;left:0;top:0;transform-origin:0 0;touch-action:pan-y;user-select:none}
.hearth-art{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.hearth-glow{position:absolute;width:var(--r);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ffb24e55 0,#ff8a2a2a 35%,#ff8a2a00 70%);mix-blend-mode:screen;pointer-events:none}
.hearth-fire,.hearth-sparks{position:absolute;pointer-events:none;mix-blend-mode:screen}
.hearth-twinkle{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen}
.hearth-snow{position:absolute;pointer-events:none;opacity:.85}
.hearth-spot{position:absolute;min-height:0;padding:0;border:0;background:transparent;border-radius:12px;cursor:pointer;transition:transform .35s cubic-bezier(.3,1.6,.5,1),box-shadow .3s}
.hearth-spot:hover,.hearth-spot:focus-visible{box-shadow:0 0 0 2px #ffe8b588,0 0 24px #ffd07a66}
.hearth-spot:focus-visible{outline:2px solid #fff0c8;outline-offset:3px}
.hearth-spot.present.opened{animation:hearth-pop .6s cubic-bezier(.3,1.6,.5,1)}
@keyframes hearth-pop{40%{transform:translateY(-14%) scale(1.08)}100%{transform:none}}
.hearth-spot.stocking.peek{animation:hearth-sway .7s ease-in-out}
@keyframes hearth-sway{25%{transform:rotate(-8deg)}60%{transform:rotate(6deg)}100%{transform:none}}
.hearth-spot.tree:hover,.hearth-spot.hearth-fire-hit:hover{box-shadow:none}
.hearth-glitter{position:absolute;width:7px;height:7px;border-radius:2px;background:#ffd772;box-shadow:0 0 8px #ffcf6a;pointer-events:none;animation:hearth-glitter 1.2s ease-out forwards}
@keyframes hearth-glitter{to{transform:translate(var(--dx),var(--dy)) rotate(260deg);opacity:0}}
/* Golden Light Tree (revision 3): a spiral of light on a winter night, the greeting written in light. */
body.scene-lighttree3d{min-height:100dvh;overflow-x:hidden;color:#eaf4ff;background:radial-gradient(ellipse at 30% 35%,#123a78 0,#0a1f4a 42%,#050c22 78%,#02050f 100%);background-attachment:fixed}
body.scene-lighttree3d main{height:100dvh;min-height:520px;overflow:hidden}
body.scene-lighttree3d #physical-stage{height:100%;min-height:0;max-height:none;isolation:isolate}
body.scene-lighttree3d #scene-poster{object-fit:cover;padding:0}
body.scene-lighttree3d #physical-canvas{cursor:pointer}
body.scene-lighttree3d .quiet-tools button,body.scene-lighttree3d .quiet-tools>span{color:#dcecff;text-shadow:0 1px 4px #0008}
body.scene-lighttree3d .handling{display:none}
body.scene-lighttree3d #after-reveal{bottom:max(5%,env(safe-area-inset-bottom));z-index:3}
body.scene-lighttree3d #after-reveal nav{gap:10px}
body.scene-lighttree3d #after-reveal button{background:#eaf4ff;color:#0b2455;border-radius:999px;font:500 15px Arial,sans-serif;padding:12px 22px;min-height:46px;text-decoration:none;box-shadow:0 0 24px #7ab8ff55}
body.scene-lighttree3d .scene-hint{opacity:0}
body.scene-lighttree3d[data-phase=revealed] .scene-hint{opacity:1}
.lighttree-greeting{position:absolute;z-index:2;pointer-events:none;text-align:center;left:50%;top:50%;width:min(88vw,620px);transform:translate(-50%,-50%)}
#physical-stage[data-layout=wide] .lighttree-greeting{left:auto;right:6%;top:46%;transform:translateY(-50%);width:min(46vw,640px)}
#physical-stage[data-layout=tall] .lighttree-greeting{top:57%}
.lighttree-greeting h2{margin:0;font:italic 600 clamp(52px,8.4vw,112px)/1 Stationery,Georgia,serif;letter-spacing:.01em;color:#f4fbff}
.lighttree-greeting h2 span{display:inline-block;margin:0 .12em;opacity:0;filter:blur(10px);transform:translateY(.12em) scale(.96);text-shadow:0 0 8px #bfe4ff,0 0 26px #5fb4ff,0 0 60px #2f7fe0;background:linear-gradient(100deg,#f4fbff 40%,#ffffff 50%,#f4fbff 60%) 200% 0/250% 100%;-webkit-background-clip:text;background-clip:text}
.lighttree-greeting.written h2 span{animation:lighttree-word 1.4s cubic-bezier(.2,.8,.2,1) forwards,lighttree-shine 5s 2s ease-in-out infinite;animation-delay:calc(var(--i) * .45s),calc(2s + var(--i) * .45s)}
.lighttree-greeting p{margin:18px 0 0;font:600 clamp(12px,1.3vw,15px)/1.4 Arial,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#bfe0ff;opacity:0;text-shadow:0 0 12px #5fb4ff88}
.lighttree-greeting p.lighttree-from{margin-top:10px;font:italic 400 clamp(18px,1.9vw,24px)/1.3 Stationery,Georgia,serif;letter-spacing:0;text-transform:none;color:#e6f2ff}
.lighttree-greeting.written p{animation:lighttree-fade 1.2s forwards;animation-delay:1.3s}
.lighttree-greeting.written p.lighttree-from{animation-delay:1.8s}
@keyframes lighttree-word{to{opacity:1;filter:blur(0);transform:none}}
@keyframes lighttree-shine{0%,70%{background-position:200% 0}100%{background-position:-50% 0}}
@keyframes lighttree-fade{to{opacity:1}}
@media(max-width:700px){.lighttree-greeting h2{font-size:clamp(46px,14vw,72px)}}
.no-motion .lighttree-greeting.written h2 span,.no-motion .lighttree-greeting.written p{animation:none;opacity:1;filter:none;transform:none}
/* Buttons in each scene's own material. */
body.scene-hearth2d .handling button,body.scene-hearth2d #after-reveal button{background:linear-gradient(#7a4424,#4d2612);color:#ffe7bd;border:1px solid #d9a441;border-radius:999px;font:italic 600 16px Stationery,Georgia,serif;letter-spacing:.02em;box-shadow:0 6px 22px #1a0600aa,0 0 18px #ff9a3a33,inset 0 1px 0 #b77a45}
body.scene-windowglobe3d .handling button,body.scene-windowglobe3d #after-reveal button{background:#ffffff26;color:#ffffff;border:1px solid #ffffff80;border-radius:999px;font:500 15px Arial,sans-serif;letter-spacing:.04em;backdrop-filter:blur(10px) saturate(1.3);box-shadow:0 8px 26px #0a1a3a66,inset 0 1px 0 #ffffff66;text-shadow:0 1px 3px #0a1a3a88}
body.scene-lighttree3d #after-reveal button{background:#7ab8ff1f;color:#eef7ff;border:1px solid #a9d6ffaa;backdrop-filter:blur(8px);font:500 15px Arial,sans-serif;letter-spacing:.04em;box-shadow:0 0 20px #5fb4ff55,inset 0 0 12px #5fb4ff22;text-shadow:0 0 8px #7ab8ff}
body.scene-hearth2d #after-reveal button:hover,body.scene-windowglobe3d #after-reveal button:hover,body.scene-lighttree3d #after-reveal button:hover{filter:brightness(1.12)}
/* The actions arrive gently at the end of a scene instead of popping in. */
body.scene-windowglobe3d #after-reveal:not([hidden]),body.scene-hearth2d #after-reveal:not([hidden]),body.scene-lighttree3d #after-reveal:not([hidden]),.keepsake-v3 #after-reveal:not([hidden]){animation:scene-actions-in .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes scene-actions-in{from{opacity:0;transform:translateY(10px)}}
.no-motion #after-reveal{animation:none!important}
body.scene-windowglobe3d[data-phase=opening] .scene-hint{opacity:0}