:root{color-scheme:dark;font-family:Tahoma,Arial,sans-serif;background:#101515;color:#e9f0eb;font-size:14px}*{box-sizing:border-box}body{margin:0}header{max-width:1160px;margin:auto;padding:26px 30px;display:flex;justify-content:space-between;border-bottom:1px solid #2a3530}.brand{display:flex;align-items:center;gap:12px;font-weight:bold}.brand-dot{width:12px;height:12px;background:#b7eb9c;border-radius:50%}small{font-size:11px;color:#91a29a;font-weight:normal;margin-right:10px}.badge{border:1px solid #34443b;color:#bbd2c3;padding:5px 12px;border-radius:30px;font-size:11px;white-space:nowrap}main{max-width:1100px;margin:auto;padding:38px 30px}.hero{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:10px 0 36px}.eyebrow{color:#b7eb9c;font-size:12px}h1{font-size:34px;line-height:1.8;margin:12px 0;font-weight:600}.intro{color:#9eafa5;line-height:2}.face{width:240px;height:165px;background:#070c0a;border:1px solid #32463a;border-radius:50px;display:flex;align-items:center;justify-content:center;gap:26px;position:relative;flex-shrink:0;box-shadow:0 20px 60px #0004}.eye{width:44px;height:55px;border-radius:18px;background:#75ccf7;box-shadow:0 0 23px #46b1e944;transition:all .2s}.face span{position:absolute;bottom:15px;font-size:11px;color:#8da49a}.face[data-state=offline] .eye{height:8px;background:#3f5148;box-shadow:none}.face[data-state=listening] .eye{height:65px}.face[data-state=thinking] .eye{animation:blink 1s infinite}.face[data-state=speaking] .eye{animation:speak .4s ease-in-out infinite alternate}.face[data-state=error] .eye{height:12px;background:#f3ab90;box-shadow:none}@keyframes blink{50%{height:9px}}@keyframes speak{to{height:40px;transform:translateY(-4px)}}.notice{border:1px solid #48543a;background:#202719;color:#d6e6b7;padding:14px 18px;border-radius:12px;line-height:1.9;margin-bottom:20px}.workspace{display:grid;grid-template-columns:340px 1fr;gap:20px}.panel{border:1px solid #2a3830;background:#161e1a;border-radius:18px;padding:24px;min-width:0}h2{font-size:15px;margin:0 0 24px}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.panel-head h2{margin:0}label{display:block;margin:16px 0 9px;color:#c2cfc7;font-size:12px}label span{color:#7e9186;font-size:10px;margin-right:5px}input,select,button{font:inherit;border-radius:9px;border:1px solid #3a4b3f;padding:12px;color:inherit;background:#101813;width:100%}input:focus,select:focus,button:focus-visible{outline:2px solid #b7eb9c;outline-offset:2px}button{cursor:pointer;font-weight:bold;transition:background .2s}button:hover:enabled{background:#2a3d2c}button:disabled,input:disabled{opacity:.45;cursor:default}.primary{background:#b7eb9c;color:#1c2d17;border:0;margin:20px 0 12px}.primary:hover:enabled{background:#d0f9ba}.button-row{display:flex;gap:10px}#mic.recording{background:#6d3228;border-color:#b86c5d}.meter{margin:24px 0;color:#91a598;font-size:11px}progress{width:100%;height:7px;display:block;margin-top:12px;accent-color:#b7eb9c}.metrics{display:flex;gap:24px;border-top:1px solid #2a3830;padding-top:20px}.metrics div{flex:1}.metrics dt{font-size:10px;color:#91a598}.metrics dd{margin:10px 0;direction:ltr;text-align:right}.hint{font-size:11px;line-height:2;color:#8da394;margin-bottom:0}.conversation{display:flex;flex-direction:column}.messages{min-height:240px;max-height:370px;overflow-y:auto;flex:1;padding:5px 0 20px;scroll-behavior:smooth}.empty{color:#80978a;line-height:2;font-size:12px}.message{padding:12px 15px;border-radius:10px;background:#233229;margin:0 0 12px;line-height:2;white-space:pre-wrap;overflow-wrap:anywhere}.message.user{background:#28312a;margin-left:35px}.message.assistant{margin-right:35px;border:1px solid #354c3b}#text-form{display:flex;gap:8px;border-top:1px solid #2a3830;padding-top:18px}#text-form button{width:76px;flex-shrink:0}details{margin-top:20px;color:#91a598;font-size:11px}summary{cursor:pointer}pre{white-space:pre-wrap;font:10px/1.9 monospace;max-height:120px;overflow:auto;color:#9cafa3}footer{margin:24px 0 0;color:#80978a;font-size:11px;line-height:2}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:760px){header{padding:20px}.brand small{display:none}main{padding:25px 18px}.hero{gap:20px;align-items:flex-start}h1{font-size:23px}.intro{font-size:12px}.face{width:130px;height:110px;border-radius:30px;gap:17px;margin-top:30px}.eye{width:24px;height:34px;border-radius:10px}.face[data-state=listening] .eye{height:40px}.face span{font-size:9px;bottom:10px}.workspace{grid-template-columns:1fr}.panel{padding:20px}.messages{min-height:200px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}