:root{--bg: #faf9f6;--text: #1c1917;--text-dim: #57534e;--border: rgba(28, 25, 23, .12);--accent: #ea580c;--accent-dim: #c2410c;--danger: #dc2626;--success: #15803d;--phone-bezel: #111;--phone-screen-top: #1f2937;--phone-screen-bottom: #0b1220;font-family:DM Sans,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);line-height:1.5;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 12px}.app{display:flex;justify-content:center;width:100%}.phone{width:360px;max-width:100%;aspect-ratio:9 / 19.5;background:var(--phone-bezel);border-radius:48px;padding:10px;box-shadow:0 0 0 2px #ffffff0a inset,0 30px 60px -20px #0f172a59,0 12px 24px -8px #0f172a33;position:relative}.phone:before,.phone:after{content:"";position:absolute;background:#0a0a0a;border-radius:2px}.phone:before{left:-2px;top:110px;width:3px;height:32px;box-shadow:0 56px #0a0a0a,0 104px #0a0a0a}.phone:after{right:-2px;top:140px;width:3px;height:64px}.phone-screen{width:100%;height:100%;background:linear-gradient(180deg,var(--phone-screen-top) 0%,var(--phone-screen-bottom) 100%);border-radius:40px;position:relative;overflow:hidden;display:flex;flex-direction:column;color:#fff}.dyn-island{position:absolute;top:10px;left:50%;transform:translate(-50%);width:96px;height:28px;background:#000;border-radius:999px;z-index:5}.statusbar{display:flex;justify-content:space-between;align-items:center;padding:14px 28px 0;font-size:13px;font-weight:600;letter-spacing:.02em}.statusbar-icons{display:inline-flex;align-items:center;gap:5px}.statusbar-icons svg{display:block}.home-bar{align-self:center;width:120px;height:5px;border-radius:999px;background:#fff6;margin:0 0 8px}.screen-body{flex:1;display:flex;flex-direction:column;min-height:0;padding-top:48px}.precall{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 24px 40px}.precall-meta{margin-top:12px;font-size:14px;color:#ffffffb3;letter-spacing:.04em;text-transform:uppercase}.precall-name{margin:12px 0 4px;font-size:28px;font-weight:600;letter-spacing:-.01em}.precall-sub{margin:0;font-size:15px;color:#ffffffb3}.precall-spacer{flex:1}.precall-tagline{font-size:13px;color:#ffffff8c;margin-bottom:20px}.avatar{width:132px;height:132px;border-radius:50%;background:linear-gradient(135deg,var(--accent) 0%,#f97316 60%,#fb923c 100%);display:flex;align-items:center;justify-content:center;font-size:56px;font-weight:600;color:#fff;margin-top:16px;box-shadow:0 12px 32px -8px #ea580c80;position:relative}.avatar--small{width:80px;height:80px;font-size:32px;margin-top:0}.avatar--speaking:before,.avatar--speaking:after{content:"";position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;border-radius:50%;border:2px solid rgba(234,88,12,.6);animation:ring 1.8s ease-out infinite}.avatar--speaking:after{animation-delay:.9s}@keyframes ring{0%{transform:scale(1);opacity:.8}to{transform:scale(1.45);opacity:0}}.action-row{display:flex;justify-content:center;gap:56px;margin-bottom:28px}.action{display:flex;flex-direction:column;align-items:center;gap:8px;background:none;border:none;color:#fff;font:inherit;font-size:13px;cursor:pointer}.action-circle{width:68px;height:68px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform .12s ease,background .2s ease}.action:active .action-circle{transform:scale(.94)}.action-circle--call{background:#34c759;box-shadow:0 8px 24px -6px #34c75999}.action-circle--call:hover{background:#2db14e}.action-circle--end{background:var(--danger);box-shadow:0 8px 24px -6px #dc262699}.action-circle--end:hover{background:#b91c1c}.action-circle svg{color:#fff}.action-disabled{opacity:.55;pointer-events:none}.incall{flex:1;display:flex;flex-direction:column;padding:0 24px 16px;min-height:0}.incall-head{text-align:center;padding:8px 0 16px}.incall-name{font-size:24px;font-weight:600;margin:12px 0 4px}.incall-timer{font-size:14px;color:#ffffffb3;font-variant-numeric:tabular-nums}.incall-status-pill{display:inline-block;margin-top:8px;font-size:12px;padding:4px 12px;border-radius:999px;background:#ffffff1a;color:#ffffffd9;letter-spacing:.04em;text-transform:uppercase}.incall-status-pill--speaking{background:#ea580c33;color:#fdba74}.incall-status-pill--listening{background:#34c75933;color:#86efac}.captions{flex:1;overflow-y:auto;padding:8px 0 12px;display:flex;flex-direction:column;gap:8px;mask-image:linear-gradient(180deg,transparent 0,#000 24px,#000 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 24px,#000 100%)}.captions::-webkit-scrollbar{width:0}.caption{padding:10px 14px;border-radius:18px;font-size:14.5px;line-height:1.4;max-width:84%;word-wrap:break-word}.caption--user{align-self:flex-end;background:var(--accent);border-bottom-right-radius:6px}.caption--assistant{align-self:flex-start;background:#ffffff1f;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom-left-radius:6px}.connecting{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;text-align:center}.connecting-dots{display:inline-flex;gap:6px}.connecting-dots span{width:8px;height:8px;border-radius:50%;background:#ffffffb3;animation:bounce 1.2s ease-in-out infinite}.connecting-dots span:nth-child(2){animation-delay:.15s}.connecting-dots span:nth-child(3){animation-delay:.3s}@keyframes bounce{0%,60%,to{transform:translateY(0);opacity:.7}30%{transform:translateY(-6px);opacity:1}}.error-msg{margin:16px 24px 0;padding:12px 14px;border-radius:12px;background:#dc26262e;color:#fecaca;font-size:13.5px;text-align:center}.tap-hint{font-size:12px;color:#ffffff80;letter-spacing:.05em;text-transform:uppercase;margin-top:4px}.boundary{max-width:600px;margin:64px auto;padding:24px;border:1px solid var(--danger);border-radius:12px;background:#fff}.boundary pre{white-space:pre-wrap;background:var(--bg);padding:12px;border-radius:6px;font-size:13px}