*{box-sizing:border-box}input,textarea,select{user-select:auto;-webkit-user-select:auto}html,body{margin:0;overflow:hidden;background-color:#000;color:#fff;font-family:Rubik,sans-serif;touch-action:none;overscroll-behavior:none;position:fixed;inset:0;width:100%;height:100%;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}canvas.main-view{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}canvas.main-view.is-dragging{cursor:grabbing}#chrome-center{position:absolute;top:10px;left:50%;transform:translate(-50%);z-index:5;display:flex;align-items:center;gap:10px;-webkit-user-select:none;user-select:none;touch-action:auto}#mode-bar,#object-bar{display:flex;overflow:hidden;border:1px solid #2a2a2a;border-radius:8px;background:#161616}#chrome-center #mode-bar button,#chrome-center #object-bar button{appearance:none;height:42px;border:0;border-radius:0;background:transparent;color:#fff;cursor:pointer}#chrome-center #mode-bar button.is-active,#chrome-center #object-bar button.is-active{background:#332423;color:#cc9690}#mode-bar button{padding:0 16px;font:13px sans-serif;white-space:nowrap}#object-bar button{width:42px;padding:6px;display:flex;align-items:center;justify-content:center}#object-bar svg{width:100%;height:100%;display:block}#tilt-banner{position:absolute;top:62px;left:50%;transform:translate(-50%);z-index:3;max-width:calc(100vw - 70px);padding:8px 12px;border:1px solid #444;border-radius:8px;background:#000000c7;color:#fff;font:13px sans-serif;cursor:pointer;touch-action:auto}#tilt-banner[hidden]{display:none}#camera-toggle{position:relative}#camera-toggle[hidden]{display:none}#parallax-banner{appearance:none;width:42px;height:42px;padding:0;border:1px solid #2a2a2a;border-radius:8px;background:#161616;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:auto}#parallax-banner svg{width:22px;height:22px;display:block}#camera-toggle.is-on #parallax-banner{background:#332423;color:#cc9690}.camera-tip{display:none;position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%);z-index:7;padding:8px 14px;border:1px solid #444;border-radius:8px;background:#000000c7;color:#fff;font:13px sans-serif;flex-direction:column;align-items:center;gap:3px;text-align:center;white-space:nowrap;pointer-events:none}.camera-tip small{font-size:11px;color:#aaa}#camera-toggle:not(.is-on):hover .camera-tip,#camera-toggle:not(.is-on):focus-within .camera-tip,#camera-toggle.is-tip-on .camera-tip{display:flex}#face-preview{position:absolute;top:10px;left:10px;z-index:5;width:168px;border:1px solid #2a2a2a;border-radius:8px;overflow:hidden;background:#000;touch-action:auto}#face-preview[hidden]{display:none}.face-track-video{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;overflow:hidden}.face-preview-video{position:relative}#face-preview canvas{display:block;width:100%;height:126px}#face-preview-close{appearance:none;position:absolute;top:4px;right:4px;z-index:1;width:22px;height:22px;padding:0;border:0;border-radius:4px;background:#0000008c;color:#ddd;cursor:pointer;display:flex;align-items:center;justify-content:center}#face-preview-close svg{width:12px;height:12px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}#face-preview-close:hover{color:#fff;background:#000c}.face-preview-sliders{display:flex;flex-direction:column;gap:6px;padding:6px 8px 4px;border-top:1px solid #2a2a2a;background:#111}.face-preview-sliders label{display:flex;flex-direction:column;gap:2px;font:11px sans-serif;color:#ccc}.face-preview-sliders .row{display:flex;justify-content:space-between;gap:8px}.face-preview-sliders input[type=range]{width:100%;margin:0;accent-color:#cc9690}#ui-container{display:none;position:absolute;top:58px;right:10px;background:#000000b3;padding:15px;border-radius:8px;border:1px solid #444;-webkit-user-select:none;user-select:none;width:min(280px,calc(100vw - 20px));max-height:calc(100% - 80px);overflow-y:auto;z-index:4;touch-action:auto}#ui-container.is-open{display:block}.control-group{margin-bottom:10px}#ui-container label.checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px}.slider-label{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;font-size:12px;color:#ccc}.slider-label .row{display:flex;justify-content:space-between;gap:8px}.slider-label input[type=range]{width:100%;margin:0;accent-color:#7ab8ff}.field-label{display:flex;flex-direction:column;gap:4px;margin-bottom:10px;font-size:12px;color:#ccc}.field-label select{width:100%;appearance:none;background:#1a1a1a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23aaa' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 10px center;color:#fff;border:1px solid #444;border-radius:6px;padding:7px 28px 7px 10px;font-size:14px;cursor:pointer}.field-label select:focus{outline:1px solid #7ab8ff}.credit{margin:0 0 12px;font-size:11px;line-height:1.45;color:#999}.credit[hidden]{display:none}.credit a{color:#7ab8ff;text-decoration:none}.credit a:hover{text-decoration:underline}body.is-mono .stereo-only{display:none}.slider-ticks{display:flex;justify-content:space-between;height:7px;margin:1px 7px 0;pointer-events:none}.slider-ticks i{width:1px;height:4px;background:#555}.slider-ticks i.is-major{height:7px;background:#888}.hint{font-size:12px;color:#aaa;line-height:1.5}.learn-more{display:inline-block;margin-top:12px;font-size:13px;color:#7ab8ff;text-decoration:none}.learn-more:hover{text-decoration:underline}.hint-desktop{display:none}@media(min-width:901px)and (min-height:521px){#tiltControls,#tilt-banner{display:none}#chrome-center{max-width:calc(100% - 64px)}.hint-phone{display:none}.hint-desktop{display:inline}}#menu-toggle{display:flex;position:absolute;top:10px;right:10px;z-index:6;width:42px;height:42px;padding:0;border:1px solid #2a2a2a;border-radius:8px;background:#161616;color:#fff;cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:5px;touch-action:auto}#menu-toggle span{display:block;position:relative;width:18px;height:2px;background:#fff;border-radius:1px;transition:transform .15s ease,opacity .15s ease}#menu-toggle span:after{content:"";position:absolute;top:50%;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 0 1.5px #161616;transform:translateY(-50%);transition:opacity .12s ease}#menu-toggle span:nth-child(1):after{left:10px}#menu-toggle span:nth-child(2):after{left:2px}#menu-toggle span:nth-child(3):after{left:8px}#menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}#menu-toggle.is-open span:nth-child(2){opacity:0}#menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}#menu-toggle.is-open span:after{opacity:0}#menu-backdrop{display:none;position:absolute;inset:0;z-index:2;background:#00000059}#stereo-split{position:absolute;top:0;bottom:0;left:50%;width:1px;background:#2a2a2a;pointer-events:none}body.is-mono #stereo-split{display:none}#axes-hud{--dial-size: 80px;position:absolute;left:50%;bottom:max(10px,env(safe-area-inset-bottom));transform:translate(-50%);z-index:2;pointer-events:none;background:none;border:0;padding:0;width:min(580px,calc(100% - 16px));text-align:center}.axis-bar{pointer-events:auto;display:flex;justify-content:center;align-items:flex-start;gap:8px;touch-action:manipulation;-webkit-user-select:none;user-select:none}.coord{display:flex;flex-direction:column;align-items:center;gap:5px;width:var(--dial-size);flex:0 0 var(--dial-size)}.coord .gesture{font-size:10px;line-height:1.15;min-height:1.15em;color:#9aa;white-space:nowrap}.coord .g-phone{display:none}.dial{position:relative;overflow:hidden;width:var(--dial-size);height:var(--dial-size);border:1px solid #555;border-radius:50%;background:#161616;display:flex;align-items:center;justify-content:center}.coord .name{font-size:11px;font-weight:700;letter-spacing:.02em;line-height:1;font-style:normal}.coord .name i{font-style:inherit;font-weight:inherit}.ax-x{color:#ff4d6d}.ax-y{color:#3ddc84}.ax-z{color:#4d8dff}.ax-w{color:#f5c542}.coord .readout{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;pointer-events:none}.coord .value{font-size:11px;font-variant-numeric:tabular-nums;color:#ddd;line-height:1}.coord .dial>button{appearance:none;position:absolute;z-index:0;display:flex;padding:0;border:0;background:transparent;color:#bbb;cursor:pointer;font-size:11px;line-height:1;touch-action:manipulation}.coord[data-axis=h] .dial>button{top:0;width:50%;height:100%;align-items:center}.coord[data-axis=h] .dial>button:first-of-type{left:0;justify-content:flex-start;padding-left:calc(var(--dial-size) * .14)}.coord[data-axis=h] .dial>button:last-of-type{right:0;justify-content:flex-end;padding-right:calc(var(--dial-size) * .14)}.coord[data-axis=v] .dial>button{left:0;width:100%;height:50%;justify-content:center}.coord[data-axis=v] .dial>button:first-of-type{top:0;align-items:flex-start;padding-top:calc(var(--dial-size) * .12)}.coord[data-axis=v] .dial>button:last-of-type{bottom:0;align-items:flex-end;padding-bottom:calc(var(--dial-size) * .12)}.coord .dial>button:hover,.coord .dial>button:active{color:#fff}#angle-reset{appearance:none;padding:0;color:#ddd;cursor:pointer;touch-action:manipulation}#angle-reset svg{width:22px;height:22px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}#angle-reset:hover,#angle-reset:active{color:#fff;border-color:#888}@media(max-width:900px),(max-height:520px){#menu-backdrop.is-on{display:block}#camera-toggle,#face-preview,.desktop-only{display:none!important}#chrome-center{gap:6px;max-width:calc(100% - 64px)}#tilt-banner{max-width:calc(100vw - 24px)}#mode-bar button{padding:0 10px;font-size:12px}#axes-hud{--dial-size: min(72px, calc((100vw - 24px) / 6));bottom:max(6px,env(safe-area-inset-bottom));width:calc(100% - 12px)}.axis-bar{gap:4px}.coord .g-desk{display:none}.coord .g-phone{display:inline}.coord .gesture{font-size:8px}.coord .name,.coord .value{font-size:9px}.coord .dial>button{font-size:10px}#angle-reset svg{width:18px;height:18px}}@media(orientation:landscape)and (max-height:700px){#axes-hud{bottom:max(4px,env(safe-area-inset-bottom))}#chrome-center{top:8px}}
