/* Ambient Graph Paper Effect */
        .graph-paper {
            position: fixed;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            pointer-events: none;
            z-index: 0;
            background-image: 
                linear-gradient(to right, rgba(27, 28, 25, 0.05) 1px, transparent 1px),
                linear-gradient(to bottom, rgba(27, 28, 25, 0.05) 1px, transparent 1px);
            background-size: 20px 20px;
        }

        html.dark .graph-paper {
            background-image: 
                linear-gradient(to right, rgba(255, 176, 0, 0.03) 1px, transparent 1px),
                linear-gradient(to bottom, rgba(255, 176, 0, 0.03) 1px, transparent 1px);
        }

        /* Improved High-Fidelity Scanlines */
        .scanlines {
            position: absolute;
            inset: 0;
            pointer-events: none;
            z-index: 20;
            background: linear-gradient(
                rgba(18, 16, 16, 0) 50%,
                rgba(0, 0, 0, 0.1) 50%
            ), linear-gradient(
                90deg,
                rgba(255, 176, 0, 0.03),
                rgba(255, 176, 0, 0.01),
                rgba(255, 176, 0, 0.03)
            );
            background-size: 100% 3px, 3px 100%;
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        
        .holo-container:hover .scanlines {
            opacity: 1;
        }

        /* Intensified Flicker Animation */
        @keyframes aggressive-flicker {
            0% { opacity: 1; filter: contrast(100%) brightness(100%) saturate(1); }
            5% { opacity: 0.85; filter: contrast(150%) brightness(120%) saturate(2); transform: translate(1px, -1px); }
            10% { opacity: 0.9; filter: contrast(120%) brightness(110%) saturate(1.5); transform: translate(-1px, 1px); }
            15% { opacity: 1; transform: translate(0); }
            20% { opacity: 0.8; filter: contrast(200%) brightness(140%) saturate(0); transform: translate(2px, 0); }
            25% { opacity: 1; transform: translate(0); }
            80% { opacity: 1; }
            85% { opacity: 0.9; transform: scaleY(1.02); }
            90% { opacity: 1; transform: scaleY(1); }
            95% { opacity: 0.8; filter: hue-rotate(15deg); }
            100% { opacity: 1; }
        }

        .hover-flicker:hover, .hover-flicker-container:hover .hover-flicker-target {
            animation: aggressive-flicker 0.2s infinite;
        }

        /* 3D Tilt */
        .tilt-card {
            transition: transform 0.15s ease-out, box-shadow 0.3s ease;
            transform: perspective(1000px) rotateX(var(--rotate-x, 0deg)) rotateY(var(--rotate-y, 0deg));
            transform-style: preserve-3d;
            will-change: transform;
        }
        .tilt-card.resetting {
            transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
            transform: perspective(1000px) rotateX(0deg) rotateY(0deg);
        }

        /* Mouse-Tracking Distortion Overlay */
        .distortion-overlay {
            position: absolute;
            inset: 0;
            background: radial-gradient(
                circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
                rgba(255, 176, 0, 0.15) 0%,
                transparent 60%
            );
            mix-blend-mode: color-dodge;
            pointer-events: none;
            opacity: 0;
            z-index: 25;
            transition: opacity 0.3s ease;
        }
        .holo-container:hover .distortion-overlay {
            opacity: 1;
        }

        /* Intensified Holographic Layer */
        .holo-prism {
            position: absolute;
            inset: 0;
            pointer-events: none;
            opacity: 0;
            z-index: 5;
            transition: opacity 0.4s ease;
            background: linear-gradient(
                135deg,
                rgba(255,176,0,0.05) 0%,
                rgba(255,176,0,0.1) 50%,
                rgba(255,176,0,0.05) 100%
            );
            background-size: 200% 200%;
        }
        .holo-container:hover .holo-prism {
            opacity: 1;
            animation: holo-pan 4s linear infinite;
        }
        @keyframes holo-pan {
            0% { background-position: 0% 0%; }
            100% { background-position: 200% 200%; }
        }

        /* Scrollbar */
        ::-webkit-scrollbar { width: 4px; }
        ::-webkit-scrollbar-track { background: #fbf9f4; border-left: 1px solid #d7c4ac; }
        html.dark ::-webkit-scrollbar-track { background: #131313; border-left: 1px solid #33281c; }
        ::-webkit-scrollbar-thumb { background: #847560; }
        html.dark ::-webkit-scrollbar-thumb { background: #524533; }
        html.dark ::-webkit-scrollbar-thumb:hover { background: #ffb000; }

        .amber-glow-text {
            text-shadow: 0 0 8px rgba(255, 176, 0, 0.4);
        }

        /* AI Visualization Styles */
        .ai-viz-container {
            mask-image: radial-gradient(circle at center, black 60%, transparent 95%);
            -webkit-mask-image: radial-gradient(circle at center, black 60%, transparent 95%);
        }
        .node {
            transition: r 0.3s ease, fill 0.3s ease;
        }
        .connection {
            transition: stroke-width 0.3s ease, opacity 0.3s ease, stroke 0.3s ease;
        }

        /* Sidebar toggle */
        #sidebar {
            transition: transform 0.25s ease, opacity 0.25s ease;
        }

        body.sidebar-collapsed #sidebar {
            opacity: 0;
            transform: translateX(-100%);
            pointer-events: none;
        }

        body.sidebar-collapsed header.fixed.top-0 {
            left: 0 !important;
        }

        body.sidebar-collapsed main {
            margin-left: 0 !important;
        }

        @media (max-width: 768px) {
            #sidebar {
                transform: translateX(-100%);
                opacity: 0;
                pointer-events: none;
            }

            body.sidebar-open #sidebar {
                opacity: 1;
                transform: translateX(0);
                pointer-events: auto;
            }

            header.fixed.top-0 {
                left: 0 !important;
            }

            main {
                margin-left: 0 !important;
            }
        }