:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;font-weight:400;color:#f5f6ff;background-color:#0b0e1c}body{margin:0;min-height:100vh;background:radial-gradient(circle at 20% 20%,rgba(92,110,255,.18),transparent 55%),radial-gradient(circle at 80% 0%,rgba(33,211,255,.2),transparent 45%),linear-gradient(160deg,#050608,#0d1021 55%,#101226);color:inherit}#root{width:100%;min-height:100vh;margin:0 auto;padding:clamp(1.5rem,5vw,3.5rem) clamp(1rem,5vw,3rem);box-sizing:border-box;display:flex;justify-content:center;align-items:flex-start}.app-container{width:min(100%,760px);margin:0 auto;display:flex;flex-direction:column;gap:clamp(1rem,2vw,1.5rem);padding:clamp(1.25rem,3vw,2.25rem);border-radius:22px;background:#0b0e1edb;border:1px solid rgba(255,255,255,.06);box-shadow:0 30px 80px #080b1c73;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);color:#f5f6ff}h1,h2,h3{font-weight:600;margin:0;color:inherit}.app-container h1{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.15}p{margin:0;color:#e6eaffbf}.setup-form{display:flex;flex-direction:column;gap:1rem;text-align:left}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-size:.85rem;font-weight:600;letter-spacing:.02em;color:#e6eaffbf;text-transform:uppercase}input[type=text],input[type=file]{padding:.85rem 1rem;border-radius:12px;border:1px solid rgba(120,132,255,.25);background:#0e1326bf;color:#f5f6ff;font-size:1rem;transition:border-color .2s ease,box-shadow .2s ease}input[type=text]:focus,input[type=file]:focus{outline:none;border-color:#7884ff99;box-shadow:0 0 0 4px #7884ff1f}input[type=file]::file-selector-button{margin-right:.75rem;padding:.5rem .9rem;border-radius:10px;border:none;background:#7884ff29;color:#cdd2ff;cursor:pointer;transition:background .2s ease,color .2s ease}input[type=file]::file-selector-button:hover{background:#7884ff42;color:#fff}button{padding:.85rem 1.2rem;border-radius:12px;border:none;font-size:1rem;font-weight:600;letter-spacing:.01em;background:linear-gradient(130deg,#6b74ff,#7d61ff);color:#fff;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,opacity .2s ease;box-shadow:0 16px 30px #6b74ff52}button:hover{transform:translateY(-1px);box-shadow:0 20px 50px #6b74ff61}button:active{transform:translateY(0);box-shadow:0 10px 24px #6b74ff40}button:disabled{background:#7882a066;box-shadow:none;cursor:not-allowed;opacity:.65}.big-start-btn{font-size:clamp(1.25rem,3.6vw,1.65rem);padding:clamp(1rem,3vw,1.5rem);border-radius:16px}.btn-secondary{background:#7481ff29;box-shadow:none;color:#e3e6ff;border:1px solid rgba(124,136,255,.35)}.btn-secondary:hover{background:#7481ff3d;box-shadow:0 12px 30px #6b74ff40}.btn-ghost{background:#0000001f;box-shadow:none;border:1px solid rgba(200,206,255,.18);color:#e4e7ffd9}.btn-ghost:hover{background:#c8ceff1f;box-shadow:0 12px 26px #575fb43d}.btn-ghost--danger{border-color:#ff697859;color:#ff9fae}.btn-ghost--danger:hover{background:#ff697824;color:#ff8297;box-shadow:0 12px 28px #ff697840}.stage-container{gap:clamp(1.1rem,2.6vw,1.8rem);padding:clamp(1.5rem,4vw,2.5rem)}.stage-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:clamp(.75rem,2vw,1.25rem);padding:clamp(.75rem,1.8vw,1.1rem) clamp(.9rem,2.2vw,1.4rem);border-radius:18px;background:radial-gradient(circle at 0% 0%,rgba(120,132,255,.18),transparent 60%),radial-gradient(circle at 90% 100%,rgba(68,149,255,.16),transparent 45%),#0d1123d1;border:1px solid rgba(120,132,255,.18);box-shadow:0 12px 32px #0c122a73}.stage-header__left{display:flex;align-items:center;gap:clamp(.75rem,2vw,1.1rem);flex:1;min-width:0}.stage-header__actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.stage-status-indicator{display:inline-flex;align-items:center;justify-content:center;gap:.48rem;padding:.38rem .85rem;border-radius:999px;border:1px solid rgba(200,206,255,.22);background:#c8ceff14;color:#d8dcffe0;font-size:.72rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;white-space:nowrap;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);min-width:clamp(120px,18vw,168px)}.stage-status-indicator__dot{width:9px;height:9px;border-radius:50%;background:currentColor;opacity:.95}.stage-status-indicator__text{font-size:.69rem;letter-spacing:.2em}.stage-status-indicator--speaking{background:#4ccf9f29;border-color:#4ccf9f57;color:#7fffd4}.stage-status-indicator--listening{background:#4495ff33;border-color:#4495ff59;color:#8bd3ff}.stage-status-indicator--processing{background:#ffb84d2e;border-color:#ffb84d52;color:#ffd699}.stage-status-indicator--paused{background:#a5adcd2e;border-color:#a5adcd4d;color:#d4daff}.stage-status-indicator--finished{background:#61d6ab2e;border-color:#61d6ab52;color:#c2ffdf}.stage-status-indicator--error{background:#ff6e7338;border-color:#ff6e7366;color:#ffb7c0}.stage-status-indicator--ready-to-start,.stage-status-indicator--ready_to_start{background:#7884ff2e;border-color:#7884ff52;color:#dfe2ff}.stage-progress-mini{display:flex;align-items:center;gap:.65rem;flex:1;min-width:0}.stage-progress-mini__track{flex:1;position:relative;height:6px;border-radius:999px;background:#6e76a047;overflow:hidden}.stage-progress-mini__fill{display:block;height:100%;border-radius:inherit;background:linear-gradient(120deg,#6a7aff,#52d6ff);transition:width .35s ease}.stage-progress-mini__meta{font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#d2d7ffb3;min-width:3rem;text-align:right}.icon-button{width:42px;height:42px;padding:0;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;font-size:1.15rem;background:#7481ff29;border:1px solid rgba(124,136,255,.36);color:#e3e6ff;box-shadow:none;transition:transform .18s ease,box-shadow .18s ease,background .2s ease,border-color .2s ease}.icon-button:hover{background:#7481ff3d;box-shadow:0 12px 30px #6b74ff40;transform:translateY(-1px)}.icon-button:active{transform:translateY(0);box-shadow:0 10px 24px #6b74ff33}.icon-button:disabled{opacity:.55;background:#7882a04d;border-color:#7882a073;box-shadow:none;cursor:not-allowed}.icon-button--pause{background:#7481ff2e;border-color:#7481ff61}.icon-button--pause:hover{background:#7481ff42}.icon-button--resume{background:#4ccf9f2e;border-color:#4ccf9f5c;color:#7fffd4}.icon-button--resume:hover{background:#4ccf9f3d;box-shadow:0 12px 30px #4ccf9f3d}.icon-button--danger{background:#00000024;border-color:#ff697859;color:#ff9fae}.icon-button--danger:hover{background:#ff697824;color:#ff8297;box-shadow:0 12px 28px #ff69783d}.icon-button--skip{position:relative;color:#e3e6ff}.icon-button--skip-back{background:#7684ff2e;border-color:#7684ff5c}.icon-button--skip-back:hover{background:#7684ff3d;box-shadow:0 12px 30px #7684ff42}.icon-button--skip-forward{background:#4495ff33;border-color:#4495ff5c;color:#9ed6ff}.icon-button--skip-forward:hover{background:#4495ff42;box-shadow:0 12px 30px #4495ff3d}.icon-button--pending{pointer-events:none}.icon-button--pending .icon-button__glyph{opacity:.2}.icon-button--pending:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid rgba(227,230,255,.35);border-top-color:#e3e6ff;animation:icon-button-spin .8s linear infinite}.icon-button__glyph{display:inline-flex;align-items:center;justify-content:center;width:100%;height:100%}.icon-button__glyph svg{width:18px;height:18px;display:block}.stage-panel{display:flex;flex-direction:column;gap:.85rem;padding:clamp(1.2rem,3vw,1.75rem);border-radius:20px;border:1px solid rgba(118,130,202,.18);background:#0f1224eb;box-shadow:0 20px 60px #0a0c1e73;transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;min-height:160px}.stage-panel--active{border-color:#707cffa6;box-shadow:0 28px 70px #606cff73;transform:translateY(-2px)}.user-panel--listening{border-color:#52b6ff8c;box-shadow:0 26px 70px #52b6ff61}.panel-label{font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#b4bcffb3}.panel-content{flex:1;display:flex;align-items:flex-start;justify-content:flex-start}.panel-content pre{margin:0;font-family:inherit;white-space:pre-wrap;word-break:break-word;font-size:clamp(1.05rem,2.5vw,1.35rem);line-height:1.6;color:#f8f9ff}.user-transcript{margin:0;font-size:clamp(1rem,2.3vw,1.2rem);line-height:1.55;color:#d7dffff2;font-style:italic}.user-transcript--processing{color:#ffd68fe6;font-style:normal}.listening-indicator{width:100%;display:flex;flex-direction:column;align-items:center;gap:.75rem;text-align:center;color:#a0ccffe6;animation:fadeSlide .4s ease forwards}.listening-indicator--capturing{color:#bfe3ff}.listening-indicator__prompt{font-size:.95rem;letter-spacing:.04em}.listening-indicator__transcript{margin:0;font-size:clamp(1rem,2.2vw,1.2rem);line-height:1.45;color:#d6e6ffeb;font-style:italic;max-width:90%}.voice-wave{display:flex;align-items:flex-end;justify-content:center;gap:7px;height:24px;width:100%;max-width:120px;opacity:.35;transform:translateY(6px);transition:opacity .25s ease,transform .25s ease}.voice-wave span{width:7px;height:6px;border-radius:6px;background:#6fc2ff59;animation:wave 1.1s infinite ease-in-out;animation-play-state:paused}.voice-wave span:nth-child(2){animation-delay:.1s}.voice-wave span:nth-child(3){animation-delay:.2s}.voice-wave span:nth-child(4){animation-delay:.3s}.voice-wave span:nth-child(5){animation-delay:.4s}.voice-wave-active{opacity:1;transform:translateY(0)}.voice-wave-active span{animation-play-state:running;background:#8bd3fff2}.error-view{border:1px solid rgba(255,118,127,.45);background:#180c12d9}.error-msg{color:#ff8fa3;font-weight:600;margin-top:1rem}@keyframes icon-button-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes wave{0%,to{height:6px}50%{height:24px}}@keyframes fadeSlide{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media(max-width:720px){#root{padding:1.25rem}.app-container{border-radius:18px;padding:1.25rem;gap:1.25rem}.stage-header__actions{width:100%;justify-content:stretch}.stage-header__actions button{flex:1 1 auto}.stage-panel{min-height:auto;padding:1.25rem}.panel-content pre,.user-transcript{font-size:1rem}}@media(max-width:480px){#root{padding:.75rem .75rem 1.5rem}.app-container{border-radius:16px;padding:1rem 1.1rem}.app-container h1{font-size:1.35rem}.stage-header{gap:1rem}.stage-header__actions{gap:.6rem}.btn-secondary,.btn-ghost,.btn-ghost--danger{font-size:.95rem;padding:.75rem 1rem}.panel-label{font-size:.7rem}.voice-wave{max-width:100px}}
