 
    :root {
        --neon-red: #ff2a2a;
        --neon-blue: #00f2ff;
        --neon-orange: #ff7a00;
        --neon-purple: #bc13fe;
        --void-black: #020205;
        --glass-panel: rgba(5, 5, 12, 0.85);
    }

    
    body { 
        background-color: var(--void-black); 
        margin: 0;
        overflow-x: hidden;
        color: #e0e0e0;
        font-family: 'JetBrains Mono', monospace;
        position: relative;
    }

    
    .space-bg {
        position: fixed;
        top: 0; left: 0; width: 100%; height: 100%;
        z-index: -1;
        background: 
            radial-gradient(circle at 50% 50%, rgba(15, 15, 40, 1) 0%, var(--void-black) 100%);
        overflow: hidden;
    }

     
    .space-bg::before {
        content: "";
        position: absolute;
        width: 200%; height: 200%;
        top: -50%; left: -50%;
        background-image: 
            url('https://www.transparenttextures.com/patterns/stardust.png'),
            radial-gradient(circle at 20% 30%, rgba(188, 19, 254, 0.05) 0%, transparent 40%),
            radial-gradient(circle at 80% 70%, rgba(0, 242, 255, 0.05) 0%, transparent 40%);
        animation: spaceRotate 120s linear infinite;
    }

    @keyframes spaceRotate {
        from { transform: rotate(0deg); }
        to { transform: rotate(360deg); }
    }

    
    .laser {
        position: absolute;
        width: 2px;
        height: 40px;
        background: var(--neon-blue);
        box-shadow: 0 0 10px var(--neon-blue);
        opacity: 0;
        animation: laserShoot 4s linear infinite;
    }

    .laser.orange { background: var(--neon-orange); box-shadow: 0 0 10px var(--neon-orange); animation-delay: 2s; }

    @keyframes laserShoot {
        0% { transform: translateY(110vh) translateX(0) rotate(-45deg); opacity: 1; }
        100% { transform: translateY(-10vh) translateX(100vw) rotate(-45deg); opacity: 0; }
    }

    
    .cyber-hud-top {
        position: sticky;
        top: 0;
        display: flex;
        justify-content: space-between;
        padding: 15px 20px;
        font-size: 10px;
        letter-spacing: 2px;
        z-index: 1000;
        background: rgba(2, 2, 5, 0.9);
        backdrop-filter: blur(10px);
        border-bottom: 1px solid rgba(0, 242, 255, 0.15);
    }

    .cyber-card {
        background: var(--glass-panel) !important;
        border: 1px solid rgba(0, 242, 255, 0.1);
        position: relative;
        transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        overflow: hidden;
        clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%);
        backdrop-filter: blur(15px);
    }

    .cyber-card:hover {
        border-color: var(--neon-red);
        transform: translateY(-8px) scale(1.02);
        box-shadow: 0 0 30px rgba(0, 242, 255, 0.2);
    }

    .lunzy-img-box { position: relative; overflow: hidden; }
    .lunzy-img { width: 100%; transition: 0.6s; filter: brightness(0.7); }
    .cyber-card:hover .lunzy-img { filter: brightness(1.1); }

    .scan-line {
        position: absolute;
        top: -100%; left: 0; width: 100%; height: 3px;
        background: var(--neon-blue);
        box-shadow: 0 0 15px var(--neon-blue);
        z-index: 10;
        opacity: 0;
    }
    .cyber-card:hover .scan-line { animation: scanAnim 2s linear infinite; opacity: 1; }

    @keyframes scanAnim { 0% { top: 0%; } 100% { top: 100%; } }

    .art-badge {
        font-family: 'Share Tech Mono', monospace;
        font-size: 9px;
        color: var(--neon-blue);
        letter-spacing: 2px;
        margin-top: 10px;
        display: block;
        opacity: 0.6;
    }
 