:root{color:#eef1f5;background:#fff;font-family:Manrope,PingFang SC,sans-serif;font-synthesis:none}*{box-sizing:border-box}html,body,#app{min-height:100%;margin:0}body{min-width:320px;overflow-x:hidden}button,input{font:inherit}button{color:inherit}.tab-guard{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px;background:#05070ae0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tab-guard[hidden]{display:none}.tab-guard-card{width:min(460px,100%);padding:32px;border:1px solid rgba(255,255,255,.14);background:#0c0f14f0;color:#eef1f5;box-shadow:0 24px 80px #00000080}.tab-guard-card h2{margin:-2px 0 12px;font-size:28px;letter-spacing:-.04em}.tab-guard-card>p:not(.phase-kicker){margin:0;color:#eef1f5b8;font-size:13px;line-height:1.7}.tab-guard-card button{width:100%;height:48px;margin-top:24px;border-radius:999px;cursor:pointer;font-weight:600;background:#ffffff1a;color:#fff;border:1px solid rgba(255,255,255,.4)}.tab-guard-card button:hover:not(:disabled){background:#fff3}.tab-guard-card button:disabled{opacity:.55;cursor:wait}.tab-guard-card button[hidden]{display:none}.phase-kicker{margin:0 0 10px;font:500 10px/1 DM Mono,monospace;letter-spacing:.14em;color:#b2d6ffb3}.voice-button{display:flex;align-items:center;border:0;border-radius:999px;cursor:pointer;transition:transform .16s ease,background .16s ease}.voice-button:disabled{cursor:wait}#friendly-error,#session-end{position:fixed;inset:0;z-index:130;display:grid;place-items:center;background:#05070ae0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#eef1f5;font-family:PingFang SC,Hiragino Sans GB,Noto Sans CJK SC,Microsoft YaHei,system-ui,sans-serif}.friendly-error-inner{display:grid;justify-items:center;gap:12px;text-align:center;max-width:520px;padding:0 24px}.friendly-error-kicker{margin:0;font-size:12px;letter-spacing:.4em;color:#eef1f580}.friendly-error-inner h2{margin:0;font-size:28px;font-weight:600;letter-spacing:.04em}.friendly-error-body{margin:0;font-size:15px;line-height:1.7;color:#eef1f5c7}.friendly-error-inner button{margin-top:10px;padding:12px 40px;border-radius:999px;border:1px solid rgba(255,255,255,.4);background:#ffffff1a;color:#fff;font-size:16px;letter-spacing:.04em;cursor:pointer}.friendly-error-inner button:hover{background:#fff3}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}:root{--stage-w: min(100vw, calc((100vh - 96px)*.5625) );--stage-h: min(177.777778vw, calc(100vh - 96px) );--stage-top: calc(50% - var(--stage-h) / 2);--stage-bottom: auto}@supports (height: 100dvh){:root{--stage-w: min(100vw, calc((100dvh - 96px)*.5625) );--stage-h: min(177.777778vw, calc(100dvh - 96px) )}}@media(orientation:portrait)and (max-width:900px){:root{--hud-top-h: calc(env(safe-area-inset-top, 0px) + 72px) ;--hud-bottom-h: calc(env(safe-area-inset-bottom, 0px) + 170px) ;--stage-h: min(177.777778vw, calc(100vh - var(--hud-top-h) - var(--hud-bottom-h)));--stage-w: calc(var(--stage-h) * .5625);--stage-top: var(--hud-top-h)}@supports (height: 100dvh){:root{--stage-h: min(177.777778vw, calc(100dvh - var(--hud-top-h) - var(--hud-bottom-h)))}}}body[data-demo-shell]{background:#fff}body[data-demo-shell] #body-stage-host{position:fixed;inset:0;z-index:0;background:#fff;overflow:hidden}body[data-demo-shell] #body-stage-host .e108-scene{position:absolute;left:calc(50% - var(--stage-w) / 2);top:var(--stage-top);bottom:var(--stage-bottom);width:var(--stage-w);height:var(--stage-h);border-radius:0;box-shadow:none}@font-face{font-family:"Noto Serif SC Sub";src:url(/fonts/noto-serif-sc-600-sub.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+2E80-2FDF,U+3000-303F,U+3100-312F,U+31A0-31BF,U+3400-4DBF,U+4E00-9FFF,U+F900-FAFF,U+FE30-FE4F,U+FF00-FFEF}#demo-hud{position:fixed;inset:0;z-index:40;overflow:hidden;pointer-events:none;--holo: rgba(150, 200, 255, .85);--holo-soft: rgba(150, 200, 255, .45);--mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;--cjk-serif: "Fraunces", "Noto Serif SC Sub", "Songti SC", "STSong", serif;font-family:PingFang SC,Hiragino Sans GB,Noto Sans CJK SC,system-ui,sans-serif}.hud-scene{position:absolute;left:calc(50% - var(--stage-w) / 2);top:var(--stage-top);bottom:var(--stage-bottom);width:var(--stage-w);height:var(--stage-h)}.hud-status{position:absolute;right:67.8%;top:max(21.5%,calc(var(--stage-crop-y, 0px) + 14px));display:grid;justify-items:end;gap:6px;padding:10px 14px 11px 18px;text-align:right;opacity:0;transform:translateY(6px);transition:opacity .5s ease,transform .5s ease}.hud-status.is-on{opacity:1;transform:none}.hud-status:after{content:"";position:absolute;right:0;top:4%;bottom:4%;width:2.5px;background:linear-gradient(180deg,transparent,rgba(150,200,255,.7) 30%,rgba(150,200,255,.7) 70%,transparent);box-shadow:0 0 14px #96c8ff80}.hud-status .k{font-family:var(--mono);font-size:clamp(9px,.72vw,12px);letter-spacing:.34em;text-indent:.34em;color:#b2d6ffb8;text-transform:uppercase;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.9),0 2px 10px rgba(0,0,0,.6)}.hud-status .t{font-family:var(--cjk-serif);font-weight:600;font-size:clamp(15px,1.35vw,24px);letter-spacing:.04em;color:#f2f5fa;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.9),0 2px 10px rgba(0,0,0,.65),0 0 14px rgba(120,180,255,.22)}.hud-status.is-swap .k,.hud-status.is-swap .t{animation:hud-swap .36s ease}@keyframes hud-swap{0%{opacity:0;transform:translateY(5px)}}.hud-status[data-state=speaking]:after{animation:hud-rail 1.4s ease-in-out infinite alternate}@keyframes hud-rail{0%{box-shadow:0 0 8px #96c8ff40}to{box-shadow:0 0 18px #96c8ff99}}.hud-status[data-state=relink]:after{background:linear-gradient(180deg,transparent,rgba(255,179,84,.75) 30%,rgba(255,179,84,.75) 70%,transparent);box-shadow:0 0 14px #ffb35473;animation:hud-rail-warn 1.1s ease-in-out infinite alternate}@keyframes hud-rail-warn{0%{opacity:.55}to{opacity:1}}.hud-captions{position:absolute;left:50%;bottom:10.2%;transform:translate(-50%);width:68%;display:grid;justify-items:center;gap:10px}.hud-user{display:flex;align-items:baseline;gap:10px;max-width:88%;opacity:0;transform:translateY(4px);transition:opacity .38s ease,transform .38s ease}.hud-user.is-on{opacity:1;transform:none}.hud-user-tag{flex:none;font-family:var(--mono);font-size:clamp(9px,.68vw,11px);letter-spacing:.3em;color:#aad2ff8c}.hud-user-clip{font-size:clamp(13px,1.05vw,18px);max-height:1.75em;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}.hud-user-text{margin:0;font-size:inherit;line-height:1.75;letter-spacing:.03em;color:#d6e6faeb;text-shadow:0 1px 8px rgba(0,0,0,.7);overflow-wrap:break-word;word-break:normal;line-break:auto;text-align:center}.hud-user.is-final .hud-user-text{animation:hud-settle .42s ease}@keyframes hud-settle{0%{color:#fff;text-shadow:0 0 14px rgba(150,200,255,.55)}}.hud-joi{width:100%;opacity:0;transform:translateY(5px);transition:opacity .42s ease,transform .42s ease}.hud-joi.is-on{opacity:1;transform:none}.hud-joi-clip{font-size:clamp(17px,1.75vw,30px);max-height:3.24em;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 12%);mask-image:linear-gradient(180deg,transparent 0,#000 12%)}.hud-joi-text{margin:0;font-family:var(--cjk-serif);font-weight:600;font-size:inherit;line-height:1.62;letter-spacing:.02em;text-align:center;color:#f5f7fa;text-shadow:0 2px 12px rgba(0,0,0,.78),0 0 16px rgba(120,180,255,.28);overflow-wrap:break-word;word-break:normal;line-break:auto}.hud-joi-text span{opacity:0;animation:hud-char .15s ease-out forwards}@keyframes hud-char{0%{opacity:0;transform:translateY(3px);filter:blur(2px)}to{opacity:1;transform:none;filter:none}}.hud-joi.is-live .hud-joi-text:after{content:"";display:inline-block;width:2.5px;height:1em;margin-left:6px;vertical-align:-.12em;background:var(--holo);box-shadow:0 0 10px #96c8ffcc;animation:hud-caret .9s steps(1) infinite}@keyframes hud-caret{50%{opacity:0}}.hud-dock{position:absolute;left:50%;bottom:3%;transform:translate(-50%);display:flex;align-items:center;gap:12px;pointer-events:none}.hud-dock>*{pointer-events:auto}#demo-hud .voice-button{position:relative;min-width:0;display:inline-flex;align-items:center;justify-content:center;padding:13px 46px;border:0;border-radius:999px;background:#0c0c168c;color:#efeefc;cursor:pointer;text-align:center;font-family:var(--cjk-serif);transition:opacity .3s,transform .3s,box-shadow .3s,padding .3s}#demo-hud .voice-button:before{content:"";position:absolute;inset:0;border-radius:999px;padding:1.2px;background:linear-gradient(100deg,#7c5cff,#4fd8e8,#ffb454);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}#demo-hud .voice-button:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 8px 34px -6px #7c5cff80}#demo-hud .voice-button:disabled{opacity:.35;cursor:wait}#demo-hud .voice-button b{font-weight:600;font-size:clamp(14px,1.15vw,19px);letter-spacing:.08em;text-indent:.08em;white-space:nowrap}#demo-hud .voice-button.is-active{padding:8px 22px;background:#0c0c1661;opacity:.45}#demo-hud .voice-button.is-active:before{background:#ffffff38}#demo-hud .voice-button.is-active b{font-size:11.5px;letter-spacing:.06em;text-indent:.06em}#demo-hud .voice-button.is-active:hover{opacity:.9;transform:none;box-shadow:none}.hud-summon{position:absolute;inset:0;opacity:0;transition:opacity .52s ease;pointer-events:none}.hud-summon.is-on{opacity:1}.hud-summon-still{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}.hud-slowwait:not([hidden]){position:absolute;bottom:8%;left:50%;transform:translate(-50%);z-index:3;width:max-content;max-width:85%;padding:10px 14px;color:#f4f5f8;background:#080b13db;border-radius:12px;font:13px/1.4 system-ui;text-align:center;pointer-events:auto}.hud-summon-notes{position:absolute;inset:0;z-index:1;pointer-events:none}.hud-loading:not([hidden]){position:fixed;left:50%;transform:translate(-50%);z-index:3;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);width:min(320px,calc(100vw - 48px));color:#23354d;pointer-events:none}.hud-loading-title{margin:0 0 14px;text-align:center;font-family:var(--cjk-serif);font-size:26px;font-weight:500}.hud-loading-bar{height:4px;border-radius:2px;background:#e6ebf1;overflow:hidden}.hud-loading-bar i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7c8cff,#4fd8e8,#ffb454);transition:width .42s ease}.hud-loading-steps{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px;font:14px/1.3 system-ui,sans-serif}.hud-loading-steps li{display:flex;align-items:center;gap:10px;color:#a8b3bf}.hud-loading-steps li:before{content:"";flex:none;box-sizing:border-box;width:15px;height:15px;border-radius:50%;border:1.5px solid #d6dde5;color:#22a35a;font-size:14px;line-height:12px;text-align:center}.hud-loading-steps li.is-active{color:#23354d;font-weight:600}.hud-loading-steps li.is-active:before{border-color:#4a7bd8;border-right-color:transparent;animation:hud-loading-spin .9s linear infinite}.hud-loading-steps li.is-done{color:#23354d}.hud-loading-steps li.is-done:before{content:"✓";border:0}@keyframes hud-loading-spin{to{transform:rotate(360deg)}}@keyframes hud-sheet-up{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.hud-loading-steps li.is-active:before{animation:none}.hud-loading-bar i{transition:none}}#demo-hud .hud-summon-still{filter:grayscale(1) blur(6px);opacity:.75;transition:opacity .4s ease}#demo-hud.is-rendered .hud-summon-still{opacity:0}.hud-slowwait button{margin-left:10px;color:inherit;background:transparent;border:1px solid currentColor;border-radius:7px;padding:5px 9px;cursor:pointer}body[data-person-cover="1"] #body-stage-host[hidden]{display:flex!important}body[data-person-cover="1"] .joi-figure-slot>*{visibility:hidden!important}body[data-person-cover="1"] #demo-hud.is-shrouded .hud-scene{opacity:1!important;visibility:visible!important}body[data-person-cover="1"] #demo-hud .hud-status,body[data-person-cover="1"] #demo-hud .hud-captions,body[data-person-cover="1"] #demo-hud .hud-dock,body[data-person-cover="1"] #demo-hud .hud-plays,body[data-person-cover="1"] #demo-hud .hud-pop,body[data-person-cover="1"] #demo-hud .hud-rotate{visibility:hidden!important}body[data-person-cover="1"] .hud-summon{opacity:1!important;transition:none!important}.hud-plays{position:absolute;right:calc(2% + var(--stage-crop-x, 0px));bottom:3%;display:flex;gap:10px;align-items:center;transition:opacity .4s ease}.hud-play{pointer-events:auto;position:relative;width:44px;height:44px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(150,200,255,.42);background:#0a0d1794;color:#cde4ffeb;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 2px 14px #00000059,inset 0 0 12px #96c8ff12;opacity:.85;transition:opacity .22s,border-color .22s,background .22s,box-shadow .22s,transform .22s}.hud-play svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.hud-play:hover,.hud-play.is-open{opacity:1;border-color:#a0d2ffd9;background:#0e1322d1;box-shadow:0 2px 18px #0006,0 0 18px #78b4ff47,inset 0 0 14px #96c8ff1f;transform:translateY(-1px)}.hud-play.is-open{color:#eaf4ff}.hud-play:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%,4px);padding:6px 12px;border-radius:8px;white-space:nowrap;background:#090b13eb;border:1px solid rgba(150,200,255,.3);color:#e2eefcf2;font-family:var(--cjk-serif);font-weight:600;font-size:12px;letter-spacing:.03em;text-indent:.03em;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,transform .2s ease,visibility .2s}.hud-play:before{content:"";position:absolute;bottom:calc(100% + 7px);left:50%;transform:translate(-50%,4px) rotate(45deg);width:8px;height:8px;background:#090b13eb;border-right:1px solid rgba(150,200,255,.3);border-bottom:1px solid rgba(150,200,255,.3);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s ease,transform .2s ease,visibility .2s}.hud-play:hover:after,.hud-play:hover:before{opacity:1;visibility:visible;transform:translate(-50%)}.hud-play:hover:before{transform:translate(-50%) rotate(45deg)}#demo-hud.is-waking .hud-plays,#demo-hud.is-waking .hud-dock,#demo-hud.is-waking .hud-pop{opacity:0;visibility:hidden}#demo-hud.is-shrouded .hud-scene{opacity:0;visibility:hidden;transition:opacity .26s ease,visibility .26s}.hud-pop{position:absolute;right:calc(2% + var(--stage-crop-x, 0px));bottom:calc(3% + 60px);width:min(340px,34%);pointer-events:auto;padding:15px 16px 13px;border-radius:16px;background:#090b13e0;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 18px 50px -12px #000000a6;opacity:0;transform:translateY(6px);transition:opacity .24s ease,transform .24s ease}.hud-pop:before{content:"";position:absolute;inset:0;border-radius:16px;padding:1px;background:linear-gradient(120deg,#7c5cff8c,#4fd8e873,#ffb45466);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.hud-pop[hidden]{display:none}.hud-pop.is-on{opacity:1;transform:none}.hud-pop.is-busy{pointer-events:none;opacity:.7}.hud-pop-grid{display:flex;flex-wrap:wrap;gap:7px;max-height:min(46vh,420px);overflow-y:auto}.hud-pop-chip{padding:6px 13px;border-radius:999px;border:1px solid rgba(150,200,255,.22);background:#96c8ff0f;color:#e2eefce0;font-family:var(--cjk-serif);font-weight:600;font-size:12.5px;letter-spacing:.02em;text-indent:.02em;cursor:pointer;transition:border-color .2s,background .2s,color .2s}.hud-pop-chip:hover{border-color:#a0d2ff99;background:#96c8ff24;color:#fff}.hud-pop-chip.is-active{border-color:#a0d2ffd9;background:#7c5cff47;color:#fff}.hud-pop-chip.is-flash{animation:hud-chip-flash .6s ease}@keyframes hud-chip-flash{30%{background:#96c8ff59;border-color:#cfe6ff;color:#fff}}@media(orientation:portrait)and (max-width:900px),(orientation:landscape)and (max-height:600px){#demo-hud:after{content:"";position:fixed;left:0;right:0;bottom:0;height:38vh;height:38dvh;z-index:0;background:linear-gradient(180deg,transparent,rgba(4,6,11,.3) 26%,rgba(4,6,11,.8) 46%,rgba(4,6,11,.93) 64%,rgba(4,6,11,.97));pointer-events:none}#demo-hud:before{content:"";position:fixed;left:0;right:0;top:0;height:18vh;height:18dvh;z-index:0;background:linear-gradient(180deg,rgba(4,6,11,.62),transparent);pointer-events:none}.hud-status,.hud-captions,.hud-dock,.hud-plays,.hud-pop,.hud-rotate{position:fixed;z-index:2}.hud-play{-webkit-backdrop-filter:none;backdrop-filter:none;background:#0a0d17b8}.hud-pop{-webkit-backdrop-filter:none;backdrop-filter:none;background:#090b13f2}.hud-status{right:auto;top:calc(env(safe-area-inset-top,0px) + 26px);left:calc(env(safe-area-inset-left,0px) + 20px);justify-items:start;text-align:left;padding:8px 14px 9px 12px}.hud-status:after{right:auto;left:0}.hud-status .t{font-size:16px}.hud-status .k{font-size:9px}.hud-plays{flex-direction:column;gap:30px;right:calc(env(safe-area-inset-right,0px) + 14px);bottom:auto}.hud-play-label{position:absolute;top:calc(100% + 5px);left:50%;transform:translate(-50%);font-size:9.5px;letter-spacing:.02em;white-space:nowrap;color:#bed7f5ad;text-shadow:0 1px 4px rgba(0,0,0,.9)}.hud-play:after,.hud-play:before{display:none}.hud-dock{transform:none}#demo-hud .voice-button b{font-size:15px}#demo-hud .voice-button.is-active b{font-size:11.5px}}@media(orientation:portrait)and (max-width:900px){.hud-captions{left:24px;right:24px;width:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 82px);transform:none;justify-items:center}.hud-dock{left:0;right:0;justify-content:center;bottom:calc(env(safe-area-inset-bottom,0px) + 16px)}.hud-pop{left:16px;right:16px;width:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 88px)}.hud-rotate{top:calc(env(safe-area-inset-top,0px) + 26px);right:calc(env(safe-area-inset-right,0px) + 16px)}.hud-rotate .r-l{display:none}}@media(orientation:landscape)and (max-height:600px){.hud-status{top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 124px);left:calc(env(safe-area-inset-left,0px) + 14px)}.hud-status .t{font-size:14px}.hud-plays{top:calc(env(safe-area-inset-top,0px) + 36px);gap:22px;right:calc(env(safe-area-inset-right,0px) + 12px)}.hud-captions{left:calc(env(safe-area-inset-left,0px) + 14px);right:auto;width:min(46vw,400px);bottom:calc(env(safe-area-inset-bottom,0px) + 20px);transform:none;justify-items:start;gap:8px}.hud-user{max-width:100%}.hud-user-text,.hud-joi-text{text-align:left}.hud-joi-clip{font-size:19px}.hud-user-clip{font-size:13px}.hud-dock{right:calc(env(safe-area-inset-right,0px) + 110px);left:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 18px)}.hud-pop{right:calc(env(safe-area-inset-right,0px) + 74px);left:auto;width:min(320px,44vw);bottom:calc(env(safe-area-inset-bottom,0px) + 18px)}.hud-rotate{top:calc(env(safe-area-inset-top,0px) + 14px);left:calc(env(safe-area-inset-left,0px) + 14px);right:auto}.hud-rotate .r-p{display:none}}.hud-rotate,.hud-play-label{display:none}@media(orientation:portrait)and (max-width:900px),(orientation:landscape)and (max-height:600px){.hud-play-label{display:block}.hud-rotate:not([hidden]){display:inline-flex;align-items:center;gap:7px;pointer-events:auto;padding:7px 12px 7px 10px;border-radius:999px;border:1px solid rgba(150,200,255,.3);background:#090c1499;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#c8e0fcd9;font-size:11px;letter-spacing:.03em;font-family:var(--cjk-serif);cursor:pointer;transition:opacity .4s ease}.hud-rotate.is-fading{opacity:0}.hud-rotate svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}}#demo-hud.is-waking .hud-rotate,#demo-hud.is-shrouded .hud-rotate{opacity:0;visibility:hidden}#demo-hud .hud-scene{left:0;top:0;bottom:auto;width:100%;height:100%}#demo-hud .hud-summon,#demo-hud .hud-summon-notes{inset:auto;left:calc(50% - var(--stage-w) / 2);top:var(--stage-top);width:var(--stage-w);height:var(--stage-h)}#demo-hud:before,#demo-hud:after{display:none}#demo-hud .hud-status{position:fixed;left:max(20px,env(safe-area-inset-left));right:auto;top:max(18px,env(safe-area-inset-top));justify-items:start;text-align:left;padding-left:14px}#demo-hud .hud-status:after{left:0;right:auto;background:linear-gradient(180deg,transparent,#8fa6c4 30%,#8fa6c4 70%,transparent);box-shadow:none}#demo-hud .hud-status .k{color:#5b6f88;text-shadow:none}#demo-hud .hud-status .t{color:#23354d;text-shadow:none}#demo-hud .hud-captions{position:fixed;left:max(24px,env(safe-area-inset-left));right:auto;transform:none;justify-items:start;width:min(420px,calc((100vw - var(--stage-w)) / 2 - 48px));bottom:max(28px,calc(env(safe-area-inset-bottom) + 20px))}#demo-hud .hud-captions .hud-user-text,#demo-hud .hud-captions .hud-joi-text{text-align:left}#demo-hud .hud-joi-clip{max-height:min(60vh,19.44em)}#demo-hud .hud-user-clip{max-height:7em}#demo-hud .hud-loading:not([hidden]){left:max(24px,env(safe-area-inset-left));right:auto;top:50%;bottom:auto;transform:translateY(-50%);width:min(320px,calc((100vw - var(--stage-w)) / 2 - 48px))}#demo-hud .hud-loading-title{text-align:left}#demo-hud .hud-joi,#demo-hud .hud-user{color:#202d3c;background:#fffffff0;border-radius:12px;padding:8px 12px;text-shadow:none}#demo-hud .hud-joi-text,#demo-hud .hud-user-text,#demo-hud .hud-user-tag{color:#23354d;text-shadow:none}#demo-hud .hud-joi.is-live .hud-joi-text:after{background:#4d6c95;box-shadow:none}#demo-hud .hud-dock{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom))}#demo-hud .voice-button{color:#172b42;background:#fffffff5;border:1px solid #a9bbd0;box-shadow:0 3px 16px #142b421a}#demo-hud .voice-button.is-active{color:#fff;opacity:1;background:#233e61}#demo-hud .hud-plays{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));color:#203451}#demo-hud .hud-play{color:#203451;background:#fffffff0;border-color:#d2dbe5}#demo-hud .hud-slowwait:not([hidden]){color:#243449;background:#fff;box-shadow:0 3px 16px #142b421a}#demo-hud .voice-icon{display:none}@media(orientation:portrait)and (max-width:900px){#demo-hud .hud-status{left:16px;top:calc(env(safe-area-inset-top,0px) + 12px)}#demo-hud .hud-dock{left:auto;right:16px;top:calc(env(safe-area-inset-top,0px) + 96px);bottom:auto;transform:none;justify-content:flex-end}#demo-hud .voice-button{width:52px;height:52px;padding:0;border:0;color:#fff;background:#22a35a;box-shadow:0 4px 14px #22a35a55}#demo-hud .voice-button.is-active{padding:0;background:#e5484d;box-shadow:0 4px 14px #e5484d55}#demo-hud .voice-button:before,#demo-hud .voice-button b{display:none}#demo-hud .voice-icon{display:block;flex:none;width:24px;height:24px;fill:currentColor;transition:transform .2s ease}#demo-hud .voice-button.is-active .voice-icon{transform:rotate(135deg)}#demo-hud .hud-plays{left:auto;right:18px;top:calc(env(safe-area-inset-top,0px) + 164px);bottom:auto;flex-direction:column;gap:16px}#demo-hud .hud-play-label{display:none}#demo-hud .hud-pop{left:12px;right:12px;top:auto;width:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);max-height:calc(var(--hud-bottom-h) - 20px);display:flex;flex-direction:column}#demo-hud .hud-pop:not([hidden]){animation:hud-sheet-up .22s ease-out both}#demo-hud .hud-pop-grid{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}#demo-hud.is-pop-open .hud-captions{opacity:0;visibility:hidden}#demo-hud .hud-captions{left:16px;right:16px;width:auto;transform:none;justify-items:center;bottom:calc(env(safe-area-inset-bottom,0px) + 24px)}#demo-hud .hud-captions .hud-user-text,#demo-hud .hud-captions .hud-joi-text{text-align:center}#demo-hud .hud-joi-clip{max-height:3.24em}#demo-hud .hud-user-clip{max-height:1.75em}#demo-hud .hud-loading:not([hidden]){left:50%;top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);transform:translate(-50%);width:min(320px,calc(100vw - 48px))}#demo-hud .hud-loading-title{text-align:center}#demo-hud .hud-rotate:not([hidden]){top:auto;right:auto;left:50%;transform:translate(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 8px)}}#body-stage-host{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}#body-stage-host .e108-scene{width:100%;height:100%}.e108-scene{position:relative;aspect-ratio:9 / 16;overflow:hidden;background:#fff}.joi-figure-slot{position:absolute;left:-.31074%;top:4.4822%;width:100.68068%;height:91.7601%}