body{background-color:#050508;margin:0;padding:0;font-family:Manrope,sans-serif;overflow:hidden}#root{width:100vw;height:100vh}input[type=range]{-webkit-appearance:none;background:0 0;width:100%}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#fff;border-radius:50%;width:16px;height:16px;margin-top:-6px;box-shadow:0 0 10px #ffffff80}input[type=range]::-webkit-slider-runnable-track{cursor:pointer;background:#fff3;border-radius:2px;width:100%;height:4px}input[type=range]:focus{outline:none}.modal-overlay{-webkit-backdrop-filter:blur(8px);background:#000c;justify-content:center;align-items:center;animation:.3s ease-out fadeIn;display:flex;position:fixed;inset:0;z-index:999999!important}.modal-card{color:#fff;background:#111;border:1px solid #ffffff1a;border-radius:16px;width:90%;max-width:600px;padding:40px;animation:.4s cubic-bezier(.16,1,.3,1) slideUp;box-shadow:0 24px 48px #000c,inset 0 1px #ffffff0d}.brand-logo{align-items:center;gap:12px;font-family:Manrope,sans-serif;display:flex}.panel-header-wrapper{justify-content:space-between;align-items:flex-start;width:100%;margin-bottom:24px;display:flex}.logo-box{color:#111;background-color:#fff;justify-content:center;align-items:center;width:48px;height:48px;font-size:26px;font-weight:900;display:flex}.logo-text{color:#fff;letter-spacing:1px;font-size:32px;font-weight:800}.about-btn{color:#9ca3af;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:#ffffff0d;border:1px solid #ffffff26;border-radius:4px;padding:4px 10px;font-size:11px;transition:all .2s}.about-btn:hover{color:#fff;background:#ffffff1a}.hud-label{font-family:JetBrains Mono,monospace}.modal-description{color:#a0a0a0;margin-bottom:32px;font-size:15px;line-height:1.6}.btn-primary{cursor:pointer;text-transform:uppercase;letter-spacing:1px;border-radius:8px;padding:12px;font-size:.9rem;font-weight:600;transition:all .2s}.btn-primary.running{color:#94a3b8;background:#ffffff0d;border:1px solid #ffffff1a}.btn-primary.running:hover{color:#f8fafc;background:#ffffff1a}.btn-primary.stopped{color:#4ade80;background:linear-gradient(135deg,#4ade8033,#4ade800d);border:1px solid #4ade804d}.btn-primary.stopped:hover{background:linear-gradient(135deg,#4ade804d,#4ade801a)}.btn-secondary{text-transform:uppercase;letter-spacing:1px;border-radius:8px;padding:12px;font-size:.9rem;font-weight:500;transition:all .2s}.btn-secondary.active{color:#38bdf8;cursor:pointer;background:linear-gradient(135deg,#38bdf833,#38bdf80d);border:1px solid #38bdf84d;box-shadow:0 4px 12px #38bdf81a}.btn-secondary.active:hover{background:linear-gradient(135deg,#38bdf84d,#38bdf81a);box-shadow:0 4px 16px #38bdf833}.btn-secondary.disabled{color:#475569;cursor:not-allowed;background:#ffffff05;border:1px solid #ffffff0d}.btn-danger{color:#94a3b8;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:8px;padding:12px;font-size:.9rem;font-weight:500;transition:all .2s}.btn-danger:hover{color:#f8fafc;background:#ffffff1a}.modal-grid{grid-template-columns:1fr 1fr;gap:32px;margin-bottom:40px;display:grid}.modal-section h3{text-transform:uppercase;letter-spacing:2px;color:#4ade80;align-items:center;gap:8px;margin-top:0;margin-bottom:16px;font-family:JetBrains Mono,monospace;font-size:12px;display:flex}.modal-section h3:before{content:"";background:#4ade80;border-radius:50%;width:6px;height:6px;display:block;box-shadow:0 0 8px #4ade8099}.control-list,.feature-list{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.control-list li{color:#ccc;align-items:center;gap:8px;font-size:14px;display:flex}.control-list kbd{color:#fff;background:#ffffff1a;border:1px solid #fff3;border-radius:4px;padding:2px 6px;font-family:JetBrains Mono,monospace;font-size:12px;box-shadow:0 2px #00000080}.feature-list li{color:#a0a0a0;font-size:14px;line-height:1.5}.feature-list strong{color:#fff;font-weight:600}.get-started-btn{color:#050505;cursor:pointer;background:#4ade80;border:none;border-radius:8px;width:100%;padding:16px;font-family:Manrope,sans-serif;font-size:16px;font-weight:700;transition:all .2s;box-shadow:0 4px 12px #4ade804d}.get-started-btn:hover{background:#22c55e;transform:translateY(-2px);box-shadow:0 6px 16px #4ade8066}.get-started-btn:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}