:root{--bg:#080c14;--surface:#101824;--input:#172132;--brand:#63d7e8;--glow:#7ae7f2;--text:#eef9fb;--muted:#90a7ad;--border:#29404a;--ok:#6dd5a8;--warn:#e8b86d;--error:#ef7d86;--action:#d5a65d;color-scheme:dark;font-family:Inter,"Segoe UI",system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -20%,color-mix(in srgb,var(--brand) 18%,transparent),transparent 45%),var(--bg);color:var(--text)}
button,input,textarea{font:inherit}.shell{width:min(760px,100%);margin:auto;padding:max(24px,env(safe-area-inset-top)) 18px max(36px,env(safe-area-inset-bottom))}
.hidden{display:none!important}.pair-card,.card{background:color-mix(in srgb,var(--surface) 92%,transparent);border:1px solid var(--border);border-radius:22px;padding:22px;box-shadow:0 20px 70px #0005}.pair-card{max-width:470px;margin:8vh auto}
.eyebrow{margin:0 0 7px;color:var(--brand);font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}h1,h2,p{margin-top:0}h1{font-size:clamp(1.6rem,7vw,2.5rem);line-height:1.05;margin-bottom:12px}h2{font-size:1.08rem;margin-bottom:8px}.muted{color:var(--muted);line-height:1.5;font-size:.9rem}.error{color:var(--error);min-height:1.4em}
label{display:block;margin:18px 0 8px;color:var(--muted);font-size:.82rem;font-weight:650}input,textarea{width:100%;margin-top:7px;padding:13px 14px;border:1px solid var(--border);border-radius:13px;background:var(--input);color:var(--text);outline:none}input:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 18%,transparent)}
button,.button-link{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:13px;padding:12px 17px;background:var(--brand);color:var(--bg);font-weight:800;text-decoration:none;cursor:pointer}button:disabled{opacity:.5;cursor:wait}.quiet{background:transparent;border:1px solid var(--border);color:var(--muted);padding:9px 12px}.mark{display:grid;grid-template-columns:repeat(2,12px);gap:5px;margin-bottom:20px}.mark span{aspect-ratio:1;border-radius:3px;background:var(--brand);box-shadow:0 0 16px color-mix(in srgb,var(--glow) 55%,transparent)}
header,.section-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.hero{position:relative;height:min(54vw,420px);min-height:290px;margin:16px 0;overflow:hidden;border:1px solid var(--border);border-radius:27px;background:linear-gradient(180deg,color-mix(in srgb,var(--surface) 76%,transparent),var(--bg))}.hero canvas{width:100%;height:100%;display:block}.live-copy{position:absolute;left:18px;bottom:16px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:3px 9px;padding:10px 13px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(12px)}.live-copy small{grid-column:2;color:var(--muted)}#live-dot{width:8px;height:8px;border-radius:50%;background:var(--muted);box-shadow:0 0 12px currentColor}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:12px 0}.grid strong{display:block;font-size:1.75rem;margin:5px 0}.card{margin:12px 0;border-radius:19px;box-shadow:none}
.agents{display:grid;gap:9px;margin-top:14px}.agent{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 13px;border-radius:13px;background:var(--input)}.agent strong{display:block;text-transform:capitalize}.agent small{color:var(--muted)}.state{padding:5px 8px;border-radius:999px;border:1px solid var(--border);font-size:.72rem;color:var(--muted)}.state.active{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 45%,var(--border))}
.chat-form,.remote-form{display:grid;gap:10px;margin-top:13px}.reply{white-space:pre-wrap;max-height:430px;overflow:auto;margin:13px 0;padding:15px;border-left:3px solid var(--brand);background:var(--input);border-radius:8px 13px 13px 8px;line-height:1.5}.button-link{margin-top:12px;width:100%}
.chat-actions{display:flex;gap:9px}.chat-actions button{flex:1}.job-history{display:grid;gap:7px;margin-top:12px}.job{padding:9px 11px;border-radius:11px;background:var(--input)}.job small{display:block;color:var(--muted);margin-top:3px}.job.failed,.job.interrupted{border-left:2px solid var(--error)}
.continuity{margin:14px 0;padding:14px;border:1px solid color-mix(in srgb,var(--brand) 42%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--brand) 7%,var(--input))}.continuity>p{margin:5px 0 11px}.continuity-choices{display:grid;gap:8px}.continuity-choice{display:block;width:100%;padding:11px 12px;text-align:left;background:var(--input);color:var(--text);border:1px solid var(--border);font-weight:650}.continuity-choice small{display:block;margin-top:4px;color:var(--muted);font-weight:500}
@media(max-width:560px){.grid{grid-template-columns:1fr}.shell{padding-left:12px;padding-right:12px}.card{padding:18px}.hero{min-height:270px}.section-head{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.hero canvas{animation:none}}