/* roulang page: index */
:root {
            --color-bg-dark: #0B1118;
            --color-card-dark: #131D27;
            --color-neon-green: #00E676;
            --color-accent-flame: #FF5722;
            --color-slate-text: #94A3B8;
        }

        body {
            color: #1E293B;
            background-color: #FFFFFF;
            -webkit-font-smoothing: antialiased;
            overflow-x: hidden;
        }

        .bg-grid-pattern {
            background-size: 40px 40px;
            background-image: 
                linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
                linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
        }

        .hud-border {
            position: relative;
        }
        .hud-border::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 10px;
            height: 10px;
            border-top: 2px solid var(--color-neon-green);
            border-left: 2px solid var(--color-neon-green);
        }
        .hud-border::before {
            content: '';
            position: absolute;
            bottom: 0;
            right: 0;
            width: 10px;
            height: 10px;
            border-bottom: 2px solid var(--color-neon-green);
            border-right: 2px solid var(--color-neon-green);
        }

        .glow-effect {
            box-shadow: 0 0 25px rgba(0, 230, 118, 0.18);
        }

        .radar-sweep {
            position: relative;
            overflow: hidden;
        }
        .radar-sweep::after {
            content: "";
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: conic-gradient(from 0deg, transparent 0deg, rgba(0, 230, 118, 0.15) 60deg, transparent 65deg);
            animation: radarRotate 6s linear infinite;
            pointer-events: none;
        }
        @keyframes radarRotate {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        .tab-content {
            display: none;
        }
        .tab-content.active {
            display: block;
        }