/* [2026-08-01] [CSS, O(1), Matrix Cursor & Whoami Glitch, Zero-Allocation] - Organized by Gemini */

body, a, button, input, textarea, select, .tile, .sub-tile, .stream-container, .avatar-container, .modal-close, .whoami {
    cursor: none !important;
}

#matrix-cursor-canvas {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: transparent !important;
    pointer-events: none !important;
    z-index: 1000000;
    contain: strict;
    will-change: transform;
}

.whoami {
    position: relative;
    transition: text-shadow 0.2s ease, filter 0.2s ease;
    will-change: text-shadow, transform;
    user-select: none;
}

.whoami p {
    position: relative;
    transition: transform 0.1s cubic-bezier(0.175, 0.885, 0.32, 1.275), color 0.2s ease;
    will-change: transform, text-shadow;
}

.whoami:hover p, .whoami.matrix-glitching p {
    color: #fff;
    text-shadow: 
        -2px 0 0 rgba(255, 0, 60, 0.9), 
        2px 0 0 rgba(0, 255, 255, 0.9), 
        0 0 10px rgba(255, 0, 60, 0.4);
    animation: whoamiCyberShift 2.5s infinite linear;
}

.whoami p:nth-child(1):hover {
    transform: translate3d(-3px, 0, 0) skewX(-2deg);
    text-shadow: -3px 0 0 #ff003c, 3px 0 0 #00ffff, 0 0 15px rgba(255, 0, 60, 0.8);
}

.whoami p:nth-child(2):hover {
    transform: translate3d(4px, 0, 0) skewX(2deg);
    text-shadow: -4px 0 0 #00ffff, 4px 0 0 #ff003c, 0 0 15px rgba(0, 255, 255, 0.8);
}

.whoami p:nth-child(3):hover {
    transform: translate3d(-2px, -1px, 0) scale(1.01);
    text-shadow: -2px 0 0 #ff003c, 2px 0 0 #ff0000, 0 0 20px rgba(255, 0, 60, 1.0);
}

.whoami.matrix-glitching {
    animation: whoamiGlitchHard 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

.whoami.matrix-glitching p {
    animation: none;
    color: #ff003c;
    text-shadow: -4px 0 0 #00ffff, 4px 0 0 #ff003c, 0 0 12px #ffffff !important;
    transform: translate3d(2px, 0, 0);
}

.whoami::after {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(180deg, 
        transparent 0%, 
        rgba(0, 255, 204, 0.05) 45%, 
        rgba(255, 0, 60, 0.4) 50%, 
        rgba(0, 255, 255, 0.15) 55%, 
        transparent 100%);
    background-size: 100% 20px;
    pointer-events: none !important;
    opacity: 0;
    transition: opacity 0.3s ease;
    mix-blend-mode: screen;
}

.whoami:hover::after, .whoami.matrix-glitching::after {
    opacity: 1;
    animation: systemScanline75Hz 0.13333s linear infinite !important;
}

.stream-container:hover::after {
    content: "";
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: repeating-linear-gradient(0deg, rgba(0,210,255,0.15), rgba(0,210,255,0.15) 1px, transparent 1px, transparent 4px);
    pointer-events: none !important;
    animation: systemScanline75Hz 0.13333s linear infinite !important;
}

@keyframes systemScanline75Hz {
    0% { transform: translate3d(0, -4px, 0); opacity: 0.85; }
    50% { opacity: 1.0; filter: drop-shadow(0 0 6px #00ffff); }
    100% { transform: translate3d(0, 4px, 0); opacity: 0.65; }
}

@keyframes whoamiCyberShift {
    0% {
        text-shadow: -2px 0 0 rgba(255, 0, 60, 0.8), 2px 0 0 rgba(0, 255, 255, 0.8);
        transform: translate3d(0, 0, 0);
    }
    48% {
        text-shadow: -2px 0 0 rgba(255, 0, 60, 0.8), 2px 0 0 rgba(0, 255, 255, 0.8);
        transform: translate3d(0, 0, 0);
    }
    50% {
        text-shadow: 3px 0 0 rgba(0, 255, 255, 1.0), -3px 0 0 rgba(255, 0, 60, 1.0);
        transform: translate3d(-2px, 0, 0) skewX(-1deg);
    }
    52% {
        text-shadow: -2px 0 0 rgba(255, 0, 60, 0.8), 2px 0 0 rgba(0, 255, 255, 0.8);
        transform: translate3d(0, 0, 0) skewX(0deg);
    }
    90% {
        text-shadow: -2px 0 0 rgba(255, 0, 60, 0.8), 2px 0 0 rgba(0, 255, 255, 0.8);
        transform: translate3d(0, 0, 0);
    }
    92% {
        text-shadow: 4px 0 0 #ff003c, -4px 0 0 #00ffff;
        transform: translate3d(2px, 1px, 0) skewX(1deg);
    }
    94% {
        text-shadow: -2px 0 0 rgba(255, 0, 60, 0.8), 2px 0 0 rgba(0, 255, 255, 0.8);
        transform: translate3d(0, 0, 0) skewX(0deg);
    }
    100% {
        text-shadow: -2px 0 0 rgba(255, 0, 60, 0.8), 2px 0 0 rgba(0, 255, 255, 0.8);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes whoamiGlitchHard {
    0% { transform: translate3d(0, 0, 0); }
    20% { transform: translate3d(-5px, 2px, 0) skewX(-5deg); }
    40% { transform: translate3d(6px, -2px, 0) skewX(5deg); }
    60% { transform: translate3d(-3px, 1px, 0) skewX(-2deg); }
    80% { transform: translate3d(4px, -1px, 0) skewX(3deg); }
    100% { transform: translate3d(0, 0, 0) skewX(0deg); }
}

@media (max-width: 900px), (hover: none) and (pointer: coarse) {
    #matrix-cursor-canvas {
        display: none !important;
    }
    body, a, button, input, textarea, select, .tile, .sub-tile, .stream-container, .avatar-container, .modal-close, .whoami {
        cursor: auto !important;
    }
}