/* Answer celebrations: decorative, finite, pointer-transparent, no rapid flashes. */
.celebration-layer{position:absolute!important;left:0;right:0;z-index:20;overflow:hidden;pointer-events:none;max-height:65vh;background:transparent!important}
.celebration-piece{position:absolute;display:block;left:var(--sx);top:10px;color:var(--color);background:var(--color);width:var(--size);height:calc(var(--size)*.52);border-radius:1px;opacity:0;animation:paper-fall 1.8s var(--delay) ease-out both;will-change:transform,opacity}
@keyframes paper-fall{0%{opacity:0;transform:translate3d(0,-16px,0) rotate(0)}12%{opacity:.9}100%{opacity:0;transform:translate3d(var(--dx),var(--dy),0) rotate(var(--turn))}}
.effect-stars .celebration-piece{top:var(--sy);background:none;font:24px/1 Georgia,serif;width:auto;height:auto;animation:star-fan 1.7s var(--delay) ease-out both}
@keyframes star-fan{0%{opacity:0;transform:scale(.3)}20%{opacity:.85}100%{opacity:0;transform:translate(var(--dx),calc(var(--dy)*-.45)) rotate(var(--turn)) scale(.6)}}
.effect-bubbles .celebration-piece{top:70%;height:var(--size);border:1.5px solid var(--color);background:transparent;border-radius:50%;box-shadow:inset 2px 2px 5px color-mix(in srgb,var(--color),transparent 84%);animation:bubble-rise 2s var(--delay) ease-out both}
@keyframes bubble-rise{0%{opacity:0;transform:scale(.6)}18%{opacity:.75}100%{opacity:0;transform:translate(calc(var(--dx)*.45),calc(var(--dy)*-.8)) scale(1.15)}}
.effect-leaves .celebration-piece{width:14px;height:21px;border-radius:90% 5% 85% 5%;box-shadow:inset 1px 0 #ffffff70;animation-duration:2s}
.effect-comets .celebration-piece{top:var(--sy);height:2px;width:70px;border-radius:100%;background:linear-gradient(90deg,transparent,var(--color));animation:meteor-glide 1.5s var(--delay) ease-out both}
.effect-comets .celebration-piece::after{content:"";position:absolute;right:0;top:-2px;width:5px;height:5px;background:var(--color);border-radius:50%}
@keyframes meteor-glide{0%{opacity:0;transform:translate(-30px,-30px) rotate(24deg)}18%{opacity:.8}100%{opacity:0;transform:translate(130px,80px) rotate(24deg)}}
.effect-origami .celebration-piece{background:none;top:var(--sy);width:35px;height:25px;animation:paper-flight 2.1s var(--delay) ease-in-out both}
.effect-origami svg{width:100%;height:100%}
@keyframes paper-flight{0%{opacity:0;transform:translate(-55px,35px) rotate(-12deg) scale(.8)}20%{opacity:.85}100%{opacity:0;transform:translate(160px,-70px) rotate(7deg) scale(1)}}
.effect-orbits .celebration-piece{top:var(--sy);height:var(--size);border-radius:50%;animation:star-fan 2s var(--delay) ease-out both}
.effect-orbits .orbital-ring{left:50%;top:40%;width:var(--ring-size);height:calc(var(--ring-size)*.4);margin-left:calc(var(--ring-size)*-.5);margin-top:calc(var(--ring-size)*-.2);background:none;border:1px solid var(--color);animation:ring-unfold 2s var(--delay) ease-out both}
@keyframes ring-unfold{0%{opacity:0;transform:scale(.6) rotate(var(--turn))}20%{opacity:.7}100%{opacity:0;transform:scale(1.2) rotate(calc(var(--turn) + 35deg))}}
.effect-fireflies .celebration-piece{top:var(--sy);height:var(--size);border-radius:50%;box-shadow:0 0 9px 2px var(--color);animation:firefly-drift 2s var(--delay) ease-out both}
@keyframes firefly-drift{0%{opacity:0;transform:translate(0,8px)}30%{opacity:.6}100%{opacity:0;transform:translate(calc(var(--dx)*.3),-42px)}}
.effect-aurora .celebration-piece{width:44%;height:85px;border-radius:55%;top:var(--sy);filter:blur(16px);background:linear-gradient(40deg,transparent,var(--color),transparent);animation:aurora-drift 2.1s var(--delay) ease-in-out both}
@keyframes aurora-drift{0%{opacity:0;transform:translate(-20px,-10px) rotate(var(--turn))}30%{opacity:.24}100%{opacity:0;transform:translate(45px,10px) rotate(calc(var(--turn) + 10deg))}}
.celebration-swatch{position:relative;display:grid;place-items:center;height:92px;border-radius:7px;background:var(--bg);color:var(--accent);overflow:hidden;margin-bottom:13px;border:1px solid var(--line)}
.celebration-swatch>span{font:46px/1 Georgia,serif;font-weight:normal;z-index:1}.celebration-swatch>i{position:absolute;font:35px Georgia;left:22%;top:11%;color:#a79564}.celebration-swatch>b{position:absolute;font:25px Georgia;right:22%;bottom:12%;color:#8d9daf}
.swatch-stars{color:#ac904f;background-image:radial-gradient(ellipse at 50% 70%,#bc964612,transparent)}
.swatch-bubbles{color:#7796ab}.swatch-leaves{color:#718762}.swatch-origami{color:#9d7c68}.swatch-fireflies{color:#b0a15b}
.swatch-aurora{background-image:linear-gradient(120deg,#65a79718,#8a8abd25,#8dafb31c);color:#73968f}
.celebration-catalog{grid-template-columns:repeat(3,minmax(0,1fr))}.celebration-shop-card .celebration-buy-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}.celebration-shop-card .celebration-buy-row button{min-height:36px}.celebration-shop-card .catalog-copy{flex:1}
.celebration-status{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:15px 0 22px;padding:12px 14px;border:1px solid var(--line);border-radius:6px;font-size:13px}.celebration-status>span{flex:1}
.effect-preview-dialog{width:min(570px,calc(100% - 28px));border:1px solid var(--line);border-radius:12px;padding:0;background:var(--panel);color:var(--ink);max-height:90dvh}
.effect-preview-dialog::backdrop{background:#10231d55}.effect-preview-stage{position:relative;min-height:255px;display:grid;place-content:center;text-align:center;padding:28px;isolation:isolate;overflow:hidden}.effect-preview-stage .celebration-swatch{margin:0 auto 15px;width:110px;height:82px;border:0;background:none}.effect-preview-stage p{color:var(--muted);font-size:13px}.effect-preview-footer{padding:16px 22px 23px;border-top:1px solid var(--line);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.experience-settings{margin:22px 0 0;padding:22px 0 0;border-top:1px solid var(--line)}.experience-settings h3{margin-bottom:8px}.experience-settings>p{font-size:13px;color:var(--muted);max-width:680px}.sound-grid{margin-top:18px}.sound-volume{display:flex;gap:12px;align-items:center;min-height:42px}.sound-volume input{flex:1;min-width:70px;accent-color:var(--accent)}.sound-volume output{font-size:13px;min-width:42px;font-variant-numeric:tabular-nums}.sound-preview-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:17px 0 6px}.sound-note{font-size:12px!important}.quiet-toggle{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;background:var(--panel);color:var(--muted);cursor:pointer;flex-shrink:0}.quiet-toggle[data-enabled=true]{color:var(--accent);background:var(--accent-soft)}.quiet-toggle svg{width:17px;height:17px}.sound-state-badge{font-size:11px;color:var(--muted)}
@media(max-width:760px){.celebration-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.celebration-catalog{grid-template-columns:1fr}.celebration-shop-card{display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:start}.celebration-shop-card .celebration-swatch{height:80px;margin:0}.celebration-shop-card .celebration-buy-row{grid-column:1/-1}.experience-settings{margin-top:18px}.effect-preview-footer{padding:14px}.sound-preview-controls .btn{flex:1}.effect-preview-dialog .dialog-header{padding:16px}}
@media(prefers-reduced-motion:reduce){.celebration-layer{display:none!important}}
[data-reduce-motion=true] .celebration-layer{display:none!important}
