:root{--bg-navy:#0a0f1e;--bg-purple:#1a0533;--bg-teal:#021a12;--accent-teal:#00f5c4;--accent-violet:#c77dff;--accent-amber:#ffd166;--text-primary:#fff;--text-secondary:#fff9;--glass-bg:#ffffff0d;--glass-border:#ffffff1f;--glass-shadow:0 8px 32px #0006;--font-main:"Inter", sans-serif;--font-display:"Space Grotesk", sans-serif}*{box-sizing:border-box;-webkit-font-smoothing:antialiased;margin:0;padding:0}body{font-family:var(--font-main);background:var(--bg-navy);color:var(--text-primary);width:100vw;height:100vh;overflow:hidden}#app{background:linear-gradient(135deg, var(--bg-navy), var(--bg-purple), var(--bg-teal));background-size:400% 400%;width:100%;height:100%;animation:15s infinite gradientBG}@keyframes gradientBG{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.glass{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:16px}#custom-cursor{border:1px solid var(--accent-teal);pointer-events:none;z-index:99999;mix-blend-mode:difference;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;transition:transform .1s ease-out;display:flex;position:fixed;transform:translate(-50%,-50%)}.cursor-dot{background:var(--accent-teal);width:4px;height:4px;box-shadow:0 0 10px var(--accent-teal);border-radius:50%}.dashboard-container{cursor:none;flex-direction:column;gap:20px;height:100vh;padding:20px;display:flex}.navbar{flex-shrink:0;justify-content:space-between;align-items:center;width:100%;height:70px;padding:0 24px;display:flex}.main-layout{flex:1;gap:20px;min-height:0;display:flex}.sidebar-left{flex-direction:column;flex-shrink:0;gap:32px;width:280px;padding:24px;display:flex}.logo{font-family:var(--font-display);letter-spacing:-1px;font-size:2rem;font-weight:700}.gradient-text{background:linear-gradient(90deg, var(--accent-teal), var(--accent-violet));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.sidebar-section h3{text-transform:uppercase;letter-spacing:1px;color:var(--text-secondary);border-bottom:1px solid #ffffff1a;margin-bottom:16px;padding-bottom:8px;font-size:.8rem}.toggle-group{flex-direction:column;gap:16px;display:flex}.toggle-item{justify-content:space-between;align-items:center;font-size:.9rem;display:flex}.switch{width:44px;height:22px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#ffffff1a;transition:all .4s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;width:16px;height:16px;transition:all .4s;position:absolute;bottom:3px;left:3px}input:checked+.slider{background-color:var(--accent-teal);box-shadow:0 0 10px var(--accent-teal)}input:checked+.slider:before{transform:translate(22px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.glowing-range{-webkit-appearance:none;background:#ffffff1a;border-radius:2px;outline:none;width:100%;height:4px}.glowing-range::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent-teal);cursor:pointer;width:16px;height:16px;box-shadow:0 0 10px var(--accent-teal);border-radius:50%}.range-labels{color:var(--text-secondary);justify-content:space-between;margin-top:8px;font-size:.75rem;display:flex}.range-value{text-align:center;color:var(--accent-teal);margin-top:10px;font-weight:700}.center-content{flex-direction:column;flex:1;gap:20px;min-width:0;display:flex}.map-container{background:#050810;flex:1;position:relative;overflow:hidden}.map-grid{background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:40px 40px;position:absolute;inset:0}.heatmap-overlay{background:radial-gradient(circle at 40% 30%,#ffd16626 0%,#0000 40%),radial-gradient(circle at 65% 55%,#00f5c426 0%,#0000 40%),radial-gradient(circle at 15% 75%,#00f5c41a 0%,#0000 30%);position:absolute;inset:0}.hotspot{cursor:pointer;z-index:10;width:20px;height:20px;position:absolute}.hotspot-dot{z-index:2;background:#fff;border-radius:50%;width:8px;height:8px;position:absolute;top:6px;left:6px}.pulse-ring{opacity:0;border-radius:50%;width:40px;height:40px;animation:3s cubic-bezier(.215,.61,.355,1) infinite pulse;position:absolute;top:-10px;left:-10px}.pulse-ring:nth-child(2){animation-delay:1s}@keyframes pulse{0%{opacity:0;transform:scale(.1)}50%{opacity:.5}to{opacity:0;transform:scale(1.5)}}.hotspot.teal .pulse-ring{border:2px solid var(--accent-teal)}.hotspot.teal .hotspot-dot{background:var(--accent-teal);box-shadow:0 0 10px var(--accent-teal)}.hotspot.selected .hotspot-dot{background:#fff;transform:scale(1.5);box-shadow:0 0 20px #fff}.hotspot.selected .pulse-ring{opacity:.8;border-width:3px;animation:none;transform:scale(1.2)}.hotspot.amber .pulse-ring{border:2px solid var(--accent-amber)}.hotspot.amber .hotspot-dot{background:var(--accent-amber);box-shadow:0 0 10px var(--accent-amber)}#map-tooltip{pointer-events:none;z-index:100;min-width:180px;padding:12px 16px;position:absolute;transform:translate(-50%,-110%)}.hidden{display:none}#map-tooltip h4{font-family:var(--font-display);border-bottom:1px solid #ffffff1a;margin-bottom:8px;padding-bottom:4px}.tooltip-row{justify-content:space-between;margin-bottom:4px;font-size:.8rem;display:flex}.ticker-container{align-items:center;width:100%;height:40px;padding:0 20px;display:flex;overflow:hidden}.ticker-wrap{width:100%}.ticker-content{white-space:nowrap;animation:30s linear infinite ticker;display:inline-block}.ticker-item{margin-right:50px;font-size:.85rem;font-weight:500}@keyframes ticker{0%{transform:translate(100%)}to{transform:translate(-100%)}}.sidebar-right{flex-direction:column;flex-shrink:0;gap:20px;width:320px;padding:24px;display:flex}.card{background:#ffffff08;border:1px solid #ffffff1a;border-radius:16px;padding:20px}.levitate{animation:4s ease-in-out infinite levitate}@keyframes levitate{0%{transform:translateY(0)}50%{transform:translateY(-6px)}to{transform:translateY(0)}}.card h3{font-size:.9rem;font-family:var(--font-display);margin-bottom:20px}.velocity-container{justify-content:center;margin-bottom:24px;display:flex}.circular-progress{width:120px;height:120px;position:relative}.circular-progress svg{transform:rotate(-90deg)}.bg-ring{fill:none;stroke:#ffffff0d;stroke-width:8px}.progress-ring{fill:none;stroke:var(--accent-teal);stroke-width:8px;stroke-linecap:round;filter:drop-shadow(0 0 5px var(--accent-teal));transition:stroke-dashoffset 1s}.progress-text{flex-direction:column;align-items:center;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.progress-text .number{font-size:1.8rem;font-weight:700;font-family:var(--font-display)}.progress-text .label{text-transform:uppercase;color:var(--text-secondary);font-size:.6rem}#svg-radar{width:100%;height:180px;margin-top:10px}.comp-list{flex-direction:column;gap:16px;display:flex}.comp-item{justify-content:space-between;align-items:center;display:flex}.comp-info{flex-direction:column;display:flex}.comp-name{font-size:.85rem;font-weight:600}.comp-score{color:var(--text-secondary);font-size:.7rem}.sparkline{width:60px;height:20px}.sparkline.teal{color:var(--accent-teal)}.sparkline.violet{color:var(--accent-violet)}.sparkline.amber{color:var(--accent-amber)}.nav-metrics{gap:20px;display:flex}.metric-pill{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:40px;align-items:center;gap:10px;padding:8px 16px;font-size:.8rem;display:flex}.label{color:var(--text-secondary)}.value{font-weight:700}.teal-text{color:var(--accent-teal);text-shadow:0 0 10px var(--accent-teal)}.violet-text{color:var(--accent-violet);text-shadow:0 0 10px var(--accent-violet)}.amber-text{color:var(--accent-amber);text-shadow:0 0 10px var(--accent-amber)}.city-selector select{color:#fff;font-family:var(--font-display);background:0 0;border:none;outline:none;font-size:1.1rem;font-weight:700}.update-badge{color:var(--text-secondary);align-items:center;gap:6px;margin-top:4px;font-size:.75rem;display:flex}.dot.pulse{background:var(--accent-teal);border-radius:50%;width:6px;height:6px;animation:2s ease-in-out infinite glow}@keyframes glow{0%{box-shadow:0 0 #00f5c4b3}70%{box-shadow:0 0 0 6px #00f5c400}to{box-shadow:0 0 #00f5c400}}button,.hotspot,select,input{cursor:none;transition:all .3s}.modal-overlay{z-index:10000;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);background:#000000d9;justify-content:center;align-items:center;width:100vw;height:100vh;transition:opacity .5s;display:flex;position:fixed;top:0;left:0}.modal-content{text-align:center;border:1px solid #ffffff26;border-radius:32px;width:90%;max-width:550px;padding:50px}.modal-content h2{font-family:var(--font-display);margin-bottom:12px;font-size:2.8rem}.quick-guide{text-align:left;flex-direction:column;gap:25px;margin:40px 0;display:flex}.guide-item{align-items:flex-start;gap:20px;display:flex}.guide-item .icon{background:#ffffff1a;border-radius:12px;justify-content:center;align-items:center;min-width:50px;height:50px;font-size:1.6rem;display:flex}.guide-item strong{color:var(--accent-teal);margin-bottom:4px;font-size:1rem;display:block}.guide-item p{color:var(--text-secondary);font-size:.85rem;line-height:1.4}.btn-primary{background:var(--accent-teal);color:#000;font-size:1rem;font-weight:700;font-family:var(--font-display);cursor:pointer;border:none;border-radius:40px;padding:16px 40px;transition:all .3s;box-shadow:0 0 25px #00f5c466}.btn-primary:hover{transform:scale(1.05);box-shadow:0 0 35px #00f5c499}.glass-btn{color:#fff;background:#ffffff1a;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;margin-left:10px;font-size:1.2rem;font-weight:700;transition:all .3s;display:flex}.glass-btn:hover{background:var(--accent-teal);color:#000;box-shadow:0 0 15px var(--accent-teal)}.modal-hidden{opacity:0;pointer-events:none}.map-container:after{content:"Select a pulsing hotspot on the grid to analyze growth data";color:var(--accent-teal);opacity:.8;pointer-events:none;letter-spacing:1.5px;text-transform:uppercase;font-size:.8rem;font-family:var(--font-display);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#00000080;border:1px solid #00f5c433;border-radius:20px;padding:8px 16px;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}
