*{margin:0;padding:0;box-sizing:border-box}:root{--bg-dark: #0a0a1a;--bg-card: #141428;--bg-card-hover: #1a1a35;--border: #2a2a4a;--border-light: #3a3a5a;--text-primary: #e0e0f0;--text-secondary: #8888aa;--text-dim: #555577;--accent-green: #00ff88;--accent-cyan: #00ccff;--accent-yellow: #ffdd44;--accent-red: #ff4466;--accent-purple: #aa88ff;--sky-purple: #7b6ba1;--sky-light: #d8cee8}body{font-family:"Press Start 2P",monospace;background:var(--bg-dark);color:var(--text-primary);min-height:100vh;overflow-x:hidden}.app{max-width:900px;margin:0 auto;min-height:100vh}.app-content{padding:0 16px 32px}.pixel-scene{position:relative;width:100%;overflow:hidden;border-bottom:4px solid var(--border)}.pixel-canvas{width:100%;height:120px;display:block}.scene-overlay{position:absolute;bottom:8px;right:12px;display:flex;align-items:baseline;gap:6px;background:#0a0a1ab3;padding:4px 8px;border:2px solid var(--border)}.scene-count{font-size:16px;color:var(--accent-green)}.scene-label{font-size:6px;color:var(--text-secondary);letter-spacing:1px}.header{padding:16px 0 8px;border-bottom:2px solid var(--border);margin-bottom:12px}.header-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.header-title{display:flex;align-items:center;gap:10px}.pixel-plane{font-size:20px;animation:bob 2s ease-in-out infinite}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.header-title h1{font-size:12px;letter-spacing:2px;background:linear-gradient(180deg,var(--accent-cyan),var(--accent-purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.refresh-btn{font-family:"Press Start 2P",monospace;font-size:16px;background:var(--bg-card);color:var(--accent-green);border:2px solid var(--border);padding:6px 10px;cursor:pointer;transition:all .1s}.refresh-btn:hover{background:var(--bg-card-hover);border-color:var(--accent-green)}.refresh-btn:active{transform:scale(.95)}.header-info{display:flex;align-items:center;gap:8px;font-size:7px;color:var(--text-secondary);flex-wrap:wrap}.separator{color:var(--border-light)}.location{color:var(--accent-yellow)}.flight-count{color:var(--accent-green)}.scanline{height:2px;background:linear-gradient(90deg,transparent,var(--accent-green),transparent);margin-top:8px;opacity:.3;animation:scanline-pulse 3s ease-in-out infinite}@keyframes scanline-pulse{0%,to{opacity:.1}50%{opacity:.4}}.controls{display:flex;justify-content:space-between;align-items:center;padding:8px 0;margin-bottom:12px}.toggle-group{display:flex;gap:8px}.toggle-btn{font-family:"Press Start 2P",monospace;font-size:8px;background:var(--bg-card);color:var(--text-secondary);border:2px solid var(--border);padding:6px 12px;cursor:pointer;transition:all .1s}.toggle-btn.active{color:var(--accent-green);border-color:var(--accent-green);box-shadow:0 0 8px #0f83}.toggle-btn:hover{border-color:var(--border-light)}.legend{display:flex;gap:12px;font-size:7px}.legend-item{display:flex;align-items:center;gap:4px}.legend-item.climbing{color:var(--accent-green)}.legend-item.cruising{color:var(--accent-cyan)}.legend-item.descending{color:var(--accent-yellow)}.flight-map-container{margin-bottom:16px;border:2px solid var(--border);background:#1a1a2e;overflow:hidden;border-radius:2px}.flight-map-canvas{width:100%;height:360px;display:block}.map-info-bar{display:flex;gap:16px;padding:8px 12px;font-family:-apple-system,BlinkMacSystemFont,SF Mono,Menlo,monospace;font-size:10px;color:#ffffff80;border-top:1px solid var(--border);background:#0000004d}.map-info-item{display:flex;align-items:center;gap:5px}.radar-container{display:flex;flex-direction:column;align-items:center;margin-bottom:16px;padding:12px;background:var(--bg-card);border:2px solid var(--border)}.radar-svg{border:2px solid #1a3a1a}.radar-label{font-size:6px;color:#1a5a1a;margin-top:6px;letter-spacing:2px}.flight-section{margin-bottom:20px}.section-title{font-size:9px;color:var(--text-secondary);padding:8px 0;border-bottom:1px solid var(--border);margin-bottom:12px;letter-spacing:2px}.flight-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:12px}.flight-card{border:2px solid var(--border);padding:12px;position:relative;transition:all .15s;image-rendering:pixelated;cursor:pointer}.flight-card:hover{border-color:var(--border-light);transform:translateY(-1px);filter:brightness(1.1)}.flight-card-selected{box-shadow:0 0 12px #ffffff1a;transform:translateY(-1px)}.flight-card-header{display:flex;align-items:center;gap:10px;margin-bottom:8px}.flight-id{flex:1;display:flex;flex-direction:column;gap:3px}.flight-callsign{font-size:11px;color:var(--text-primary);letter-spacing:1px}.flight-airline{font-size:6px;color:var(--text-secondary);letter-spacing:1px}.flight-status{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 8px;border:1px solid var(--border);background:#0003}.flight-status.climbing{color:var(--accent-green);border-color:#00ff884d}.flight-status.cruising{color:var(--accent-cyan);border-color:#00ccff4d}.flight-status.descending{color:var(--accent-yellow);border-color:#ffdd444d}.status-icon{font-size:12px}.status-label{font-size:5px;letter-spacing:1px}.flight-plane-display{display:flex;justify-content:center;padding:6px 0;margin-bottom:8px;background:#00000026;border:1px solid rgba(255,255,255,.04);overflow:hidden}.airline-logo{flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:6px;overflow:hidden;background:#ffffff0f;padding:2px}.airline-logo img{display:block;border-radius:4px}.airline-badge{flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:6px;font-family:"Press Start 2P",monospace;font-size:9px;font-weight:700;letter-spacing:1px}.flight-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:8px;background:#0003;border:1px solid rgba(255,255,255,.04)}.stat{display:flex;flex-direction:column;align-items:center;gap:3px}.stat-label{font-size:5px;color:var(--text-dim);letter-spacing:2px}.stat-value{font-size:8px;color:var(--accent-cyan)}.flight-footer{display:flex;justify-content:space-between;margin-top:8px;font-size:6px;color:var(--text-dim)}.ground-badge{position:absolute;top:8px;right:8px;font-size:5px;padding:2px 6px;background:#f463;color:var(--accent-red);border:1px solid var(--accent-red);letter-spacing:1px}.loading{display:flex;flex-direction:column;align-items:center;padding:48px 0;gap:16px}.loading-plane{font-size:32px;animation:fly 2s ease-in-out infinite}@keyframes fly{0%,to{transform:translate(-10px) rotate(-5deg)}50%{transform:translate(10px) rotate(5deg)}}.loading p{font-size:8px;color:var(--text-secondary);letter-spacing:3px;animation:blink 1s step-end infinite}@keyframes blink{50%{opacity:0}}.error-box{text-align:center;padding:32px;border:2px solid var(--accent-red);background:#ff44660d}.error-box p{font-size:8px;color:var(--accent-red);margin-bottom:12px}.empty-state{text-align:center;padding:48px 0}.empty-state p{font-size:10px;color:var(--text-secondary)}.empty-state .sub{font-size:7px;color:var(--text-dim);margin-top:8px}.footer{margin-top:24px;padding:12px 0;border-top:1px solid var(--border);text-align:center}.footer p{font-size:5px;color:var(--text-dim);letter-spacing:2px}.app:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(0deg,rgba(0,0,0,.03) 0px,rgba(0,0,0,.03) 1px,transparent 1px,transparent 2px);pointer-events:none;z-index:9999}@media(max-width:600px){.header-title h1{font-size:9px}.flight-grid{grid-template-columns:1fr}.flight-stats{grid-template-columns:repeat(2,1fr)}.header-info{font-size:6px}.legend{display:none}.flight-map-canvas{height:260px}}