@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--ink:#182820;--panel:#20352a;--cream:#f5f0df;--muted:#afbbab;--line:#3c5142;--lime:#d8f26e;--lilac:#b5a0ed;--orange:#f19d74;--signal:#b5a0ed}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--cream);font:14px/1.65 'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.42}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,.lightboard:focus-visible{outline:3px solid var(--orange);outline-offset:4px}[hidden]{display:none!important}.wrap{width:min(1210px,calc(100% - 80px));margin-inline:auto}header{height:94px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{font:600 27px 'Space Grotesk',sans-serif;letter-spacing:-1px}.brand span{font:9px 'DM Sans',sans-serif;letter-spacing:1.5px;color:var(--muted);margin-left:14px;border-left:1px solid var(--line);padding-left:14px}.back{font-size:12px}.hero{padding:65px 0 58px;display:flex;justify-content:space-between;align-items:center;gap:25px}.eyebrow{font-size:9px;letter-spacing:1.7px;font-weight:700;margin:0;display:flex;align-items:center;gap:8px}.dot,.status i{width:6px;height:6px;display:inline-block;border-radius:50%;background:var(--lime);flex-shrink:0}h1{font:500 clamp(46px,5.5vw,74px)/1.06 'Space Grotesk',sans-serif;letter-spacing:-3px;margin:24px 0}h1 em{font-style:normal;color:var(--lime)}.intro{font-size:15px;color:var(--muted);line-height:1.8;margin:0}.hero-stamp{width:235px;height:235px;border:1px solid #6b795b;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;transform:rotate(12deg);margin-right:7%}.hero-stamp>span{font:100px/1.1 'Space Grotesk',sans-serif;color:var(--lilac)}.hero-stamp p{font-size:9px;letter-spacing:3px;text-align:center;line-height:1.6}.workspace{display:grid;grid-template-columns:1.2fr 1fr;gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}.stage{padding:27px 30px;background:#15271d;align-self:stretch;position:relative}.stage-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.stage-head .eyebrow{font-size:8px;letter-spacing:1.2px}.status{font-size:10px;white-space:nowrap;color:var(--muted);display:flex;align-items:center;gap:6px}.status i{background:#7b8979}.status[data-status=live] i{background:var(--lime)}.status[data-status=error] i{background:var(--orange)}.lightboard{padding:60px 15px 24px;--signal:var(--lilac)}.lightboard[data-mode=spark]{--signal:var(--lime)}.lightboard[data-mode=ping]{--signal:var(--orange)}.lightboard[data-mode=celebrate]{--signal:#91d2c3}.keys{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:370px;margin:0 auto;transform:perspective(700px) rotateX(12deg) rotateZ(-6deg);padding:24px;border:1px solid #526347;background:linear-gradient(140deg,#2e4230,#1b2c20);border-radius:26px;box-shadow:0 8px 0 #0e1b13,0 25px 45px #07150f99}.keys i{display:block;aspect-ratio:1.2;border-radius:9px;border:1px solid #718365;background:linear-gradient(135deg,#526348,#334b37);box-shadow:0 4px 0 #0d1c14,inset 0 1px 0 #ffffff20;position:relative;overflow:hidden}.keys i:after{content:'';position:absolute;inset:0;background:var(--signal);opacity:0;box-shadow:inset 0 0 20px #ffffff44}.keys .space-key{aspect-ratio:auto;height:44px;grid-column:span 4;display:grid;place-items:center;font:500 15px 'Space Grotesk',sans-serif;color:#a7b49a;font-style:normal;letter-spacing:-.5px}.signal-indicator{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:43px;color:var(--signal);font-size:9px;letter-spacing:1.6px}.signal-indicator>span:first-child{font-size:25px;line-height:1}.lightboard.playing .keys i:after{animation:signal-glow 3.2s ease-in-out both;animation-delay:calc(var(--n)*40ms)}.lightboard[data-mode=calm].playing .keys i:after{animation-duration:4s;animation-delay:0s}.lightboard[data-mode=ping].playing .keys i:after{animation-duration:1.5s;animation-delay:0s}.lightboard[data-mode=celebrate].playing .keys i:nth-child(3n):after{background:var(--orange)}.lightboard[data-mode=celebrate].playing .keys i:nth-child(3n+1):after{background:var(--lilac)}@keyframes signal-glow{0%{opacity:0}25%{opacity:.8}65%{opacity:.65}100%{opacity:0}}.latest{text-align:center;padding:25px 12px 20px;min-height:176px}.latest .eyebrow{justify-content:center;color:var(--muted);font-size:8px}.latest>p:nth-child(2){font:500 clamp(22px,2.4vw,31px)/1.3 'Space Grotesk',sans-serif;letter-spacing:-.6px;margin:14px 0;overflow-wrap:anywhere}.latest>span{font-size:10px;color:var(--muted)}.audio-controls{display:flex;gap:15px;align-items:center;justify-content:center;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:25px;margin-top:10px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--line);padding:13px 16px;border-radius:5px;background:#283f2e;font-size:12px;font-weight:700;line-height:1.4;min-height:44px}.lime{background:var(--lime);color:var(--ink);border-color:var(--lime)}.lime:hover{background:#e5ff89}.outline{background:none}.full{width:100%}.volume{display:flex;gap:7px;align-items:center;font-size:10px;color:var(--muted)}.volume input{width:76px;accent-color:var(--lime);margin:0}.volume output{min-width:28px}.speech{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:11px;width:100%;justify-content:center}.speech input{accent-color:var(--lime)}.stage-note{font-size:10px;color:var(--muted);text-align:center;line-height:1.7;margin:12px 0 20px}.hardware-note{border-top:1px solid var(--line);padding-top:18px;color:var(--muted);font-size:11px}.hardware-note summary{cursor:pointer;color:var(--cream)}.hardware-note p{margin-bottom:0}.room-panel{padding:29px 32px;border-left:1px solid var(--line)}h2{font:500 28px/1.2 'Space Grotesk',sans-serif;letter-spacing:-.9px;margin:10px 0 20px}.name-field{display:block;margin-bottom:22px}.name-field>span{display:block;font-size:10px;color:var(--muted);margin-top:6px}.room-panel label{font-size:11px;display:block}.room-panel input:not([type=radio]),textarea{width:100%;border:1px solid #53654f;background:#172b1f;color:var(--cream);border-radius:5px;padding:11px 12px;margin-top:6px;min-height:44px;font-size:13px}input::placeholder,textarea::placeholder{color:#8d9f8d;opacity:1}input:disabled,textarea:disabled{opacity:.55}textarea{resize:vertical;min-height:94px;line-height:1.5}#create-form .button,#join-form .button{margin-top:10px}.or{display:flex;align-items:center;gap:12px;margin:20px 0 15px;color:var(--muted);font-size:8px;letter-spacing:1.2px;white-space:nowrap}.or:before,.or:after{content:'';height:1px;background:var(--line);flex:1}.privacy{font-size:11px;color:var(--muted);line-height:1.75;margin:15px 0}.room-identity{display:flex;gap:9px;align-items:center;margin:12px 0;font-size:20px;line-height:1.3;overflow-wrap:anywhere}.room-identity strong{min-width:0}.expiry{font-size:10px;color:var(--muted)}.room-actions{display:flex;gap:16px;align-items:center;margin-top:19px}.text-button{background:none;border:0;padding:0;color:var(--cream);font-size:11px;text-decoration:underline;text-underline-offset:4px;min-height:34px}.room-panel fieldset{padding:0;border:0;border-top:1px solid var(--line);margin:23px 0 0}.room-panel legend{font-size:11px;padding:0 10px 0 0}.room-panel legend span{color:var(--muted);font-size:9px;margin-left:7px}.presets{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:16px}.room-panel .preset{display:flex;flex-direction:column;align-items:center;border:1px solid var(--line);padding:10px 3px;border-radius:6px;cursor:pointer;position:relative;background:#1a3023;text-align:center}.preset input{position:absolute;width:1px;height:1px;opacity:0}.preset:focus-within{outline:2px solid var(--orange);outline-offset:2px}.preset>span{font-size:23px;line-height:1.4;color:var(--lilac)}.preset:nth-child(2)>span{color:var(--lime)}.preset:nth-child(3)>span{color:var(--orange)}.preset:nth-child(4)>span{color:#91d2c3}.preset strong{font-size:10px;font-weight:500}.preset small{font-size:7px;color:var(--muted);margin-top:4px;white-space:nowrap}.preset.selected{border-color:var(--lime);background:#2d4130}.try-signal{display:block;margin:9px 0 13px;color:var(--muted)}.counter{float:right;color:var(--muted);font-size:9px}#send-message{margin-top:9px}.shortcut{font-size:9px;color:var(--muted);margin:9px 0 0;line-height:1.7}.form-status{font-size:11px;color:var(--orange);margin:12px 0 0;min-height:16px;overflow-wrap:anywhere}.room-bottom{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;padding-block:56px 66px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.section-heading h2{font-size:25px;margin-bottom:18px}.section-heading>span{font-size:10px;color:var(--muted);white-space:nowrap}.empty{font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:20px;line-height:1.8}.conversation ol{list-style:none;padding:0;margin:0;max-height:545px;overflow:auto;scrollbar-color:#5a7052 #172b1f;scrollbar-width:thin}.message-item{padding:17px 0;border-top:1px solid var(--line)}.message-meta{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--muted);flex-wrap:wrap}.message-meta strong{font-weight:600;color:var(--cream);overflow-wrap:anywhere}.message-meta time{margin-left:auto;font-size:9px}.message-mode{color:var(--lilac);font-size:15px;line-height:1}.message-item[data-mode=spark] .message-mode{color:var(--lime)}.message-item[data-mode=ping] .message-mode{color:var(--orange)}.message-item[data-mode=celebrate] .message-mode{color:#91d2c3}.message-item p{margin:8px 0 0;font-size:14px;line-height:1.65;overflow-wrap:anywhere;white-space:pre-wrap}.history-note{font-size:10px;color:var(--muted);margin-top:20px}.agent-panel{border-left:1px solid var(--line);padding-left:32px}.agent-panel>p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.85}.agent-endpoint{background:#22392a;border:1px solid var(--line);padding:13px;display:flex;gap:9px;align-items:center;font-size:10px;border-radius:5px;margin-block:19px}.agent-endpoint>span{color:var(--lime);font-size:9px;font-weight:700}.agent-endpoint code{overflow-wrap:anywhere;min-width:0}.agent-panel details{font-size:11px;color:var(--muted);margin:17px 0}.agent-panel summary{cursor:pointer;color:var(--cream)}.agent-panel pre{background:#102318;border:1px solid var(--line);padding:14px;color:#c7d4bd;font-size:10px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:5px}.agent-panel .small{font-size:10px!important}.agent-panel .button{margin-top:1px}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-block:30px 35px}footer p{font-size:10px;color:var(--muted);line-height:1.8}footer>a:last-child{font-size:11px}.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);max-width:min(520px,calc(100% - 32px));padding:13px 19px;background:var(--cream);color:var(--ink);border-radius:7px;font-size:12px;box-shadow:0 8px 35px #0006;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:20}.toast.visible{opacity:1;transform:translate(-50%,0)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:absolute;top:-50px;left:14px;background:var(--lime);color:var(--ink);padding:10px 18px;z-index:30}.skip:focus{top:10px}
@media(max-width:980px){.wrap{width:calc(100% - 48px)}.workspace{grid-template-columns:1fr 1fr}.stage{padding:25px 20px}.stage-head{flex-direction:column;align-items:flex-start}.room-panel{padding:25px 22px}.lightboard{padding:55px 0 24px}.keys{gap:8px;padding:18px}.presets{gap:5px}.preset small{font-size:6px}.hero-stamp{margin-right:2%;width:195px;height:195px}.room-bottom{gap:28px}.agent-panel{padding-left:24px}}
@media(max-width:740px){.wrap{width:calc(100% - 32px)}header{height:74px}.brand{font-size:23px}.brand span{font-size:7px;margin-left:9px;padding-left:9px}.back{font-size:10px}.hero{padding:40px 0 32px;position:relative}.hero .eyebrow{font-size:7px;letter-spacing:1.1px}h1{font-size:49px;letter-spacing:-2.3px;margin:20px 0}.intro{font-size:13px}.hero-stamp{display:none}.workspace{grid-template-columns:1fr}.stage{padding:21px 19px}.stage-head{flex-direction:row;gap:8px}.stage-head .eyebrow{font-size:7px;letter-spacing:.8px}.status{font-size:9px}.lightboard{padding:36px 23px 8px}.keys{max-width:325px;padding:20px;gap:9px;border-radius:22px}.keys i{border-radius:7px}.keys .space-key{height:37px}.signal-indicator{margin-top:31px;font-size:8px}.latest{padding:21px 0 13px;min-height:132px}.latest>p:nth-child(2){font-size:27px}.audio-controls{padding-top:20px;gap:10px}.audio-controls .button{font-size:11px;padding:11px 13px}.room-panel{border-left:0;border-top:1px solid var(--line);padding:25px 22px}.presets{gap:8px}.preset small{font-size:7px}.room-bottom{grid-template-columns:1fr;padding-block:34px 42px;gap:35px}.agent-panel{border-left:0;border-top:1px solid var(--line);padding:29px 0 0}.section-heading h2{font-size:25px}.conversation ol{max-height:400px}.hardware-note{padding-top:14px}.stage-note{margin-bottom:15px}.agent-endpoint{font-size:10px}footer{flex-wrap:wrap;gap:12px}footer p{order:3;width:100%;margin:0}.volume input{width:63px}}
@media(max-width:359px){.brand span{display:none}.back{font-size:9px}h1{font-size:42px}.stage{padding:19px 15px}.stage-head{flex-direction:column;gap:6px}.lightboard{padding-inline:8px}.keys{padding:16px;gap:8px}.latest>p:nth-child(2){font-size:24px}.room-panel{padding:24px 17px}.preset small{display:none}.presets{gap:5px}.preset strong{font-size:9px}.room-actions{gap:12px}.room-actions .button{font-size:11px}.section-heading{align-items:flex-start}.section-heading h2{font-size:22px}.hero .eyebrow{font-size:6.5px}.intro br{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}.keys{transform:none}.lightboard.playing .keys i:after{opacity:.65}.hero-stamp{transform:none}}

.close-room{color:var(--orange);font-size:10px;margin-top:-3px}.privacy-details{border-top:1px solid var(--line);padding-top:16px;margin-top:22px!important}.form-status[data-kind=success]{color:var(--lime)}

.bridge-download{display:inline-block;color:var(--lime);font-size:11px;text-decoration:underline;text-underline-offset:4px;margin-top:14px}