:root{--bg-0:#090b0f;--bg-1:#0e1117;--panel-0:#161b23;--panel-1:#11151c;--panel-edge:#2a323f80;--hairline:#ffffff14;--ink:#eef2f7;--ink-dim:#9aa6b6;--ink-faint:#5f6b7c;--call:#34d399;--call-soft:#6ee7b7;--call-glow:#34d39940;--end:#fb6f6a;--end-glow:#fb6f6a40;--accent:#7dd3fc;--sans:"Hanken Grotesk", system-ui, sans-serif;--display:"Bricolage Grotesque", "Hanken Grotesk", sans-serif;--mono:"JetBrains Mono", ui-monospace, Consolas, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font:400 16px/1.5 var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:radial-gradient(110% 70% at 50% -5%, #1b2330 0%, transparent 55%), radial-gradient(80% 50% at 50% 4%, var(--call-glow) 0%, transparent 50%), linear-gradient(180deg, var(--bg-1) 0%, var(--bg-0) 100%);background-attachment:fixed;min-height:100svh}#root{z-index:1;width:100%;max-width:100%;min-height:100svh;margin:0;display:block;position:relative}button,input{font:inherit}.shell{text-align:left;flex-direction:column;justify-content:center;align-items:center;gap:18px;min-height:100svh;padding:clamp(20px,4vw,56px) 18px;display:flex}.panel{background:linear-gradient(165deg, var(--panel-0) 0%, var(--panel-1) 100%);border:1px solid var(--panel-edge);border-radius:30px;width:100%;max-width:460px;padding:26px 28px 24px;animation:.55s cubic-bezier(.2,.8,.2,1) both rise;position:relative;box-shadow:inset 0 1px #ffffff14,0 32px 64px -24px #000000d9,0 2px #00000060}.panel-top{justify-content:space-between;align-items:center;gap:16px;display:flex}.eyebrow{font-family:var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint);margin:0;font-size:13px;font-weight:600}.indicator{border:1px solid var(--hairline);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);background:#ffffff08;border-radius:999px;align-items:center;gap:8px;padding:5px 11px 5px 9px;font-size:11px;display:inline-flex}.indicator i{background:var(--ink-faint);border-radius:50%;width:8px;height:8px}.indicator.online{color:var(--call);border-color:#34d39933}.indicator.online i{background:var(--call);box-shadow:0 0 0 4px var(--call-glow);animation:2.4s ease-in-out infinite blink}.callscreen{text-align:center;flex-direction:column;align-items:center;margin:28px 0 8px;display:flex}.avatar{width:92px;height:92px;color:var(--ink-dim);border:1px solid var(--hairline);background:radial-gradient(120% 120% at 50% 20%,#232c39 0%,#161b23 75%);border-radius:28px;place-items:center;display:grid;box-shadow:inset 0 1px #ffffff1a,0 14px 28px -14px #000a}.avatar svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:42px;height:42px}.state{font-family:var(--display);letter-spacing:-.015em;color:var(--ink);text-wrap:balance;margin:20px 0 0;font-size:clamp(26px,6vw,34px);font-weight:700;line-height:1.05}.detail{font-family:var(--mono);letter-spacing:.01em;color:var(--ink-dim);margin:10px 0 0;font-size:12.5px}.dial{justify-content:center;padding:30px 0 26px;display:flex}.callbtn{cursor:pointer;color:#06231a;background:radial-gradient(120% 120% at 50% 25%, var(--btn-hi) 0%, var(--btn-lo) 72%);width:84px;height:84px;box-shadow:inset 0 2px 2px #fff6, inset 0 -5px 12px #00000040, 0 12px 28px -8px var(--btn-shadow), 0 0 40px -6px var(--btn-shadow);--btn-hi:var(--call-soft);--btn-lo:var(--call);--btn-shadow:var(--call-glow);border:none;border-radius:50%;place-items:center;transition:transform .16s cubic-bezier(.2,.8,.2,1),box-shadow .25s;display:grid;position:relative}.callbtn.call{animation:3.2s ease-in-out infinite breathe}.callbtn.accept{animation:1.1s cubic-bezier(.4,0,.2,1) infinite ring}.callbtn.reject{--btn-hi:#ffa19c;--btn-lo:var(--end);--btn-shadow:var(--end-glow);color:#2a0907}.callbtn:hover:not(:disabled){transform:translateY(-3px)scale(1.04)}.callbtn:active:not(:disabled){transform:translateY(1px)scale(.97)}.callbtn:disabled{cursor:not-allowed;color:#4a5564;background:radial-gradient(120% 120% at 50% 25%,#283140 0%,#1b212b 74%);animation:none;box-shadow:inset 0 1px #ffffff10,0 0 0 1px #00000030}.callbtn svg{fill:currentColor;width:34px;height:34px;transition:transform .25s}.callbtn.reject svg{transform:rotate(134deg)}.callbtn-label{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.controls{grid-template-columns:1fr 1fr;gap:10px;display:grid}.ctrl{border:1px solid var(--hairline);color:var(--ink-dim);font-family:var(--sans);letter-spacing:.01em;cursor:pointer;background:#ffffff08;border-radius:14px;padding:13px 14px;font-size:14px;font-weight:600;transition:border-color .2s,color .2s,background .2s,transform .12s}.ctrl:hover:not(:disabled){color:var(--ink);background:#ffffff12;border-color:#ffffff2e}.ctrl:active:not(:disabled){transform:translateY(1px)}.ctrl:disabled{opacity:.4;cursor:not-allowed}.room{border-top:1px solid var(--hairline);gap:8px;margin-top:20px;padding-top:20px;display:grid}.room span{letter-spacing:.04em;color:var(--ink-faint);font-size:12px}.room input{border:1px solid var(--hairline);color:var(--call-soft);font-family:var(--mono);letter-spacing:.03em;background:#0a0d12;border-radius:13px;padding:12px 14px;font-size:14px;transition:border-color .2s,box-shadow .2s;box-shadow:inset 0 2px 6px #0006}.room input:focus{border-color:var(--call);box-shadow:inset 0 2px 6px #0006, 0 0 0 3px var(--call-glow);outline:none}.room input:disabled{color:var(--ink-faint);cursor:not-allowed}.panel audio{width:0;height:0;display:block}.log{border:1px solid var(--panel-edge);background:linear-gradient(165deg,#12161d 0%,#0d1117 100%);border-radius:22px;width:100%;max-width:460px;padding:18px 20px 20px;animation:.65s cubic-bezier(.2,.8,.2,1) 80ms both rise;box-shadow:inset 0 1px #ffffff10,0 18px 40px -24px #000c}.log-head{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.log-head h2{font-family:var(--display);letter-spacing:.04em;color:var(--ink-dim);margin:0;font-size:15px;font-weight:600}.log-count{text-align:center;min-width:26px;font-family:var(--mono);color:var(--accent);background:#7dd3fc1c;border:1px solid #7dd3fc33;border-radius:999px;padding:3px 9px;font-size:11px}.log-body{flex-direction:column;gap:1px;max-height:280px;display:flex;overflow-y:auto}.log-empty{font-family:var(--mono);color:var(--ink-faint);padding:8px 0;font-size:12.5px}.log-line{font-family:var(--mono);color:var(--ink-dim);white-space:pre-wrap;word-break:break-word;border-left:2px solid #0000;border-radius:0 6px 6px 0;padding:4px 4px 4px 12px;font-size:12.5px;line-height:1.5;transition:color .15s,background .15s;animation:.3s both slide}.log-line:first-child{color:var(--ink);border-left-color:var(--call);background:#34d3990d}.log-line:hover{color:var(--ink);background:#ffffff06}.log-body::-webkit-scrollbar{width:8px}.log-body::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:8px}@keyframes rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes slide{0%{opacity:0;transform:translate(-6px)}to{opacity:1;transform:translate(0)}}@keyframes breathe{0%,to{box-shadow:inset 0 2px 2px #fff6, inset 0 -5px 12px #00000040, 0 12px 28px -8px var(--btn-shadow), 0 0 26px -6px var(--btn-shadow)}50%{box-shadow:inset 0 2px 2px #fff6, inset 0 -5px 12px #00000040, 0 12px 28px -8px var(--btn-shadow), 0 0 52px 0 var(--btn-shadow)}}@keyframes ring{0%{box-shadow:inset 0 2px 2px #fff6, inset 0 -5px 12px #00000040, 0 0 0 0 var(--call-glow)}70%{box-shadow:inset 0 2px 2px #fff6,inset 0 -5px 12px #00000040,0 0 0 16px #0000}to{box-shadow:inset 0 2px 2px #fff6,inset 0 -5px 12px #00000040,0 0 #0000}}@keyframes blink{0%,to{opacity:1}50%{opacity:.45}}@media (width<=460px){.controls{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.panel,.log,.log-line,.callbtn.call,.callbtn.accept,.indicator.online i{animation:none}}