:root{--bg: #efeeea;--surface: #f8f8f6;--ink: #16181b;--muted: #5f646b;--rule: #d9d8d2;--signal: #ff5a1f;--signal-ink: #d9420c;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:Space Grotesk,system-ui,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}:focus-visible{outline:2px solid var(--signal);outline-offset:2px}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.top{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;max-width:1360px;margin:0 auto;padding:22px clamp(16px,3vw,40px)}.brand{margin:0;font-size:20px;display:flex;align-items:center;gap:10px;font-size:22px;font-weight:700;letter-spacing:-.02em}.logo{width:30px;height:22px;border-radius:4px;background:var(--ink);box-shadow:inset 0 0 0 4px var(--ink),inset 0 0 0 30px var(--signal)}.tagline{flex:1;margin:0;color:var(--muted);min-width:240px}.gh{color:var(--ink);font-weight:600}.layout{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:40px;max-width:1360px;margin:0 auto;padding:10px clamp(16px,3vw,40px) 60px;align-items:start}@media(max-width:1040px){.layout{grid-template-columns:minmax(0,1fr)}}.device{position:relative;padding:2.6%;border-radius:22px;background:linear-gradient(180deg,#23262b,#121417);box-shadow:inset 0 1px #ffffff14,0 26px 34px -24px #16181b8c}.cam{position:absolute;top:1.1%;right:6%;width:6px;height:6px;border-radius:50%;background:#050608}.screen{position:relative;aspect-ratio:16 / 10;overflow:hidden;border-radius:6px;background:#16181b}@media(max-width:640px){.screen{aspect-ratio:3 / 4}}.view{position:absolute;top:0;right:0;bottom:0;left:0}.empty{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;align-content:center;padding:8%;color:#9ca1a8}.empty[hidden]{display:none}.empty p{margin:0;max-width:30em}.empty .big{color:#f6f6f4;font-size:clamp(22px,3vw,38px);font-weight:600;line-height:1.1;margin-bottom:12px;letter-spacing:-.02em}.caption{position:absolute;left:4%;right:4%;bottom:6%;margin:0;padding:12px 18px;border-radius:12px;background:#f8f8f6f5;color:var(--ink);font-size:clamp(15px,1.8vw,22px);line-height:1.3}.caption[data-who=you]{color:var(--muted)}.bar{position:absolute;left:0;right:0;bottom:0;height:6px;opacity:0;background:linear-gradient(90deg,#1d4bff,#00caff 30%,#00caff 70%,#1d4bff);background-size:200% 100%;transition:opacity .2s}.device[data-phase=listening] .bar{opacity:1;animation:sweep 1.6s linear infinite}.device[data-phase=thinking] .bar{opacity:1;animation:pulse .9s ease-in-out infinite alternate}.device[data-phase=speaking] .bar{opacity:.85;background:#00caff}@keyframes sweep{to{background-position:-200% 0}}@keyframes pulse{0%{opacity:.35}}@media(prefers-reduced-motion:reduce){.bar{animation:none!important}}.controls{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center;margin-top:30px}button{font:inherit;cursor:pointer}button:disabled{opacity:.45;cursor:default}.talk{min-height:50px;padding:0 24px;border:0;border-radius:999px;background:var(--signal);color:#fff;font-weight:600}.talk:hover:not(:disabled){background:var(--signal-ink)}.say{display:flex;flex:1 1 280px;min-width:0;gap:6px;padding:5px;border-radius:999px;background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--ink)}.say input{flex:1;min-width:0;border:0;background:transparent;padding:0 14px;font:inherit;color:var(--ink)}.say input:focus-visible{outline:none}.say:focus-within{box-shadow:inset 0 0 0 2px var(--signal)}.say button{min-height:40px;padding:0 18px;border:0;border-radius:999px;background:var(--ink);color:#fff;font-weight:600}.voice{display:inline-flex;gap:8px;align-items:center;color:var(--muted)}.status{min-height:1.5em;margin:14px 0 0;color:var(--muted)}.status.error{color:var(--signal-ink);font-weight:600}.panel{display:grid;gap:32px;min-width:0}.panel h2{margin:0 0 10px;font-size:20px;letter-spacing:-.01em}.count{color:var(--muted);font-weight:500}.connect label{display:block;margin-bottom:6px;color:var(--muted);font-size:14px}.row{display:flex;gap:6px}.row input{flex:1;min-width:0;min-height:46px;padding:0 14px;border:0;border-radius:10px;box-shadow:inset 0 0 0 1.5px var(--ink);background:var(--surface);font:inherit}.row button{min-height:46px;padding:0 18px;border:0;border-radius:10px;background:var(--ink);color:#fff;font-weight:600}.hint{margin:8px 0 0;font-size:14px;color:var(--muted)}.link{padding:0;border:0;background:none;color:var(--signal-ink);font-weight:600;text-decoration:underline}.server{margin:10px 0 0;font-weight:600}.tools,.log{display:grid;gap:8px;margin:0;padding:0;list-style:none}.tools li{padding:10px 12px;border-radius:10px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--rule)}.toolHead{display:flex;align-items:center;gap:8px}.toolHead code{font-family:inherit;font-weight:700}.viewTag{flex:none;padding:1px 8px;border-radius:999px;background:var(--signal);color:#fff;font-size:12px;font-weight:600}.run{margin-left:auto;padding:4px 12px;border:0;border-radius:999px;background:var(--ink);color:#fff;font-size:13px;font-weight:600}.tools p{margin:4px 0 0;font-size:13.5px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.none{color:var(--muted);font-size:14px}.log{max-height:360px;overflow-y:auto;font-size:14.5px}.log li[data-who=you]:before{content:"You  ";font-weight:700;white-space:pre}.log li[data-who=assistant]:before{content:"Assistant  ";font-weight:700;color:var(--signal-ink);white-space:pre}.log li[data-who=tool] code{display:inline-block;padding:2px 10px;border-radius:999px;background:var(--ink);color:#fff;font-family:inherit;font-size:12.5px;overflow-wrap:anywhere}.log li[data-who=note]{color:var(--muted)}.model{margin:10px 0 0;font-size:13px;color:var(--muted)}dialog{width:min(560px,92vw);border:0;border-radius:16px;padding:24px;background:var(--surface);color:var(--ink);box-shadow:0 30px 60px -20px #0006}dialog::backdrop{background:#16181b66}dialog h3{margin:0;font-size:22px}dialog label{display:block;margin:14px 0 6px;font-size:14px;color:var(--muted)}dialog textarea{width:100%;padding:12px;border:0;border-radius:10px;box-shadow:inset 0 0 0 1.5px var(--ink);background:#fff;font:14px/1.4 ui-monospace,monospace}.err{color:var(--signal-ink);min-height:1em}.actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}.actions button{min-height:42px;padding:0 18px;border:0;border-radius:999px;background:var(--signal);color:#fff;font-weight:600}.actions .quiet{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
