:root{color-scheme:dark;--ink:#ffffff;--muted:#929aa6;--blue:#3fa9ff;--red:#c41e3a}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#0f1419;font-family:ui-sans-serif,system-ui,Noto Sans Lao,Noto Sans Thai,sans-serif}button{font:inherit}.shell{height:100dvh;min-height:560px;overflow:hidden;position:relative;background:radial-gradient(circle at 45% 38%,#142c40 0,#111c25 27%,#0f1419 60%,#0a0d10 100%)}.shell:before{content:"";position:fixed;inset:0;opacity:.18;pointer-events:none;background-image:linear-gradient(rgba(63,169,255,.05) 1px,transparent 0),linear-gradient(90deg,rgba(63,169,255,.05) 1px,transparent 0);background-size:52px 52px;-webkit-mask-image:radial-gradient(circle,black,transparent 72%);mask-image:radial-gradient(circle,black,transparent 72%)}.nav{height:62px;justify-content:space-between;border-bottom:1px solid rgba(63,169,255,.16);padding:0 clamp(22px,5vw,72px);position:relative;z-index:2;background:#0f1419b8;backdrop-filter:blur(16px)}.brand,.nav{display:flex;align-items:center}.brand{gap:14px;font-weight:700;letter-spacing:-.02em}.brand-logo{width:86px;height:40px;-o-object-fit:contain;object-fit:contain}.brand small{display:block;color:#3fa9ff;font-size:7px;letter-spacing:.2em;margin-top:1px}.secure{display:flex;gap:6px;align-items:center;color:#9aa2ab;font-size:11px}.secure svg{color:#3fa9ff}.voice-panel{width:100%;height:calc(100dvh - 62px);min-height:498px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 20px;position:relative;z-index:1}.orb-wrap{width:218px;height:218px;display:grid;place-items:center}.orb,.orb-wrap{position:relative}.orb{width:120px;height:120px;border-radius:50%;background:radial-gradient(circle at 37% 30%,#e9f7ff 0 3%,#72c8ff 15%,#278bd8 43%,#174b7a 68%,#071a2d 100%);box-shadow:inset -16px -18px 28px #061522aa,inset 10px 7px 22px #d9f3ff70,0 0 34px #3fa9ff66,0 0 86px #1678ca35;transition:.4s ease}.orb-core{inset:32%;background:white;filter:blur(16px);opacity:.35}.orb-core,.orb-shine{position:absolute;border-radius:50%}.orb-shine{inset:3px;background:conic-gradient(from 40deg,transparent,#bde7ff4d,transparent 36%,#fff4,transparent 55%);animation:spin 7s linear infinite}.orbit{position:absolute;border:1px solid #3fa9ff42;border-radius:50%;animation:breathe 3s ease-in-out infinite}.orbit-one{inset:25px}.orbit-two{inset:2px;animation-delay:.5s;opacity:.42}.state-speaking .orb{transform:scale(1.07);box-shadow:0 0 45px #3fa9ff75,0 0 130px #1678ca38}.state-thinking .orb{filter:hue-rotate(40deg);animation:think 1.2s ease-in-out infinite}.state-interrupted .orb,.state-listening .orb{animation:listen 1.4s ease-in-out infinite}.wave{position:absolute;bottom:21px;display:flex;gap:4px;align-items:center;height:28px}.wave i{width:2px;height:7px;border-radius:2px;background:#3fa9ff;animation:wave .8s ease-in-out infinite alternate}.wave i:nth-child(3n){animation-delay:-.3s}.wave i:nth-child(2n){animation-delay:-.55s}.status{text-align:center;margin-top:0}.status h1{font-size:clamp(21px,2.4vw,26px);margin:7px 0 1px;letter-spacing:-.035em}.status p{margin:0;color:var(--muted);font-size:12px}.status-dot{display:inline-block;width:6px;height:6px;background:#3fa9ff;border-radius:50%;box-shadow:0 0 12px #3fa9ff}.status-dot.error{background:#ff6f77;box-shadow:0 0 12px #ff6f77}.transcript{width:min(540px,92vw);min-height:68px;margin:16px 0 14px;padding:10px 22px;text-align:center;border-top:1px solid #3fa9ff24;border-bottom:1px solid #3fa9ff24}.transcript span{color:#3fa9ff;font-size:8px;font-weight:800;letter-spacing:.18em}.transcript p{margin:6px 0 0;color:#f1f1ef;font-size:14px;line-height:1.6}.end-button,.start-button{border:0;border-radius:999px;min-width:190px;padding:11px 22px;display:flex;justify-content:center;align-items:center;gap:8px;cursor:pointer;transition:.2s}.start-button{color:#061725;background:linear-gradient(135deg,#8fd5ff,#3fa9ff);box-shadow:0 8px 32px #3fa9ff42;font-weight:750}.start-button:hover{transform:translateY(-2px);box-shadow:0 12px 40px #3fa9ff66}.end-button{color:#ffb8bb;background:#4d1d223b;border:1px solid #ff687048}.end-button:hover{background:#69282e55}.hint{display:flex;gap:7px;align-items:center;color:#777f88;font-size:9px;margin:10px 0 0}@keyframes spin{to{transform:rotate(1turn)}}@keyframes breathe{50%{transform:scale(1.05);opacity:.2}}@keyframes listen{50%{transform:scale(.96);filter:brightness(1.2)}}@keyframes think{50%{transform:rotate(5deg) scale(1.04)}}@keyframes wave{to{height:25px;opacity:.55}}@media (max-height:820px){.nav{height:56px}.voice-panel{height:calc(100dvh - 56px);min-height:504px;padding:10px 20px}.orb-wrap{width:166px;height:166px}.orb{width:92px;height:92px}.orbit-one{inset:20px}.status h1{font-size:21px;margin-top:5px}.transcript{min-height:56px;margin:10px 0;padding:7px 20px}.transcript p{font-size:13px;line-height:1.45}.hint{margin-top:7px}}@media (max-width:600px){.shell{min-height:600px}.nav{padding:0 18px;height:56px}.brand-logo{width:70px;height:34px}.brand{gap:9px}.secure{font-size:0}.secure svg{width:17px;height:17px}.voice-panel{height:calc(100dvh - 56px);min-height:544px;justify-content:center;padding:12px 16px}.orb-wrap{width:158px;height:158px}.orb{width:88px;height:88px}.orbit-one{inset:20px}.transcript{margin-top:9px}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.001ms!important;animation-iteration-count:1!important}}