/* A quiet closing ritual in the scrapbook's warm palette. */
.birthday-celebration{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;z-index:150;pointer-events:none}
.finale{padding-bottom:70px}
.finale #finale-intro h2{font-size:clamp(28px,3.5vw,44px);margin:28px 0 0;letter-spacing:.08em}
.ritual-cake{width:480px;max-width:90vw;aspect-ratio:1448 / 1186;position:relative;margin:12px auto 22px;isolation:isolate}
.ritual-cake img{position:absolute;bottom:0;left:0;display:block;width:100%;height:auto;filter:drop-shadow(0 8px 10px #7050410a)}
.wish-flame{position:absolute;z-index:2;left:48.75%;top:7%;width:2.5%;height:7.2%;background:radial-gradient(ellipse at 50% 75%,#fffdec 0 22%,#ffdf92 35%,#eda34e 65%,#d7793700 80%);border-radius:60% 40% 45% 45%;transform-origin:50% 100%;box-shadow:0 0 15px #ffcf7770;animation:wish-flicker 2.7s ease-in-out infinite}
.wish-glow{position:absolute;z-index:-1;left:calc(50% - 70px);top:-5%;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,#ffdd9b50,transparent 65%);pointer-events:none;transition:opacity .65s}
.finale-copy{font:17px/2 var(--serif);color:#6c624e}
.finale-copy p{margin:0 0 18px}
.finale-copy .wish-invitation{font-size:22px;color:#8c6947;margin:28px 0 12px}
.ritual-button{min-height:48px;padding:11px 35px;border:1px solid #b99b737a;border-radius:2px;background:#f6eedc;color:#82613f;font:16px/1.6 var(--serif);letter-spacing:.08em;transition:background .25s,box-shadow .25s}
.ritual-button:hover{background:#fff9e9;box-shadow:0 4px 20px #b99b731a}
.ritual-button span{margin-left:18px}
.finale #finale-intro .finale-keepsake{font:14px/1.9 var(--serif);color:#98846a;margin:35px auto 0}
.finale .song-dedication{font-size:11px;margin-top:18px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body.wish-room-open{overflow:hidden}
#wish-dialog{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;padding:20px;margin:0;border:0;background:#1c1818;color:#f6e8d6;overflow:auto;overscroll-behavior:contain}
#wish-dialog::backdrop{background:#1c1818}
#wish-dialog[open]{display:grid;place-items:center;animation:room-darken .9s ease both}
.wish-room{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:440px;background:radial-gradient(ellipse at 50% 40%,#7f4d3228,transparent 60%)}
#wish-dialog .ritual-cake{width:min(560px,90vw);margin:0 auto 12px}
#wish-dialog .ritual-cake img{filter:brightness(.95) drop-shadow(0 12px 25px #0006);transition:filter 1.3s}
#wish-dialog .wish-glow{width:260px;height:260px;left:calc(50% - 130px);top:-12%;background:radial-gradient(circle,#efb26a4a 0,#bc813329 27%,transparent 65%)}
#wish-dialog .wish-flame{box-shadow:0 0 20px #ffc36599}
#wish-dialog .ritual-button{background:#ffffff05;border-color:#b99b7355;color:#e8d5b7;min-width:168px;margin-top:16px}
#wish-dialog .ritual-button:hover{background:#ffffff0d}
#wish-dialog .ritual-button:disabled{opacity:.65}
#wish-dialog .blown img{filter:brightness(.68) saturate(.85) drop-shadow(0 12px 25px #0006)}
.ritual-cake.blown .wish-flame{animation:flame-out .35s ease forwards}
.ritual-cake.blown .wish-glow{opacity:0}
.wish-smoke{position:absolute;left:calc(50% - 3px);top:12%;width:7px;height:25px;border-left:2px solid #e5d9c078;border-radius:50%;opacity:0;filter:blur(2px)}
.blown .wish-smoke{animation:wish-smoke 1.5s ease-out forwards}
#finale-ending{max-width:650px;margin:30px auto 0;animation:room-darken 1s ease both}
.ending-ornament{display:block;font:32px Georgia;color:#b59464;margin:0 0 22px}
.finale #ending-heading{font:21px/1.8 var(--serif);color:#988263;letter-spacing:.12em;margin:0 0 28px}
.ending-lines p{font:18px/2 var(--serif);color:#685e4b;margin:0 0 26px;opacity:0;transform:translateY(8px);transition:opacity 1.3s ease,transform 1.3s ease}
.ending-lines p.is-visible{opacity:1;transform:none}
.ending-lines p.ending-heart{font-size:26px;color:#8a6343;margin:35px 0;line-height:1.85}
.ending-lines p.ending-sign{font-size:17px;color:#9b805d;margin:30px 0}
#ending-actions{border-top:1px solid #c4b18b55;padding-top:18px;max-width:370px;margin:20px auto 0}
#ending-actions button{display:block;margin:0 auto 8px}
#ending-actions .text-button{font-size:11px;color:#a4967c;margin:0 auto}
#joke-reveal{font:12px/1.8 var(--serif);color:#9b805d}
@keyframes wish-flicker{0%,100%{transform:rotate(-3deg) scaleY(.97)}40%{transform:rotate(3deg) scaleY(1.04)}70%{transform:rotate(-1deg) scaleX(.91)}}
@keyframes room-darken{from{opacity:0}to{opacity:1}}
@keyframes flame-out{to{opacity:0;transform:scale(.25) translateY(12px)}}
@keyframes wish-smoke{15%{opacity:.5}100%{opacity:0;transform:translate(12px,-65px) scale(2)}}
@media(max-width:760px){
 .finale{padding-top:32px;padding-bottom:45px}
 .finale .eyebrow{font-size:8px;letter-spacing:.16em}
 .ritual-cake{width:330px;margin-top:4px}
 .finale-copy{font-size:15px;line-height:1.95}
 .finale-copy p{margin-bottom:16px}
 .finale-copy .wish-invitation{font-size:19px;margin-top:24px}
 .finale #finale-intro h2{font-size:27px;margin-top:24px}
 .finale #finale-intro .finale-keepsake{font-size:12px;margin-top:28px}
 #wish-dialog{padding:12px}
 #wish-dialog .ritual-cake{width:min(390px,94vw)}
 .ending-lines p{font-size:16px;margin-bottom:24px}
 .ending-lines p.ending-heart{font-size:22px}
 .finale #ending-heading{font-size:18px}
}
@media(prefers-reduced-motion:reduce){
 #wish-dialog[open],.wish-flame{animation:none}
 .ritual-cake.blown .wish-flame{animation:none;opacity:0}
 .blown .wish-smoke{animation:none}
 .ending-lines p{transition:none;transform:none}
}
