:root{--bg: #0a1210;--panel: #12201d;--text: #eef8f5;--muted: #9fb6b0;--accent-300: #5eead4;--accent-400: #2dd4bf;--accent: #14b8a6;--accent-600: #0d9488;--accent-700: #0f766e;--accent-text: #ffffff;--error: #ff6b6b;--meter: #2dd4bf;--panel-2: #0e1a17;--panel-3: #1a2b27;--user-bubble: var(--accent-700);--user-bubble-text: #ffffff;--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .14);--warn: #ffce6b;--shadow-1: 0 1px 2px rgba(0, 0, 0, .28), 0 6px 18px rgba(0, 0, 0, .22);--shadow-2: 0 10px 40px rgba(0, 0, 0, .4), 0 2px 6px rgba(0, 0, 0, .3);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(1200px 600px at 15% -10%,rgba(20,184,166,.14),transparent 60%),radial-gradient(900px 500px at 100% 0%,rgba(139,92,246,.09),transparent 55%),var(--bg);background-attachment:fixed;color:var(--text)}.app{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem}.screen{width:100%;max-width:30rem;background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:2rem;box-shadow:var(--shadow-2)}.brand{display:flex;align-items:center;gap:.6rem}.brand.card-brand{margin-bottom:1.25rem}.brand-mark{width:1.85rem;height:1.85rem;flex:none;display:block;overflow:visible;filter:drop-shadow(0 0 12px rgba(139,92,246,.55))}.brand-text{font-size:1.1rem;font-weight:650;letter-spacing:.01em}.spotlight{position:relative;isolation:isolate}.spotlight:before,.spotlight:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s ease}.spotlight:before{padding:1.5px;background:radial-gradient(240px 240px at calc(var(--x, -500) * 1px) calc(var(--y, -500) * 1px),var(--accent-300),transparent 70%);background-attachment:fixed;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;z-index:1}.spotlight:after{background:radial-gradient(560px 420px at calc(var(--x, -500) * 1px) calc(var(--y, -500) * 1px),rgba(45,212,191,.12),transparent 72%);background-attachment:fixed}.spotlight:hover:before,.spotlight:focus-within:before,.spotlight:hover:after,.spotlight:focus-within:after{opacity:1}.screen h1{font-size:1.4rem;margin:0 0 1rem}.screen p{color:var(--muted);line-height:1.5}.consent-statement{color:var(--text);font-weight:600}button.primary{margin-top:1.25rem;width:100%;padding:.85rem 1rem;border:none;border-radius:10px;background:linear-gradient(180deg,var(--accent-400),var(--accent-600));color:var(--accent-text);font-size:1rem;font-weight:600;cursor:pointer;box-shadow:0 8px 22px #14b8a652;transition:box-shadow .2s ease}button.primary:hover:not(:disabled){box-shadow:0 10px 28px #14b8a66b}button.primary:disabled{opacity:.5;cursor:default;box-shadow:none}button.link{background:none;border:none;color:var(--accent-300);cursor:pointer;text-decoration:underline;font:inherit;padding:0}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent-400);outline-offset:2px}.consent-agree{display:flex;gap:.6rem;align-items:flex-start;margin-top:1.25rem;color:var(--text)}.inline-error{color:var(--error);margin-top:1rem}.meter{width:100%;height:14px;background:#ffffff14;border-radius:999px;overflow:hidden;margin-top:.5rem}.meter-fill{height:100%;background:var(--meter);transition:width 80ms linear}.status.reconnecting{color:var(--warn)}.status.live{color:var(--meter)}.screen.interview-screen{max-width:84rem;background:transparent;box-shadow:none;padding:0;display:flex;flex-direction:column;gap:.9rem;height:calc(100vh - 3rem);max-height:58rem}.interview-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex:none}.brand.interview-brand{gap:.55rem}.brand.interview-brand .brand-mark{width:1.4rem;height:1.4rem}.brand.interview-brand .brand-text{font-size:1rem}.conn-badge{display:inline-flex;align-items:center;gap:.45rem;padding:.32rem .7rem;border:1px solid var(--border);border-radius:999px;background:var(--panel-2);color:var(--muted);font-size:.8rem;font-weight:550}.conn-dot{width:.45rem;height:.45rem;border-radius:50%;background:currentColor}.conn-badge[data-phase=live]{color:var(--meter)}.conn-badge[data-phase=live] .conn-dot{animation:pulse-dot 2.4s ease-in-out infinite}.conn-badge[data-phase=reconnecting],.conn-badge[data-phase=checking]{color:var(--warn);border-color:#ffce6b59}.interview-grid{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 24rem;gap:.9rem}.stage{min-width:0;min-height:0;display:flex;flex-direction:column;gap:.9rem;background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:1.25rem;box-shadow:0 10px 40px #00000059}.agent-tile{display:flex;align-items:center;gap:.9rem;flex:none}.agent-orb{position:relative;width:3.25rem;height:3.25rem;flex:none;display:grid;place-items:center}.agent-orb-core{width:2.1rem;height:2.1rem;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--accent-300),var(--accent));box-shadow:0 0 18px #14b8a68c}.agent-orb-ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--accent);opacity:0}.agent-tile[data-agent-state=speaking] .agent-orb-ring{animation:orb-ripple 1.5s ease-out infinite}.agent-tile[data-agent-state=thinking] .agent-orb-core{animation:pulse-dot 1.2s ease-in-out infinite}.agent-tile[data-agent-state=listening] .agent-orb-core{background:radial-gradient(circle at 35% 30%,var(--accent-300),var(--meter));box-shadow:0 0 18px #2dd4bf66}.agent-meta{min-width:0}.agent-name{margin:0;color:var(--text);font-weight:650}.agent-state{margin:.15rem 0 0;display:flex;align-items:center;gap:.4rem;font-size:.85rem;color:var(--muted)}.agent-dot{width:.4rem;height:.4rem;border-radius:50%;background:var(--muted)}.agent-tile[data-agent-state=speaking] .agent-state{color:var(--accent)}.agent-tile[data-agent-state=speaking] .agent-dot{background:var(--accent)}.agent-tile[data-agent-state=listening] .agent-dot{background:var(--meter)}.self-view{position:relative;flex:1;min-height:0;border-radius:14px;overflow:hidden;background:var(--panel-2);border:1px solid var(--border);display:grid;place-items:center}.self-view-video{width:100%;height:100%;object-fit:cover;display:block;transform:scaleX(-1)}.self-view-placeholder{display:flex;flex-direction:column;align-items:center;gap:.6rem;color:var(--muted)}.self-view-avatar{width:5rem;height:5rem;border-radius:50%;display:grid;place-items:center;background:var(--panel-3);color:var(--muted)}.self-view-hint{margin:0;font-size:.9rem}.self-view-label{position:absolute;left:.75rem;bottom:.75rem;padding:.2rem .55rem;border-radius:8px;background:#0f1220b8;font-size:.78rem;font-weight:600}.self-view-error{position:absolute;right:.75rem;bottom:.75rem;left:auto;margin:0;max-width:60%;padding:.35rem .6rem;border-radius:8px;background:#0f1220d1;color:var(--warn);font-size:.78rem;text-align:right}.controls{flex:none;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}button.control{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border-radius:999px;border:1px solid var(--border-strong);background:var(--panel-3);color:var(--text);font:inherit;font-weight:600;font-size:.9rem;cursor:pointer}button.control:hover:not(:disabled){border-color:var(--accent)}button.control[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}button.control:disabled{opacity:.55;cursor:default}button.control.control-danger{border-color:var(--error);background:linear-gradient(180deg,#ff8484,var(--error));color:#fff;box-shadow:0 6px 18px #ff6b6b52}button.control.control-danger:hover:not(:disabled){border-color:#ff8484;box-shadow:0 8px 24px #ff6b6b70}button.control.control-danger:disabled{opacity:.55}.end-confirm{display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}.control-icon{font-size:.7rem;line-height:1}.controls-hint{margin:0;font-size:.78rem;color:var(--muted)}.transcript{min-height:0;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--border);border-radius:18px;box-shadow:0 10px 40px #00000059;overflow:hidden}.transcript-header{flex:none;display:flex;align-items:center;justify-content:space-between;padding:.9rem 1rem;border-bottom:1px solid var(--border)}.transcript-header h2{margin:0;font-size:.95rem;letter-spacing:.02em}.transcript-live{display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:650;text-transform:uppercase;letter-spacing:.06em;color:var(--meter)}.transcript-live-dot{width:.4rem;height:.4rem;border-radius:50%;background:var(--meter);animation:pulse-dot 2.4s ease-in-out infinite}.transcript-list{flex:1;min-height:0;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.85rem;scrollbar-width:thin;scrollbar-color:var(--panel-3) transparent}.transcript-empty{margin:auto 0;text-align:center;font-size:.88rem;color:var(--muted)}.bubble-row{display:flex;flex-direction:column;gap:.25rem;max-width:92%}.bubble-row[data-speaker=you]{align-self:flex-end;align-items:flex-end}.bubble-row[data-speaker=interviewer]{align-self:flex-start}.bubble-who{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.bubble{margin:0;padding:.6rem .8rem;border-radius:14px;font-size:.9rem;line-height:1.45;color:var(--text);overflow-wrap:anywhere}.bubble-row[data-speaker=you] .bubble{background:var(--user-bubble);color:var(--user-bubble-text);border-bottom-right-radius:5px}.bubble-row[data-speaker=interviewer] .bubble{background:var(--panel-3);border-bottom-left-radius:5px}.bubble-row[data-pending=true] .bubble{opacity:.82}.bubble.typing{display:inline-flex;align-items:center;gap:.28rem;padding:.75rem .85rem}.typing-dot{width:.35rem;height:.35rem;border-radius:50%;background:var(--muted);animation:typing-bounce 1.2s ease-in-out infinite}.typing-dot:nth-child(2){animation-delay:.15s}.typing-dot:nth-child(3){animation-delay:.3s}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.35}}@keyframes orb-ripple{0%{transform:scale(.65);opacity:.7}to{transform:scale(1.15);opacity:0}}@keyframes typing-bounce{0%,60%,to{transform:translateY(0);opacity:.5}30%{transform:translateY(-.22rem);opacity:1}}@media(max-width:62rem){.screen.interview-screen{height:auto;max-height:none}.interview-grid{grid-template-columns:minmax(0,1fr)}.self-view{min-height:15rem}.transcript{height:26rem}}@media(prefers-reduced-motion:reduce){.conn-badge[data-phase=live] .conn-dot,.transcript-live-dot,.agent-tile[data-agent-state=speaking] .agent-orb-ring,.agent-tile[data-agent-state=thinking] .agent-orb-core,.typing-dot{animation:none}}
