:root{--bg-color:#121212;--surface-color:#1e1e1e;--primary-color:#bb86fc;--secondary-color:#03dac6;--error-color:#cf6679;--text-primary:#fff;--text-secondary:#b0b0b0;--font-family:"Inter", sans-serif;--source-bg:#a00090;--controller-bg:#503080}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-family);flex-direction:column;align-items:center;min-height:100vh;margin:0;padding:0;display:flex}h1,h2,h3{color:var(--text-primary)}button{background-color:var(--primary-color);color:#000;cursor:pointer;border:none;border-radius:4px;margin:5px;padding:10px 20px;font-size:1rem;transition:background-color .2s}button.fabutton{color:gray;background-color:#0000;width:40px;height:40px;padding:5px}button:disabled{color:#a9a9a9;cursor:not-allowed;background-color:gray}button:hover{background-color:#9965f4}button.secondary{background-color:var(--secondary-color)}button.danger{background-color:var(--error-color);color:#fff}button.remove-worker{margin-left:20px;padding:6px 10px}input,select{background-color:var(--surface-color);color:var(--text-primary);border:1px solid #333;border-radius:4px;margin:5px;padding:8px;font-size:1rem}.card{background-color:var(--surface-color);border-radius:8px;margin-bottom:20px;padding:20px;box-shadow:0 4px 6px #0000004d}.worker-item{border-bottom:1px solid #333;justify-content:space-between;align-items:center;padding:10px;display:flex}.level-meter{background-color:#333;border-radius:5px;width:100px;height:10px;margin:0 10px;overflow:hidden}.level-bar{background-color:var(--secondary-color);width:0%;height:100%;transition:width .1s linear}.hidden{display:none!important}div.flex-center-all{width:100vw;height:100vh;flex-direction:column;justify-content:space-between;align-items:center;height:100dvh;display:flex}.worker{background-color:var(--source-bg)}.worker canvas{border:2px solid #000}.worker{color:#fff;text-align:center}.worker h1{font-size:3em}.worker p.status{color:gray;font-size:.8em}.worker img.icon-1,.worker #upload-indicator{width:200px;height:auto}.worker a{margin-bottom:25px}.worker #audio-input-container,.worker #level-container{flex-direction:column;justify-content:center;align-items:center;margin:10px 0;display:flex}.blink_me{animation:1s linear infinite blinker}@keyframes blinker{50%{opacity:0}}.tip{text-align:left;width:100%;font-size:.8em}.tip span.example{color:var(--secondary-color);font-style:italic;font-weight:700}.tip li{color:var(--primary-color);margin-right:6pt}.tutorial-container{display:inline-block;position:relative}.tutorial-bubble{background:var(--primary-color);color:#fff;z-index:1000;text-align:center;border-radius:12px;width:250px;padding:15px;font-size:.9em;animation:.3s ease-out fadeIn;position:absolute;top:120%;left:50%;transform:translate(-50%);box-shadow:0 4px 15px #0000004d}.tutorial-bubble:after{content:"";border-style:solid;border-width:10px;border-color:transparent transparent var(--primary-color) transparent;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.tutorial-bubble h4{margin:0 0 8px;font-size:1.1em}.tutorial-bubble p{color:#ffffffe6;margin:0 0 12px;line-height:1.4}.tutorial-bubble .btn-got-it{color:var(--primary-color);cursor:pointer;background:#fff;border:none;border-radius:20px;padding:5px 15px;font-size:.8em;font-weight:700;transition:transform .2s}.tutorial-bubble .btn-got-it:hover{transform:scale(1.05)}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}