:root{--bg:#f4f2ee;--ink:#14161a;--muted:#6b6f76;--line:#e2ded6;--card:#fff;--live:#1fb97a;--live-soft:#e3f7ee;--warn:#d9534f;--radius:18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,system-ui,sans-serif}.app{max-width:1100px;padding:20px 16px 40px;padding-left:max(16px, env(safe-area-inset-left));padding-right:max(16px, env(safe-area-inset-right));margin:0 auto}.top{justify-content:space-between;align-items:center;gap:12px;display:flex}.brand{align-items:center;gap:10px;font-size:17px;font-weight:600;display:flex}.dot{background:var(--live);width:10px;height:10px;box-shadow:0 0 0 4px var(--live-soft);border-radius:50%}.tag{color:var(--muted);border:1px solid var(--line);white-space:nowrap;border-radius:99px;padding:5px 10px;font-size:12px}.intro{max-width:760px;margin:34px 0 26px}.intro h1{letter-spacing:-.03em;margin:0 0 14px;font-size:clamp(30px,5vw,52px);font-weight:700;line-height:1.04}.intro h1 span{color:var(--muted)}.intro p{color:#3b3f45;margin:0;font-size:17px;line-height:1.55}.grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start;gap:18px;display:grid}@media (width<=820px){.grid{grid-template-columns:1fr}}.phone{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;min-height:520px;padding:16px;display:flex;box-shadow:0 30px 60px -40px #14161a59}.phone__head{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding-bottom:14px;display:flex}.phone__who{font-weight:600}.phone__state{color:var(--muted);font-size:13px}.phone__timer{font-variant-numeric:tabular-nums;color:var(--muted);margin-left:auto;font-size:14px}.avatar{background:radial-gradient(circle at 35% 30%,#4b5059,#14161a);border-radius:50%;flex:none;width:44px;height:44px;position:relative}.avatar span{border:2px solid var(--live);opacity:0;border-radius:50%;position:absolute;inset:-5px}.avatar.is-speaking span{opacity:1;animation:1.1s ease-out infinite ring}.avatar.is-listening{box-shadow:0 0 0 3px var(--live-soft)}@keyframes ring{0%{opacity:.9;transform:scale(.9)}to{opacity:0;transform:scale(1.35)}}@media (prefers-reduced-motion:reduce){.avatar.is-speaking span{animation:none}}.log{flex-direction:column;flex:1;gap:10px;max-height:420px;padding:14px 2px;display:flex;overflow-y:auto}.msg{border-radius:16px;max-width:82%;padding:10px 14px;font-size:15px;line-height:1.45;animation:.25s ease-out in}.msg--ava{background:#f1efea;border-bottom-left-radius:5px;align-self:flex-start}.msg--you{background:var(--ink);color:#fff;border-bottom-right-radius:5px;align-self:flex-end}.msg--sys{color:var(--muted);background:0 0;align-self:center;padding:2px;font-size:12px}.msg--typing{color:var(--muted)}@keyframes in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.interim{min-height:22px;color:var(--muted);padding:0 4px 8px;font-size:14px;font-style:italic}.controls{justify-content:center;padding:6px 0 12px;display:flex}.call{color:#fff;background:var(--live);cursor:pointer;border:0;border-radius:99px;align-items:center;gap:10px;padding:14px 30px;font:600 16px Inter,sans-serif;transition:transform .15s,background .2s;display:inline-flex}.call svg{fill:currentColor;width:20px;height:20px}.call:hover{transform:translateY(-1px)}.call:focus-visible{outline:3px solid var(--ink);outline-offset:3px}.call.is-live{background:var(--warn)}.call.is-live svg{transform:rotate(135deg)}.type{gap:8px;display:flex}.type input{border:1px solid var(--line);background:#fbfaf8;border-radius:12px;flex:1;min-width:0;padding:11px 12px;font:15px Inter,sans-serif}.type input:focus{outline:2px solid var(--ink);outline-offset:1px}.type button{border:1px solid var(--ink);background:var(--ink);color:#fff;cursor:pointer;border-radius:12px;padding:0 16px;font:600 14px Inter,sans-serif}.hint{color:var(--muted);min-height:16px;margin:10px 2px 0;font-size:12px}.owner{flex-direction:column;gap:12px;display:flex}.owner__label{text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-size:12px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px}.card__title{align-items:center;gap:8px;margin-bottom:8px;font-weight:600;display:flex}.card--done{border-color:var(--live);box-shadow:0 0 0 4px var(--live-soft);animation:.3s ease-out in}.card--done .card__title:before{content:"";background:var(--live);border-radius:50%;width:8px;height:8px}.muted{color:var(--muted);margin:0;font-size:14px;line-height:1.5}.kv{grid-template-columns:90px 1fr;gap:6px 10px;margin:0;font-size:14px;display:grid}.kv dt{color:var(--muted)}.kv dd{overflow-wrap:anywhere;margin:0;font-weight:500}.stats{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.stats div{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px}.stats b{letter-spacing:-.02em;font-size:22px;display:block}.stats span{color:var(--muted);margin-top:4px;font-size:12px;line-height:1.35;display:block}.foot{color:var(--muted);max-width:700px;margin-top:28px;font-size:12px;line-height:1.5}
