/* === 1. ЖЕСТКИЙ СБРОС ФОНОВ ТИЛЬДЫ === */
html, body { background: #080808 !important; }
#allrecords, .t-records, .t-rec, .t-section, .t-body, .t-container, 
.t-cover, .t-cover__carrier, .t-cover__filter, .t-cover__wrapper, .t396, .t396__artboard {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* === 2. ЯРКАЯ СЕТКА === */
#cyber-grid {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    background-image: linear-gradient(rgba(255, 90, 0, 0.18) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255, 90, 0, 0.18) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none; z-index: -99999 !important;
}

/* === 3. АБСТРАКТНЫЕ ПЯТНА (БОЛЬШЕ ОРАНЖЕВОГО) === */
#cyber-blobs {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    pointer-events: none; z-index: -99998 !important; overflow: hidden;
}
.cyber-blob {
    position: absolute; border-radius: 50%; filter: blur(110px);
    animation: blobMove 28s ease-in-out infinite alternate; opacity: 0.85;
}
.cyber-blob.b1 { top: -15%; left: -10%; width: 850px; height: 850px; background: radial-gradient(circle, rgba(255, 80, 0, 0.38) 0%, transparent 70%); }
.cyber-blob.b2 { top: 35%; right: -15%; width: 750px; height: 750px; background: radial-gradient(circle, rgba(255, 140, 0, 0.32) 0%, transparent 70%); animation-delay: -7s; }
.cyber-blob.b3 { bottom: -20%; left: 25%; width: 950px; height: 950px; background: radial-gradient(circle, rgba(255, 50, 0, 0.28) 0%, transparent 70%); animation-delay: -14s; }
.cyber-blob.b4 { top: 60%; left: 60%; width: 600px; height: 600px; background: radial-gradient(circle, rgba(255, 180, 50, 0.22) 0%, transparent 70%); animation-delay: -20s; }

@keyframes blobMove {
    0% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(70px, -50px) scale(1.15); }
    100% { transform: translate(-50px, 60px) scale(0.95); }
}

/* === 4. ИСКРЫ (80+ ШТУК, ЯРКИЕ, ПЛЫВУТ ВВЕРХ) === */
#cyber-sparks {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    pointer-events: none; z-index: -99997 !important; overflow: hidden;
}
.spark {
    position: absolute; border-radius: 50%;
    background: #ff7a00;
    box-shadow: 0 0 6px #ff5500, 0 0 14px rgba(255, 85, 0, 0.7);
    animation: sparkFloat linear infinite; opacity: 0;
}
@keyframes sparkFloat {
    0% { transform: translateY(110vh) scale(0.2); opacity: 0; }
    10% { opacity: 1; }
    85% { opacity: 1; }
    100% { transform: translateY(-10vh) scale(1.3); opacity: 0; }
}

/* === 5. ВИНЬЕТКА === */
#cyber-vignette {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    background: radial-gradient(ellipse at center, transparent 25%, rgba(0,0,0,0.8) 100%);
    pointer-events: none; z-index: -99996 !important;
}