
:root{--paper:#fbf7f0;--ink:#624c43;--muted:#a28b7d;--coral:#bc705b;--line:#e7d9c9;--serif:Georgia,'Songti SC','STSong',serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;background:var(--paper)}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--coral);outline-offset:5px}button{color:inherit}a{color:inherit;text-decoration:none}.site-header{height:105px;max-width:1450px;margin:auto;padding:0 6%;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-size:19px;letter-spacing:2px}.brand-symbol{color:var(--coral);font-size:35px}.brand-en{font-family:Arial,sans-serif;font-size:8px;letter-spacing:2px;margin-left:10px;border-left:1px solid var(--line);padding-left:20px}.quiet{background:none;border:1px solid var(--line);border-radius:30px;padding:12px 20px;font-size:12px}.quiet span{margin-left:14px}main{max-width:1390px;margin:18px auto 45px;display:grid;grid-template-columns:1fr 410px .8fr;align-items:center;gap:56px;padding:0 5%}.eyebrow{font-size:9px;letter-spacing:2.2px;color:#a18b77}.intro h1{font-family:var(--serif);font-size:clamp(30px,3vw,43px);font-weight:400;line-height:1.55;letter-spacing:1px;margin:26px 0}.intro h1 span{color:var(--coral)}.intro p{font-size:13px;line-height:2.2;color:#958376}.intro-rule{height:1px;width:42px;background:#cdae98;margin:30px 0}.small-label{font-size:11px;letter-spacing:2px}.steps{display:flex;gap:16px;font-size:9px;color:#bbaa9b;margin-top:18px}.steps .active{color:#ad6e57}.desktop-note{font-size:10px;color:#ae9b8b;margin-top:64px}.theater{position:relative;height:704px;overflow:hidden;border-radius:180px 180px 26px 26px;background:radial-gradient(ellipse at 50% 37%,#fff8e9 0%,#f5e2cb 60%,#f0d6c1 100%);border:7px solid #fffcf7;box-shadow:0 20px 65px #8d5e3720,0 0 0 1px #ebdfd2;transition:background 1s,color 1s}.arch{position:absolute;inset:14px;border:1px solid #c5a98666;border-radius:170px 170px 17px 17px;pointer-events:none}.scene-kicker{position:absolute;top:52px;width:100%;text-align:center;font-size:8px;letter-spacing:3px;color:#a88c70}.sound{position:absolute;right:31px;top:106px;border:1px solid #bca18a66;border-radius:50%;width:31px;height:31px;background:#fff7;font-size:17px;z-index:5}.sound-slash{position:absolute;height:20px;width:1px;background:#9f7b63;transform:rotate(40deg);left:15px;top:5px}.sound[aria-pressed=true] .sound-slash{display:none}.star{position:absolute;color:#b98f60}.star-a{top:165px;left:37px;font-size:25px}.star-b{top:266px;right:29px;font-size:15px}.scene-footer{position:absolute;bottom:26px;width:100%;text-align:center;color:#a28972;font-size:9px;letter-spacing:1px}.tiny-heart{margin-right:5px}#scene{height:100%;position:relative;padding:106px 25px 65px;display:flex;flex-direction:column;align-items:center;text-align:center;z-index:2}.scene-title{font-family:var(--serif);font-size:28px;line-height:1.5;font-weight:400;margin:12px 0 7px;letter-spacing:2px}.scene-copy{font-size:11px;line-height:1.9;color:#997e67;margin:0;max-width:290px}.scene-art{position:relative;flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}.messenger{max-height:100%;width:100%;object-fit:contain;filter:drop-shadow(0 12px 8px #936e4010);animation:arrive 1.2s ease both}.messenger.pet{max-height:91%;max-width:90%}.primary{border:0;border-radius:100px;background:var(--coral);color:#fff9f1;min-height:47px;padding:14px 30px;font-size:12px;letter-spacing:1px;box-shadow:0 6px 16px #925b4220;display:inline-flex;align-items:center;justify-content:center;gap:22px;transition:transform .2s,background .2s}.primary:hover{background:#aa604d;transform:translateY(-2px)}.scene-actions{width:100%;min-height:76px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px}.micro{font-size:9px;color:#a68b78;margin:0}.picker h2{font-family:var(--serif);font-size:24px;font-weight:400;letter-spacing:1px;margin:16px 0}.picker p{font-size:11px;color:var(--muted);line-height:1.8}.characters{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 15px;margin:30px 0}.character{border:0;background:none;padding:0;font-size:10px;display:flex;align-items:center;flex-direction:column;gap:10px}.portrait{width:85px;height:95px;border-radius:45px 45px 14px 14px;display:block;overflow:hidden;background:#f0e4d6;border:1px solid transparent;transition:all .2s}.portrait img{width:100%;height:180px;object-fit:cover;object-position:top;transform:translateY(3px)}.portrait.pet img{height:125px}.selected .portrait{border:1px solid #b9785e;box-shadow:0 0 0 4px #ead4c455;background:#efdbc4}.selected{color:#ae634e}.text-button{border:0;background:none;font-size:11px;color:#9d8170;padding:10px 0}.picker>.text-button{border-top:1px solid var(--line);width:100%;padding-top:20px;text-align:left}.page-footer{max-width:1240px;padding:25px 20px;margin:0 auto;display:flex;justify-content:space-between;border-top:1px solid var(--line);font-size:9px;color:#ac9989;letter-spacing:1px}.page-footer i{margin:0 9px}.cake-wrap{position:relative;width:100%;max-width:315px;animation:arrive 1s ease both}.cake-img{display:block;width:100%;filter:drop-shadow(0 16px 13px #7d503d18)}.candle{position:absolute;left:50%;top:6%;height:57px;width:11px;border-radius:3px;background:repeating-linear-gradient(30deg,#f9dec1 0px,#f9dec1 7px,#c5846b 8px,#c5846b 12px);transform:translateX(-50%);box-shadow:inset -3px 0 2px #8d57352a}.wick{position:absolute;width:2px;height:7px;background:#5e4937;top:-6px;left:5px}.flame{display:none;position:absolute;width:15px;height:27px;border-radius:60% 40% 55% 45%;background:radial-gradient(ellipse at 50% 75%,#fffce0 10%,#ffd079 48%,#e49332 90%);top:-30px;left:-2px;box-shadow:0 0 20px #ffd487,0 0 60px 22px #ffcf7633;animation:flicker 1s ease-in-out infinite alternate;transform-origin:bottom}.lit .flame{display:block}.theater.night{background:radial-gradient(ellipse at 50% 55%,#77553f,#382f30 80%);color:#f6e5cd}.night .scene-copy,.night .micro,.night .scene-footer,.night .scene-kicker{color:#cbb49a}.night .cake-img{filter:drop-shadow(0 0 35px #ffd28f24)}.night .sound{color:#f1d8bc;background:#675549}.hold{position:relative;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}.hold:after{content:'';position:absolute;inset:0;background:#fff3;transform:scaleX(0);transform-origin:left}.hold.holding:after{transform:scaleX(1);transition:transform 1.2s linear}.envelope{width:240px;height:165px;background:#ecd2b5;position:relative;box-shadow:0 20px 35px #7b513c1c;border-radius:5px;transform:rotate(-5deg);border:0;animation:arrive 1s ease both}.envelope:before{content:'';position:absolute;inset:0;background:#f6e5cc;clip-path:polygon(0 0,100% 0,50% 63%)}.envelope:after{content:'♡';position:absolute;top:75px;left:99px;width:42px;height:42px;line-height:40px;border-radius:50%;background:#bd715a;color:#f9e6d1;font-size:25px;box-shadow:0 3px 8px #8d483b33}.letter-paper{background:#fff9ed;padding:23px 22px;width:100%;margin:15px 0;border:1px solid #d8bea066;border-radius:3px;box-shadow:0 8px 30px #8b543511;overflow:auto;text-align:left;flex:1;min-height:0;animation:arrive .6s ease both}.letter-paper h3{font-family:var(--serif);font-size:20px;font-weight:400;margin:0 0 16px}.letter-body{white-space:pre-wrap;font-family:var(--serif);font-size:14px;line-height:2;color:#81604b;overflow-wrap:anywhere}.signature{text-align:right;font-family:var(--serif);font-size:14px;color:#b7775b;margin:22px 0 0}.heart-mark{font-size:22px;color:#b47c61}.letter-scene .scene-title{font-size:24px}.confetti-bit{position:absolute;top:-20px;width:7px;height:11px;animation:fall 3.4s ease-in forwards}#confetti{position:absolute;inset:0;pointer-events:none;z-index:4}.final-art{max-width:235px}dialog{border:1px solid #e7d3c1;border-radius:20px;background:#fffaf2;color:var(--ink);padding:28px;max-width:470px;width:calc(100% - 32px);max-height:90dvh;box-shadow:0 25px 100px #38241633}dialog::backdrop{background:#44362b66;backdrop-filter:blur(6px)}.dialog-top{display:flex;justify-content:space-between;align-items:center}.close{border:0;background:none;font-size:27px;color:#987a66;padding:0 5px}dialog h2{font-family:var(--serif);font-weight:400;font-size:25px;margin:20px 0 12px}.muted{font-size:12px;color:var(--muted);line-height:1.8}.input-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}label{display:block;font-size:12px;margin-top:16px}input,textarea{display:block;width:100%;margin-top:8px;background:#fffdf8;border:1px solid #e7d8c8;border-radius:8px;padding:12px;color:var(--ink);font-size:14px;resize:vertical}input:focus,textarea:focus{outline:1px solid #b77860}.form-hint,.local-note{font-size:10px;line-height:1.7;color:#a78f7b}.local-note{text-align:center}form .primary,#download{width:100%;margin-top:10px}#memory-image{width:100%;max-height:55dvh;object-fit:contain}#memory h2{font-size:23px}.error-hint{color:#a15749;font-size:10px;max-width:270px;margin:0}.primary:disabled{opacity:.6;cursor:wait}@keyframes arrive{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes flicker{to{transform:rotate(5deg) scale(.9,1.05)}}@keyframes fall{to{transform:translate(var(--drift),760px) rotate(520deg);opacity:0}}@media(min-width:1400px){main{gap:75px}}@media(max-width:1150px){main{grid-template-columns:1fr 380px;gap:35px;max-width:950px}.picker{grid-column:1/-1;display:flex;align-items:center;gap:30px;justify-content:center}.characters{display:flex;margin:10px}.picker>.text-button{width:auto;border:0}.theater{height:690px}.desktop-note{margin-top:35px}}@media(max-width:700px){.site-header{height:76px;padding:0 22px}.brand{font-size:16px;gap:8px}.brand-en{display:none}.brand-symbol{font-size:28px}.quiet{font-size:10px;padding:9px 13px}.quiet span{margin-left:5px}main{display:flex;flex-direction:column;margin:0 auto 25px;padding:0 17px;gap:25px;max-width:460px}.intro{display:none}.theater{width:100%;height:clamp(590px,calc(100svh - 103px),720px);border-width:5px;border-radius:165px 165px 24px 24px}.arch{inset:12px}.scene-kicker{top:43px}.sound{top:94px;right:28px}#scene{padding:90px 24px 57px}.scene-title{font-size:27px}.scene-footer{bottom:22px;font-size:8px}.scene-actions{min-height:76px}.picker{display:block;width:100%;text-align:center}.picker .eyebrow{font-size:8px}.picker h2{font-size:21px;margin:10px 0}.picker p{margin:0}.characters{display:flex;justify-content:space-between;gap:9px;margin:20px 0}.portrait{width:65px;height:76px}.portrait img{height:145px}.portrait.pet img{height:100px}.character{font-size:9px}.picker>.text-button{text-align:center;width:auto;padding:8px}.page-footer{margin:0 20px;flex-direction:column;gap:12px;text-align:center;line-height:1.7}.cake-wrap{max-width:290px}.scene-copy{font-size:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* V2: one persistent stage with choreographed object transitions. */
.continuous-scene .scene-caption{position:absolute;top:105px;left:20px;right:20px;z-index:6;pointer-events:none;transition:opacity .4s,transform .6s}.continuous-scene .scene-title{font-size:25px;margin:10px 0}.continuous-scene .scene-copy{font-size:10px}.continuous-scene .scene-actions{position:absolute;bottom:61px;left:15px;right:15px;width:auto;z-index:8;min-height:54px}.stage-world{position:absolute;inset:0;perspective:900px;pointer-events:none}.stage-halo{position:absolute;width:310px;height:370px;left:50%;top:235px;transform:translateX(-50%);background:radial-gradient(ellipse,#fff5dcb0,transparent 65%);transition:opacity 1.2s,transform 1.8s}.stage-floor{position:absolute;width:210px;height:22px;border-radius:50%;background:#9164431a;filter:blur(9px);left:50%;bottom:153px;transform:translateX(-50%);transition:all 1.4s}.avatar-position{position:absolute;top:215px;bottom:145px;left:17%;right:17%;transform-origin:50% 90%;transition:transform 1.8s cubic-bezier(.22,.7,.2,1),opacity 1.25s,filter 1.2s;animation:avatar-arrival 2.2s cubic-bezier(.2,.7,.25,1) both}.avatar{height:100%;width:100%;object-fit:contain;transform-origin:50% 95%;animation:breathing 4.4s ease-in-out infinite}.avatar.pet{padding:18px 0}.reveal-gift{position:absolute;width:144px;height:122px;left:50%;top:44%;margin-left:-72px;opacity:0;transform:scale(.3);transition:opacity .35s,transform 1s cubic-bezier(.2,.65,.2,1);z-index:4}.gift-base{position:absolute;inset:28px 0 0;border-radius:3px 3px 8px 8px;background:linear-gradient(110deg,#fff7e5,#ead6b6);box-shadow:0 18px 23px #51331a25}.gift-base:after,.gift-lid:after{content:'';position:absolute;width:24px;left:60px;top:0;bottom:0;background:linear-gradient(90deg,#b76850,#e7a286,#b66650)}.gift-lid{position:absolute;left:-6px;right:-6px;top:12px;height:30px;border-radius:5px;background:linear-gradient(#fff9eb,#e7cfad);z-index:3;box-shadow:0 3px 5px #4f301626;transform-origin:20% 50%}.gift-lid:after{left:66px}.gift-lid i:before,.gift-lid i:after{content:'';position:absolute;top:-26px;width:40px;height:29px;border:7px solid #cd8269;border-radius:70% 80% 0 80%;left:37px;transform:rotate(12deg)}.gift-lid i:after{left:75px;transform:scaleX(-1) rotate(12deg)}.gift-glow{position:absolute;inset:-100px;background:radial-gradient(#ffe6aa99,transparent 64%);opacity:0}.cake-position{position:absolute;width:80%;left:10%;top:31%;opacity:0;transform:translateY(65px) scale(.45);transform-origin:50% 65%;transition:transform 1.6s cubic-bezier(.2,.7,.2,1),opacity 1s,filter 1s;z-index:3}.cake-position .cake-wrap{max-width:none;animation:none}.cake-position .candle{top:7%}.letter-position{position:absolute;left:50%;top:45%;width:240px;margin-left:-120px;opacity:0;transform:translateY(100px) rotate(-9deg) scale(.65);transition:transform 1.2s cubic-bezier(.2,.7,.2,1),opacity .7s;z-index:5}.letter-position .envelope{animation:none;transform:none;pointer-events:auto;isolation:isolate}.letter-position .envelope:before{z-index:3;transform-origin:50% 0;transition:transform .8s}.letter-position .envelope:after{z-index:4;transition:opacity .25s,transform .5s}.letter-peek{position:absolute;inset:15px 15px 5px;background:#fffaf0;color:#b67559;padding-top:30px;font-size:32px;z-index:1;transition:transform .8s .4s}.letter-position .envelope{background:linear-gradient(32deg,#edd4b8 49%,transparent 50%),linear-gradient(-32deg,#e5c6a3 49%,#f0dcc4 50%)}.continuous-scene .letter-paper{position:absolute;left:25px;right:25px;top:135px;bottom:145px;width:auto;margin:0;z-index:7;animation:paper-unfold .8s cubic-bezier(.2,.7,.2,1) both}.continuous-scene .letter-paper[hidden]{display:none}.smoke{position:absolute;left:50%;top:0%;opacity:0}.smoke i{position:absolute;width:16px;height:40px;border-left:2px solid #eddccd;border-radius:50%;filter:blur(2px);opacity:0}.wish-rings{position:absolute;width:180px;height:180px;left:50%;top:38%;margin-left:-90px;opacity:0}.wish-rings i{position:absolute;inset:0;border:1px solid #fff0bc;border-radius:50%}.warm-sparkles{position:absolute;inset:35% 15% auto;color:#d7ad65;font-size:25px;opacity:0}.warm-sparkles span{position:absolute;right:0;top:55px;font-size:17px}.warm-sparkles i{position:absolute;left:35%;top:180px;font-size:13px}.continuous-scene[data-phase=intro] .avatar-position{transform:translateY(0) scale(1)}.continuous-scene[data-phase=unwrap] .avatar-position{transform:translateY(15px) scale(1.22);opacity:0;filter:blur(4px)}.continuous-scene[data-phase=unwrap] .reveal-gift{opacity:1;transform:translateY(25px) scale(1.35)}.continuous-scene[data-phase=unwrap] .gift-lid{animation:lift-lid 1.5s .65s ease-in-out forwards}.continuous-scene[data-phase=unwrap] .gift-glow{animation:gift-light 1.8s .4s ease forwards}.continuous-scene:not([data-phase=intro]):not([data-phase=unwrap]) .avatar-position{opacity:0;transform:translateY(25px) scale(1.25);filter:blur(5px)}.continuous-scene:not([data-phase=intro]):not([data-phase=unwrap]) .reveal-gift{transform:translateY(100px) scale(1.6);opacity:0}.continuous-scene:is([data-phase=cake],[data-phase=wish],[data-phase=celebrate],[data-phase=final]) .cake-position{opacity:1;transform:translateY(0) scale(1)}.continuous-scene[data-phase=wish] .cake-position{transform:translateY(2px) scale(1.06);filter:drop-shadow(0 0 27px #ffdb7933)}.continuous-scene[data-phase=wish] .stage-halo{opacity:.2;transform:translateX(-50%) scale(1.3)}.continuous-scene[data-phase=celebrate] .smoke{opacity:1}.continuous-scene[data-phase=celebrate] .smoke i{animation:smoke-rise 2.8s ease-out both}.continuous-scene[data-phase=celebrate] .smoke i:nth-child(2){animation-delay:.2s;left:5px}.continuous-scene[data-phase=celebrate] .smoke i:nth-child(3){animation-delay:.4s;left:-4px}.continuous-scene[data-phase=celebrate] .wish-rings{opacity:1}.continuous-scene[data-phase=celebrate] .wish-rings i{animation:wish-ring 2.3s ease-out both}.continuous-scene[data-phase=celebrate] .wish-rings i+ i{animation-delay:.3s}.continuous-scene[data-phase=celebrate] .warm-sparkles{animation:sparkle-in 3s ease both}.continuous-scene:is([data-phase=envelope],[data-phase=opening],[data-phase=letter]) .cake-position{opacity:.14;transform:translateY(100px) scale(.85);filter:blur(3px)}.continuous-scene:is([data-phase=envelope],[data-phase=opening]) .letter-position{opacity:1;transform:translateY(0) rotate(-4deg) scale(1)}.continuous-scene[data-phase=opening] .envelope:before{transform:rotateX(180deg);z-index:0}.continuous-scene[data-phase=opening] .envelope:after{opacity:0;transform:scale(.7)}.continuous-scene[data-phase=opening] .letter-peek{transform:translateY(-95px)}.continuous-scene[data-phase=letter] .letter-position{opacity:0;transform:translateY(40px) scale(1.05)}.continuous-scene:is([data-phase=opening],[data-phase=letter]) .scene-caption{opacity:0;transform:translateY(-12px)}.continuous-scene[data-phase=final] .cake-position{transform:scale(.92)}.night .text-button{color:#e8c7a2}.theater{transition:background 1.6s,color 1s}.scene-footer{opacity:.65}.continuous-scene .scene-actions:empty{pointer-events:none}@keyframes avatar-arrival{0%{opacity:0;translate:0 25px;scale:.8}100%{opacity:1;translate:0 0;scale:1}}@keyframes breathing{0%,100%{transform:rotate(-.4deg) translateY(0)}50%{transform:rotate(.5deg) translateY(-3px)}}@keyframes lift-lid{0%{transform:translateY(0) rotate(0)}40%{transform:translateY(-20px) rotate(-6deg)}100%{transform:translate(-27px,-130px) rotate(-20deg);opacity:0}}@keyframes gift-light{40%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.8)}}@keyframes smoke-rise{0%{opacity:0;transform:translate(0,0) scale(.5)}20%{opacity:.7}100%{opacity:0;transform:translate(15px,-80px) scale(1.8)}}@keyframes wish-ring{0%{opacity:.7;transform:scale(.5)}100%{opacity:0;transform:scale(2.3)}}@keyframes sparkle-in{0%,100%{opacity:0;transform:translateY(10px)}35%{opacity:1;transform:translateY(0)}}@keyframes paper-unfold{from{opacity:0;transform:translateY(45px) scale(.85) rotate(-4deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}@media(max-width:700px){.continuous-scene .scene-caption{top:100px}.continuous-scene .scene-title{font-size:24px}.avatar-position{top:208px;bottom:137px;left:13%;right:13%}.continuous-scene .scene-actions{bottom:60px}.continuous-scene .letter-paper{top:130px;bottom:135px}.cake-position{top:32%;width:86%;left:7%}}@media(prefers-reduced-motion:reduce){.continuous-scene .avatar-position{animation:none}.continuous-scene[data-phase=unwrap] .gift-lid{opacity:0}.continuous-scene[data-phase=opening] .letter-peek{transform:none}.warm-sparkles,.wish-rings,.smoke{display:none}}
.continuous-scene[data-phase=cake] .candle{pointer-events:auto;cursor:pointer}.continuous-scene[data-phase=cake] .candle:after{content:'';position:absolute;inset:-20px}.continuous-scene .flame{transition:opacity .4s}.continuous-scene .lit .flame{animation:ignite .55s ease-out,flicker 1s .55s ease-in-out infinite alternate}.continuous-scene[data-phase=wish] .scene-actions{min-height:105px;bottom:39px}.continuous-scene[data-phase=wish] .scene-actions .text-button{padding:2px 0}.continuous-scene[data-phase=wish] .cake-position{transform:translateY(-12px) scale(1.04)}@keyframes ignite{from{opacity:0;transform:scale(.1)}65%{opacity:1;transform:scale(1.35)}to{transform:scale(1)}}
.continuous-scene:not([data-phase=intro]) .avatar-position{animation:none}.continuous-scene:not([data-phase=envelope]):not([data-phase=opening]) .letter-position{visibility:hidden;pointer-events:none}.continuous-scene:is([data-phase=envelope],[data-phase=opening]) .letter-position{visibility:visible}
/* V2.1: approach, handoff, and a continuous gift-to-cake reveal. */
.continuous-scene[data-phase=intro] .avatar-position{top:204px;bottom:115px;left:9%;right:9%;transform-origin:50% 75%;animation:walk-toward 3.4s cubic-bezier(.22,.45,.25,1) both}.continuous-scene[data-phase=intro] .avatar{animation:walking-sway .56s ease-in-out 5,breathing 4.4s 3s ease-in-out infinite}.continuous-scene[data-phase=intro] .stage-floor{animation:shadow-approach 3.4s ease both;bottom:122px}.continuous-scene .reveal-gift{border:0;padding:0;background:transparent;pointer-events:none;top:52%;overflow:visible;transform-origin:50% 50%;outline-offset:25px}.continuous-scene[data-phase=intro] .reveal-gift{opacity:1;transform:translateY(0) scale(1.18);animation:gift-handoff 3.4s cubic-bezier(.2,.6,.2,1) both;z-index:5}.continuous-scene[data-phase=intro][data-arrived=true] .reveal-gift{pointer-events:auto;cursor:pointer}.continuous-scene[data-phase=intro][data-arrived=true] .reveal-gift:hover{filter:brightness(1.035)}.gift-touch{position:absolute;left:-30px;right:-30px;bottom:-40px;color:#9d6c51;font-size:10px;letter-spacing:2px;opacity:0;white-space:nowrap}.continuous-scene[data-phase=intro][data-arrived=true] .gift-touch{animation:touch-in .65s ease both}.continuous-scene[data-phase=intro][data-arrived=true] .gift-lid{animation:gift-nudge 3s 1s ease-in-out infinite}.continuous-scene[data-phase=unwrap] .reveal-gift{opacity:1;transform:scale(1.18);animation:box-reveal 2.6s cubic-bezier(.2,.7,.2,1) both}.continuous-scene[data-phase=unwrap] .gift-lid{animation:lid-unfold 1.65s .12s cubic-bezier(.2,.7,.2,1) both}.continuous-scene[data-phase=unwrap] .gift-glow{animation:inner-light 2.5s ease both}.continuous-scene[data-phase=unwrap] .avatar-position{top:204px;bottom:115px;left:9%;right:9%;transform:scale(1.3);opacity:0;filter:blur(8px);transition:opacity .9s,filter 1s}.continuous-scene[data-phase=unwrap] .cake-position{opacity:1;animation:cake-emerge 2.6s cubic-bezier(.18,.65,.2,1) both;z-index:4}.continuous-scene[data-phase=unwrap] .scene-caption{opacity:0}.continuous-scene[data-phase=unwrap] .stage-floor{opacity:0}.reveal-wash{position:absolute;inset:0;z-index:6;pointer-events:none;background:radial-gradient(ellipse at 50% 56%,#fff9e7 0%,#fff0d699 38%,transparent 73%);opacity:0}.continuous-scene[data-phase=unwrap] .reveal-wash{animation:light-wash 2.6s ease both}.continuous-scene[data-phase=cake] .cake-position{transition:none}.gift-base:before{content:'';position:absolute;inset:4px;border:1px solid #fff9;border-radius:4px}.continuous-scene[data-phase=intro] .scene-caption{animation:greeting-in 1.3s .6s both}.continuous-scene[data-phase=intro] .stage-halo{opacity:.7}.continuous-scene .gift-base,.continuous-scene .gift-lid,.continuous-scene .gift-glow{display:block}@keyframes walk-toward{0%{opacity:0;transform:translateY(-80px) scale(.27)}10%{opacity:1}25%{transform:translate(-3px,-63px) scale(.43)}45%{transform:translate(3px,-42px) scale(.63)}65%{transform:translate(-2px,-19px) scale(.87)}83%{transform:translate(1px,-3px) scale(1.12)}100%{opacity:1;transform:translateY(0) scale(1.28)}}@keyframes walking-sway{0%,100%{transform:translateY(0) rotate(-1deg)}25%{transform:translateY(-5px) rotate(0)}50%{transform:translateY(0) rotate(1deg)}75%{transform:translateY(-5px) rotate(0)}}@keyframes shadow-approach{from{opacity:.15;transform:translate(-50%,-95px) scale(.25)}to{opacity:1;transform:translate(-50%,0) scale(1.2)}}@keyframes gift-handoff{0%,57%{opacity:0;transform:translateY(-48px) scale(.36)}68%{opacity:1;transform:translateY(-24px) scale(.62)}85%{opacity:1;transform:translateY(-4px) scale(.94)}100%{opacity:1;transform:translateY(0) scale(1.18)}}@keyframes gift-nudge{0%,82%,100%{transform:rotate(0)}87%{transform:rotate(-2deg) translateY(-2px)}93%{transform:rotate(1deg)}}@keyframes touch-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes greeting-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes box-reveal{0%{opacity:1;transform:scale(1.18)}20%{opacity:1;transform:translateY(5px) scale(1.1)}48%{opacity:1;transform:translateY(30px) scale(1.4)}75%,100%{opacity:0;transform:translateY(155px) scale(1.75)}}@keyframes lid-unfold{0%{opacity:1;transform:translateY(0) rotate(0)}25%{opacity:1;transform:translateY(-12px) rotate(-3deg)}65%{opacity:1;transform:translate(-24px,-120px) rotate(-20deg)}100%{opacity:0;transform:translate(-48px,-210px) rotate(-30deg)}}@keyframes inner-light{0%{opacity:0;transform:scale(.3)}40%{opacity:1;transform:scale(1.2)}80%,100%{opacity:0;transform:scale(2.4)}}@keyframes light-wash{0%,17%{opacity:0;transform:scale(.3)}45%{opacity:.95;transform:scale(1.1)}100%{opacity:0;transform:scale(1.8)}}@keyframes cake-emerge{0%,25%{opacity:0;transform:translateY(90px) scale(.3);filter:blur(5px)}45%{opacity:.4;transform:translateY(40px) scale(.65);filter:blur(2px)}78%{opacity:1;transform:translateY(-5px) scale(1.025);filter:blur(0)}100%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@media(prefers-reduced-motion:reduce){.continuous-scene[data-phase=intro] .avatar-position{transform:scale(1.28)}.continuous-scene[data-phase=intro] .reveal-gift{opacity:1;transform:scale(1.18)}.continuous-scene[data-phase=intro][data-arrived=true] .gift-touch{opacity:1}.continuous-scene[data-phase=unwrap] .cake-position{opacity:1;transform:scale(1)}.continuous-scene[data-phase=unwrap] .reveal-gift{opacity:0}}
.continuous-scene[data-phase=intro] .avatar-position,.continuous-scene[data-phase=unwrap] .avatar-position{top:255px;bottom:122px}.continuous-scene .reveal-gift{top:47%}.continuous-scene[data-phase=intro] .scene-caption{z-index:6}@media(max-width:700px){.continuous-scene[data-phase=intro] .avatar-position,.continuous-scene[data-phase=unwrap] .avatar-position{top:245px;bottom:120px}}
/* V2.2: avatar and cake travel as one composition. */
.carrier{position:absolute;inset:0;transform-origin:50% 64%;opacity:0;transform:translateY(-45px) scale(.32);pointer-events:none;transition:opacity .8s,transform 1s}.carrier-step{position:absolute;inset:0}.continuous-scene .carrier .avatar-position{position:absolute;top:168px;bottom:auto;left:50%;right:auto;width:520px;height:780px;margin-left:-260px;opacity:1;filter:blur(0);transform:none;animation:none;transition:filter 1.4s,opacity 1s;mask-image:none;-webkit-mask-image:none}.continuous-scene .carrier .avatar{animation:none;transform:none;padding:0}.continuous-scene .carrier .cake-position{left:8%;width:84%;top:45%;opacity:1;transform:none;animation:none;filter:none;transition:transform 1s,opacity 1s}.continuous-scene[data-phase=intro] .carrier{opacity:0;visibility:hidden}.continuous-scene[data-phase=intro] .stage-floor{animation:none;opacity:0}.continuous-scene[data-phase=intro] .scene-caption{top:220px;animation:none}.continuous-scene[data-phase=intro] .scene-title{font-size:27px}.continuous-scene[data-phase=intro] .scene-actions{bottom:180px}.continuous-scene[data-phase=intro] .stage-halo{opacity:.7}.continuous-scene[data-phase=approach] .carrier{visibility:visible;animation:carrying-approach 5.2s cubic-bezier(.23,.4,.28,1) both}.continuous-scene[data-phase=approach] .carrier-step{animation:carrying-steps .85s ease-in-out 5}.continuous-scene[data-phase=approach] .scene-caption{opacity:0}.continuous-scene[data-phase=approach] .carrier .avatar-position{animation:focus-pull 5.2s linear both}.continuous-scene:is([data-phase=cake],[data-phase=wish],[data-phase=celebrate],[data-phase=envelope],[data-phase=opening],[data-phase=letter],[data-phase=final]) .carrier{opacity:1;transform:translateY(0) scale(1)}.continuous-scene:is([data-phase=cake],[data-phase=wish],[data-phase=celebrate]) .carrier .avatar-position{opacity:.82;filter:blur(1.5px)}.continuous-scene:is([data-phase=cake],[data-phase=wish],[data-phase=celebrate]) .scene-caption{top:99px}.continuous-scene:is([data-phase=envelope],[data-phase=opening],[data-phase=letter],[data-phase=final]) .carrier .avatar-position{opacity:0}.continuous-scene:is([data-phase=envelope],[data-phase=opening],[data-phase=letter]) .carrier .cake-position{opacity:.14;transform:translateY(35px) scale(.9);filter:blur(3px)}.continuous-scene[data-phase=final] .carrier .cake-position{transform:translateY(-35px)}.continuous-scene[data-phase=wish] .carrier .cake-position{filter:drop-shadow(0 0 20px #ffcf7922)}.continuous-scene .carrier .cake-img{filter:drop-shadow(0 12px 15px #80583d20)}.continuous-scene[data-phase=approach] .stage-floor{animation:carrying-shadow 5.2s ease both}.continuous-scene[data-phase=intro] .scene-caption:before{content:'♡';display:block;font-family:Georgia,serif;font-size:62px;font-weight:normal;line-height:1.4;color:#bf8469;margin-bottom:18px}.continuous-scene .carrier .candle{pointer-events:none}.continuous-scene[data-phase=cake] .carrier .candle{pointer-events:auto}@keyframes carrying-approach{0%{opacity:0;transform:translateY(-48px) scale(.3)}12%{opacity:1}35%{opacity:1;transform:translateY(-31px) scale(.49)}65%{opacity:1;transform:translateY(-12px) scale(.76)}85%{opacity:1;transform:translateY(-3px) scale(.94)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes carrying-steps{0%,100%{transform:translate(0,0) rotate(-.3deg)}25%{transform:translate(-1px,-2px) rotate(0)}50%{transform:translate(0,0) rotate(.3deg)}75%{transform:translate(1px,-2px) rotate(0)}}@keyframes focus-pull{0%,65%{filter:blur(0);opacity:1}100%{filter:blur(1.5px);opacity:.82}}@keyframes carrying-shadow{0%{opacity:0;transform:translate(-50%,-50px) scale(.2)}100%{opacity:.5;transform:translate(-50%,0) scale(1)}}@media(max-width:700px){.continuous-scene .carrier .avatar-position{top:158px;width:480px;height:720px;margin-left:-240px}.continuous-scene .carrier .cake-position{top:44%}.continuous-scene[data-phase=intro] .scene-caption{top:190px}}@media(max-height:730px) and (max-width:700px){.continuous-scene .carrier .avatar-position{top:155px;width:420px;height:630px;margin-left:-210px}.continuous-scene .carrier .cake-position{width:76%;left:12%;top:44%}.continuous-scene[data-phase=intro] .scene-caption{top:145px}.continuous-scene[data-phase=intro] .scene-actions{bottom:140px}}@media(prefers-reduced-motion:reduce){.continuous-scene[data-phase=approach] .carrier{opacity:1;transform:none}.continuous-scene[data-phase=approach] .carrier-step{animation:none}}
.continuous-scene .carrier .cake-position{top:40%;width:78%;left:11%}.continuous-scene .carrier .avatar-position{mask-image:none;-webkit-mask-image:none}@media(max-width:700px){.continuous-scene .carrier .cake-position{top:40%;width:78%;left:11%}}@media(max-height:730px) and (max-width:700px){.continuous-scene .carrier .cake-position{top:40%;width:70%;left:15%}}
/* Reference sequence: arrival, letter, candle close-up, ensemble celebration. */
.continuous-scene[data-phase=approach] .carrier{animation-duration:7.5s}.continuous-scene[data-phase=approach] .carrier-step{animation-duration:.95s;animation-iteration-count:7}.continuous-scene[data-phase=approach] .carrier .avatar-position{animation-duration:7.5s}.continuous-scene[data-phase=approach] .stage-floor{animation-duration:7.5s}.continuous-scene:is([data-phase=envelope],[data-phase=opening],[data-phase=letter]) .carrier{transform:translateY(5px) scale(.74);opacity:1;transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}.continuous-scene:is([data-phase=envelope],[data-phase=opening]) .carrier .avatar-position{opacity:1;filter:none}.continuous-scene[data-phase=letter] .carrier .avatar-position{opacity:.35;filter:blur(2px)}.continuous-scene:is([data-phase=envelope],[data-phase=opening]) .carrier .cake-position{opacity:1;transform:none;filter:none}.continuous-scene[data-phase=envelope] .letter-position{top:43%;transform:translateY(0) rotate(-4deg) scale(.85)}.continuous-scene[data-phase=opening] .letter-position{top:43%;transform:translateY(0) rotate(-4deg) scale(.95)}.continuous-scene[data-phase=wish] .carrier{transform:translateY(-12px) scale(1.08);transition:transform 1.8s cubic-bezier(.2,.7,.2,1)}.party-cast{position:absolute;inset:0;opacity:0;pointer-events:none;z-index:3}.party-person{position:absolute;width:95px;height:170px;left:calc(4% + var(--i)*17%);bottom:145px;transform:translateY(230px) scale(.5);opacity:0}.party-person img{width:100%;height:100%;object-fit:contain}.heart-balloon{position:absolute;left:40%;top:34%;font-size:75px;color:#bc6655;text-shadow:inset 0 2px #fff;transform:translateY(330px);opacity:0}.heart-balloon i{position:absolute;left:50%;top:80%;width:1px;height:90px;background:#c5a185;transform:rotate(5deg)}.continuous-scene[data-phase=celebrate] .carrier{animation:party-pullback 3s cubic-bezier(.2,.7,.2,1) both}.continuous-scene[data-phase=celebrate] .party-cast{opacity:1}.continuous-scene[data-phase=celebrate] .party-person{animation:party-arrive 1.8s calc(1.4s + var(--i)*.3s) ease-out both}.continuous-scene[data-phase=celebrate] .party-person img{animation:party-sway 1.6s calc(3s + var(--i)*.2s) ease-in-out infinite alternate}.continuous-scene[data-phase=celebrate] .heart-balloon{animation:heart-rise 3.2s 1.2s ease-out both}.continuous-scene[data-phase=celebrate] .party-continue{animation:party-button .7s 6s both}.continuous-scene[data-phase=celebrate] .scene-caption{animation:party-button 1s 1s both}.arrival-balloons{position:absolute;inset:0;opacity:0;pointer-events:none}.arrival-balloons i{position:absolute;width:34px;height:45px;border-radius:50%;background:linear-gradient(120deg,#fce6b9,#d8ad70);left:8%;top:55%}.arrival-balloons i:after{content:'';position:absolute;height:90px;width:1px;background:#c7ab8e;left:50%;top:100%}.arrival-balloons i:nth-child(2){left:auto;right:9%;top:35%;background:linear-gradient(120deg,#f6cbb9,#c67b65)}.arrival-balloons i:nth-child(3){left:13%;top:23%;width:25px;height:34px;background:linear-gradient(120deg,#f8eee1,#dccbb2)}.continuous-scene[data-phase=approach] .arrival-balloons{animation:balloons-arrive 7.5s ease both}.continuous-scene[data-phase=celebrate] .confetti-bit{animation-duration:5s}@keyframes party-pullback{0%{transform:translateY(-12px) scale(1.08);opacity:1}100%{transform:translateY(120px) scale(.27);opacity:0}}@keyframes party-arrive{from{opacity:0;transform:translateY(230px) scale(.5)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes party-sway{from{transform:rotate(-4deg) translateY(0)}to{transform:rotate(4deg) translateY(-8px)}}@keyframes heart-rise{from{opacity:0;transform:translateY(330px) scale(.6)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes party-button{from{opacity:0;visibility:hidden}to{opacity:1;visibility:visible}}@keyframes balloons-arrive{0%{opacity:0;transform:translateY(130px)}25%,65%{opacity:.8}100%{opacity:0;transform:translateY(-180px)}}@media(prefers-reduced-motion:reduce){.continuous-scene[data-phase=celebrate] .carrier{opacity:0}.continuous-scene[data-phase=celebrate] .party-person{opacity:1;transform:none}.continuous-scene[data-phase=celebrate] .heart-balloon{opacity:1;transform:none}}
/* V3: integrated hands/plate/cake artwork with independent leg mesh animation. */
.walk-canvas{position:absolute;inset:0;width:100%;height:100%;display:none;pointer-events:none}.rig-ready .walk-canvas{display:block}.rig-ready>.avatar{visibility:hidden}.continuous-scene .carrier .avatar-position{top:160px;width:740px;height:1110px;margin-left:-370px;filter:none!important;opacity:1;mask-image:none;-webkit-mask-image:none}.continuous-scene .carrier .avatar{object-fit:fill}.continuous-scene .carrier .cake-position{display:none}.continuous-scene[data-phase=final] .carrier .cake-position{display:block}.continuous-scene .carrier .avatar-position .candle{top:27.3%;left:50%;height:3.8%;width:1.3%;z-index:3;transform:translateX(-50%)}.continuous-scene .carrier .avatar-position .smoke{left:50%;top:27.3%;z-index:3}.continuous-scene .carrier .avatar-position .flame{width:100%;height:65%;top:-65%;left:0}.continuous-scene[data-character=girl] .avatar-position .candle{top:26.4%}.continuous-scene[data-character=cat] .avatar-position .candle{left:55%;top:38%}.continuous-scene[data-character=dog] .avatar-position .candle{left:55%;top:36.3%}.continuous-scene[data-character=cat] .avatar-position,.continuous-scene[data-character=dog] .avatar-position{top:166px;width:535px;height:802.5px;margin-left:-267.5px}.continuous-scene[data-phase=approach] .carrier-step{animation:steady-carry 1.1s linear infinite}.continuous-scene[data-phase=approach] .carrier .avatar-position{animation:none}.continuous-scene:is([data-phase=cake],[data-phase=wish],[data-phase=celebrate],[data-phase=envelope],[data-phase=opening]) .carrier .avatar-position{filter:none;opacity:1}.continuous-scene[data-phase=letter] .carrier .avatar-position{opacity:.3}.continuous-scene[data-phase=final] .carrier .avatar-position{opacity:0}.continuous-scene .carrier .avatar-position .candle .wick{left:45%}.continuous-scene:is([data-phase=envelope],[data-phase=opening],[data-phase=letter]) .carrier{transform:translateY(-22px) scale(.72)}.continuous-scene[data-phase=wish] .carrier{transform:translateY(-54px) scale(1.14)}@keyframes steady-carry{0%,50%,100%{transform:translateY(0)}25%,75%{transform:translateY(-1.4px)}}@media(max-width:700px){.continuous-scene .carrier .avatar-position{top:164px;width:670px;height:1005px;margin-left:-335px}.continuous-scene[data-character=cat] .avatar-position,.continuous-scene[data-character=dog] .avatar-position{top:178px;width:475px;height:712.5px;margin-left:-237.5px}}@media(max-height:730px) and (max-width:700px){.continuous-scene .carrier .avatar-position{top:150px;width:580px;height:870px;margin-left:-290px}.continuous-scene[data-character=cat] .avatar-position,.continuous-scene[data-character=dog] .avatar-position{width:415px;height:622.5px;margin-left:-207.5px}}@media(prefers-reduced-motion:reduce){.continuous-scene[data-phase=approach] .carrier-step{animation:none}}
/* Keep legacy entrance transforms off the new rig container. */
#scene .carrier .avatar-position{transform:none;translate:none;scale:none;animation:none;filter:none!important}#scene:is([data-phase=final]) .carrier .avatar-position{opacity:0}#scene:is([data-phase=approach],[data-phase=envelope],[data-phase=opening],[data-phase=wish],[data-phase=celebrate]) .carrier .avatar-position{opacity:1}
/* Clip the cinematic stage without creating an internal scroll container. */
.theater{overflow:clip}
#scene[data-phase=wish] .scene-caption{opacity:0}#scene[data-phase=wish] .scene-actions .micro{color:#f2dfc7;text-shadow:0 1px 4px #35241c}#scene[data-phase=wish] .scene-actions .text-button{color:#f6e5d2;text-shadow:0 1px 4px #35241c}

/* Keep the carrying pose intact; only the camera approach moves. */
#scene[data-phase=approach] .carrier-step{animation:none;transform:none}
/* V4 layered girl: shared plate geometry, replaceable cake, foreground rim, eyelids. */
.cake-layer,.hands-layer,.blink-layer,.plate-contact{display:none;pointer-events:none}#scene[data-character=girl] .cake-layer{display:block;position:absolute;left:36.75%;top:26.75%;width:26.5%;height:9.6%;object-fit:fill;z-index:2}#scene[data-character=girl] .plate-contact{display:block;position:absolute;left:40%;top:34.8%;width:20%;height:1.15%;border-radius:50%;background:#7b452439;filter:blur(2px);z-index:1}#scene[data-character=girl] .hands-layer{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;clip-path:polygon(35% 35.65%,65% 35.65%,65% 38.5%,35% 38.5%);z-index:4}#scene[data-character=girl] .blink-layer{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;clip-path:polygon(40.8% 9.5%,53.5% 7.65%,54.5% 9.9%,41.2% 11.6%);z-index:5;opacity:0}#scene[data-character=girl]:is([data-phase=approach],[data-phase=envelope],[data-phase=wish]) .blink-layer{animation:gentle-blink 6.7s linear infinite}#scene[data-character=girl] .avatar-position .candle{top:25.5%;z-index:3}#cake-options{border-top:1px solid var(--line);padding-top:15px;margin:18px 0}#cake-options[hidden]{display:none}#cake-options h3{font-family:var(--serif);font-weight:400;font-size:17px;margin:0 0 12px}.cake-options{display:flex;gap:8px}.cake-options button{flex:1;border:1px solid var(--line);background:#fff9f0;border-radius:12px;padding:7px;font-size:10px}.cake-options button[aria-pressed=true]{border-color:var(--coral);background:#f3e3d2}.cake-options img{display:block;width:65px;height:50px;object-fit:contain;margin:0 auto 6px}.layer-note{font-size:9px!important}@keyframes gentle-blink{0%,44%,48%,100%{opacity:0}45%,47%{opacity:1}}@media(max-width:1150px) and (min-width:701px){.picker{flex-wrap:wrap}#cake-options{width:220px}}@media(prefers-reduced-motion:reduce){#scene[data-character=girl] .blink-layer{animation:none!important}}

.miniature-layer{position:relative;width:100%;height:100%;animation:party-sway 1.6s ease-in-out infinite alternate}.party-person .miniature-layer>img{position:absolute;inset:0;object-fit:fill;animation:none!important}.party-person .miniature-layer>.miniature-cake{left:36.75%;top:26.75%;width:26.5%;height:9.6%;inset:auto;left:36.75%;top:26.75%}

/* Registered local eyelid overlays keep bodies and cakes stationary. */
#scene:not([data-character=girl]) .blink-layer{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:5;opacity:0;pointer-events:none}
#scene[data-character=boy] .blink-layer{mask-image:radial-gradient(ellipse 3.1% 1.3% at 44.5% 10%,#000 70%,transparent 100%),radial-gradient(ellipse 3.1% 1.3% at 50.4% 8.8%,#000 70%,transparent 100%)}
#scene[data-character=cat] .blink-layer{mask-image:radial-gradient(ellipse 5.8% 3.1% at 46% 22.6%,#000 78%,transparent 100%),radial-gradient(ellipse 5.7% 3.2% at 61.2% 18.8%,#000 78%,transparent 100%)}
#scene[data-character=dog] .blink-layer{mask-image:radial-gradient(ellipse 5.5% 3% at 44% 17.7%,#000 78%,transparent 100%),radial-gradient(ellipse 5.5% 3% at 60.5% 13.4%,#000 78%,transparent 100%)}
#scene:not([data-character=girl]):is([data-phase=approach],[data-phase=envelope],[data-phase=wish]) .blink-layer{animation:gentle-blink 6.7s linear infinite}
@media(prefers-reduced-motion:reduce){#scene .blink-layer{animation:none!important}}
/* Shared cake mounting coordinates for all four avatars. */
#scene[data-character=boy]{--cake-left:37%;--cake-top:27.7%;--cake-width:27%;--cake-height:10%;--rim:37.6%;--wick-top:26.5%}
#scene[data-character=cat]{--cake-left:30%;--cake-top:35%;--cake-width:51%;--cake-height:17%;--rim:52.1%;--wick-top:34%}
#scene[data-character=dog]{--cake-left:29%;--cake-top:35.5%;--cake-width:50%;--cake-height:17%;--rim:52.7%;--wick-top:34.5%}
#scene:not([data-character=girl]) .cake-layer{display:block;position:absolute;left:var(--cake-left);top:var(--cake-top);width:var(--cake-width);height:var(--cake-height);object-fit:fill;z-index:2}
#scene:not([data-character=girl]) .hands-layer{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;clip-path:inset(var(--rim) 15% 40%);z-index:4}
#scene:not([data-character=girl]) .avatar-position .candle{top:var(--wick-top);z-index:3}
.wish-sky{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;overflow:hidden;background:radial-gradient(ellipse at 50% 38%,#43385b 0%,#202943 44%,#10182c 100%)}
#scene[data-phase=celebrate] .wish-sky{animation:sky-reveal 3s ease both}
#scene[data-phase=celebrate] .carrier{animation:sky-camera 3s cubic-bezier(.4,0,.3,1) both!important}
#scene[data-phase=celebrate] .stage-floor,#scene[data-phase=celebrate] .scene-caption,#scene[data-phase=celebrate] .warm-sparkles{opacity:0;animation:none}
#scene[data-phase=celebrate] .scene-actions{z-index:12}
#scene[data-phase=celebrate] .party-continue{animation:sky-text 1.2s 6s both;background:#f2d8bd;color:#43354c;box-shadow:0 0 30px #efb4a020}
.theater.celebrating .scene-footer,.theater.celebrating .scene-kicker{opacity:0}.theater.celebrating .sound{z-index:20;color:#f3d9c9}
.sky-stars{position:absolute;inset:-20% 0 0;transform:translateY(60px)}
.sky-stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff2d9;box-shadow:0 0 8px #ffe0bd;opacity:.5}
#scene[data-phase=celebrate] .sky-stars{animation:star-camera 5s ease-out both}
#scene[data-phase=celebrate] .sky-stars i{animation:star-glow 3s var(--delay) ease-in-out infinite alternate}
.wish-comet{position:absolute;left:50%;top:68%;width:7px;height:7px;border-radius:50%;background:#fff3d8;box-shadow:0 0 12px 4px #ffd6a3,0 0 40px 12px #ffc7a544;opacity:0}
.wish-comet:after{content:'';position:absolute;top:5px;left:2px;width:3px;height:90px;background:linear-gradient(#fbd2a9aa,transparent);border-radius:50%}
#scene[data-phase=celebrate] .wish-comet{animation:wish-rise 3.2s .25s cubic-bezier(.35,0,.3,1) both}
.heart-firework{position:absolute;left:50%;top:36%;width:0;height:0}
.heart-firework i{position:absolute;width:4px;height:4px;border-radius:50%;background:#ffcab8;box-shadow:0 0 9px 2px #ffa6a2,0 0 22px #ffcc9b;opacity:0}
#scene[data-phase=celebrate] .heart-firework i{animation:heart-burst 5.5s calc(3.15s + var(--delay)) cubic-bezier(.15,.7,.2,1) both}
.sky-dedication{position:absolute;top:61%;left:8%;right:8%;text-align:center;color:#f8e6dc;opacity:0}
.sky-dedication>span{font-size:11px;letter-spacing:3px;color:#d9c3cb}.sky-dedication h2{font-family:var(--serif);font-weight:400;font-size:26px;margin:17px 0;overflow-wrap:anywhere}.sky-dedication p{font-size:12px;color:#cab7c6}
#scene[data-phase=celebrate] .sky-dedication{animation:sky-text 1.7s 4.4s both}
@keyframes sky-reveal{0%,15%{opacity:0}80%,100%{opacity:1}}
@keyframes sky-camera{0%{transform:translateY(-12px) scale(1.08);opacity:1}100%{transform:translateY(520px) scale(1.12);opacity:0}}
@keyframes star-camera{from{transform:translateY(-90px)}to{transform:translateY(40px)}}
@keyframes star-glow{to{opacity:1;transform:scale(1.4)}}
@keyframes wish-rise{0%{opacity:0;transform:translateY(0) scale(.4)}15%{opacity:1}85%{opacity:1}100%{top:36%;opacity:0;transform:translateY(0) scale(.6)}}
@keyframes heart-burst{0%{opacity:0;transform:translate(0,0) scale(.2)}8%{opacity:1}28%{opacity:1;transform:translate(var(--x),var(--y)) scale(1)}65%{opacity:.9;transform:translate(var(--x),var(--y)) scale(.75)}100%{opacity:.8;transform:translate(var(--x),var(--y)) scale(.8)}}
@keyframes sky-text{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#scene[data-phase=celebrate] .wish-sky,#scene[data-phase=celebrate] .sky-dedication,#scene[data-phase=celebrate] .party-continue{animation:none;opacity:1;visibility:visible}#scene[data-phase=celebrate] .carrier{animation:none!important;opacity:0}#scene[data-phase=celebrate] .heart-firework i{animation:none;opacity:1;transform:translate(var(--x),var(--y))}#scene[data-phase=celebrate] .wish-comet{display:none}}

.sky-dedication>span{font-size:18px;letter-spacing:2px;font-family:var(--serif)}.sky-dedication p{margin-top:20px}
/* Chibi avatars keep independent tray anchors and eyelid regions. */
#scene[data-character=chibi-boy]{--cake-left:28%;--cake-top:40%;--cake-width:44%;--cake-height:17%;--rim:56.7%;--wick-top:39%}
#scene[data-character=chibi-girl]{--cake-left:29%;--cake-top:34.8%;--cake-width:44%;--cake-height:16%;--rim:50.7%;--wick-top:33.8%}
#scene:is([data-character=chibi-boy],[data-character=chibi-girl]) .avatar-position{top:155px;width:475px;height:712.5px;margin-left:-237.5px}
#scene[data-character=chibi-boy] .blink-layer{mask-image:radial-gradient(ellipse 6.3% 3.3% at 41% 25.5%,#000 78%,transparent 100%),radial-gradient(ellipse 6.3% 3.3% at 58.8% 24.5%,#000 78%,transparent 100%)}
#scene[data-character=chibi-girl] .blink-layer{mask-image:radial-gradient(ellipse 6.2% 3.3% at 42.4% 21.3%,#000 78%,transparent 100%),radial-gradient(ellipse 6.2% 3.3% at 58.4% 20%,#000 78%,transparent 100%)}
#scene:is([data-character=chibi-boy],[data-character=chibi-girl]) .hands-layer{clip-path:inset(var(--rim) 15% 38%)}
.portrait.chibi img{object-position:center 14%}
@media(max-width:700px){#scene:is([data-character=chibi-boy],[data-character=chibi-girl]) .avatar-position{width:415px;height:622.5px;margin-left:-207.5px}}
/* Microphone-first wish ceremony, with a discreet manual fallback. */
.blow-guide{--breath:0;display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;color:#fff0df}
.blow-guide #mic-status{font-size:13px;line-height:1.7;margin:0;max-width:260px;text-align:center;text-shadow:0 1px 8px #322018}
.blow-guide [hidden]{display:none!important}.blow-guide button:disabled{opacity:.65;cursor:wait}
.airflow{display:none;position:relative;width:110px;height:78px;pointer-events:none}
.blow-guide[data-mic-state=listening] .airflow{display:block}
.airflow i{position:absolute;bottom:0;left:calc(50% - 13px);width:26px;height:38px;border:1px solid #ffe9c8;border-bottom:0;border-radius:60% 40% 0 0;opacity:0;filter:drop-shadow(0 0 5px #ffd6a6);animation:breath-rise 2.3s ease-out infinite}
.airflow i:nth-child(2){left:20px;animation-delay:.7s}.airflow i:nth-child(3){left:65px;animation-delay:1.4s}
.airflow span{position:absolute;left:0;right:0;bottom:3px;text-align:center;font-size:24px;color:#ffe9c8;opacity:calc(.45 + var(--breath)*.5)}
.blow-backup{text-align:center;font-size:11px;color:#d8c5b6}.blow-backup summary{cursor:pointer;list-style:none;padding:8px}.blow-backup summary::-webkit-details-marker{display:none}.blow-backup .hold{display:block;min-height:44px;font-size:12px;color:#fff1df;background:#795a49;border:1px solid #d9b79b;margin:6px auto;padding:12px 22px;border-radius:14px;box-shadow:0 3px 12px #24170f24;touch-action:none;user-select:none;cursor:pointer}.blow-backup .hold:hover{background:#896650}.blow-backup .hold:focus-visible{outline:2px solid #ffe0ba;outline-offset:3px}
.blow-backup .hold.holding{background:#a37858;box-shadow:0 0 0 2px #f0d2ac77;transition:background 1.2s}
@keyframes breath-rise{0%{opacity:0;transform:translateY(8px) scale(.6)}25%{opacity:.65}100%{opacity:0;transform:translateY(-55px) scale(1.2)}}
@media(prefers-reduced-motion:reduce){.airflow i{animation:none;opacity:.5;transform:translateY(-15px)}}
