@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";:root{--bg-deep:#0b0f19;--bg-surface:#0d1117;--bg-card:#111827;--bg-card-hover:#161f30;--bg-elevated:#1a2234;--bg-input:#ffffff0a;--accent-start:#00f2fe;--accent-end:#4facfe;--accent-mid:#2dd4ff;--accent-purple:#818cf8;--gradient-accent:linear-gradient(135deg, var(--accent-start), var(--accent-end));--gradient-accent-soft:linear-gradient(135deg, #00f2fe26, #4facfe26);--gradient-bg:linear-gradient(160deg, #0b0f19 0%, #0f1623 50%, #0b0f19 100%);--text-primary:#fff;--text-secondary:#9ca3af;--text-muted:#6b7280;--text-accent:var(--accent-start);--border-subtle:#ffffff0f;--border-default:#ffffff1a;--border-active:#00f2fe59;--border-accent-glow:#00f2fe33;--success:#10b981;--success-bg:#10b9811a;--warning:#f59e0b;--warning-bg:#f59e0b1a;--danger:#ef4444;--danger-bg:#ef44441a;--shadow-sm:0 1px 3px #0006;--shadow-md:0 4px 20px #00000080;--shadow-lg:0 8px 40px #0009;--shadow-accent:0 0 20px #00f2fe26, 0 0 40px #00f2fe14;--shadow-accent-hover:0 0 30px #00f2fe40, 0 0 60px #00f2fe1f;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-full:9999px;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s ease;--sidebar-width:240px;--sidebar-bg:#0a0e19f5;--player-height:72px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg-deep);color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;line-height:1.6;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background-image:linear-gradient(#ffffff04 1px,#0000 1px),linear-gradient(90deg,#ffffff04 1px,#0000 1px);background-size:40px 40px;position:fixed;inset:0}body:after{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#00f2fe0a 0%,#0000 70%);width:600px;height:600px;position:fixed;top:-200px;left:-200px}#root{z-index:1;position:relative}h1,h2,h3,h4,h5,h6{color:var(--text-primary);letter-spacing:-.02em;font-weight:600;line-height:1.3}h1{font-size:2rem;font-weight:800}h2{font-size:1.5rem;font-weight:700}h3{font-size:1.125rem;font-weight:600}p{color:var(--text-secondary)}a{color:var(--accent-mid);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--accent-start)}.text-gradient{background:var(--gradient-accent);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.glass-panel{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:border-color var(--transition-base), box-shadow var(--transition-base);padding:24px}.glass-panel:hover{border-color:var(--border-accent-glow);box-shadow:var(--shadow-accent)}.glass-panel-elevated{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:20px}.btn{border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);white-space:nowrap;-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-family:Inter,sans-serif;font-size:14px;font-weight:500;display:inline-flex;position:relative;overflow:hidden}.btn:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--gradient-accent);color:#0b0f19;font-weight:700;box-shadow:0 0 20px #00f2fe33}.btn-primary:before{content:"";opacity:0;transition:opacity var(--transition-fast);background:linear-gradient(135deg,#ffffff26,#0000);position:absolute;inset:0}.btn-primary:hover:before{opacity:1}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 0 30px #00f2fe66}.btn-primary:active{transform:translateY(0)}.btn-ghost{color:var(--text-secondary);border:1px solid var(--border-default);background:0 0}.btn-ghost:hover{background:var(--bg-elevated);border-color:var(--border-active);color:var(--text-primary)}.btn-outline{color:var(--accent-mid);border:1px solid var(--border-active);background:0 0}.btn-outline:hover{box-shadow:var(--shadow-accent);background:#00f2fe14}.btn-danger{background:var(--danger-bg);color:var(--danger);border:1px solid #ef444433}.btn-danger:hover{background:#ef444433}.btn-sm{border-radius:var(--radius-sm);padding:6px 12px;font-size:12px}.btn-icon{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--text-secondary);background:0 0;padding:8px}.btn-icon:hover{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-default)}.input{background:var(--bg-input);border:1px solid var(--border-default);width:100%;color:var(--text-primary);border-radius:var(--radius-md);transition:all var(--transition-base);outline:none;padding:10px 14px;font-family:Inter,sans-serif;font-size:14px}.input::placeholder{color:var(--text-muted)}.input:focus{border-color:var(--accent-start);background:#00f2fe0a;box-shadow:0 0 0 3px #00f2fe1a}.textarea{width:100%;color:var(--text-primary);resize:none;caret-color:var(--accent-start);background:0 0;border:none;outline:none;font-family:Inter,sans-serif;font-size:15px;line-height:1.7}.textarea::placeholder{color:var(--text-muted)}.slider{appearance:none;border-radius:var(--radius-full);background:var(--bg-elevated);cursor:pointer;outline:none;width:100%;height:4px;position:relative}.slider::-webkit-slider-thumb{appearance:none;background:var(--gradient-accent);cursor:pointer;width:16px;height:16px;transition:transform var(--transition-fast), box-shadow var(--transition-fast);border-radius:50%;box-shadow:0 0 8px #00f2fe80}.slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 0 14px #00f2feb3}.slider::-moz-range-thumb{background:var(--gradient-accent);cursor:pointer;border:none;border-radius:50%;width:16px;height:16px;box-shadow:0 0 8px #00f2fe80}.select{appearance:none;background:var(--bg-input);border:1px solid var(--border-default);width:100%;color:var(--text-primary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;outline:none;padding:10px 36px 10px 14px;font-family:Inter,sans-serif;font-size:14px}.select:focus{border-color:var(--accent-start);box-shadow:0 0 0 3px #00f2fe1a}.badge{border-radius:var(--radius-full);letter-spacing:.04em;text-transform:uppercase;align-items:center;gap:4px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-accent{color:var(--accent-start);background:#00f2fe1f;border:1px solid #00f2fe33}.badge-success{background:var(--success-bg);color:var(--success)}.badge-warning{background:var(--warning-bg);color:var(--warning)}.badge-danger{background:var(--danger-bg);color:var(--danger)}.divider{background:var(--border-subtle);border:none;height:1px;margin:16px 0}.nav-item{border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-base);-webkit-user-select:none;user-select:none;border:1px solid #0000;align-items:center;gap:10px;padding:10px 12px;font-size:13px;font-weight:500;text-decoration:none;display:flex}.nav-item:hover{background:var(--bg-elevated);color:var(--text-primary)}.nav-item.active{background:var(--gradient-accent-soft);color:var(--accent-start);border-color:var(--border-active)}.status-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.status-dot.online{background:var(--success);box-shadow:0 0 6px var(--success);animation:2s infinite pulse-dot}.status-dot.busy{background:var(--warning);box-shadow:0 0 6px var(--warning);animation:1s infinite pulse-dot}.status-dot.offline{background:var(--danger);box-shadow:0 0 6px var(--danger)}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.8)}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}@keyframes waveform{0%,to{scaleY:.3}50%{scaleY:1}}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes gradientShift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.wave-bar{border-radius:var(--radius-full);background:var(--gradient-accent);width:3px;animation:.8s ease-in-out infinite wave-dance;display:inline-block}.wave-bar:first-child{height:12px;animation-delay:0s}.wave-bar:nth-child(2){height:20px;animation-delay:.1s}.wave-bar:nth-child(3){height:16px;animation-delay:.2s}.wave-bar:nth-child(4){height:24px;animation-delay:.3s}.wave-bar:nth-child(5){height:14px;animation-delay:.15s}.wave-bar:nth-child(6){height:20px;animation-delay:.25s}.wave-bar:nth-child(7){height:12px;animation-delay:50ms}@keyframes wave-dance{0%,to{opacity:.6;transform:scaleY(.4)}50%{opacity:1;transform:scaleY(1)}}.skeleton{background:linear-gradient(90deg, var(--bg-elevated) 25%, var(--bg-card-hover) 50%, var(--bg-elevated) 75%);border-radius:var(--radius-sm);background-size:200% 100%;animation:1.5s infinite shimmer}.shake{animation:.4s shake}.fade-in{animation:.3s fadeIn}.spinner{border:2px solid #00f2fe33;border-top-color:var(--accent-start);border-radius:50%;width:20px;height:20px;animation:.7s linear infinite spin}.dropzone{border:2px dashed var(--border-default);border-radius:var(--radius-lg);text-align:center;cursor:pointer;transition:all var(--transition-base);background:var(--bg-input);padding:40px 24px;position:relative}.dropzone:hover,.dropzone.drag-over{border-color:var(--accent-start);background:#00f2fe0a;box-shadow:0 0 20px #00f2fe14}.dropzone.error{border-color:var(--danger);background:var(--danger-bg)}.progress-bar-track{background:var(--bg-elevated);border-radius:var(--radius-full);height:4px;overflow:hidden}.progress-bar-fill{background:var(--gradient-accent);border-radius:var(--radius-full);height:100%;transition:width .3s}.timeline-slider{appearance:none;border-radius:var(--radius-full);cursor:pointer;background:#ffffff26;outline:none;width:100%;height:3px}.timeline-slider::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;width:12px;height:12px;transition:transform var(--transition-fast);background:#fff;border-radius:50%}.timeline-slider::-webkit-slider-thumb:hover{transform:scale(1.3)}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--border-active)}.flex{display:flex}.flex-col{flex-direction:column}.flex-center{justify-content:center;align-items:center;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.items-center{align-items:center}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.w-full{width:100%}.flex-1{flex:1}.min-w-0{min-width:0}.text-xs{font-size:11px}.text-sm{font-size:12px}.text-base{font-size:14px}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.text-accent{color:var(--accent-start)}.text-danger{color:var(--danger)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mt-1{margin-top:4px}.mt-2{margin-top:8px}.mt-3{margin-top:12px}.mt-4{margin-top:16px}.mb-2{margin-bottom:8px}.mb-4{margin-bottom:16px}.p-3{padding:12px}.p-4{padding:16px}.rounded{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.overflow-hidden{overflow:hidden}.cursor-pointer{cursor:pointer}.overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#000000b3;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--bg-card);border:1px solid var(--border-default);border-radius:var(--radius-xl);width:400px;max-width:90vw;box-shadow:var(--shadow-lg);padding:28px;animation:.25s slideUp}.table{border-collapse:collapse;width:100%;font-size:13px}.table th{text-align:left;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--border-subtle);padding:10px 14px;font-size:11px;font-weight:500}.table td{border-bottom:1px solid var(--border-subtle);color:var(--text-secondary);vertical-align:middle;padding:12px 14px}.table tr:last-child td{border-bottom:none}.table tr:hover td{color:var(--text-primary);background:#ffffff05}.btn-neon{color:var(--text-secondary);border:1px solid var(--border-default);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);background:0 0;align-items:center;gap:8px;padding:10px 20px;font-family:Inter,sans-serif;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}.btn-neon:hover{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-active)}.btn-neon.active{background:var(--gradient-accent-soft);color:var(--accent-start);border-color:var(--border-active)}.btn-solid{background:var(--gradient-accent);color:#0b0f19;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);border:none;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-family:Inter,sans-serif;font-size:14px;font-weight:700;display:inline-flex}.btn-solid:hover{opacity:.9;box-shadow:var(--shadow-accent-hover)}.input-neon{background:var(--bg-input);border:1px solid var(--border-default);width:100%;color:var(--text-primary);border-radius:var(--radius-md);transition:all var(--transition-base);outline:none;padding:10px 14px;font-family:Inter,sans-serif;font-size:14px}.input-neon::placeholder{color:var(--text-muted)}.input-neon:focus{border-color:var(--accent-start);box-shadow:0 0 0 3px #00f2fe1a}.space-y-4>*+*{margin-top:16px}.space-y-6>*+*{margin-top:24px}.text-center{text-align:center}.typing-effect{background:var(--gradient-accent);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.1rem;font-weight:600}