.d6-anim-bg {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    overflow: hidden;
    contain: strict;
}
.d6-anim-bg__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    will-change: transform;
    mix-blend-mode: screen;
    opacity: 0.55;
}
.d6-anim-bg__orb--1 {
    width: 560px; height: 560px;
    background: radial-gradient(circle, rgba(6, 214, 160, 0.55) 0%, rgba(6, 214, 160, 0) 70%);
    top: -180px; left: -180px;
    animation: d6-orb-drift-1 26s ease-in-out infinite alternate;
}
.d6-anim-bg__orb--2 {
    width: 640px; height: 640px;
    background: radial-gradient(circle, rgba(0, 180, 216, 0.5) 0%, rgba(0, 180, 216, 0) 70%);
    top: 20%; right: -220px;
    animation: d6-orb-drift-2 32s ease-in-out infinite alternate;
}
.d6-anim-bg__orb--3 {
    width: 480px; height: 480px;
    background: radial-gradient(circle, rgba(139, 92, 246, 0.36) 0%, rgba(139, 92, 246, 0) 70%);
    bottom: -180px; left: 24%;
    animation: d6-orb-drift-3 24s ease-in-out infinite alternate;
}
.d6-anim-bg__orb--4 {
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(224, 64, 251, 0.24) 0%, rgba(224, 64, 251, 0) 70%);
    bottom: 14%; right: 26%;
    animation: d6-orb-drift-4 36s ease-in-out infinite alternate;
}
@keyframes d6-orb-drift-1 {
    0%   { transform: translate3d(0, 0, 0) scale(1); }
    100% { transform: translate3d(180px, 140px, 0) scale(1.15); }
}
@keyframes d6-orb-drift-2 {
    0%   { transform: translate3d(0, 0, 0) scale(1); }
    100% { transform: translate3d(-160px, 90px, 0) scale(0.92); }
}
@keyframes d6-orb-drift-3 {
    0%   { transform: translate3d(0, 0, 0) scale(0.95); }
    100% { transform: translate3d(140px, -140px, 0) scale(1.12); }
}
@keyframes d6-orb-drift-4 {
    0%   { transform: translate3d(0, 0, 0) scale(1); }
    100% { transform: translate3d(-150px, -100px, 0) scale(1.08); }
}

.d6-anim-bg__scan {
    position: absolute; inset: 0;
    background: repeating-linear-gradient(
        0deg,
        transparent 0,
        transparent 3px,
        rgba(6, 182, 212, 0.018) 3px,
        rgba(6, 182, 212, 0.018) 4px
    );
    mix-blend-mode: screen;
    opacity: 0.7;
}

.d6-anim-bg__particles {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0.85;
}

@media (max-width: 640px) {
    .d6-anim-bg__orb { filter: blur(70px); opacity: 0.45; }
    .d6-anim-bg__orb--1 { width: 360px; height: 360px; }
    .d6-anim-bg__orb--2 { width: 420px; height: 420px; }
    .d6-anim-bg__orb--3 { width: 320px; height: 320px; }
    .d6-anim-bg__orb--4 { width: 280px; height: 280px; }
}

@media (prefers-reduced-motion: reduce) {
    .d6-anim-bg__orb { animation: none !important; }
    .d6-anim-bg__particles { display: none; }
}

/* ─── Light theme overrides ─── */
body.d6-theme.theme-light .d6-anim-bg__orb { mix-blend-mode: multiply; opacity: 0.4; filter: blur(80px); }
body.d6-theme.theme-light .d6-anim-bg__orb--1 {
    background: radial-gradient(circle, rgba(16, 185, 129, 0.34) 0%, transparent 70%);
}
body.d6-theme.theme-light .d6-anim-bg__orb--2 {
    background: radial-gradient(circle, rgba(6, 182, 212, 0.32) 0%, transparent 70%);
}
body.d6-theme.theme-light .d6-anim-bg__orb--3 {
    background: radial-gradient(circle, rgba(139, 92, 246, 0.22) 0%, transparent 70%);
}
body.d6-theme.theme-light .d6-anim-bg__orb--4 {
    background: radial-gradient(circle, rgba(224, 64, 251, 0.18) 0%, transparent 70%);
}
body.d6-theme.theme-light .d6-anim-bg__scan {
    background: repeating-linear-gradient(
        0deg,
        transparent 0,
        transparent 3px,
        rgba(6, 182, 212, 0.03) 3px,
        rgba(6, 182, 212, 0.03) 4px
    );
    mix-blend-mode: multiply;
    opacity: 0.5;
}
body.d6-theme.theme-light .d6-anim-bg__particles { opacity: 0.45; mix-blend-mode: multiply; }