/* CYBERMINDCOLONY CORE UI MATRIX */
:root {
    --matrix-green: #00ff66;
    --cyber-purple: #9d4edd;
    --cyber-cyan: #00f0ff;
    --dark-void: #0a0a0c;
    --panel-bg: rgba(16, 16, 20, 0.75);
}

body {
    background-color: var(--dark-void);
    color: #e2e8f0;
    font-family: 'Courier New', Courier, monospace;
    overflow-x: hidden;
}

.cyber-glow-green {
    box-shadow: 0 0 15px rgba(0, 255, 102, 0.4);
    border: 1px solid var(--matrix-green);
}

.cyber-glow-purple {
    box-shadow: 0 0 15px rgba(157, 78, 221, 0.4);
    border: 1px solid var(--cyber-purple);
}

/* Matrix Loading Animation */
.matrix-loader {
    width: 50px;
    height: 50px;
    border: 3px solid rgba(0, 255, 102, 0.1);
    border-radius: 50%;
    border-top-color: var(--matrix-green);
    animation: spin 1s ease-in-out infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Custom Grid Scans */
.grid-bg {
    background-image: linear-gradient(rgba(0, 255, 102, 0.03) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(0, 255, 102, 0.03) 1px, transparent 1px);
    background-size: 20px 20px;
}

/* Glassmorphism Panels */
.cyber-panel {
    background: var(--panel-bg);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(0, 240, 255, 0.2);
    transition: all 0.3s ease;
}

.cyber-panel:hover {
    border-color: var(--cyber-cyan);
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.15);
}