.dashAccCelebrate {
    position: fixed;
    inset: 0;
    z-index: 1200;
    pointer-events: none;
    overflow: hidden;
}

.dashAccCelebrate__wash {
    position: absolute;
    inset: -20%;
    background:
        radial-gradient(circle at 50% 38%, rgba(255, 95, 135, 0.55), transparent 46%),
        radial-gradient(circle at 16% 82%, rgba(255, 214, 90, 0.42), transparent 40%),
        radial-gradient(circle at 86% 14%, rgba(90, 190, 255, 0.38), transparent 38%);
    opacity: 0;
    animation: dashAccCelebrateWash 2.1s ease-out forwards;
}

.dashAccCelebrate__piece {
    position: absolute;
    left: var(--x);
    top: var(--y);
    width: var(--w);
    height: var(--h);
    margin: calc(var(--h) / -2) 0 0 calc(var(--w) / -2);
    background: var(--tone);
    color: var(--tone);
    opacity: 1;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.55),
        0 0 18px rgba(255, 255, 255, 0.5);
    will-change: transform, opacity;
}

.dashAccCelebrate__piece--strip {
    border-radius: 0.18rem;
}

.dashAccCelebrate__piece--ribbon {
    border-radius: 999px;
}

.dashAccCelebrate__piece--dot {
    border-radius: 50%;
}

.dashAccCelebrate__piece--spark,
.dashAccCelebrate__piece--star,
.dashAccCelebrate__piece--diamond,
.dashAccCelebrate__piece--burst {
    background: transparent;
    box-shadow: none;
    filter: drop-shadow(0 0 2px #fff) drop-shadow(0 0 12px var(--tone));
}

.dashAccCelebrate__piece--spark::before,
.dashAccCelebrate__piece--star::before,
.dashAccCelebrate__piece--diamond::before,
.dashAccCelebrate__piece--burst::before {
    content: "";
    position: absolute;
    inset: 0;
    background: var(--tone);
}

.dashAccCelebrate__piece--spark::before {
    clip-path: polygon(50% 0%, 58% 42%, 100% 50%, 58% 58%, 50% 100%, 42% 58%, 0% 50%, 42% 42%);
}

.dashAccCelebrate__piece--star::before {
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}

.dashAccCelebrate__piece--diamond::before {
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
}

.dashAccCelebrate__piece--burst::before {
    clip-path: polygon(40% 0%, 60% 0%, 60% 40%, 100% 40%, 100% 60%, 60% 60%, 60% 100%, 40% 100%, 40% 60%, 0% 60%, 0% 40%, 40% 40%);
}

body.du-body .dashAccCelebrate__wash {
    background:
        radial-gradient(circle at 50% 38%, oklch(78% 0.22 350 / 0.55), transparent 46%),
        radial-gradient(circle at 16% 82%, oklch(88% 0.18 85 / 0.42), transparent 40%),
        radial-gradient(circle at 86% 14%, oklch(78% 0.16 240 / 0.4), transparent 38%);
}

@keyframes dashAccCelebrateWash {
    0% { opacity: 0; transform: scale(0.92); }
    12% { opacity: 1; transform: scale(1); }
    100% { opacity: 0; transform: scale(1.08); }
}

@media (prefers-reduced-motion: reduce) {
    .dashAccCelebrate {
        display: none;
    }
}