:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#263329;background:#f5f6f1;font-synthesis:none;--green:#355b3d;--level:0;--reply:0}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.55}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #90ad80;outline-offset:5px}[hidden]{display:none!important}
.topbar{height:84px;padding:0 6%;border-bottom:1px solid #e2e6dc;display:flex;align-items:center;justify-content:space-between}.brand{color:#263329;text-decoration:none;display:flex;align-items:center;font-size:19px;font-weight:650;letter-spacing:-.6px;gap:10px}.brand-mark{display:grid;place-items:center;background:#355b3d;color:#fff;width:35px;height:35px;border-radius:11px;font-size:25px;letter-spacing:-3px;padding-right:4px}.brand-light{font-size:13px;font-weight:400;color:#788170;letter-spacing:0;margin-left:4px}.local-badge{font-size:10px;letter-spacing:1.3px;color:#677761;display:flex;align-items:center;gap:8px}.local-badge>span:first-child{width:6px;height:6px;border-radius:50%;background:#8fab75}
main{max-width:940px;margin:0 auto;padding:46px 28px 25px}.intro{text-align:center}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:650;color:#79906e;margin:0 0 14px}h1{font-size:48px;letter-spacing:-2.5px;line-height:1.1;font-weight:500;margin:0}.subtitle{font-size:14px;color:#798173;line-height:1.7;margin:15px 0 29px}
.studio{background:#fff;border:1px solid #e0e6da;border-radius:24px;box-shadow:0 14px 44px #283a2310;overflow:hidden}.studio-heading{display:flex;justify-content:space-between;align-items:center;padding:22px 28px}.mode{font-size:11px;color:#66765c;background:#f2f5ee;border:1px solid #e6ecdf;border-radius:20px;padding:7px 11px;display:flex;align-items:center;gap:7px}.mode>span:first-child{width:5px;height:5px;border-radius:50%;background:#9eaf91}.session-label{font-size:9px;color:#969d91;letter-spacing:1.3px}
.orb-stage{position:relative;height:225px;display:grid;place-items:center;isolation:isolate}.orb-stage:before{content:"";position:absolute;width:300px;height:225px;border-radius:50%;background:radial-gradient(ellipse,#ecf3dfaa,transparent 70%);z-index:-2}.orbit{position:absolute;border:1px solid #e6eedf;border-radius:50%;width:196px;height:196px}.orbit-two{width:242px;height:242px;border-style:dashed;opacity:.55}.orb{position:relative;width:140px;height:140px;border-radius:46% 54% 49% 51% / 51% 45% 55% 49%;background:radial-gradient(circle at 32% 25%,#e4f2c8,#b8d38d 44%,#91b367 75%,#72944f);box-shadow:inset -10px -14px 30px #5e843b33,inset 7px 8px 24px #ffffff99,0 16px 30px #80a95524;transform:scale(calc(1 + var(--level)*.26 + var(--reply)*.15));transition:transform .1s;animation:breathe 5s ease-in-out infinite}.orb-glow{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at 67% 65%,#d5ec9f99,transparent 57%)}.orb-face{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;gap:22px}.orb-face span{height:10px;width:5px;background:#425e34;border-radius:5px;opacity:.75}.waveform{position:absolute;bottom:2px;display:flex;align-items:center;gap:3px;height:24px}.waveform i{width:3px;border-radius:3px;height:calc(3px + var(--level)*var(--bar)*22px + var(--reply)*var(--bar)*15px);min-height:3px;background:#adbe9d;transition:height .09s}
.message{text-align:center;padding:18px 20px 4px;min-height:105px}h2{font-size:23px;font-weight:500;letter-spacing:-.7px;margin:0 0 10px}.message p{font-size:12px;line-height:1.85;color:#7c8476;margin:0}.controls{display:flex;justify-content:center;gap:10px;padding:20px 24px 29px}.controls button{border-radius:11px;min-height:44px;padding:0 19px;display:flex;align-items:center;justify-content:center;gap:9px;font-size:12px;transition:background .2s,transform .2s}.controls button:hover{transform:translateY(-1px)}.primary{border:1px solid #355b3d;background:#355b3d;color:#fff;box-shadow:0 3px 7px #355b3d1a}.primary:hover{background:#294a30}.secondary{background:#fff;border:1px solid #e0e6db;color:#586650}.secondary:hover{background:#f5f8f1}.controls svg{height:17px;width:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.signal-strip{background:#fafbf8;border-top:1px solid #edf0e7;display:grid;grid-template-columns:repeat(3,1fr);padding:19px 29px}.signal{display:flex;align-items:center;gap:12px;padding-left:18px;border-right:1px solid #e6eadf}.signal:first-child{padding-left:0}.signal:last-child{border:0}.signal-title{display:block;font-size:10px;color:#929a8b;margin-bottom:5px}.signal strong{display:block;font-size:11px;font-weight:500;color:#65705e}.signal-icon{width:9px;height:9px;background:#cbd3c5;border-radius:50%;box-shadow:0 0 0 5px #edf1e8}.signal-icon.connected{background:#84aa69;box-shadow:0 0 0 5px #ecf4e6}.mini-meter{display:flex;gap:2px;align-items:center;height:22px;width:25px}.mini-meter i{width:3px;background:#b9c6ad;border-radius:2px;height:calc(3px + var(--meter)*var(--bar)*18px)}
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:29px 15px 22px}.step{font-size:10px;letter-spacing:1px;color:#98a48e}.guide h3{font-size:12px;font-weight:600;margin:9px 0 7px}.guide p{font-size:11px;line-height:1.75;color:#808978;margin:0;max-width:220px}.diagnostics{border-top:1px solid #e0e5d9;padding:17px 5px;color:#818d76;font-size:10px}summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}summary:before{content:"+";margin-right:9px}summary span{margin-left:auto;color:#a0a898}details[open] summary:before{content:"−"}dl{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:20px 0 0}dt{color:#96a28a;font-size:10px}dd{margin:7px 0 0;font-size:11px;color:#647258}footer{display:flex;align-items:center;justify-content:center;gap:7px;font-size:10px;color:#929c88;margin-top:13px;line-height:1.8}.footer-dot{width:4px;height:4px;background:#aebc9e;border-radius:50%}.error{margin:0 28px 20px;padding:12px 15px;border:1px solid #efdbca;border-radius:9px;background:#fff8f2;color:#956343;font-size:12px;line-height:1.6}#audio-elements{position:absolute;width:1px;height:1px;overflow:hidden}
@keyframes breathe{0%,100%{border-radius:46% 54% 49% 51% / 51% 45% 55% 49%}50%{border-radius:53% 47% 54% 46% / 47% 55% 45% 53%}}@media(prefers-reduced-motion:reduce){.orb{animation:none}.orb,.waveform i,.controls button{transition:none}}
@media(max-width:650px){.topbar{height:65px;padding:0 22px}.brand-light{display:none}.brand{font-size:16px}main{padding:35px 16px 23px}h1{font-size:38px}.subtitle{font-size:12px}.studio-heading{padding:20px}.session-label{font-size:8px}.orb-stage{height:215px}.controls{padding:20px 16px 24px;flex-wrap:wrap}.signal-strip{padding:17px 12px}.signal{gap:8px;padding-left:12px}.signal strong{font-size:9px}.signal-title{font-size:9px}.mini-meter{width:19px}.guide{gap:15px;padding:25px 6px}.guide p{font-size:10px}footer{font-size:9px;text-align:center}dl{grid-template-columns:1fr 1fr}.orb{width:130px;height:130px}}

.device-status{display:flex;align-items:center;justify-content:center;gap:10px;font-size:11px;color:#798173;margin:16px 0 0}.device-led{display:inline-block;width:13px;height:13px;border-radius:50%;background:#cad0c6;border:1px solid #aeb8a6}.device-led[data-state="on"],.device-led[data-state="blinking"]{background:#8ccc58;box-shadow:0 0 14px #8ccc5880;border-color:#71a244}.device-led[data-state="blinking"]{animation:device-blink .2s steps(1,end) infinite}.diagnostic-controls{justify-content:flex-start;padding:15px 0 0}@keyframes device-blink{50%{background:#cad0c6;box-shadow:none;border-color:#aeb8a6}}


#login,#device{display:flex;flex-direction:column;gap:18px;max-width:480px;margin:24px auto;text-align:left}
#login[hidden],#device[hidden]{display:none}
#key,#identity{font:inherit;padding:14px;border:1px solid #cdd8c5;border-radius:10px;background:#fff;color:#263d2a;width:100%;box-sizing:border-box}
dd{overflow-wrap:anywhere}
#login .primary,#device .primary{font:inherit;font-weight:600;border:0;border-radius:999px;padding:14px 24px;cursor:pointer;text-align:center}