*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #FFFFFF;--surface: #F5F5F5;--surface2: #EBEBEB;--border: #E0E0E0;--border2: #CCCCCC;--text: #000000;--text2: #555555;--text3: #999999;--accent: #000000;--accent2: #333333;--green: #555555;--red: #CC0000;--radius: 10px;--radius-lg: 16px}html,body{background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:14px;line-height:1.5;height:100%;-webkit-font-smoothing:antialiased}a{color:var(--text2);text-decoration:none;transition:color .15s}a:hover{color:var(--text)}button{cursor:pointer;border:none;background:none;font-family:inherit}code{font-family:SF Mono,Fira Code,monospace}.app{display:flex;flex-direction:column;min-height:100vh}.nav{border-bottom:1px solid var(--border);position:sticky;top:0;background:#ffffffeb;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:50}.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:0 2rem;height:56px;max-width:690px;width:100%;margin:0 auto}.nav-brand{display:flex;align-items:center;gap:.8rem;font-size:.9rem;font-weight:500}.nav-product{color:var(--text);padding-left:10px}.nav-sep{color:var(--border2)}.nav-demo{color:var(--text3);font-size:.8rem}.nav-links{display:flex;gap:1.5rem;font-size:.85rem}.main{flex:1;display:flex;align-items:stretch;padding:2rem;max-width:1100px;width:100%;margin:0 auto}.agent{display:flex;flex-direction:column;align-items:center;gap:1.25rem;width:100%;max-width:640px;margin:0 auto}.agent-card{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:2.5rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1.25rem;text-align:center}.agent-tag{display:inline-block;padding:.25rem .8rem;background:#0000000d;border:1px solid rgba(0,0,0,.15);border-radius:999px;color:var(--accent);font-size:.68rem;font-weight:700;letter-spacing:.1em}.agent-title{font-size:1.6rem;font-weight:600;color:var(--text);line-height:1.2}.agent-sub{font-size:.82rem;color:var(--text2);line-height:1.6;max-width:380px}.orb{position:relative;width:128px;height:128px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#93c5fd,#2563eb,#1e3a8a);border:none;box-shadow:0 0 32px #2563eb59,0 0 64px #2563eb26;display:flex;align-items:center;justify-content:center;transition:box-shadow .3s ease,background .5s ease;margin:.5rem 0;cursor:pointer;animation:orb-float 4s ease-in-out infinite}.orb:hover:not(:disabled){box-shadow:0 0 44px #2563eb85,0 0 80px #2563eb40}.orb:disabled{opacity:.55;cursor:not-allowed}.orb--listening{background:radial-gradient(circle at 40% 35%,#bfdbfe,#3b82f6,#2563eb);box-shadow:0 0 48px #3b82f68c,0 0 96px #3b82f633;animation:orb-listen 2s ease-in-out infinite}.orb--speaking{background:radial-gradient(circle at 40% 35%,#93c5fd,#1d4ed8,#1e3a8a);box-shadow:0 0 48px #1d4ed899,0 0 96px #1d4ed840;animation:orb-speak 1.1s ease-in-out infinite}.orb--busy{opacity:.7;animation:orb-breathe 1.6s ease-in-out infinite}@keyframes orb-float{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.015)}}@keyframes orb-listen{0%,to{transform:scale(1);box-shadow:0 0 40px #3b82f673}50%{transform:scale(1.05);box-shadow:0 0 68px #3b82f6b8}}@keyframes orb-speak{0%{border-radius:50%;transform:scale(1)}20%{border-radius:44% 56% 53% 47%/52% 46% 54% 48%;transform:scale(1.025)}40%{border-radius:56% 44% 47% 53%/47% 54% 46% 53%;transform:scale(1.03)}60%{border-radius:47% 53% 56% 44%/54% 47% 53% 46%;transform:scale(1.015)}80%{border-radius:53% 47% 44% 56%/46% 53% 47% 54%;transform:scale(1.03)}to{border-radius:50%;transform:scale(1)}}@keyframes orb-breathe{0%,to{box-shadow:0 0 20px #2563eb33}50%{box-shadow:0 0 40px #2563eb73}}.orb-core{position:relative;z-index:2;display:flex;align-items:center;justify-content:center}.ring{position:absolute;border-radius:50%;border:1px solid;opacity:0;animation:ring-out 2.6s ease-out infinite;pointer-events:none;z-index:1}.orb--listening .ring{border-color:#93c5fd8c}.r1{width:148px;height:148px;animation-delay:0s}.r2{width:172px;height:172px;animation-delay:.65s}.r3{width:196px;height:196px;animation-delay:1.3s}@keyframes ring-out{0%{transform:scale(.9);opacity:.75}to{transform:scale(1.05);opacity:0}}.mic{width:34px;height:34px;color:#ffffffd9;transition:color .2s}.spinner{display:block;width:28px;height:28px;border:2px solid rgba(255,255,255,.2);border-top-color:#ffffffe6;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.orb-bars{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;gap:3px;align-items:center;z-index:3}.orb-bar{width:3px;background:#ffffffe6;border-radius:2px;animation:bar-dance .7s ease-in-out infinite alternate;animation-delay:calc(var(--i) * .13s)}.orb-bar:nth-child(1){height:10px}.orb-bar:nth-child(2){height:18px}.orb-bar:nth-child(3){height:26px}.orb-bar:nth-child(4){height:18px}.orb-bar:nth-child(5){height:10px}@keyframes bar-dance{0%{transform:scaleY(.3);opacity:.5}to{transform:scaleY(1);opacity:1}}.orb-caption{font-size:.82rem;color:var(--text2);letter-spacing:.01em;min-height:1.2em}.end-btn{font-size:.75rem;color:var(--text3);padding:.3rem .9rem;border:1px solid var(--border);border-radius:8px;transition:color .15s,border-color .15s;letter-spacing:.03em}.end-btn:hover{color:var(--red);border-color:#ef444466}.chips{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;max-width:380px}.chip{font-size:.72rem;padding:.2rem .65rem;border-radius:999px;font-family:SF Mono,Fira Code,monospace;white-space:nowrap}.chip--active{background:#0000000f;border:1px solid rgba(0,0,0,.2);color:var(--accent);animation:orb-breathe 1.2s ease-in-out infinite}.chip--done{background:#00000008;border:1px solid rgba(0,0,0,.1);color:var(--green)}.agent-error{font-size:.8rem;color:#fca5a5;background:#ef444414;border:1px solid rgba(239,68,68,.2);border-radius:8px;padding:.6rem .9rem;width:100%;text-align:left}.setup-hint{font-size:.78rem;color:var(--text3)}.setup-hint code{color:var(--text2);font-size:.76rem}.transcript{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:1.25rem 1.25rem 1rem;display:flex;flex-direction:column;gap:.85rem;max-height:400px;overflow-y:auto}.msg{display:flex;flex-direction:column;gap:.2rem}.msg-who{font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text3)}.msg--user .msg-who{text-align:right}.msg-text{font-size:.875rem;line-height:1.55;padding:.55rem .85rem;border-radius:4px 14px 14px;background:var(--surface2);border:1px solid var(--border);color:var(--text);max-width:88%}.msg--user .msg-text{background:#0000000a;border-color:#0000001a;border-radius:14px 4px 14px 14px;align-self:flex-end;text-align:right;margin-left:auto}.footer{display:flex;align-items:center;justify-content:center;gap:.75rem;padding:1rem 2rem;border-top:1px solid var(--border);font-size:.75rem;color:var(--text3)}.footer code{color:var(--text2);font-size:.72rem}.footer-sep{color:var(--border)}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:var(--text3)}@media (max-width: 640px){.main{padding:1rem}.agent-card{padding:2rem 1.25rem}.nav{padding:0 1rem}.orb{width:112px;height:112px}.r1{width:132px;height:132px}.r2{width:154px;height:154px}.r3{width:176px;height:176px}}