/* ============================================================
   ATMOSPHERE (2026-10-23): slow drifting light specks over every page,
   like the snow on deijs.eu but pure CSS. Two tiled layers move with
   transform only (GPU), sit under the chrome and never take clicks.
   ============================================================ */
.bk-atmos { position: fixed; inset: 0; z-index: 5; pointer-events: none; overflow: hidden; contain: strict; }
.bk-atmos i {
    --c: rgba(255, 220, 235, .55); --c2: rgba(255, 0, 90, .45); --c3: rgba(140, 220, 255, .35);
    position: absolute; left: -10%; top: -100%; width: 120%; height: 200%; will-change: transform;
    background-image:
        radial-gradient(1.4px 1.4px at 22px 34px, var(--c) 50%, transparent 100%),
        radial-gradient(1px 1px at 140px 90px, var(--c) 50%, transparent 100%),
        radial-gradient(1.8px 1.8px at 210px 180px, var(--c2) 50%, transparent 100%),
        radial-gradient(1.2px 1.2px at 80px 220px, var(--c3) 50%, transparent 100%),
        radial-gradient(1px 1px at 260px 260px, var(--c) 50%, transparent 100%);
    background-size: 300px 300px;
    animation: bkFall 90s linear infinite, bkSway 14s ease-in-out infinite alternate;
    opacity: .7;
}
.bk-atmos i + i {
    background-size: 460px 460px; opacity: .45; filter: blur(.6px);
    animation-duration: 150s, 22s; animation-direction: normal, alternate-reverse;
}
@keyframes bkFall { from { translate: 0 0; } to { translate: 0 50%; } }
@keyframes bkSway { from { transform: translateX(-12px); } to { transform: translateX(12px); } }
[data-theme="light"] .bk-atmos i { --c: rgba(255, 0, 90, .28); --c2: rgba(124, 58, 237, .25); --c3: rgba(0, 150, 200, .22); opacity: .8; }
@media (max-width: 768px) { .bk-atmos i + i { display: none; } .bk-atmos i { background-size: 220px 220px; } }
@media (prefers-reduced-motion: reduce) { .bk-atmos i { animation: none; } }
@media print { .bk-atmos { display: none; } }