@keyframes scanline {
    0% { transform: translateY(-100%); }
    100% { transform: translateY(100%); }
}

@keyframes flicker {
    0% { opacity: 0.985; }
    5% { opacity: 0.992; }
    10% { opacity: 0.988; }
    15% { opacity: 0.999; }
    20% { opacity: 0.985; }
    100% { opacity: 1; }
}

@keyframes blink {
    from, to { opacity: 1; }
    50% { opacity: 0; }
}

.scanline-overlay, .scanlines {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: linear-gradient(to bottom, rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.18) 50%);
    background-size: 100% 4px;
    z-index: 0; /* put scanlines behind UI to avoid covering headers/footers */
    mix-blend-mode: multiply; /* reduce any light/white overlay artifacts */
    pointer-events: none;
}

.crt-flicker {
    animation: flicker 0.15s infinite;
}

.terminal-glow, .phosphor-glow {
    text-shadow: 0 0 8px rgba(0, 255, 65, 0.8);
}

.amber-glow {
    text-shadow: 0 0 8px rgba(255, 186, 67, 0.8);
}

.cursor-pulse {
    display: inline-block;
    width: 10px;
    height: 1.2em;
    background-color: #00ff41;
    vertical-align: middle;
    animation: blink 1s step-end infinite;
}

.noise-bg {
    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.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.05;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: #131318;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #00ff41;
}

/* Warden Theme Overrides */
body.warden-theme {
    background-color: #0a0a0c;
}
.warden-theme .scanlines {
    background: linear-gradient(rgba(10, 10, 12, 0) 50%, rgba(0, 0, 0, 0.35) 50%), linear-gradient(90deg, rgba(255, 176, 0, 0.03), rgba(0, 0, 0, 0.02), rgba(0, 0, 0, 0.03));
    background-size: 100% 4px, 3px 100%;
}
.warden-theme .phosphor-glow {
    text-shadow: 0 0 8px rgba(255, 176, 0, 0.7);
}
.warden-theme .cursor-pulse {
    background-color: #ffb000;
}