@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#050b12;--mint:#a0ffe2;--text:#e5eeef;--muted:#7e949c;--line:rgba(158,197,207,.14);font-family:'Space Grotesk','Microsoft YaHei','PingFang SC',sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);overflow:hidden}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--mint);outline-offset:5px}button{border:0}button:disabled{cursor:wait;opacity:.65}svg{fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}#universe{position:fixed;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}#universe:active{cursor:grabbing}.vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 49% 46%,transparent 23%,rgba(3,9,16,.25) 70%,rgba(3,9,16,.8) 100%)}.header{position:fixed;top:32px;left:40px;right:40px;display:flex;align-items:center;justify-content:space-between;z-index:2}.brand{color:var(--text);text-decoration:none;display:flex;align-items:center;gap:13px;font-size:22px;letter-spacing:4px;font-weight:600}.brand-symbol{font-size:42px;color:var(--mint);line-height:1;font-weight:400;letter-spacing:0}.brand-cn{display:block;font-size:12px;letter-spacing:5px;font-weight:400;color:var(--muted);margin-top:5px}.top-actions{display:flex;align-items:center;gap:18px}.live{font-size:12px;color:var(--muted);letter-spacing:1px;display:flex;align-items:center;gap:7px}.live i,.footer-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--mint);box-shadow:0 0 9px #71ffbe66;margin-right:5px}.icon-button{background:rgba(17,30,40,.5);height:38px;width:38px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:#bacbd0;transition:.2s}.icon-button:hover{background:#233c45;color:var(--mint)}.icon-button svg{width:16px;height:16px}.scene-label{position:fixed;top:147px;left:44px;pointer-events:none}.eyebrow{font-size:11px;letter-spacing:2.4px;color:#7fa399}.scene-label h1{font-weight:400;font-size:36px;line-height:1.5;letter-spacing:4px;margin:18px 0 12px}.scene-label h1 span{color:var(--mint)}.scene-label p{font-size:14px;letter-spacing:1px;color:var(--muted)}.mode-badge{position:fixed;top:116px;left:50%;transform:translateX(-50%);display:flex;gap:10px;align-items:center;font-size:12px;letter-spacing:1px;color:#a1b4bb;padding:9px 15px;border:1px solid #a0ffe21c;border-radius:30px;background:#06101980;white-space:nowrap;pointer-events:none}.tiny-orbit{width:10px;height:10px;border:1px solid var(--mint);border-radius:50%;box-shadow:0 0 8px #a0ffe244}.glass{background:linear-gradient(130deg,rgba(19,33,42,.73),rgba(9,20,29,.52));border:1px solid var(--line);backdrop-filter:blur(24px);box-shadow:0 14px 70px #0002;border-radius:16px}.hand-panel{position:fixed;right:40px;top:143px;width:252px;padding:19px}.panel-heading{display:flex;justify-content:space-between;align-items:center;font-size:14px;letter-spacing:1px;margin-bottom:17px}.tag{border:1px solid var(--line);padding:3px 7px;border-radius:5px;font-size:11px;color:var(--muted)}.tag.connected{color:var(--mint);border-color:#a0ffe244}.camera-stage{height:143px;position:relative;overflow:hidden;border-radius:6px;background:radial-gradient(ellipse at center,#a0ffe20b,transparent 70%),repeating-linear-gradient(0deg,transparent,transparent 21px,#a0ffe207 22px),repeating-linear-gradient(90deg,transparent,transparent 21px,#a0ffe207 22px),#061019}.camera-stage video{width:100%;height:100%;object-fit:contain;transform:scaleX(-1);opacity:.65;display:none}.camera-stage canvas{position:absolute;inset:0;width:100%;height:100%}.camera-stage.enabled video{display:block}.camera-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:11px;font-size:12px;color:#8ba29e}.hand-icon{width:51px;height:51px;color:#9be3cc;stroke-width:1.2}.camera-caption{position:absolute;bottom:9px;left:10px;font-size:9px;letter-spacing:1.7px;color:#729088}.camera-corner{position:absolute;width:10px;height:10px;border-color:#8affa74d;border-style:solid}.tl{top:0;left:0;border-width:1px 0 0 1px}.tr{top:0;right:0;border-width:1px 1px 0 0}.bl{bottom:0;left:0;border-width:0 0 1px 1px}.br{bottom:0;right:0;border-width:0 1px 1px 0}.primary-button{background:var(--mint);color:#103128;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px;border-radius:7px;font-size:14px;font-weight:600;margin-top:13px;transition:.2s}.primary-button:hover{background:#c9ffef;box-shadow:0 0 25px #a0ffe226}.primary-button svg{width:16px;height:16px}.button-arrow{margin-left:auto}.privacy{font-size:10px;color:#8a9da4;text-align:center;line-height:1.8;margin:9px -10px 17px}.gesture-list{border-top:1px solid var(--line);padding-top:16px;display:flex;flex-direction:column;gap:16px}.gesture-list>div{display:flex;align-items:center;gap:13px;font-size:13px;color:#d1dedf}.gesture-mark{width:28px;text-align:center;font-size:19px;filter:grayscale(.8);color:#bbded3}.gesture-list small{display:block;font-size:11px;color:var(--muted);margin-top:5px}.tracking-line{border-top:1px solid var(--line);padding-top:14px;margin-top:17px;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--muted)}.signal{display:flex;align-items:end;gap:3px;height:13px}.signal i{width:3px;height:40%;background:#354849;border-radius:1px}.signal i:nth-child(2){height:60%}.signal i:nth-child(3){height:80%}.signal i:nth-child(4){height:65%}.signal i:nth-child(5){height:100%}.tracking .signal i{background:var(--mint)}.tuning{position:fixed;left:40px;bottom:166px;width:237px;padding:18px 20px}.control-heading{font-size:14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.text-button{font-size:11px;background:none;color:var(--muted);padding:0}.text-button:hover{color:var(--mint)}.range-label{font-size:12px;display:flex;justify-content:space-between;color:#b1c4c8;margin-bottom:13px}.range-label output{color:var(--mint);font-size:12px}input[type=range]{-webkit-appearance:none;appearance:none;height:3px;width:100%;background:linear-gradient(to right,var(--mint) 65%,#31454b 65%);border-radius:3px;margin:0 0 21px;cursor:pointer;accent-color:var(--mint)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:11px;height:11px;background:#c4ffeb;border-radius:50%;box-shadow:0 0 12px #a0ffe255}input[type=range]::-moz-range-thumb{width:11px;height:11px;background:#c4ffeb;border:none;border-radius:50%}.color-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#b1c4c8}.swatches{display:flex;gap:10px}.swatch{width:13px;height:13px;border-radius:50%;background:var(--swatch);padding:0;transition:.2s}.swatch.active{outline:1px solid var(--swatch);outline-offset:4px}.swatch:hover{transform:scale(1.2)}.scene-caption{position:fixed;left:42px;bottom:75px;pointer-events:none}.scene-caption>div{display:flex;align-items:center;gap:12px;letter-spacing:2px;font-size:16px}.scene-caption #scene-number{font-size:12px;color:var(--mint)}.caption-line{height:1px;width:25px;background:#9bbebd55}.scene-caption p{font-size:11px;color:var(--muted);margin:10px 0 0}.shape-dock{position:fixed;bottom:79px;left:50%;transform:translateX(-50%);display:flex;gap:5px;padding:7px;border-radius:17px}.shape{width:70px;height:73px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:transparent;color:#81979e;border:1px solid transparent;border-radius:11px;transition:.25s}.shape svg{width:29px;height:29px;stroke-width:1.1}.shape span{font-size:12px;letter-spacing:1px}.shape:hover{color:#c8e6de;background:#a0ffe207}.shape.active{color:var(--mint);border-color:#a0ffe233;background:linear-gradient(150deg,#a0ffe21b,#a0ffe207);box-shadow:inset 0 0 15px #a0ffe205}.footer{position:fixed;bottom:25px;left:40px;right:40px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#5e7b83;align-items:center}.footer-separator{margin:0 12px;color:#2f4a53}.keyboard-hints{letter-spacing:.3px}.keyboard-hints b{padding:0 8px;color:#3b5964}kbd{font:9px 'Space Grotesk',sans-serif;padding:2px 4px;border:1px solid #28434e;border-radius:3px;margin:0 4px 0 12px}.restore-ui{display:none;position:fixed;bottom:30px;left:50%;transform:translateX(-50%);padding:10px 17px;color:#aecbc3;background:#122b2b88;border:1px solid #8dffe022;border-radius:30px;font-size:12px}.immersive header,.immersive main{visibility:hidden;pointer-events:none}.immersive .restore-ui{display:block;opacity:.4}.immersive .restore-ui:hover{opacity:1}#toast{position:fixed;bottom:188px;left:50%;transform:translate(-50%,10px);background:#163730dd;border:1px solid #a0ffe230;border-radius:10px;padding:12px 20px;font-size:13px;opacity:0;transition:.3s;pointer-events:none;max-width:min(480px,85vw);text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}#fatal{position:fixed;top:35%;left:20%;right:20%;background:#10232b;padding:30px;border-radius:15px;border:1px solid var(--line);z-index:10}#fatal h2{font-size:22px}#fatal p{line-height:1.8;color:#aec0c8}@media(min-width:1500px){.header{top:40px;left:55px;right:55px}.scene-label{left:58px;top:175px}.hand-panel{right:55px;top:170px;width:270px;padding:22px}.camera-stage{height:160px}.tuning{left:55px;bottom:180px}.scene-caption{left:57px}.shape-dock{bottom:90px}.footer{left:55px;right:55px;bottom:30px}}@media(max-height:800px) and (min-width:901px){.header{top:24px}.scene-label{top:123px}.scene-label h1{font-size:29px}.hand-panel{top:112px;padding:15px;width:225px}.camera-stage{height:111px}.gesture-list{gap:12px;padding-top:12px}.privacy{margin-bottom:11px}.gesture-list small{font-size:10px}.tracking-line{margin-top:12px;padding-top:10px}.tuning{bottom:157px;width:217px;padding:16px}.scene-caption{bottom:73px}.control-heading{margin-bottom:18px}.shape-dock{bottom:66px}}@media(max-width:1100px){.scene-label h1{font-size:28px}.scene-label{left:27px}.header{left:26px;right:26px}.hand-panel{right:24px;width:218px}.tuning{left:25px;width:208px}.scene-caption{left:27px;bottom:70px}.scene-caption p{display:none}.shape{width:58px}.shape-dock{left:51%}.footer{left:27px;right:27px}.keyboard-hints{font-size:9px}}@media(max-width:900px){.header{top:23px;left:22px;right:22px}.brand{font-size:18px;gap:9px;letter-spacing:3px}.brand-symbol{font-size:34px}.brand-cn{font-size:10px;letter-spacing:3px}.top-actions{gap:10px}.scene-label{top:111px;left:23px}.scene-label h1{font-size:24px;line-height:1.5;margin:12px 0}.scene-label p{font-size:12px}.eyebrow{font-size:9px;letter-spacing:1.3px}.mode-badge{top:auto;bottom:206px;font-size:11px}.hand-panel{right:20px;top:112px;width:180px;padding:13px}.panel-heading{font-size:12px;margin-bottom:11px}.camera-stage{height:110px}.gesture-list,.tracking-line{display:none}.primary-button{font-size:12px;padding:10px;gap:6px}.privacy{font-size:9px;margin:9px -7px 0}.tuning{bottom:123px;left:23px;width:180px;padding:14px}.control-heading{margin-bottom:16px;font-size:12px}.color-row{font-size:10px}.swatches{gap:9px}.swatch{width:11px;height:11px}.scene-caption{bottom:78px;left:24px}.scene-caption>div{font-size:13px}.shape-dock{left:auto;right:20px;transform:none;bottom:78px;gap:1px}.shape{width:48px;height:60px}.shape svg{width:24px;height:24px}.shape span{font-size:10px}.footer{bottom:23px;left:23px;right:23px;font-size:9px}.keyboard-hints{display:none}}@media(max-width:600px){.scene-label{top:98px}.scene-label h1{font-size:23px}.scene-label p{display:none}.eyebrow{font-size:8px;letter-spacing:1px}.hand-panel{top:103px;right:15px;width:149px;padding:10px;border-radius:12px}.camera-stage{height:91px}.hand-icon{width:35px;height:35px}.camera-placeholder{gap:6px;font-size:10px}.camera-caption{font-size:7px}.panel-heading{font-size:12px;letter-spacing:0;margin-bottom:9px}.tag{font-size:9px;padding:2px 4px}.primary-button{font-size:11px;padding:9px 6px;margin-top:10px}.primary-button svg{width:13px}.privacy{font-size:8px}.top-actions{gap:8px}.live{font-size:9px;gap:4px}.icon-button{width:31px;height:31px}.tuning{left:20px;right:20px;bottom:133px;width:auto;padding:15px 16px;display:grid;grid-template-columns:1fr 1fr;column-gap:23px;border-radius:12px}.control-heading{display:none}.range-label{font-size:11px;margin:0 0 12px;grid-column:1;grid-row:1}.tuning input{grid-column:1;grid-row:2;margin:0;align-self:center}.color-row{grid-column:2;grid-row:1/3;flex-direction:column;gap:12px;align-items:flex-start}.swatches{gap:17px}.swatch{width:12px;height:12px}.shape-dock{left:20px;right:20px;bottom:42px;justify-content:space-between;padding:5px;border-radius:13px}.shape{flex:1;min-width:0;height:64px}.shape span{font-size:11px}.shape svg{width:25px;height:25px}.mode-badge{bottom:222px;max-width:90vw;font-size:10px;padding:7px 10px}.scene-caption{bottom:280px}.scene-caption>div{font-size:11px;gap:8px}.footer{bottom:14px;font-size:8px;justify-content:center}.scene-caption p{display:none}#toast{bottom:310px}}@media(max-height:600px){.scene-label{display:none}.hand-panel{top:88px}.gesture-list,.tracking-line{display:none}.tuning{bottom:123px}.mode-badge{top:85px;bottom:auto}.shape-dock{bottom:43px}.scene-caption{display:none}.footer{bottom:15px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.camera-stage canvas{object-fit:contain}