.finale{
  position:relative;overflow:hidden;
  min-height:100vh;min-height:100lvh;
  display:flex;align-items:center;justify-content:center;
  padding:clamp(170px,24vh,230px) 16px 80px;
  background:radial-gradient(ellipse 110% 80% at 50% 30%,#8c1b33 0%,var(--bdx) 45%,var(--bdx-deep) 100%);
}
.js:not(.static) .finale{
  margin-top:-100vh;margin-top:-100lvh;overflow:visible;
  background:linear-gradient(to bottom,#5e0e1d 0%,rgba(94,14,29,0) 35%),radial-gradient(ellipse 110% 80% at 50% 45%,#8c1b33 0%,var(--bdx) 50%,var(--bdx-deep) 100%);
}
.js:not(.static) .finale::before{
  content:"";position:absolute;left:0;right:0;bottom:100%;height:45vh;pointer-events:none;
  background:linear-gradient(to bottom,rgba(94,14,29,0) 0%,rgba(94,14,29,.35) 45%,rgba(94,14,29,.8) 80%,#5e0e1d 100%);
}
.finale-clip{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.finale .beams{z-index:1;opacity:.7;-webkit-mask:linear-gradient(to bottom,transparent 0,#000 30%);mask:linear-gradient(to bottom,transparent 0,#000 30%)}
.f-glow{
  position:absolute;left:50%;top:55%;width:120vmin;height:120vmin;margin:-60vmin 0 0 -60vmin;border-radius:50%;
  background:radial-gradient(circle,rgba(249,223,170,.18) 0%,rgba(255,158,192,.08) 40%,transparent 68%);
  pointer-events:none;z-index:1;
}
.confetti{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.garland{position:absolute;top:0;left:0;right:0;display:flex;z-index:3;pointer-events:none}
.swag{flex:1}
.swag svg{width:100%;height:auto;transform-origin:50% 0;animation:swing 6s ease-in-out infinite alternate}
.swag:nth-child(2) svg{animation-delay:-2s}
.swag:nth-child(3) svg{animation-delay:-4s}
@keyframes swing{from{transform:rotate(-1.2deg)}to{transform:rotate(1.2deg)}}
.streamer{position:absolute;top:2px;width:22px;margin-left:-11px;z-index:3;pointer-events:none;transform-origin:50% 0}
.streamer svg{width:100%;height:clamp(110px,18vh,200px);transform-origin:50% 0;animation:swing 4s ease-in-out infinite alternate}
.streamer:nth-child(odd) svg{animation-duration:5s;animation-delay:-1.5s}
.s1{left:1.5%;color:var(--pink)}
.s2{left:33.33%;color:var(--champ)}
.s3{left:66.66%;color:var(--pink)}
.s4{left:98.5%;color:var(--champ)}

.f-card{
  position:relative;z-index:4;width:100%;max-width:740px;text-align:center;
  padding:clamp(44px,7vw,76px) clamp(20px,5vw,60px);
  border:1px solid rgba(249,223,170,.55);
  background:linear-gradient(180deg,rgba(46,5,13,.35),rgba(46,5,13,.55));
}
.f-card::before{content:"";position:absolute;inset:8px;border:1px solid rgba(249,223,170,.22);pointer-events:none}
.f-pre{font-style:italic;font-weight:500;font-size:clamp(22px,4vw,34px);color:var(--champ)}
.f-title{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(42px,8vw,86px);line-height:1.05;color:var(--champ);margin-top:.25em;
}
.f-title em{font-style:italic;font-weight:400;color:var(--pink)}
.f-rule{display:flex;align-items:center;justify-content:center;gap:16px;margin:clamp(22px,4vh,34px) 0}
.f-rule::before,.f-rule::after{content:"";width:clamp(40px,12vw,110px);height:1px;background:rgba(249,223,170,.6)}
.f-rule svg{width:18px;height:18px;color:var(--pink)}
.f-date{font-family:var(--serif);font-size:clamp(20px,3.6vw,30px);letter-spacing:.12em;color:var(--champ)}
.f-time{font-weight:500;font-size:clamp(19px,3vw,25px);margin-top:.7em;color:var(--blush)}
.f-note{font-style:italic;font-size:clamp(17px,2.6vw,21px);margin-top:.5em;color:rgba(253,241,243,.78)}

.credit{background:var(--bdx-deep);text-align:center;padding:22px 16px calc(22px + env(safe-area-inset-bottom))}
.credit a,.credit span{
  font-family:'Geist',system-ui,sans-serif;font-weight:500;font-size:13px;letter-spacing:.04em;
  color:rgba(249,223,170,.65);text-decoration:none;border-bottom:1px solid transparent;
  transition:color .3s ease,border-color .3s ease;
}
.credit a:hover,.credit a:focus-visible{color:var(--champ);border-bottom-color:rgba(249,223,170,.6);outline:none}

@media (prefers-reduced-motion:reduce){
  .beam i,.swag svg,.streamer svg{animation:none}
}