*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background-color:#0a1628;color:#e0e0e0;min-height:100vh;overflow:hidden}#root{width:100vw;height:100vh;display:flex;flex-direction:column}.app-container{display:flex;flex-direction:column;height:100vh;width:100vw}.header{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;background:linear-gradient(180deg,#1a2744,#0f1d32);border-bottom:1px solid #2a3f5f}.header h1{font-size:1.5rem;font-weight:600;color:#4ade80;letter-spacing:1px}.stats{display:flex;gap:24px}.stat{display:flex;flex-direction:column;align-items:center}.stat-value{font-size:1.25rem;font-weight:700;color:#60a5fa}.stat-value.danger{color:#f87171}.stat-value.success{color:#4ade80}.stat-label{font-size:.75rem;color:#94a3b8;text-transform:uppercase;letter-spacing:.5px}.main-content{flex:1;display:flex;overflow:hidden}.canvas-container{flex:1;position:relative;background:radial-gradient(ellipse at center,#0f1d32,#0a1628)}.canvas-container canvas{width:100%;height:100%}.sidebar{width:320px;background:#0f1d32;border-left:1px solid #2a3f5f;display:flex;flex-direction:column;overflow-y:auto}.sidebar-section{padding:16px;border-bottom:1px solid #2a3f5f}.sidebar-section:has(.plane-list),.sidebar-section:has(.ai-log){flex:1;min-height:0;display:flex;flex-direction:column}.sidebar-section h3{font-size:.875rem;font-weight:600;color:#94a3b8;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}.controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.ai-status{font-size:.875rem;color:#fbbf24;padding:8px 12px}.btn{padding:8px 16px;border:none;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background:#3b82f6;color:#fff}.btn-primary:hover{background:#2563eb}.btn-danger{background:#ef4444;color:#fff}.btn-danger:hover{background:#dc2626}.btn-secondary{background:#374151;color:#e5e7eb}.btn-secondary:hover{background:#4b5563}.plane-list{flex:1;min-height:0;overflow-y:auto}.plane-item{background:#1a2744;border-radius:8px;padding:12px;margin-bottom:8px;border-left:3px solid}.plane-item.flying{border-left-color:#60a5fa}.plane-item.approaching{border-left-color:#fbbf24}.plane-item.landed{border-left-color:#4ade80}.plane-item.crashed{border-left-color:#ef4444}.plane-callsign{font-weight:600;font-size:.875rem;color:#e5e7eb}.plane-info{display:flex;gap:16px;margin-top:4px;font-size:.75rem;color:#94a3b8}.ai-log{flex:1;min-height:0;overflow-y:auto;background:#0a1628}.ai-log-entry{font-size:.75rem;color:#64748b;margin-bottom:8px;padding:8px;background:#1a2744;border-radius:4px}.ai-log-entry .timestamp{color:#4ade80;margin-right:8px}.api-key-input{width:100%;padding:8px 12px;background:#1a2744;border:1px solid #2a3f5f;border-radius:6px;color:#e5e7eb;font-size:.875rem;margin-bottom:8px}.api-key-input:focus{outline:none;border-color:#3b82f6}.api-key-input::placeholder{color:#64748b}.status-indicator{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:8px}.status-indicator.connected{background:#4ade80;box-shadow:0 0 8px #4ade80}.status-indicator.disconnected{background:#f87171}.info-icon-wrapper{position:relative;display:inline-flex;align-items:center;margin-left:6px;cursor:help}.info-icon{color:#64748b;transition:color .2s}.info-icon-wrapper:hover .info-icon{color:#94a3b8}.info-tooltip{position:fixed;right:16px;width:280px;background:#1a2744;border:1px solid #2a3f5f;border-radius:6px;padding:8px 12px;font-size:.75rem;font-weight:400;color:#e5e7eb;text-transform:none;letter-spacing:normal;line-height:1.4;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;z-index:1000;box-shadow:0 4px 12px #0000004d;margin-top:8px}.info-icon-wrapper:hover .info-tooltip{opacity:1;visibility:visible}.sidebar-section h3{display:flex;align-items:center;justify-content:space-between}.settings-toggle{background:none;border:none;color:#64748b;cursor:pointer;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:all .2s}.settings-toggle:hover{background:#1a2744;color:#94a3b8}.settings-toggle svg{transition:transform .3s ease}.settings-toggle .settings-icon-active{transform:rotate(90deg);color:#3b82f6}.settings-panel{max-height:0;overflow:hidden;transition:max-height .3s ease-out;background:#0a1628;border-bottom:1px solid transparent}.settings-panel.open{max-height:300px;overflow-y:auto;border-bottom-color:#2a3f5f}.settings-content{padding:12px 16px}.setting-item{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.setting-item:last-child{margin-bottom:0}.setting-item label{font-size:.75rem;color:#94a3b8}.setting-item input[type=number]{width:80px;padding:6px 8px;background:#1a2744;border:1px solid #2a3f5f;border-radius:4px;color:#e5e7eb;font-size:.75rem;text-align:right}.setting-item input[type=number]:focus{outline:none;border-color:#3b82f6}.range-input{display:flex;align-items:center;gap:8px}.range-input input[type=range]{width:80px;height:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#2a3f5f;border-radius:2px;cursor:pointer}.range-input input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;background:#3b82f6;border-radius:50%;cursor:pointer}.range-input input[type=range]::-moz-range-thumb{width:12px;height:12px;background:#3b82f6;border-radius:50%;cursor:pointer;border:none}.range-input span{font-size:.75rem;color:#60a5fa;min-width:32px;text-align:right}.toggle-btn{padding:4px 12px;border:1px solid #2a3f5f;border-radius:4px;background:#1a2744;color:#64748b;font-size:.75rem;cursor:pointer;transition:all .2s}.toggle-btn:hover{border-color:#3b82f6}.toggle-btn.active{background:#3b82f6;border-color:#3b82f6;color:#fff}