:root {
    --green-fosforo: #00FF00;
}

body {
    background-color: black;
    color: var(--green-fosforo);
    text-shadow: 0 0 5px rgba(0, 255, 0, 0.5);
}

.radar-grid {
    background-image: 
        linear-gradient(rgba(0, 255, 0, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 255, 0, 0.05) 1px, transparent 1px);
    background-size: 30px 30px;
}

.terminal-border {
    border: 2px solid var(--green-fosforo);
    box-shadow: 0 0 15px rgba(0, 255, 0, 0.2);
    min-height: 90vh;
}

.glow { text-shadow: 0 0 10px var(--green-fosforo); }

.btn-terminal {
    background: transparent;
    border: 1px solid var(--green-fosforo);
    color: var(--green-fosforo);
    padding: 5px 15px;
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-terminal:hover {
    background: var(--green-fosforo);
    color: black;
    box-shadow: 0 0 10px var(--green-fosforo);
}

.news-card {
    transition: all 0.2s;
}

.blink { animation: blinker 1.5s linear infinite; }
@keyframes blinker { 50% { opacity: 0; } }

#news-feed::-webkit-scrollbar { width: 5px; }
#news-feed::-webkit-scrollbar-track { background: #001100; border-left: 1px solid #003300; }
#news-feed::-webkit-scrollbar-thumb { background: var(--green-fosforo); box-shadow: 0 0 6px rgba(0,255,0,0.6); border-radius: 2px; }
#news-feed::-webkit-scrollbar-thumb:hover { background: #00cc00; }
#news-feed { scrollbar-width: thin; scrollbar-color: var(--green-fosforo) #001100; }
/* ============================================================
   INTEL STATION v2.1 — RESPONSIVE ADDITIONS
   ============================================================ */

/* Remove old CSS matrix-bg div (now using real canvas) */
.matrix-bg { display: none !important; }

/* Ensure terminal border glow */
.terminal-border { box-shadow: 0 0 15px rgba(0, 255, 0, 0.15); }

/* Mobile: make sections scrollable instead of clipped */
@media (max-width: 1024px) {
    .min-h-screen { min-height: 100dvh; }
    
    /* Globe gets a fixed height on mobile */
    #globe-container { min-height: 300px; }
    
    /* Ticker readable on mobile */
    .ticker-move { font-size: 11px; }
    
    /* Pulse boxes stack better on small screens */
    .pulse-box { padding: 4px 2px; font-size: 9px; }
}

@media (max-width: 640px) {
    /* Header titles */
    h1.glow { font-size: 13px !important; }
    
    /* Buttons in footer wrap cleanly */
    footer a { font-size: 9px; padding: 4px 8px; }
    
    /* Canvas chart always fills container */
    #candleChart { height: 120px; }
}