*{margin:0;padding:0;box-sizing:border-box}.skip-nav{position:absolute;top:-100%;left:50%;transform:translate(-50%);padding:12px 24px;background:var(--neon-cyan, #05d9e8);color:#0d0221;font-weight:700;font-size:14px;z-index:10000;border-radius:0 0 8px 8px;text-decoration:none;transition:top .2s ease}.skip-nav:focus{top:0}:root{--neon-pink: #ff2a6d;--neon-cyan: #05d9e8;--neon-purple: #d300c5;--neon-blue: #7700ff;--neon-orange: #ff6b35;--dark-bg: #0d0221;--grid-color: rgba(255, 42, 109, .3);--sun-yellow: #ffcc00;--sun-orange: #ff6600;--font-display: "Orbitron", monospace;--font-body: "Rajdhani", sans-serif}html,body,#root{width:100%;height:100%;background:var(--dark-bg);font-family:var(--font-body);color:#fff}body.desktop-mode,body.desktop-mode #root{overflow:hidden}body.mobile-mode{overflow-y:auto;-webkit-overflow-scrolling:touch}.skyline-backdrop{position:fixed;bottom:0;left:0;width:100vw;height:50vh;background:url(/toronto-skyline.webp) center bottom / cover no-repeat;z-index:0;opacity:.6;pointer-events:none}.canvas-container{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:1}.ui-overlay{position:fixed;z-index:100;pointer-events:none}.ui-overlay>*{pointer-events:auto}.title-container{position:fixed;top:30px;left:30px;z-index:100}.site-logo{height:200px;width:auto;filter:invert(1) brightness(1.5) drop-shadow(0 0 18px rgba(5,217,232,.7));animation:glow-pulse 2s ease-in-out infinite alternate}.title{font-family:var(--font-display);font-size:2.5rem;font-weight:900;letter-spacing:.15em;text-transform:uppercase;color:var(--neon-cyan);text-shadow:0 0 10px rgba(5,217,232,.8),0 0 40px rgba(5,217,232,.4);animation:glow-pulse 2s ease-in-out infinite alternate}.subtitle{font-family:var(--font-body);font-size:.875rem;font-weight:300;letter-spacing:.3em;color:var(--neon-pink);opacity:.9;margin-top:5px;text-shadow:0 0 8px rgba(255,42,109,.6)}@keyframes glow-pulse{0%{filter:drop-shadow(0 0 10px rgba(5,217,232,.5))}to{filter:drop-shadow(0 0 20px rgba(255,42,109,.8))}}.controls-hint{position:fixed;bottom:30px;left:50%;transform:translate(-50%);z-index:100;text-align:center}.controls-hint p{font-family:var(--font-display);font-size:.75rem;letter-spacing:.2em;color:var(--neon-cyan);opacity:.6;animation:fade-pulse 3s ease-in-out infinite}@keyframes fade-pulse{0%,to{opacity:.3}50%{opacity:.8}}.speed-indicator{position:fixed;bottom:30px;right:30px;z-index:100;text-align:right}.speed-label{font-family:var(--font-body);font-size:.625rem;letter-spacing:.2em;color:var(--neon-pink);opacity:.6}.speed-value{font-family:var(--font-display);font-size:2rem;font-weight:700;color:var(--neon-pink);text-shadow:0 0 20px rgba(255,42,109,.8)}.loading-screen{position:fixed;top:0;left:0;width:100vw;height:100vh;background:var(--dark-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000}.loading-text{font-family:var(--font-display);font-size:1.5rem;letter-spacing:.3em;color:var(--neon-cyan);animation:loading-blink 1.5s ease-in-out infinite}@keyframes loading-blink{0%,to{opacity:1}50%{opacity:.3}}.loading-bar{width:200px;height:3px;background:#ffffff1a;margin-top:20px;border-radius:2px;overflow:hidden}.loading-progress{height:100%;background:var(--neon-cyan);animation:loading-slide 1.5s ease-in-out infinite}@keyframes loading-slide{0%{width:0;transform:translate(0)}50%{width:100%;transform:translate(0)}to{width:100%;transform:translate(200px)}}.project-info{position:fixed;bottom:100px;left:30px;z-index:100;max-width:350px;padding:20px;background:#0d0221d9;border:1px solid rgba(5,217,232,.3);border-radius:4px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transform:translate(-120%);transition:transform .4s cubic-bezier(.4,0,.2,1)}.project-info.visible{transform:translate(0)}.project-info h3{font-family:var(--font-display);font-size:1rem;letter-spacing:.1em;color:var(--neon-cyan);margin-bottom:10px}.project-info p{font-family:var(--font-body);font-size:.875rem;line-height:1.6;color:#fffc;margin-bottom:15px}.project-link{display:inline-block;font-family:var(--font-display);font-size:.75rem;letter-spacing:.1em;color:var(--neon-pink);text-decoration:none;padding:8px 16px;border:1px solid var(--neon-pink);transition:all .3s ease}.project-link:hover{background:var(--neon-pink);color:var(--dark-bg);box-shadow:0 0 20px #ff2a6d80}.audio-prompt{position:fixed;bottom:100px;left:50%;transform:translate(-50%);padding:15px 30px;background:#05d9e833;border:2px solid var(--neon-cyan);border-radius:4px;cursor:pointer;color:var(--neon-cyan);font-family:var(--font-display);font-size:14px;text-transform:uppercase;letter-spacing:2px;animation:pulse 2s infinite;z-index:1000;box-shadow:0 0 20px #05d9e84d;-webkit-appearance:none;-moz-appearance:none;appearance:none}.audio-toggle{position:fixed;bottom:30px;right:30px;padding:8px 16px;background:#0d0221cc;border:1px solid var(--neon-cyan);border-radius:4px;color:var(--neon-cyan);font-family:var(--font-display);font-size:12px;text-transform:uppercase;letter-spacing:1px;z-index:1000;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:background .2s ease,box-shadow .2s ease,border-color .2s ease,color .2s ease}.audio-toggle.off{border-color:var(--neon-pink);color:var(--neon-pink)}.audio-toggle:hover,.audio-prompt:hover{background:#05d9e84d}.audio-toggle.off:hover{background:#ff2a6d33}.audio-toggle:focus-visible,.audio-prompt:focus-visible{outline:2px solid var(--neon-cyan);outline-offset:2px}@keyframes pulse{0%,to{transform:translate(-50%) scale(1);box-shadow:0 0 20px #05d9e84d}50%{transform:translate(-50%) scale(1.05);box-shadow:0 0 30px #05d9e899}}.video-overlay{position:fixed;top:120px;left:30px;z-index:200;opacity:0;transform:translate(-20px);transition:opacity .4s ease,transform .4s ease;pointer-events:none}.video-overlay.visible{opacity:1;transform:translate(0);pointer-events:auto}.video-frame{width:400px;background:#0d0221f2;border:2px solid var(--neon-cyan);border-radius:8px;padding:15px;box-shadow:0 0 30px #05d9e84d,inset 0 0 60px #05d9e80d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.video-title{font-family:var(--font-display);font-size:1rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:10px;text-shadow:0 0 10px currentColor;display:flex;align-items:center;justify-content:space-between;gap:.5rem}.theater-mode-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;background:#00000080;border:1px solid;border-radius:4px;color:inherit;cursor:pointer;transition:all .2s ease;flex-shrink:0}.theater-mode-btn:hover{background:#ffffff1a;transform:scale(1.1)}.theater-mode-btn svg{width:14px;height:14px}.video-container{position:relative;width:100%;aspect-ratio:16 / 9;background:#000;border-radius:4px;overflow:hidden}.video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%}.crt-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(#12101000 50%,#00000026 50%),linear-gradient(90deg,#ff000008,#00ff0003,#0000ff08);background-size:100% 3px,3px 100%;pointer-events:none;z-index:10}.video-description{font-family:var(--font-body);font-size:.875rem;color:#ffffffb3;margin-top:10px;letter-spacing:.05em}.lane-indicator{position:fixed;bottom:80px;left:50%;transform:translate(-50%);z-index:100;display:flex;align-items:center;gap:0;background:#0d0221e6;border:1px solid rgba(5,217,232,.3);border-radius:30px;padding:8px 12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 30px #05d9e826}.lane-btn{display:flex;align-items:center;gap:8px;padding:8px 16px;background:transparent;border:none;color:#ffffff80;font-family:var(--font-display);font-size:.7rem;letter-spacing:.1em;cursor:pointer;transition:all .3s ease;border-radius:20px}.lane-btn:hover{color:#fffc}.lane-btn.active{background:#05d9e833;color:var(--neon-cyan);box-shadow:0 0 15px #05d9e84d}.lane-btn.active .lane-icon{color:var(--neon-pink);text-shadow:0 0 10px var(--neon-pink)}.lane-icon{font-size:1rem;transition:all .3s ease}.lane-label{font-weight:600}.lane-hint{font-size:.9rem;opacity:.6;font-weight:700}.lane-divider{color:#fff3;font-size:1.2rem;margin:0 4px}.lane-hint-text{font-size:.65rem!important;opacity:.4!important;margin-top:5px}.vehicle-selector{position:fixed;top:30px;right:30px;z-index:100;display:flex;gap:8px;background:#0d0221e6;border:1px solid rgba(5,217,232,.3);border-radius:25px;padding:6px 10px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.vehicle-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 12px;background:transparent;border:none;color:#ffffff80;font-family:var(--font-display);cursor:pointer;transition:all .3s ease;border-radius:15px}.vehicle-btn:hover{color:#fffc;background:#05d9e81a}.vehicle-btn.active{background:#05d9e833;color:var(--neon-cyan);box-shadow:0 0 15px #05d9e84d}.vehicle-icon{font-size:1.2rem}.vehicle-label{font-size:.55rem;letter-spacing:.1em;font-weight:600}@media(max-width:768px){.video-overlay{top:auto;bottom:180px;left:50%;transform:translate(-50%) translateY(20px)}.video-overlay.visible{transform:translate(-50%) translateY(0)}.video-frame{width:320px}.site-logo{height:100px}.title{font-size:1.5rem}.lane-indicator{bottom:120px;padding:6px 10px}.lane-btn{padding:6px 10px;font-size:.6rem}.lane-icon{font-size:.8rem}.lane-hint{display:none}}.search-bar-container{position:fixed;top:30px;left:50%;transform:translate(-50%);z-index:200}.search-trigger,.search-active-filter{padding:8px 18px;background:#0d0221e6;border:1px solid var(--neon-cyan);border-radius:20px;color:var(--neon-cyan);font-family:var(--font-display);font-size:.7rem;letter-spacing:.1em;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.search-trigger:hover{background:#05d9e826;box-shadow:0 0 15px #05d9e84d}.search-active-filter{border-color:var(--neon-pink);color:var(--neon-pink);box-shadow:0 0 12px #ff2a6d4d}.search-active-filter:hover{background:#ff2a6d26}.search-dropdown{position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%);width:260px;background:#0d0221f2;border:1px solid var(--neon-cyan);border-radius:12px;overflow:hidden;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);box-shadow:0 8px 32px #05d9e833}.search-input{width:100%;padding:10px 14px;background:#0000004d;border:none;border-bottom:1px solid rgba(5,217,232,.2);color:#fff;font-family:var(--font-body);font-size:.9rem;outline:none}.search-input::placeholder{color:#ffffff4d}.search-results{max-height:240px;overflow-y:auto}.search-result-item{display:flex;justify-content:space-between;align-items:center;width:100%;padding:8px 14px;background:none;border:none;color:#fffc;font-family:var(--font-body);font-size:.85rem;cursor:pointer;transition:background .2s;text-align:left}.search-result-item:hover{background:#05d9e826;color:var(--neon-cyan)}.search-result-count{font-size:.7rem;color:#fff6;font-family:var(--font-display)}.artist-spotlight{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid rgba(5,217,232,.15)}.spotlight-artist{font-family:var(--font-display);font-size:.7rem;color:var(--neon-cyan);letter-spacing:.08em}.spotlight-stat{font-family:var(--font-body);font-size:.7rem;color:#ffffff80;padding:1px 6px;background:#05d9e814;border-radius:8px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}