body::before { 
    content: ""; 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.5'/%3E%3C/svg%3E"); 
    opacity: 0.15; 
    pointer-events: none; 
    z-index: 9999; 
    mix-blend-mode: multiply; 
}

.bg-halftone { 
    background-image: radial-gradient(#0052cc 1px, transparent 1px); 
    background-size: 20px 20px; 
    opacity: 0.1; 
}

::-webkit-scrollbar { 
    width: 12px; 
    height: 12px; 
}

::-webkit-scrollbar-track { 
    background: #f2f0e9; 
    border-left: 2px solid #1a1a1a; 
}

::-webkit-scrollbar-thumb { 
    background: #1a1a1a; 
    border: 2px solid #f2f0e9; 
}

::-webkit-scrollbar-thumb:hover { 
    background: #0052cc; 
}

.custom-scrollbar::-webkit-scrollbar { 
    width: 8px; 
} 

.custom-scrollbar::-webkit-scrollbar-thumb { 
    background: #333; 
    border-radius: 4px; 
}

pre { 
    white-space: pre-wrap; 
    word-wrap: break-word; 
}

.tv-screen-content { 
    transition: all 0.1s ease; 
    transform-origin: center; 
}

.tv-scanlines { 
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
    background-size: 100% 4px, 3px 100%; 
    pointer-events: none; 
    z-index: 40;
}

.tv-static {
    position: absolute; 
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    opacity: 0; 
    z-index: 35; 
    pointer-events: none;
}

@keyframes crt-off { 
    0% { transform: scale(1, 1); opacity: 1; filter: brightness(1); } 
    40% { transform: scale(1, 0.005); opacity: 1; filter: brightness(2); } 
    70% { transform: scale(0.005, 0.005); opacity: 1; filter: brightness(5); } 
    100% { transform: scale(0, 0); opacity: 0; filter: brightness(10); } 
}

@keyframes crt-on { 
    0% { transform: scale(0, 0); opacity: 0; filter: brightness(10); } 
    30% { transform: scale(0.005, 0.005); opacity: 1; filter: brightness(5); } 
    60% { transform: scale(1, 0.005); opacity: 1; filter: brightness(2); } 
    100% { transform: scale(1, 1); opacity: 1; filter: brightness(1); } 
}

@keyframes static-flicker { 
    0% { opacity: 0.1; } 10% { opacity: 0.5; } 20% { opacity: 0.2; } 30% { opacity: 0.6; } 
    40% { opacity: 0.3; } 50% { opacity: 0.7; } 60% { opacity: 0.4; } 70% { opacity: 0.8; } 
    80% { opacity: 0.5; } 90% { opacity: 0.9; } 100% { opacity: 0.1; } 
}

.animate-crt-off { animation: crt-off 0.4s cubic-bezier(0.23, 1, 0.32, 1) forwards; }
.animate-crt-on { animation: crt-on 0.4s cubic-bezier(0.23, 1, 0.32, 1) forwards; }
.animate-static { animation: static-flicker 0.1s infinite; opacity: 0.8 !important; }
.wood-texture { background-image: repeating-linear-gradient(45deg, transparent, transparent 10px, #000 10px, #000 11px); }
.antenna-left { transform-origin: bottom; transform: rotate(-25deg); } 
.antenna-right { transform-origin: bottom; transform: rotate(25deg); }
@keyframes fade-in {
    from { opacity: 0; transform: translateY(10px); filter: blur(4px); }
    to { opacity: 1; transform: translateY(0); filter: blur(0); }
}

@keyframes fade-out {
    from { opacity: 1; transform: translateY(0); filter: blur(0); }
    to { opacity: 0; transform: translateY(10px); filter: blur(4px); }
}

@keyframes slide-down {
    from { opacity: 0; transform: scaleY(0); transform-origin: top; }
    to { opacity: 1; transform: scaleY(1); transform-origin: top; }
}

.animate-fade-in {
    animation: fade-in 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-fade-out {
    animation: fade-out 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-slide-down {
    animation: slide-down 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
