.qrl-icon {
            display: inline-block;
            width: 1em;
            height: 1em;
            vertical-align: -0.125em;
            fill: currentColor;
            flex-shrink: 0;
        }

        .qrl-icon--lg {
            width: 3rem;
            height: 3rem;
        }

        :root {
            --quantum-blue: #00f3ff;
            --blueshift-core: #38bdf8;
            --blueshift-deep: #1d4ed8;
            --purpleshift-core: #a855f7;
            --purpleshift-deep: #7c3aed;
            --redshift-core: #00f3ff;
            --redshift-mid: #ff6b4a;
            --redshift-edge: #dc2626;
        }
        
        body {
            font-family: 'Inter', system_ui, sans-serif;
        }
        
        .logo-font {
            font-family: 'Space Grotesk', sans-serif;
        }

        .hero-bg {
            background: radial-gradient(circle at 50% 30%, rgba(0, 243, 255, 0.15) 0%, transparent 50%);
        }

        .entanglement-cluster {
            position: absolute;
            width: 110px;
            height: 110px;
            pointer-events: none;
        }

        .entanglement-spark-track {
            position: absolute;
            top: 50%;
            left: 50%;
            width: var(--beam-len, 72px);
            height: 0;
            transform-origin: left center;
            pointer-events: none;
        }

        .entanglement-spark {
            position: absolute;
            left: 0;
            top: -2px;
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background: #fff;
            box-shadow: 0 0 8px #a855f7, 0 0 12px #ff6b4a;
            animation: sparkTravel 2.8s ease-in-out infinite;
            animation-delay: var(--ent-delay, 0s);
        }

        @keyframes sparkTravel {
            0%, 100% { left: 0; opacity: 0; transform: scale(0.5); }
            12% { opacity: 0.9; }
            50% { left: calc(100% - 4px); opacity: 1; transform: scale(1); }
            88% { opacity: 0; }
        }

        .floating-entangle-pair {
            position: absolute;
            width: 0;
            height: 0;
            pointer-events: none;
        }

        .floating-entangle-beam {
            position: absolute;
            height: 1px;
            background: linear-gradient(90deg, #1d4ed8, #38bdf8, #a855f7, #ff6b4a);
            opacity: 0.5;
            transform-origin: left center;
            animation: entanglementPulse 3.2s ease-in-out infinite;
        }

        .redshift-trail {
            position: absolute;
            width: 26px;
            height: 2px;
            border-radius: 2px;
            background: linear-gradient(
                90deg,
                rgba(0, 243, 255, 0.85) 0%,
                rgba(255, 107, 74, 0.8) 55%,
                rgba(220, 38, 38, 0.25) 100%
            );
            transform: rotate(var(--trail-angle, 0deg));
            transform-origin: right center;
            opacity: 0;
            box-shadow: 0 0 8px rgba(255, 107, 74, 0.3);
            animation: redshiftTrail 7s ease-in-out infinite;
            animation-delay: var(--trail-delay, 0s);
            pointer-events: none;
        }

        @keyframes redshiftTrail {
            0%, 100% {
                opacity: 0;
                transform: rotate(var(--trail-angle, 0deg)) scaleX(0.35);
            }
            35%, 65% {
                opacity: 0.7;
                transform: rotate(var(--trail-angle, 0deg)) scaleX(1);
            }
        }

        .entanglement-beam {
            position: absolute;
            top: 50%;
            left: 50%;
            width: var(--beam-len, 90px);
            height: 2px;
            margin-top: -1px;
            transform-origin: left center;
            transform: rotate(var(--beam-angle, 0deg));
            background: linear-gradient(
                90deg,
                var(--blueshift-deep) 0%,
                var(--blueshift-core) 22%,
                var(--purpleshift-core) 50%,
                var(--purpleshift-deep) 68%,
                var(--redshift-mid) 100%
            );
            box-shadow:
                0 0 12px rgba(56, 189, 248, 0.45),
                0 0 18px rgba(168, 85, 247, 0.4),
                0 0 22px rgba(255, 107, 74, 0.3);
            animation: entanglementPulse 2.8s ease-in-out infinite;
            animation-delay: var(--ent-delay, 0s);
        }

        .entanglement-beam::after {
            content: '';
            position: absolute;
            inset: -3px 0;
            background: inherit;
            filter: blur(6px);
            opacity: 0.5;
            animation: entanglementPhase 2.8s ease-in-out infinite;
            animation-delay: var(--ent-delay, 0s);
        }

        @keyframes entanglementPulse {
            0%, 100% {
                opacity: 0.35;
                transform: rotate(var(--beam-angle, 0deg)) scaleX(0.85);
            }
            50% {
                opacity: 1;
                transform: rotate(var(--beam-angle, 0deg)) scaleX(1.08);
            }
        }

        @keyframes entanglementPhase {
            0%, 100% { opacity: 0.25; }
            25% { opacity: 0.9; }
            75% { opacity: 0.15; }
        }

        .entanglement-qubit {
            position: absolute;
            width: 10px;
            height: 10px;
            border-radius: 50%;
            margin: -5px 0 0 -5px;
            box-shadow: 0 0 14px currentColor, 0 0 28px currentColor;
        }

        .entanglement-qubit--a {
            top: 50%;
            left: 50%;
            color: var(--blueshift-core);
            background: var(--blueshift-core);
            animation: qubitSpinA 2.8s ease-in-out infinite;
            animation-delay: var(--ent-delay, 0s);
        }

        .entanglement-qubit--b {
            top: 50%;
            left: calc(50% + var(--beam-len, 90px));
            color: var(--redshift-mid);
            background: var(--redshift-mid);
            animation: qubitSpinB 2.8s ease-in-out infinite;
            animation-delay: var(--ent-delay, 0s);
        }

        .entanglement-qubit--purple {
            top: 50%;
            left: calc(50% + var(--beam-len, 90px) * 0.5);
            color: var(--purpleshift-core);
            background: var(--purpleshift-core);
            width: 7px;
            height: 7px;
            margin: -3.5px 0 0 -3.5px;
            animation: qubitPurpleBridge 2.8s ease-in-out infinite;
            animation-delay: var(--ent-delay, 0s);
        }

        @keyframes qubitPurpleBridge {
            0%, 100% { transform: scale(0.6); opacity: 0.35; }
            50% { transform: scale(1.35); opacity: 1; }
        }

        @keyframes qubitSpinA {
            0%, 100% { transform: translate(0, 0) scale(1); }
            25% { transform: translate(6px, -8px) scale(1.25); }
            50% { transform: translate(0, 0) scale(0.75); }
            75% { transform: translate(-6px, 8px) scale(1.25); }
        }

        @keyframes qubitSpinB {
            0%, 100% { transform: translate(0, 0) scale(1); }
            25% { transform: translate(-6px, 8px) scale(0.75); }
            50% { transform: translate(0, 0) scale(1.25); }
            75% { transform: translate(6px, -8px) scale(0.75); }
        }

        .entanglement-correlation {
            position: absolute;
            inset: -20%;
            border: 1px dashed rgba(168, 85, 247, 0.25);
            border-radius: 50%;
            animation: correlationRing 5.6s linear infinite;
            animation-delay: var(--ent-delay, 0s);
        }

        @keyframes correlationRing {
            from { transform: rotate(0deg) scale(0.9); opacity: 0.15; }
            50% { opacity: 0.45; }
            to { transform: rotate(360deg) scale(1.1); opacity: 0.15; }
        }

        .quantum-particle--entangled {
            animation: entangledFloat 6s infinite ease-in-out;
        }

        .quantum-particle--entangled-b {
            animation: entangledFloatMirror 6s infinite ease-in-out;
        }

        @keyframes entangledFloat {
            0%, 100% { transform: translate(0, 0) scale(1); }
            50% { transform: translate(16px, -20px) scale(1.1); }
        }

        @keyframes entangledFloatMirror {
            0%, 100% { transform: translate(0, 0) scale(1); }
            50% { transform: translate(-16px, 20px) scale(0.88); }
        }

        .quantum-particle--blueshift {
            animation: quantumBlueshiftFloat 9s infinite ease-in-out;
        }

        @keyframes quantumBlueshiftFloat {
            0%, 100% {
                transform: translate(0, 0) scale(1);
                background: var(--quantum-blue);
                box-shadow: 0 0 15px #00f3ff, 0 0 30px #00f3ff;
            }
            50% {
                transform: translate(-36px, 24px) scale(1.2);
                background: var(--blueshift-deep);
                box-shadow: 0 0 20px #38bdf8, 0 0 40px #1d4ed8;
            }
        }

        .quantum-particle--purpleshift {
            animation: quantumPurpleshiftFloat 8s infinite ease-in-out;
        }

        @keyframes quantumPurpleshiftFloat {
            0%, 100% {
                transform: translate(0, 0) scale(1);
                background: var(--purpleshift-core);
                box-shadow: 0 0 16px #a855f7, 0 0 32px #7c3aed;
            }
            33% {
                transform: translate(18px, -28px) scale(1.15);
                background: #c084fc;
            }
            66% {
                transform: translate(-14px, 16px) scale(0.9);
                background: var(--purpleshift-deep);
            }
        }

        .quantum-particle--redshift {
            animation: quantumRedshiftFloat 10s infinite ease-in-out;
        }

        @keyframes quantumRedshiftFloat {
            0%, 100% {
                transform: translate(0, 0) scale(1);
                background: var(--quantum-blue);
                box-shadow: 0 0 10px #00f3ff;
            }
            50% {
                transform: translate(28px, -14px) scale(0.75);
                background: var(--redshift-mid);
                box-shadow: 0 0 12px #ff6b4a, 0 0 20px #dc2626;
            }
        }

        .probability-cloud--blueshift {
            animation: cloudBlueshift 11s ease-in-out infinite;
        }

        @keyframes cloudBlueshift {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.45; filter: hue-rotate(0deg); }
            50% { transform: translate(-30px, 22px) scale(1.15); opacity: 0.75; filter: hue-rotate(-25deg); }
        }

        .probability-cloud--purpleshift {
            animation: cloudPurpleshift 9s ease-in-out infinite;
        }

        @keyframes cloudPurpleshift {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }
            50% { transform: translate(22px, -18px) scale(1.25); opacity: 0.85; }
        }

        .probability-cloud--redshift {
            animation: cloudRedshift 12s ease-in-out infinite;
        }

        @keyframes cloudRedshift {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.4; filter: hue-rotate(0deg); }
            50% { transform: translate(28px, -14px) scale(0.9); opacity: 0.7; filter: hue-rotate(28deg); }
        }

        .glass {
            background: rgba(15, 23, 42, 0.7);
            backdrop-filter: blur(20px);
        }

        .neon-text {
            text-shadow: 0 0 10px #00f3ff,
                        0 0 20px #00f3ff,
                        0 0 40px #00f3ff;
        }

        .quantum-particle {
            position: absolute;
            border-radius: 50%;
            background: var(--quantum-blue);
            box-shadow: 0 0 15px #00f3ff,
                       0 0 30px #00f3ff;
            animation: quantumFloat 8s infinite ease-in-out;
        }

        @keyframes quantumFloat {
            0%, 100% { transform: translate(0, 0) scale(1); }
            50% { transform: translate(30px, -40px) scale(0.6); }
        }

        .section-header {
            position: relative;
        }
        
        .section-header::after {
            content: '';
            position: absolute;
            bottom: -8px;
            left: 0;
            width: 60px;
            height: 2px;
            background: linear-gradient(to right, #00f3ff, #a855f7);
        }

        canvas {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            opacity: 0.6;
        }

        .focus-card {
            transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);
        }
        
        .focus-card:hover {
            transform: translateY(-4px);
            border-color: rgba(103, 232, 249, 0.4);
        }

        /* ── Header quantum animations ── */
        .quantum-field {
            position: absolute;
            inset: 0;
            pointer-events: none;
            overflow: hidden;
            z-index: 2;
        }

        .quantum-orbit {
            position: absolute;
            border: 1px solid rgba(0, 243, 255, 0.25);
            border-radius: 50%;
            animation: orbitSpin var(--orbit-dur, 12s) linear infinite;
        }

        .quantum-orbit::before,
        .quantum-orbit::after {
            content: '';
            position: absolute;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--quantum-blue);
            box-shadow: 0 0 12px #00f3ff, 0 0 24px #a855f7;
            top: 50%;
            left: 50%;
            margin: -3px 0 0 -3px;
        }

        .quantum-orbit::before {
            transform: rotate(0deg) translateX(var(--orbit-r, 80px));
            animation: electronOrbit var(--orbit-dur, 12s) linear infinite;
        }

        .quantum-orbit::after {
            transform: rotate(180deg) translateX(var(--orbit-r, 80px));
            animation: electronOrbit var(--orbit-dur, 12s) linear infinite reverse;
            background: #a855f7;
            box-shadow: 0 0 12px #a855f7, 0 0 24px #00f3ff;
        }

        @keyframes orbitSpin {
            from { transform: rotate(0deg) scale(1); }
            50% { transform: rotate(180deg) scale(1.05); }
            to { transform: rotate(360deg) scale(1); }
        }

        @keyframes electronOrbit {
            from { transform: rotate(0deg) translateX(var(--orbit-r, 80px)); }
            to { transform: rotate(360deg) translateX(var(--orbit-r, 80px)); }
        }

        .quantum-wave-layer {
            position: absolute;
            inset: 0;
            opacity: 0.35;
            mix-blend-mode: screen;
        }

        .quantum-wave-path {
            fill: none;
            stroke: url(#waveGradient);
            stroke-width: 1.5;
            animation: wavePulse 4s ease-in-out infinite;
        }

        .quantum-wave-path--blueshift {
            stroke: url(#blueshiftGradient);
            animation: waveBlueshift 6s ease-in-out infinite;
        }

        @keyframes waveBlueshift {
            0%, 100% { stroke-opacity: 0.3; transform: translateX(0); }
            50% { stroke-opacity: 0.8; transform: translateX(-10px); }
        }

        .quantum-wave-path--purpleshift {
            stroke: url(#purpleshiftGradient);
            animation: wavePurpleshift 5.5s ease-in-out infinite;
        }

        @keyframes wavePurpleshift {
            0%, 100% { stroke-opacity: 0.35; transform: translateY(0); }
            50% { stroke-opacity: 0.85; transform: translateY(-6px); }
        }

        .quantum-wave-path--redshift {
            stroke: url(#redshiftGradient);
            animation: waveRedshift 7s ease-in-out infinite;
        }

        @keyframes waveRedshift {
            0%, 100% { stroke-opacity: 0.25; transform: translateX(0); }
            50% { stroke-opacity: 0.75; transform: translateX(12px); }
        }

        .quantum-wave-path--cyan {
            stroke: url(#waveGradient);
            stroke-width: 1.2;
            animation: waveCyan 5.5s ease-in-out infinite;
            animation-delay: -0.8s;
        }

        @keyframes waveCyan {
            0%, 100% { stroke-opacity: 0.2; transform: translateY(0); }
            50% { stroke-opacity: 0.65; transform: translateY(-5px); }
        }

        .quantum-wave-path--mixed {
            stroke: url(#purpleshiftGradient);
            stroke-width: 1.3;
            animation: waveMixed 6.5s ease-in-out infinite;
            animation-delay: -2.1s;
        }

        @keyframes waveMixed {
            0%, 100% { stroke-opacity: 0.22; transform: translateX(0) translateY(0); }
            33% { stroke-opacity: 0.55; transform: translateX(-8px) translateY(4px); }
            66% { stroke-opacity: 0.45; transform: translateX(6px) translateY(-3px); }
        }

        .quantum-wave-path--soft {
            stroke: url(#blueshiftGradient);
            stroke-width: 1;
            opacity: 0.55;
            animation: waveSoft 8s ease-in-out infinite;
            animation-delay: -4s;
        }

        @keyframes waveSoft {
            0%, 100% { stroke-opacity: 0.15; transform: translateY(0); }
            50% { stroke-opacity: 0.5; transform: translateY(6px); }
        }

        .quantum-wavelets {
            pointer-events: none;
        }

        .quantum-wavelet-wrap {
            transform-box: fill-box;
            transform-origin: center;
            animation: waveletOscillate var(--wl-dur, 4s) ease-in-out infinite;
            animation-delay: var(--wl-delay, 0s);
        }

        .quantum-wavelet {
            fill: none;
            stroke-width: 1.4;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .quantum-wavelet--blue {
            stroke: #38bdf8;
            filter: drop-shadow(0 0 4px rgba(56, 189, 248, 0.55));
        }

        .quantum-wavelet--purple {
            stroke: #a855f7;
            filter: drop-shadow(0 0 4px rgba(168, 85, 247, 0.5));
        }

        .quantum-wavelet--red {
            stroke: #ff6b4a;
            filter: drop-shadow(0 0 4px rgba(255, 107, 74, 0.45));
        }

        .quantum-wavelet--cyan {
            stroke: #00f3ff;
            filter: drop-shadow(0 0 4px rgba(0, 243, 255, 0.5));
        }

        .quantum-wavelet--mixed {
            stroke: url(#waveGradient);
            filter: drop-shadow(0 0 5px rgba(103, 232, 249, 0.4));
        }

        @keyframes waveletOscillate {
            0%, 100% {
                opacity: 0.3;
                transform: translateY(0) scaleX(0.92);
            }
            50% {
                opacity: 0.9;
                transform: translateY(-7px) scaleX(1.08);
            }
        }

        .quantum-wave-path:nth-child(2) { animation-delay: -1.3s; opacity: 0.7; }
        .quantum-wave-path:nth-child(3) { animation-delay: -2.6s; opacity: 0.5; }

        @keyframes wavePulse {
            0%, 100% { stroke-opacity: 0.3; transform: translateY(0); }
            50% { stroke-opacity: 0.9; transform: translateY(-8px); }
        }

        .probability-cloud {
            position: absolute;
            border-radius: 50%;
            filter: blur(40px);
            animation: cloudDrift 10s ease-in-out infinite;
        }

        @keyframes cloudDrift {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.4; }
            33% { transform: translate(40px, -30px) scale(1.2); opacity: 0.7; }
            66% { transform: translate(-20px, 20px) scale(0.85); opacity: 0.5; }
        }

        .superposition-title {
            animation: superpositionGlow 3s ease-in-out infinite;
        }

        @keyframes superpositionGlow {
            0%, 100% {
                text-shadow: 0 0 10px #00f3ff, 0 0 20px #00f3ff, 0 0 40px #00f3ff;
                filter: hue-rotate(0deg);
            }
            20% {
                text-shadow: 0 0 16px #38bdf8, 0 0 32px #1d4ed8, 0 0 48px #00f3ff;
                filter: hue-rotate(-18deg);
            }
            40% {
                text-shadow: 0 0 15px #a855f7, 0 0 30px #7c3aed, 0 0 50px #00f3ff;
                filter: hue-rotate(15deg);
            }
            60% {
                text-shadow: 0 0 14px #ff6b4a, 0 0 28px #dc2626, 0 0 42px #a855f7;
                filter: hue-rotate(28deg);
            }
            80% {
                text-shadow: 0 0 12px #67e8f9, 0 0 25px #a855f7, 0 0 45px #67e8f9;
                filter: hue-rotate(-10deg);
            }
        }

        .bloch-sphere {
            position: absolute;
            width: 120px;
            height: 120px;
            right: 8%;
            top: 22%;
            opacity: 0.5;
            animation: blochFloat 6s ease-in-out infinite;
        }

        @keyframes blochFloat {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            50% { transform: translateY(-15px) rotate(8deg); }
        }

        .bloch-ring {
            fill: none;
            stroke: rgba(0, 243, 255, 0.4);
            stroke-width: 1;
            transform-origin: 60px 60px;
            animation: blochSpin 8s linear infinite;
        }

        .bloch-ring:nth-child(2) { animation-duration: 12s; animation-direction: reverse; stroke: rgba(168, 85, 247, 0.4); }
        .bloch-ring:nth-child(3) { animation-duration: 6s; stroke: rgba(103, 232, 249, 0.3); }

        @keyframes blochSpin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        .bloch-vector {
            stroke: #00f3ff;
            stroke-width: 2;
            stroke-linecap: round;
            filter: drop-shadow(0 0 6px #00f3ff);
            transform-origin: 60px 60px;
            animation: vectorPrecess 5s ease-in-out infinite;
        }

        @keyframes vectorPrecess {
            0%, 100% { transform: rotate(-30deg); }
            50% { transform: rotate(30deg); }
        }

        .quantum-grid {
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(0, 243, 255, 0.03) 1px, transparent 1px),
                linear-gradient(90deg, rgba(0, 243, 255, 0.03) 1px, transparent 1px);
            background-size: 60px 60px;
            animation: gridPulse 4s ease-in-out infinite;
            mask-image: radial-gradient(ellipse 80% 60% at 50% 40%, black 20%, transparent 70%);
        }

        @keyframes gridPulse {
            0%, 100% { opacity: 0.4; }
            50% { opacity: 0.8; }
        }

        .tunnel-flash {
            position: absolute;
            width: 4px;
            height: 4px;
            border-radius: 50%;
            background: #fff;
            box-shadow: 0 0 20px #00f3ff, 0 0 40px #a855f7;
            animation: tunnelFlash 2s ease-out infinite;
            opacity: 0;
        }

        @keyframes tunnelFlash {
            0% { opacity: 0; transform: scale(0); }
            5% { opacity: 1; transform: scale(1); }
            15% { opacity: 0; transform: scale(3); }
            100% { opacity: 0; transform: scale(0); }
        }

        /* ── Footer astronaut cowboy gunslinger ── */
        .footer-cowboy-scene {
            position: relative;
            width: 100%;
            max-width: 340px;
            height: 210px;
            margin: 0 auto 2rem;
        }

        .astronaut-cowboy {
            width: 100%;
            height: 100%;
            overflow: visible;
        }

        .cowboy-hat {
            transform-origin: 100px 44px;
            animation: hatTip 4s ease-in-out infinite;
        }

        @keyframes hatTip {
            0%, 70%, 100% { transform: rotate(2deg); }
            75% { transform: rotate(-6deg) translateY(-2px); }
            85% { transform: rotate(5deg); }
        }

        .astronaut-body {
            animation: bodySway 4s ease-in-out infinite;
            transform-origin: 100px 130px;
        }

        @keyframes bodySway {
            0%, 100% { transform: rotate(0deg) scale(1); }
            50% { transform: rotate(-1deg) scale(1.02); }
        }

        .visor-glare {
            animation: visorPulse 4s ease-in-out infinite;
        }

        @keyframes visorPulse {
            0%, 100% { opacity: 0.85; }
            50% { opacity: 1; }
        }

        .gun-left, .gun-right {
            transform-origin: center;
        }

        .gun-left {
            animation: drawLeft 4s ease-in-out infinite;
            transform-origin: 55px 115px;
        }

        .gun-right {
            animation: drawRight 4s ease-in-out infinite;
            transform-origin: 145px 115px;
        }

        @keyframes drawLeft {
            0%, 12%, 88%, 100% { transform: rotate(95deg) translateY(22px); opacity: 0.7; }
            22% { transform: rotate(-50deg) translate(-14px, -34px); opacity: 1; }
            32%, 58% { transform: rotate(-68deg) translate(-20px, -50px); opacity: 1; }
            68% { transform: rotate(-35deg) translate(-8px, -28px); opacity: 1; }
            78% { transform: rotate(95deg) translateY(22px); opacity: 0.7; }
        }

        @keyframes drawRight {
            0%, 12%, 88%, 100% { transform: rotate(-95deg) translateY(22px); opacity: 0.7; }
            22% { transform: rotate(50deg) translate(14px, -34px); opacity: 1; }
            32%, 58% { transform: rotate(68deg) translate(20px, -50px); opacity: 1; }
            68% { transform: rotate(35deg) translate(8px, -28px); opacity: 1; }
            78% { transform: rotate(-95deg) translateY(22px); opacity: 0.7; }
        }

        .muzzle-flash-left, .muzzle-flash-right {
            opacity: 0;
            animation: muzzleFlash 4s ease-out infinite;
        }

        .muzzle-flash-right { animation-delay: 0.05s; }

        @keyframes muzzleFlash {
            0%, 38%, 100% { opacity: 0; transform: scale(0.5); }
            40% { opacity: 1; transform: scale(1.2); }
            42% { opacity: 0.8; transform: scale(1.5); }
            45% { opacity: 0; transform: scale(2); }
        }

        .dust-puff {
            opacity: 0;
            animation: dustPuff 4s ease-out infinite;
        }

        @keyframes dustPuff {
            0%, 43%, 100% { opacity: 0; transform: scale(0.3) translateY(0); }
            44% { opacity: 0.7; transform: scale(1) translateY(-5px); }
            55% { opacity: 0; transform: scale(1.5) translateY(-15px); }
        }

        .star-twinkle {
            animation: starTwinkle 2s ease-in-out infinite;
        }

        @keyframes starTwinkle {
            0%, 100% { opacity: 0.3; }
            50% { opacity: 1; }
        }

        .cowboy-caption {
            text-align: center;
            font-family: 'Space Grotesk', sans-serif;
            font-size: 10px;
            letter-spacing: 3px;
            color: rgba(0, 243, 255, 0.5);
            margin-top: -0.5rem;
            margin-bottom: 1.5rem;
        }

        @media (prefers-reduced-motion: reduce) {
            .entanglement-beam,
            .entanglement-spark,
            .entanglement-correlation,
            .entanglement-qubit,
            .redshift-trail,
            .probability-cloud,
            .quantum-orbit,
            .quantum-wave-path,
            .quantum-wavelet-wrap,
            .quantum-particle,
            .tunnel-flash,
            .superposition-title,
            .bloch-sphere,
            .bloch-ring,
            .bloch-vector,
            .quantum-grid,
            canvas {
                animation: none !important;
            }

            canvas {
                opacity: 0.35;
            }
        }