
.achievement-celebration{position:fixed;inset:0;margin:0;border:0;padding:28px;width:100%;height:100dvh;max-width:none;max-height:none;overflow:auto;color:#f4f9fc;background:radial-gradient(ellipse at 50% 55%,color-mix(in srgb,var(--celebration-color) 38%,transparent),transparent 64%),radial-gradient(ellipse at 95% 0%,color-mix(in srgb,var(--celebration-color) 26%,transparent),transparent 55%),linear-gradient(145deg,#142a38,#07131f 65%,color-mix(in srgb,var(--celebration-color) 15%,#07131f));isolation:isolate}
.achievement-celebration::backdrop{background:#07131f}
.achievement-celebration::before{content:'';position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(120deg,transparent 0 180px,#ffffff03 181px 182px,transparent 183px 380px);z-index:-1}
.celebration-content{position:relative;z-index:1;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px}
.celebration-kicker{text-transform:uppercase;letter-spacing:3px;font-size:10px;color:#bdd0db;margin-bottom:7px}
.celebration-content h1{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;font-size:clamp(32px,4vw,54px);letter-spacing:-1.5px;margin:0;line-height:1.1;color:#fff;text-shadow:0 3px 24px #0003}
.celebration-content h2{font-size:clamp(19px,2.4vw,30px);font-weight:550;letter-spacing:-.4px;margin:2px 0;overflow-wrap:anywhere;max-width:90%;color:#e0edf4}
.celebration-label{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;font-weight:600;color:color-mix(in srgb,var(--celebration-color) 45%,white);margin-top:5px}
.celebration-gauge{--a-text:#f4faff;--a-muted:#abc4d1;--a-needle:#f4faff;--a-line:#ffffff30;--a-surface:transparent;background:none;border-radius:0;width:min(82vw,66dvh,760px);padding:0;margin:0;box-shadow:none;filter:drop-shadow(0 14px 30px #0003);flex-shrink:0}
.celebration-gauge .pressure-dial-wrap{width:100%;max-width:none;margin:0}
.celebration-gauge .pressure-dial{width:100%;height:auto}
.celebration-gauge .dial-shell{stroke:#ffffff18!important}
.celebration-gauge .dial-value{fill:#f4faff}.celebration-gauge .dial-number,.celebration-gauge .dial-caption{fill:#c0d5e1}.celebration-gauge .dial-tick{stroke:#c0d5e1}
.celebration-content p{color:#d7e7f0;margin:0;font-size:clamp(12px,1.4vw,17px);font-weight:600}.celebration-content p span{font-weight:400;color:#9fb8c8}
.celebration-dismiss{position:absolute;right:20px;top:16px;z-index:3;border:1px solid #ffffff30;background:#ffffff08;color:#d9e9f2;padding:9px 14px;border-radius:8px;font-size:12px}
.celebration-confetti{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:2;opacity:.8}.celebration-confetti i{position:absolute;left:var(--x);top:-20px;width:7px;height:13px;animation:celebration-fall 4s var(--delay) linear 2 both}
@keyframes celebration-fall{to{transform:translate(var(--drift),110vh) rotate(var(--spin))}}
.celebration-settings{margin-bottom:22px}
@media(max-height:650px){.achievement-celebration{padding:44px 14px 14px}.celebration-content{gap:2px}.celebration-kicker{font-size:8px;margin-bottom:3px}.celebration-content h1{font-size:30px}.celebration-content h2{font-size:19px}.celebration-label{font-size:10px}.celebration-gauge{width:min(78vw,62dvh)}.celebration-content p{font-size:12px}}
.achievement-celebration.celebration-super{background:radial-gradient(ellipse at 50% 84%,color-mix(in srgb,var(--celebration-color) 48%,transparent),transparent 64%),radial-gradient(ellipse at 15% 15%,color-mix(in srgb,var(--celebration-color) 20%,transparent),transparent 50%),radial-gradient(ellipse at 92% 35%,color-mix(in srgb,var(--celebration-color) 27%,transparent),transparent 60%),linear-gradient(145deg,#251b20,#0c101a 55%,#271b14)}
.celebration-embers{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}.celebration-embers i{position:absolute;bottom:-10px;left:var(--ember-x);width:3px;height:6px;border-radius:50%;background:color-mix(in srgb,var(--celebration-color) 60%,white);box-shadow:0 0 12px var(--celebration-color);animation:celebration-ember 7s var(--ember-delay) linear infinite}
@keyframes celebration-ember{0%{opacity:0;transform:translate(0,0) scale(.6)}15%{opacity:.65}85%{opacity:.2}100%{opacity:0;transform:translate(var(--ember-drift),-100vh) scale(.1)}}
.celebration-gauge [data-atmosphere=smoke]{filter:brightness(1.8)}
@media(prefers-reduced-motion:reduce){.celebration-confetti,.celebration-embers{display:none}}
