:root {
            --purple: #433878;
            --orange: #CD5C08;
            --dark: #0f0c1d;
        }

        body {
            background-color: var(--dark);
            color: #ffffff;
            scroll-behavior: smooth;
            overflow-x: hidden;
        }

        /* --- HUD SCANLINE & GRID BACKGROUND --- */
        .hud-bg {
            background-image: 
                linear-gradient(rgba(67, 56, 120, 0.05) 1px, transparent 1px),
                linear-gradient(90deg, rgba(67, 56, 120, 0.05) 1px, transparent 1px);
            background-size: 30px 30px;
        }

        .scanline {
            position: fixed;
            top: 0; left: 0; width: 100%; height: 100%;
            background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.02) 50%, rgba(255,255,255,0) 100%);
            background-size: 100% 4px;
            z-index: 999;
            pointer-events: none;
            animation: scan 8s linear infinite;
        }
        @keyframes scan { from { transform: translateY(-100%); } to { transform: translateY(100%); } }

        /* --- NAVIGATION --- */
        .nav-tab {
            position: relative;
            padding: 10px 0;
            cursor: pointer;
            transition: all 0.3s;
        }
        .nav-tab::after {
            content: '';
            position: absolute;
            bottom: 0; left: 0; width: 0; height: 3px;
            background: var(--orange);
            transition: width 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            box-shadow: 0 0 10px var(--orange);
        }
        .nav-tab:hover::after, .nav-tab.active::after { width: 100%; }
        .nav-tab:hover { color: var(--orange); text-shadow: 0 0 8px rgba(205, 92, 8, 0.5); }

        /* --- MODULE PANELS --- */
        .hud-panel {
            background: rgba(67, 56, 120, 0.15);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-left: 3px solid var(--orange);
            transition: all 0.4s;
        }
        .hud-panel:hover {
            background: rgba(67, 56, 120, 0.25);
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0,0,0,0.5);
        }

        /* --- HERO ANIMATIONS --- */
        .hero-pulse { animation: heroPulse 6s ease-in-out infinite; }
        @keyframes heroPulse { 0%, 100% { transform: scale(1); opacity: 0.9; } 50% { transform: scale(1.02); opacity: 1; } }

        .slide-in-left { animation: slideLeft 0.8s forwards; }
        .slide-in-right { animation: slideRight 0.8s forwards; }
        @keyframes slideLeft { from { opacity: 0; transform: translateX(-50px); } to { opacity: 1; transform: translateX(0); } }
        @keyframes slideRight { from { opacity: 0; transform: translateX(50px); } to { opacity: 1; transform: translateX(0); } }

        /* --- MISSION SELECTOR --- */
        .mission-pill {
            transition: all 0.3s;
            border: 1px solid rgba(255, 255, 255, 0.1);
        }
        .mission-pill.active {
            background: var(--orange);
            color: white;
            box-shadow: 0 0 15px var(--orange);
            border-color: var(--orange);
        }

        /* --- PAGE TRANSITIONS --- */
        .page-node {
            display: none;
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .page-node.active {
            display: block;
            opacity: 1;
            transform: translateY(0);
        }

        /* --- ACCORDION --- */
        .guide-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.6s ease-out;
        }
        .guide-panel.open .guide-content { max-height: 1500px; padding-bottom: 2rem; }
        .guide-panel.open .chevron { transform: rotate(180deg); color: var(--orange); }

        /* --- SEARCH MODAL --- */
        #search-overlay {
            display: none;
            background: rgba(15, 12, 29, 0.98);
            backdrop-filter: blur(20px);
        }

        /* --- SCROLLBAR --- */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: var(--dark); }
        ::-webkit-scrollbar-thumb { background: var(--purple); border-radius: 10px; }
        ::-webkit-scrollbar-thumb:hover { background: var(--orange); }

        /* --- LIVE FEED --- */
        .feed-track {
            animation: feedScroll 40s linear infinite;
        }
        @keyframes feedScroll { from { transform: translateY(0); } to { transform: translateY(-50%); } }
        .feed-track:hover { animation-play-state: paused; }

        .btn-tech {
            clip-path: polygon(10% 0, 100% 0, 100% 70%, 90% 100%, 0 100%, 0 30%);
            transition: all 0.3s;
        }
        .btn-tech:hover { transform: scale(1.05); filter: brightness(1.2); }