.demo{padding-top:calc(60px + env(safe-area-inset-top,0px));min-height:100vh;overflow-x:hidden}.demo-grid{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:56px;padding-block:40px 80px;align-items:center}.demo-side{display:flex;flex-direction:column;gap:24px}@media(max-width:960px){.demo-grid{grid-template-columns:1fr;gap:32px;padding-block:24px 56px}.demo-side{order:2}.d-stage{order:1}}.d-block{display:flex;flex-direction:column;gap:10px}.d-label{margin:0;font-size:14px;color:var(--night-ink-2)}.voices{display:flex;flex-wrap:wrap;gap:8px}.voices button{padding:10px 18px;border-radius:999px;border:1px solid var(--night-line);background:var(--night-3);color:var(--night-ink);font-size:15px;font-weight:550;cursor:pointer;transition:all .2s}.voices button:hover{border-color:#5eead4}.voices button[aria-pressed=true]{background:#fff;color:#000;border-color:#fff}.tries{display:flex;flex-wrap:wrap;gap:8px}.tries span{padding:8px 13px;border-radius:999px;background:var(--night-3);font-size:14px;border:1px solid var(--night-line);color:var(--night-ink-2)}.d-stage{position:relative;align-self:start;display:flex;flex-direction:column;align-items:center}#orb3{position:absolute;left:50%;top:50%;width:760px;height:760px;max-width:140vw;transform:translate(-50%,-54%);opacity:.8;pointer-events:none}.d-phone{position:relative;width:min(390px,100%);height:min(760px,calc(100vh - 120px));min-height:560px;border-radius:54px;padding:12px;background:linear-gradient(160deg,#3a3d44,#15161a 40%,#2a2c31);box-shadow:0 0 0 1px #ffffff14,0 70px 120px -40px #14b8a659,0 40px 80px -30px #000c}.d-scr{position:relative;height:100%;border-radius:43px;overflow:hidden;background:#07080a;display:flex;flex-direction:column}.d-bar{display:flex;justify-content:space-between;padding:14px 28px 4px;font-size:13px;font-weight:600;color:#f5f5f7}.d-head{display:flex;align-items:center;gap:12px;padding:10px 16px 12px;border-bottom:1px solid rgba(255,255,255,.07)}.d-av{width:40px;height:40px;border-radius:50%;flex:none;background:radial-gradient(circle at 35% 30%,#8ff7e7,#14b8a6 55%,#2546d9);box-shadow:0 0 22px #14b8a699}[data-mode=speak] .d-av{animation:pulse 1.1s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.08);box-shadow:0 0 34px #14b8a6e6}}.d-who{flex:1;min-width:0;display:flex;flex-direction:column}.d-who b{font-size:16px;color:#f5f5f7}.d-who small{font-size:12px;color:#8e8e93;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.d-restart{width:34px;height:34px;border-radius:50%;border:0;background:#ffffff14;color:#f5f5f7;font-size:17px;cursor:pointer}.d-chat{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:8px;overscroll-behavior:contain}.cm{max-width:84%;padding:9px 13px;border-radius:18px;font-size:15px;line-height:1.38;animation:pop .35s cubic-bezier(.2,.8,.2,1) both;white-space:pre-wrap;overflow-wrap:anywhere}.cm small{display:block;font-size:11px;opacity:.6;font-weight:600;margin-bottom:2px}.cm.a{align-self:flex-start;background:#0f3d38;color:#e6fffb;border-bottom-left-radius:6px}.cm.p{align-self:flex-end;background:#2c2f36;color:#f5f5f7;border-bottom-right-radius:6px}.cm.sys{align-self:center;max-width:92%;color:#5eead4;background:#34e0c81a;border-radius:12px;font-size:13px;text-align:center}.cm.sys:first-child{background:transparent;color:#8e8e93}.cm.err{align-self:center;background:#ff5a5a1f;color:#ffb4b4;font-size:13px;text-align:center}.cm.typing{display:flex;gap:4px;padding:13px 14px}.cm.typing i{width:7px;height:7px;border-radius:50%;background:#5eead4;opacity:.5;animation:blink 1.2s infinite}.cm.typing i:nth-child(2){animation-delay:.2s}.cm.typing i:nth-child(3){animation-delay:.4s}@keyframes blink{30%{opacity:1;transform:translateY(-3px)}}@keyframes pop{0%{opacity:0;transform:translateY(8px) scale(.98)}}.d-ctrl{padding:10px 14px 18px;border-top:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;align-items:center;gap:8px;background:linear-gradient(transparent,#14b8a60d)}.d-wave{display:flex;align-items:center;gap:3px;height:30px}.d-wave i{width:3px;height:30px;border-radius:2px;background:linear-gradient(#5eead4,#3b82f6);transform:scaleY(.12);transition:transform .08s linear}.d-status{margin:0;font-size:13px;color:#a1a1a6;min-height:18px;text-align:center}.d-mic{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:999px;border:0;background:#12b5a2;color:#fff;font-size:16px;font-weight:650;cursor:pointer;box-shadow:0 10px 30px -8px #12b5a2b3;transition:background .2s,transform .15s}.d-mic:active{transform:scale(.97)}.d-mic:disabled{opacity:.5;cursor:default}.d-mic-ic{width:12px;height:12px;border-radius:50%;background:#fff}[data-mode=listen] .d-mic,[data-mode=hear] .d-mic{background:#1f2a2c;box-shadow:0 0 0 2px #12b5a2}[data-mode=listen] .d-mic-ic,[data-mode=hear] .d-mic-ic{background:#ff5a5a;animation:rec 1.4s infinite}[data-mode=speak] .d-mic,[data-mode=think] .d-mic{background:#2c2f36;box-shadow:none}@keyframes rec{50%{opacity:.35}}.d-type{display:flex;gap:8px;width:100%}.d-type input{flex:1;min-width:0;padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:#15171b;color:#f5f5f7;font:inherit;font-size:16px}.d-type input:focus{outline:none;border-color:#12b5a2}.d-type button{width:40px;height:40px;flex:none;border-radius:50%;border:0;background:#2c2f36;color:#fff;font-size:18px;cursor:pointer}@media(max-width:600px){.d-phone{height:78vh;min-height:540px;border-radius:44px;padding:9px}.d-scr{border-radius:36px}}