:root{font-family:Helvetica Neue,Helvetica,Arial,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px)}html{height:-webkit-fill-available;background-color:#000;overflow-x:hidden}body{margin:0;padding:0;min-height:100dvh;overscroll-behavior-y:none;background-color:#000;transition:background-color .5s ease;overflow-x:hidden}#root{width:100%;height:100%;min-height:100dvh;margin:0;padding:0;overflow:hidden}body{transition:background-color .5s ease}.controls-panel{position:absolute;top:24px;right:24px;width:280px;display:flex;flex-direction:column;gap:20px;padding:24px;background:#0f172a99;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);border-radius:20px;box-shadow:0 4px 6px -1px #0003,0 20px 40px -5px #0000004d;z-index:100;transition:all .4s cubic-bezier(.4,0,.2,1);pointer-events:auto}.controls-section{display:flex;flex-direction:column;gap:10px}.section-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-secondary);margin-bottom:4px;padding-left:4px}.button-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.full-width{grid-column:span 2}.tech-btn{appearance:none;border:none;outline:none;background:#ffffff08;color:var(--text-primary);padding:12px;border-radius:10px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;border:1px solid rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;gap:8px;position:relative;overflow:hidden}.tech-btn:hover{background:#ffffff14;border-color:#fff3;transform:translateY(-1px)}.tech-btn:active{transform:translateY(0);background:#ffffff1f}.tech-btn.active{background:#3b82f626;border-color:var(--accent-blue);color:#fff;box-shadow:0 0 15px #3b82f633}.tech-btn.active:before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:var(--accent-blue)}.tech-btn.action:hover{border-color:var(--accent-blue);box-shadow:0 0 10px #3b82f61a}.tech-btn.stop{margin-top:10px;background:#ef44441a;border-color:#ef444433;color:var(--accent-red);font-weight:600}.tech-btn.stop:hover{background:#ef444433;border-color:var(--accent-red);box-shadow:0 0 20px #ef444426}.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.5}.active .status-dot{opacity:1;box-shadow:0 0 8px currentColor}@media(max-width:600px){.controls-panel{top:auto;bottom:24px;right:50%;transform:translate(50%);width:calc(100% - 48px);max-width:400px;padding-bottom:calc(24px + env(safe-area-inset-bottom))}.tech-btn{padding:14px;min-height:48px}.tech-btn.stop{position:sticky;bottom:0;margin-top:16px}}kbd{display:inline-block;padding:2px 6px;font-family:inherit;font-size:.7rem;font-weight:500;line-height:1;color:var(--text-secondary);background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:4px;margin-left:6px;vertical-align:middle}.tech-btn:hover kbd{color:var(--text-primary);border-color:#fff3}.tech-btn.stop kbd{color:#ef4444b3;border-color:#ef44444d}.tech-btn.stop:hover kbd{color:var(--accent-red);border-color:var(--accent-red)}.loading-screen{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at center,#1e293bcc,#0f172acc);z-index:1000;pointer-events:none}.loading-content{pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:24px;padding:40px;background:#0f172a99;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);border-radius:20px;box-shadow:0 20px 40px -5px #0000004d}.loading-spinner{width:60px;height:60px;border:3px solid rgba(255,255,255,.1);border-top-color:var(--accent-blue, #3b82f6);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-title{font-size:1.25rem;font-weight:600;color:var(--text-primary, #f8fafc);letter-spacing:-.02em}.loading-subtitle{font-size:.875rem;color:var(--text-secondary, #94a3b8);margin-top:-16px}.progress-bar{width:200px;height:4px;background:#ffffff1a;border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent-blue, #3b82f6),#60a5fa);border-radius:2px;transition:width .3s ease}