:root{color-scheme:dark;font-family:Inter,Arial,sans-serif;background:#03090f;color:#d9edff}*{box-sizing:border-box}body{margin:0;min-height:100svh;overflow-x:hidden}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #9cd9ff;outline-offset:5px}button:disabled{opacity:.35;cursor:default}#rain,.vignette{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}.vignette{background:radial-gradient(ellipse at 50% 38%,transparent 10%,#03090f66 55%,#03090fee 100%)}header{height:100px;padding:0 4.5%;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:3}.brand{display:flex;align-items:center;gap:18px;text-decoration:none;color:#ecf7ff;font-size:20px;letter-spacing:4px}.mark{width:33px;height:38px;border:1px solid #6eaccc;font-size:24px;display:grid;place-items:center;transform:skewY(-12deg);letter-spacing:0}.divider{height:20px;width:1px;background:#466073}.brand small{font-size:11px;letter-spacing:2px;color:#8a9dad}.icon-button{background:#10202c70;border:1px solid #2a3d4c;border-radius:50%;width:42px;height:42px;color:#a3c3dc;font-size:22px}main{position:relative;max-width:1400px;margin:auto;text-align:center}.eyebrow{font-size:11px;letter-spacing:3px;color:#7d9bb1;margin:12px 0 0}.eyebrow span{display:inline-block;width:5px;height:5px;background:#9fd4ff;border-radius:50%;vertical-align:middle;margin-right:10px;box-shadow:0 0 12px #5ebfff}.scene{position:relative;width:min(940px,95vw);height:clamp(270px,45vw,490px);margin:-5px auto -8px;display:grid;place-items:center}.avatar{width:100%;max-height:100%;object-fit:contain;mix-blend-mode:screen;mask-image:radial-gradient(ellipse at center,black 37%,transparent 73%);animation:hover 7s ease-in-out infinite;filter:brightness(.86);position:relative;z-index:1}.halo{position:absolute;width:48%;height:60%;background:#258add14;filter:blur(65px);border-radius:50%}.orbit{position:absolute;bottom:8%;width:53%;height:8%;border:1px solid #6095bd35;border-radius:50%;box-shadow:0 0 30px #338ddb10;animation:orbit 7s ease-in-out infinite}.corner{position:absolute;bottom:14%;font-family:monospace;font-size:10px;letter-spacing:1.5px;line-height:1.9;text-align:left;color:#6c8a9f}.left{left:1%}.right{right:0;text-align:right}.console{position:relative;z-index:2;margin:0 auto;max-width:550px;padding:0 22px}.state{display:flex;justify-content:center;align-items:center;gap:12px;font-size:14px;letter-spacing:.3px;color:#accce5}.wave{height:22px;display:flex;gap:3px;align-items:center}.wave i{width:2px;height:4px;background:#8fd0ff;border-radius:3px}.speaking .wave i{animation:wave .7s infinite alternate}.wave i:nth-child(2n){animation-delay:-.3s}.wave i:nth-child(3n){animation-delay:-.5s}#transcript{font-size:21px;line-height:1.5;font-weight:300;color:#e3f1fc;min-height:32px;margin:18px 0 23px}.actions{display:flex;justify-content:center;gap:12px}.primary,.secondary{border-radius:7px;padding:13px 22px;font-size:14px;transition:.2s}.primary{border:1px solid #77b4e2;background:linear-gradient(120deg,#1f4362,#112b42);color:#ecf7ff;box-shadow:0 0 30px #3b9aff12}.primary:hover{background:#26577d}.primary span{margin-right:8px;color:#9cdbff}.secondary{color:#9ab4c8;border:1px solid #263b4b;background:#0b1722}form{display:flex;margin:23px 0 13px;border:1px solid #263a4b;border-radius:9px;background:#09131dd9;padding:5px 6px 5px 15px;align-items:center}form input{width:100%;background:none;border:0;color:#d9edff;padding:12px 0;font-size:14px;outline:none}form input::placeholder{color:#6f8598}form button{border:0;background:#183249;color:#b9dfff;border-radius:5px;width:35px;height:35px;font-size:23px}.hint{font:10px monospace;letter-spacing:2px;color:#627d91}.hint span{margin:0 10px}footer{position:relative;display:flex;justify-content:space-between;align-items:center;padding:32px 4.5% 24px;font:10px monospace;letter-spacing:2px;color:#5c788e}footer button{border:0;background:none;color:#91adc2;font-size:12px;letter-spacing:.5px}aside{position:fixed;z-index:10;right:26px;top:83px;width:min(350px,calc(100vw - 32px));background:#0b1723f5;backdrop-filter:blur(20px);border:1px solid #355068;border-radius:12px;padding:24px;box-shadow:0 20px 80px #000b}.settings-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:23px}h2{font-size:18px;font-weight:500;margin:0}.settings-head button{color:#abc4d8;background:none;border:0;font-size:26px}aside label{display:block;font-size:14px;margin-top:22px;margin-bottom:10px}aside select{width:100%;padding:10px;background:#132536;border:1px solid #355068;border-radius:5px;font-size:14px}aside p{font-size:12px;color:#91a9bd;line-height:1.6}aside input{width:100%;accent-color:#83c9ff}aside output{float:right;color:#9fcdf0}.settings-note{border-top:1px solid #273c4e;padding-top:16px;margin-top:25px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.speaking .avatar{filter:brightness(1.12) drop-shadow(0 0 15px #78b9ff22)}.paused *{animation-play-state:paused!important}@keyframes hover{0%,100%{transform:translateY(7px)}50%{transform:translateY(-12px)}}@keyframes orbit{50%{transform:scale(.94);opacity:.5}}@keyframes wave{to{height:21px}}@media(min-height:900px){main{padding-top:3vh}.scene{height:52vh;max-height:580px}}@media(max-width:640px){header{height:80px;padding:0 23px}.brand{font-size:17px;gap:12px}.brand small,.divider{display:none}.eyebrow{font-size:9px;letter-spacing:1.8px;margin-top:25px}.scene{margin:28px auto 4px;height:310px;width:115%;left:-7.5%}.corner{display:none}#transcript{font-size:19px}footer{padding:35px 23px}.footer-center{display:none}aside{right:16px}.console{padding:0 28px}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}

[hidden]{display:none!important}dialog{background:#0b1723;color:#d9edff;border:1px solid #355068;border-radius:16px;padding:28px;width:min(420px,90vw)}dialog::backdrop{background:#02070de8;backdrop-filter:blur(10px)}dialog p{color:#91a9bd;line-height:1.5}#loginError{color:#ffb4a4}#transcript{white-space:pre-wrap;overflow-wrap:anywhere;max-height:280px;overflow:auto;text-align:left}.actions{flex-wrap:wrap}aside .check{display:flex;gap:10px;align-items:center}aside .check input{width:auto}aside .secondary{padding:10px;margin-top:12px;font-size:12px}.listening .halo{background:#258add55}#loginForm button{flex-shrink:0}