.aniversario-festa {
    position: fixed; inset: 0; box-sizing: border-box; width: 100vw; max-width: none;
    height: 100dvh; max-height: none; margin: 0; border: 0; padding: 24px;
    overflow: auto; color: #fff; font-family: Inter, system-ui, sans-serif;
    background: radial-gradient(ellipse at 12% 10%, #b459ca 0, transparent 42%),
        radial-gradient(ellipse at 95% 90%, #4256ba 0, transparent 45%), #442273;
    text-align: center;
}
.aniversario-festa::backdrop { background: #442273; }
.aniversario-conteudo { position: relative; z-index: 1; display: flex; flex-direction: column;
    align-items: center; justify-content: center; min-height: calc(100dvh - 48px); max-width: 960px; margin: auto; }
.aniversario-selo { font-size: 11px; letter-spacing: .24em; font-weight: 750; border: 1px solid #ffffff50;
    padding: 10px 19px; border-radius: 30px; background: #ffffff0d; }
.aniversario-bolo { font-size: clamp(46px, 7vw, 80px); margin: 20px 0 10px; }
.aniversario-festa h1 { color: #fff; font-size: clamp(48px, 10vw, 116px); line-height: .98;
    font-weight: 900; letter-spacing: -.055em; margin: 0; text-shadow: 0 7px 35px #23094740; }
.aniversario-festa h1 span { color: #ffe391; }
.aniversario-nome { color: #ffe391; font-size: clamp(26px, 4vw, 46px); font-weight: 750;
    line-height: 1.2; overflow-wrap: anywhere; margin: 20px 0 14px; }
#aniversario-mensagem { font-size: clamp(15px, 2vw, 20px); line-height: 1.7; max-width: 590px; color: #f4eafa; margin: 0; }
.aniversario-assinatura { font-size: 13px; margin: 22px 0 28px; color: #e7d9f4; }
.aniversario-festa button { font: inherit; font-weight: 750; background: #ffdf83; color: #3f2460;
    border: 0; border-radius: 18px; padding: 18px 28px; cursor: pointer; min-height: 52px;
    box-shadow: 0 8px 30px #20103935; }
.aniversario-festa button span { padding-left: 14px; }
.aniversario-festa button:hover { background: #ffecb5; transform: translateY(-2px); }
.aniversario-festa button:focus-visible { outline: 3px solid white; outline-offset: 5px; }
.aniversario-enfeites { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.aniversario-confete { position: absolute; left: var(--x); top: -20px; width: 8px; height: 15px;
    background: var(--cor); border-radius: 2px; animation: aniversario-cair var(--duracao) linear var(--delay) 3; }
.aniversario-confete:nth-child(3n) { border-radius: 50%; width: 9px; height: 9px; }
.aniversario-balao { position: absolute; left: var(--x); top: var(--altura); width: clamp(38px, 6vw, 85px);
    aspect-ratio: .8; border-radius: 50% 50% 47% 47%; background: radial-gradient(circle at 30% 25%, #ffffff80, transparent 34%), var(--cor);
    opacity: .8; transform: rotate(-12deg); box-shadow: inset -10px -10px 20px #00000015;
    animation: aniversario-flutuar 5s ease-in-out var(--delay) 4 alternate; }
.aniversario-balao::after { content: ''; position: absolute; top: 100%; left: 50%; height: 100px;
    width: 1px; background: #ffffff55; transform: rotate(8deg); transform-origin: top; }
@keyframes aniversario-cair { to { transform: translate(35px, 110dvh) rotate(var(--giro)); } }
@keyframes aniversario-flutuar { to { transform: translateY(-24px) rotate(10deg); } }
@media (max-width: 600px) {
    .aniversario-festa { padding: 24px 20px; }
    .aniversario-conteudo { min-height: calc(100dvh - 48px); }
    .aniversario-balao { opacity: .35; }
    .aniversario-selo { font-size: 9px; letter-spacing: .16em; }
    .aniversario-festa button { padding: 17px 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .aniversario-confete, .aniversario-balao { animation: none; }
    .aniversario-confete { top: calc(var(--x) * .8); transform: rotate(var(--giro)); opacity: .5; }
    .aniversario-festa button:hover { transform: none; }
}
