:root{--bg:#f6f7f9;--panel:#fff;--panel-2:#f0f2f5;--border:#dfe3e8;--text:#1b1f24;--muted:#6b7280;--accent:#5b5bd6;--accent-soft:#e9e9fb;--ok:#15803d;--ok-soft:#dcfce7;--bad:#b91c1c;--bad-soft:#fee2e2;--warn:#a16207;--warn-soft:#fef3c7;--info:#0369a1;--info-soft:#e0f2fe;--tag:#9333ea;--mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--bg:#0f1115;--panel:#161a20;--panel-2:#1d222a;--border:#2a313b;--text:#e6e8eb;--muted:#8b95a3;--accent:#8b8bf0;--accent-soft:#25264a;--ok:#4ade80;--ok-soft:#12321f;--bad:#f87171;--bad-soft:#3b1515;--warn:#facc15;--warn-soft:#3a300c;--info:#38bdf8;--info-soft:#0c2a3a;--tag:#c084fc;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-size:14px}button{font:inherit;cursor:pointer;border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:8px;padding:.45rem .9rem}button:disabled{opacity:.5;cursor:default}button.ghost{color:var(--text);border-color:var(--border);background:0 0}button.ghost:hover:not(:disabled){background:var(--panel-2)}pre{white-space:pre-wrap;word-break:break-word;margin:0}h3{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 .5rem;font-size:.75rem}.muted{color:var(--muted)}.small{font-size:.8rem}.mono{font-family:var(--mono);font-size:.8rem}.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}.error{color:var(--bad);margin:.25rem 0}.app{flex-direction:column;height:100vh;display:flex}.topbar{border-bottom:1px solid var(--border);background:var(--panel);flex-wrap:wrap;align-items:center;gap:1rem;padding:.6rem 1rem;display:flex}.brand{align-items:center;gap:.45rem;display:flex}.brand .version{border:1px solid var(--border);border-radius:999px;padding:.05rem .4rem;font-size:.75rem}.chips{flex-wrap:wrap;flex:1;align-items:center;gap:.35rem;display:flex}.tts-select{background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent);cursor:pointer;border-radius:999px;padding:.1rem .45rem;font-size:.75rem}.top-actions{align-items:center;gap:.75rem;margin-left:auto;display:flex}.toggle{color:var(--muted);align-items:center;gap:.3rem;display:flex}.dot{background:gray;border-radius:50%;width:.6rem;height:.6rem}.dot.ok{background:var(--ok)}.dot.down{background:var(--bad)}.badge{background:var(--panel-2);border:1px solid var(--border);color:var(--text);white-space:nowrap;border-radius:999px;padding:.1rem .45rem;font-size:.75rem;display:inline-block}.badge.ok{background:var(--ok-soft);color:var(--ok);border-color:#0000}.badge.bad{background:var(--bad-soft);color:var(--bad);border-color:#0000}.badge.warn{background:var(--warn-soft);color:var(--warn);border-color:#0000}.badge.info{background:var(--info-soft);color:var(--info);border-color:#0000}.layout{flex:1;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);min-height:0;display:grid}@media (width<=900px){.layout{grid-template-columns:1fr;grid-auto-rows:minmax(60vh,auto);overflow:auto}}.chat{border-right:1px solid var(--border);flex-direction:column;min-height:0;display:flex}.messages{flex-direction:column;flex:1;gap:1rem;padding:1rem;display:flex;overflow-y:auto}.empty{text-align:center;color:var(--muted);max-width:26rem;margin:auto}.suggestions{flex-direction:column;gap:.4rem;margin-top:1rem;display:flex}.turn{flex-direction:column;gap:.4rem;display:flex}.bubble{text-align:left;border-radius:12px;max-width:85%;padding:.6rem .8rem;line-height:1.45}.bubble p{margin:0 0 .35rem}.bubble.user{background:var(--accent);color:#fff;white-space:pre-wrap;border-bottom-right-radius:4px;align-self:flex-end}.bubble.assistant{background:var(--panel);color:var(--text);border:1px solid var(--border);border-bottom-left-radius:4px;align-self:flex-start}.bubble.assistant:hover{border-color:var(--accent)}.bubble.assistant.selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.bubble .meta{flex-wrap:wrap;align-items:center;gap:.3rem;display:flex}.bubble audio{width:100%;height:32px;margin-top:.5rem}.composer{border-top:1px solid var(--border);background:var(--panel);gap:.5rem;padding:.75rem 1rem;display:flex}.composer textarea{resize:none;font:inherit;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:8px;flex:1;padding:.5rem .6rem}.composer-wrap{border-top:1px solid var(--border);background:var(--panel)}.composer-wrap .composer{border-top:none}.composer-note{margin:0;padding:.5rem 1rem 0;font-size:.85rem}.composer .mic{color:var(--muted);place-items:center;padding:.45rem .6rem;display:grid}.composer .mic.on{color:#fff;background:var(--bad);border-color:var(--bad);animation:1.2s ease-in-out infinite mic-pulse}.composer .mic.blocked{color:var(--bad)}@keyframes mic-pulse{0%,to{box-shadow:0 0 0 0 var(--bad-soft)}50%{box-shadow:0 0 0 5px var(--bad-soft)}}@media (prefers-reduced-motion:reduce){.composer .mic.on{animation:none}}.inspector{background:var(--panel);flex-direction:column;min-height:0;display:flex}.tabs{border-bottom:1px solid var(--border);gap:.15rem;padding:.4rem .5rem 0;display:flex;overflow-x:auto}.tab{color:var(--muted);white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;border-radius:0;padding:.45rem .7rem}.tab.active{color:var(--text);border-bottom-color:var(--accent)}.tab-body{flex-direction:column;flex:1;gap:1.25rem;padding:1rem;display:flex;overflow-y:auto}.notice{background:var(--warn-soft);color:var(--warn);border-radius:8px;margin:0;padding:.5rem .7rem}.error-box{background:var(--bad-soft);color:var(--bad);border-radius:8px;margin:.4rem 0;padding:.5rem .7rem}.kv{grid-template-columns:max-content 1fr;gap:.25rem 1rem;margin:0 0 .5rem;display:grid}.kv>div{display:contents}.kv dt{color:var(--muted)}.kv dd{font-family:var(--mono);word-break:break-word;margin:0;font-size:.8rem}.metrics{grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:.5rem;display:grid}.metric{background:var(--panel-2);border-radius:8px;flex-direction:column;padding:.5rem .6rem;display:flex}.metric.strong{background:var(--accent-soft)}.metric-value{font-variant-numeric:tabular-nums;font-size:1rem;font-weight:600}.metric-label{color:var(--muted);font-size:.75rem}.cost-pie{align-items:center;gap:1rem;margin-top:.75rem;display:flex}.cost-pie svg{flex:none}.pie-legend{flex-direction:column;flex:1;gap:.3rem;min-width:0;margin:0;padding:0;list-style:none;display:flex}.pie-legend li{grid-template-columns:.65rem minmax(4rem,1fr) auto auto;align-items:center;gap:.5rem;font-size:.8rem;display:grid}.pie-legend .swatch{border-radius:2px;width:.65rem;height:.65rem}.pie-legend .pie-amount{color:var(--muted);font-variant-numeric:tabular-nums;text-align:right}.pie-legend .pie-pct{font-variant-numeric:tabular-nums;text-align:right;min-width:3.2rem;font-weight:600}.timeline{flex-direction:column;gap:.3rem;margin:0;padding:0;list-style:none;display:flex}.timeline li{grid-template-columns:7.5rem 1fr 4.5rem;align-items:center;gap:.5rem;display:grid}.bar{background:var(--panel-2);border-radius:999px;height:.5rem;overflow:hidden}.bar>span{background:var(--accent);border-radius:999px;min-width:2px;height:100%;display:block}.table{border-collapse:collapse;width:100%;font-size:.8rem}.table th{text-align:left;color:var(--muted);border-bottom:1px solid var(--border);padding:.3rem .4rem;font-weight:500}.table td{border-bottom:1px solid var(--border);vertical-align:top;padding:.3rem .4rem}.table tr.hl td{background:var(--accent-soft)}.code{background:var(--panel-2);font-family:var(--mono);border-radius:8px;padding:.6rem .7rem;font-size:.8rem}.code .tag{color:var(--tag)}.prompt-msg{flex-direction:column;gap:.3rem;margin-bottom:.75rem;display:flex}.prompt-msg pre{background:var(--panel-2);font-family:var(--mono);border-radius:8px;padding:.6rem .7rem;font-size:.8rem}.badge.role-system{background:var(--warn-soft);color:var(--warn);border-color:#0000}.badge.role-user{background:var(--accent-soft);color:var(--accent);border-color:#0000}.badge.role-assistant{background:var(--ok-soft);color:var(--ok);border-color:#0000}.segments{flex-wrap:wrap;gap:.3rem;display:flex}.seg{border:1px solid var(--border);border-radius:6px;flex-direction:column;padding:.2rem .45rem;font-size:.85rem;display:inline-flex}.seg small{color:var(--muted);font-size:.7rem}.seg-speech{background:var(--accent-soft);border-color:#0000}.seg-break{background:var(--warn-soft);color:var(--warn);font-family:var(--mono);border-color:#0000;font-size:.75rem}.seg-visual{background:var(--info-soft);border-color:#0000}.legend{gap:.3rem;margin:.5rem 0 0;display:flex}.legend .seg{font-size:.7rem}.visible{margin:0 0 .5rem;font-size:1rem;line-height:1.6}.vseg.hl{background:var(--accent-soft);outline:1px solid var(--accent);border-radius:4px}.event{border-bottom:1px solid var(--border);padding:.3rem 0}.event summary{cursor:pointer;align-items:baseline;gap:.5rem;display:flex}.event summary .num{text-align:left;min-width:4.5rem;color:var(--muted)}.event pre{margin-top:.4rem}.error-box .detail{font-family:var(--mono);color:var(--text);background:0 0;margin-top:.35rem;font-size:.8rem}.chosen{color:var(--accent);font-weight:600}.event summary{flex-wrap:wrap}.event h4{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:.6rem 0 .3rem;font-size:.7rem}.view-switch{gap:.15rem;display:flex}.view-switch .tab{padding:.3rem .7rem}.avatar-view{position:relative}.stage{--stage-light:color-mix(in srgb, var(--accent) 16%, var(--panel));--stage-edge:color-mix(in srgb, var(--panel-2) 82%, var(--text) 18%);isolation:isolate;background:radial-gradient(ellipse 38% 46% at 50% 36%, var(--stage-light) 0%, transparent 100%), linear-gradient(to bottom, transparent 62%, color-mix(in srgb, var(--stage-edge) 55%, transparent) 100%), radial-gradient(ellipse 95% 85% at 50% 40%, var(--panel) 0%, var(--panel-2) 52%, var(--stage-edge) 100%);flex:1;min-height:0;position:relative;overflow:hidden}.stage:before{content:"";z-index:0;pointer-events:none;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:absolute;inset:0}.stage:after{content:"";z-index:0;pointer-events:none;box-shadow:inset 0 0 140px color-mix(in srgb, var(--text) 10%, transparent);position:absolute;inset:0}.stage>*{z-index:1}@media (prefers-color-scheme:dark){.stage{--stage-light:color-mix(in srgb, var(--accent) 22%, var(--panel-2));--stage-edge:color-mix(in srgb, var(--bg) 70%, #000 30%)}.stage:before{opacity:.12}.stage:after{box-shadow:inset 0 0 160px #0000008c}}.stage-canvas{position:absolute;inset:0}.stage-overlay{text-align:center;background:color-mix(in srgb, var(--panel) 85%, transparent);flex-direction:column;justify-content:center;align-items:center;gap:.6rem;padding:1.5rem;display:flex;position:absolute;inset:0}.stage-overlay .bar{width:min(20rem,80%)}.stage-metrics{background:color-mix(in srgb, var(--panel) 80%, transparent);color:var(--muted);border-radius:999px;padding:.1rem .45rem;position:absolute;top:.5rem;right:.6rem}.subtitles{border:1px solid var(--border);background:color-mix(in srgb, var(--panel) 86%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);width:max-content;max-width:min(44rem,100% - 2rem);box-shadow:0 6px 24px color-mix(in srgb, var(--text) 10%, transparent);text-align:center;color:var(--muted);text-wrap:balance;border-radius:12px;margin:0;padding:.65rem 1rem;font-size:1.15rem;font-weight:500;line-height:1.45;position:absolute;bottom:1.25rem;left:50%;transform:translate(-50%)}.subtitles span{border-radius:6px;padding:0 .12em;transition:color .12s,background-color .12s}.subtitles .said{color:var(--text)}.subtitles .cur{color:var(--accent);background:var(--accent-soft)}.stage-status{min-height:1.4rem;padding:0 1rem}.stage-status p{margin:.25rem 0}button.icon{place-items:center;padding:.4rem;line-height:1;display:grid}.app.mobile{height:100dvh}.app.mobile .topbar{padding:.45rem .6rem;padding-top:max(.45rem, env(safe-area-inset-top));flex-wrap:nowrap;gap:.5rem}.app.mobile .brand{font-size:1rem}.app.mobile .view-switch{background:var(--panel-2);border-radius:999px;margin-left:auto;padding:.15rem}.app.mobile .view-switch .tab{border:none;border-radius:999px;padding:.3rem .85rem}.app.mobile .view-switch .tab.active{background:var(--panel);color:var(--text);box-shadow:0 1px 3px color-mix(in srgb, var(--text) 15%, transparent)}.app.mobile .layout{flex-direction:column;display:flex;overflow:hidden}.app.mobile .chat{border-right:none;flex:1}.app.mobile .messages{gap:.75rem;padding:.75rem}.app.mobile .bubble{max-width:88%;font-size:15px}.app.mobile .bubble .meta,.app.mobile .bubble audio{display:none}.app.mobile .bubble.assistant.selected{box-shadow:none;border-color:var(--border)}.app.mobile .empty>p{display:none}.app.mobile .composer{padding:.5rem .6rem;padding-bottom:max(.5rem, env(safe-area-inset-bottom));align-items:flex-end}.app.mobile .composer textarea{font-size:16px}.app.mobile .subtitles{padding:.5rem .75rem;font-size:1rem;bottom:.75rem}.sheet-backdrop{z-index:10;background:#00000059;justify-content:flex-end;animation:.15s ease-out fade-in;display:flex;position:fixed;inset:0}.sheet{background:var(--bg);flex-direction:column;width:min(100%,30rem);height:100%;animation:.2s ease-out slide-in;display:flex}.sheet-head{padding:.55rem .75rem;padding-top:max(.55rem, env(safe-area-inset-top));background:var(--panel);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;display:flex}.sheet-body{padding:.75rem;padding-bottom:max(.75rem, env(safe-area-inset-bottom));flex-direction:column;flex:1;gap:.75rem;display:flex;overflow-y:auto}.menu-section{background:var(--panel);border:1px solid var(--border);border-radius:12px;flex-direction:column;align-items:flex-start;gap:.6rem;padding:.75rem;display:flex}.menu-section h3,.menu-section p{margin:0}.menu-section .tts-select{max-width:100%;padding:.35rem .6rem;font-size:.9rem}.menu-section .inspector{border-top:1px solid var(--border);border-radius:0 0 12px 12px;align-self:stretch;margin:0 -.75rem -.75rem}.menu-section .tab-body{overflow:visible}.menu-section .timeline li{grid-template-columns:6rem 1fr 4rem}@keyframes fade-in{0%{opacity:0}}@keyframes slide-in{0%{transform:translate(100%)}}@media (prefers-reduced-motion:reduce){.sheet-backdrop,.sheet{animation:none}}.app.mobile .composer textarea{field-sizing:content;min-height:2.5rem;max-height:8rem}.app.mobile .stage-metrics{display:none}.app.mobile .stage-status{min-height:0}
