@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url('../assets/fonts/manrope-latin-400-800.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url('../assets/fonts/manrope-latin-ext-400-800.woff2') format('woff2');unicode-range:U+0178;}
:root{font-family:Manrope,Arial,sans-serif;color:#f3eff7;background:#0b0910;color-scheme:dark;font-synthesis:none;--muted:#ad9fb8;--line:#d9c7ef24;--pink:#e765ad;--purple:#b093e1;--green:#70ebac;--red:#ff8096}*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;border:0}button:disabled{opacity:.35;cursor:wait}a{color:inherit;text-decoration:none}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;flex:none}button:focus-visible,a:focus-visible{outline:2px solid #80e3ce;outline-offset:5px}[hidden]{display:none!important}.icon-defs{position:absolute;width:0;height:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.app{height:100svh;min-height:580px;overflow:clip;background:radial-gradient(ellipse at 50% 62%,#32253a70,transparent 60%),linear-gradient(#0d0b12,#09090e)}.topbar{position:relative;z-index:15;height:76px;padding:0 4%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0b}.brand{display:flex;align-items:center;gap:13px;font-size:11px;letter-spacing:.13em;font-weight:750}.brand-mark{font-size:32px;letter-spacing:-.12em;font-weight:400;color:#cfb1f2}.brand-mark>span{color:var(--pink)}.brand small{display:block;font-size:7px;letter-spacing:.22em;color:#b09bc1;margin-top:5px;font-weight:500}.camera-toggle{display:flex;align-items:center;gap:10px;border:1px solid #b8a1d239;background:#20172977;min-height:44px;border-radius:30px;padding:10px 16px;font-size:12px}.camera-toggle>svg{width:19px;height:19px;color:#e6d8f1}.camera-state{font-size:10px;font-weight:650;color:var(--red)}.switch-dot{height:7px;width:7px;background:var(--red);border-radius:50%;box-shadow:0 0 9px #ff809633}.camera-toggle[aria-checked=true]{border-color:#70ebac55;background:#17312566}.camera-toggle[aria-checked=true] .camera-state{color:var(--green)}.camera-toggle[aria-checked=true] .switch-dot{background:var(--green);box-shadow:0 0 10px #70ebac55}.camera-toggle.loading .camera-state{color:#e7c595}.camera-toggle.loading .switch-dot{background:#e7c595;animation:waiting 1.2s infinite}.experience{height:calc(100% - 76px);position:relative;isolation:isolate;overflow:clip}.studio-halo{position:absolute;top:34%;left:12%;right:12%;height:48%;background:radial-gradient(ellipse,#a0a0c018,transparent 62%);filter:blur(25px);pointer-events:none}.backdrop-word{position:absolute;left:0;right:0;top:24%;font-size:clamp(120px,22vw,410px);line-height:1;letter-spacing:-.07em;font-weight:750;text-align:center;color:#c8b9e605;pointer-events:none;z-index:-1}#viewport{position:absolute;inset:66px 2% 139px;touch-action:none}#viewport>canvas{display:block;width:100%;height:100%;transition:opacity .5s}#viewport canvas:not(.ready){opacity:0}.poster{position:absolute;inset:4% 10% 11%;width:80%;height:80%;object-fit:contain;pointer-events:none;transition:opacity .3s}.poster.ready{opacity:0}.tracking-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;mix-blend-mode:screen}.stage-loader{position:absolute;inset:0;display:grid;place-content:center;pointer-events:none;text-align:center}.stage-loader>span{width:25px;height:25px;border:1px solid #e0d8ec26;border-top-color:#c9a2e5;border-radius:50%;animation:spin 1s linear infinite;margin:auto}.stage-loader p{font-size:12px;color:#c3b2d3}.paint-palette{position:absolute;top:22px;left:4%;z-index:6}.swatches{display:flex;gap:4px}.swatch{height:43px;width:43px;display:grid;place-items:center;background:transparent;border-radius:50%;touch-action:none;cursor:grab;padding:7px}.swatch>i{width:25px;height:25px;border-radius:50%;background:linear-gradient(140deg,#ffffff45,#ffffff00 60%),var(--swatch);box-shadow:inset 0 0 0 1px #ffffff22;outline:1px solid transparent;outline-offset:4px;pointer-events:none;transition:transform .15s,outline-color .15s}.swatch[aria-pressed=true]>i{outline-color:#e8dff2}.swatch:hover>i{transform:scale(1.1)}.swatch.picked>i{transform:scale(.7);opacity:.5}.paint-palette p{margin:5px 8px 0;font-size:11px;letter-spacing:.01em;color:#b8a9c6}.reset-view{position:absolute;top:26px;right:4%;width:42px;height:42px;border:1px solid #d7c4eb22;border-radius:50%;background:#1e17215c;display:grid;place-items:center;z-index:7;color:#cabcd7}.reset-view>svg{width:19px;height:19px}.camera-preview{position:absolute;right:4%;top:90px;width:216px;aspect-ratio:1.34;border:1px solid #d4b2ed47;border-radius:14px;overflow:hidden;background:#17121c;z-index:6;box-shadow:0 12px 35px #0004}.camera-preview video,.camera-preview canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.camera-preview video{transform:scaleX(-1);opacity:.75}.camera-caption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#0b0810e0);display:flex;gap:6px;align-items:center;padding:14px 9px 8px;font-size:10px;color:#efddfa}.camera-caption i{width:5px;height:5px;border-radius:50%;background:var(--green)}.bottom-controls{position:absolute;bottom:22px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:14px;z-index:7;pointer-events:none}.bottom-controls>*{pointer-events:auto}.gesture-cue{display:flex;align-items:center;gap:11px;min-height:43px}.gesture-cue strong{font-size:14px;font-weight:550;display:block;color:#ede5f3}.gesture-cue span{display:block;font-size:11px;color:#baacc6;margin-top:5px}.click-demo{width:43px;height:43px;stroke:#eee5f5;stroke-width:1.55}.gesture-accent{stroke:#ce9cea}.finger-straight{animation:point-demo 4s infinite}.finger-bent{animation:click-demo 4s infinite}.gesture-cue.learned .click-demo{display:none}.gesture-cue.learned{min-height:36px;text-align:center}.scene-actions{display:flex;gap:8px;padding:5px;background:linear-gradient(115deg,#211628d9,#16121ee8);border:1px solid #d2b4ea29;border-radius:40px;box-shadow:0 10px 35px #0003;backdrop-filter:blur(18px)}.scene-actions button{min-height:46px;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px 24px;font-size:13px;font-weight:550;border-radius:28px;background:transparent;color:#dacee4;white-space:nowrap;transition:background .2s}.scene-actions button svg{width:20px;height:20px}.scene-actions button:hover{background:#d1b8eb12}.scene-actions .engine-button{background:linear-gradient(115deg,#a82778,#7243a9);color:white;box-shadow:inset 0 0 0 1px #fbcde321}.scene-actions .engine-button:hover{filter:brightness(1.13)}.scene-actions button[aria-pressed=true]{background:#7e5a9b42;color:#faf5ff;box-shadow:inset 0 0 0 1px #cbace45c}.scene-actions .engine-button[aria-pressed=true]{background:#25423799;box-shadow:inset 0 0 0 1px #70dba65e;color:#c4f7dd}.navigation-hint{margin:0;color:#8f839d;font-size:10px;letter-spacing:.025em}.feedback{position:absolute;top:109px;left:4%;max-width:330px;margin:0;color:#eedff8;font-size:12px;line-height:1.55;padding:10px 15px;background:#1e1428df;border:1px solid #caaddb33;border-radius:12px;z-index:10;pointer-events:none}.paint-target{position:absolute;top:67%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:9px;color:#c5fbdc;border:1px solid #7cf5b565;background:#18382ce8;border-radius:30px;padding:10px 16px;font-size:12px;z-index:5;pointer-events:none;white-space:nowrap}.paint-target svg{width:17px;height:17px}.paint-ready .studio-halo{background:radial-gradient(ellipse,color-mix(in srgb,var(--paint-color),transparent 82%),transparent 62%)}.hand-pointer{position:fixed;z-index:50;top:0;left:0;pointer-events:none;width:28px;height:28px;margin:-14px;border-radius:50%;border:1px solid #e9d6ffad;background:#a77ae51a;display:grid;place-items:center;transition:background .12s,box-shadow .12s}.hand-pointer>i{width:5px;height:5px;border-radius:50%;background:#f0dbff}.hand-pointer>span{position:absolute;top:39px;left:50%;transform:translateX(-50%);font-size:12px;font-weight:550;white-space:nowrap;padding:8px 12px;color:#d4f9e4;background:#153026eb;border:1px solid #6febae66;border-radius:20px;display:none}.hand-pointer.hit{border:2px solid #7bffc0;background:#6afcb02d;box-shadow:0 0 23px #64f3aa47}.hand-pointer.hit>i{background:#78fac0}.hand-pointer.neutral{width:14px;height:14px;margin:-7px;background:transparent;border-style:dashed;opacity:.7}.hand-pointer.neutral>i{height:3px;width:3px}.hand-pointer.edge-right>span{left:auto;right:0;transform:none}.hand-pointer.edge-left>span{left:0;transform:none}.hand-pointer.edge-bottom>span{top:auto;bottom:39px}.hand-pointer.clicked{background:#82ffb988;box-shadow:0 0 0 9px #5bf2a923}.hand-pointer.clicked>span{display:none}[data-hand-action].hand-hover{outline:2px solid #74eaae;outline-offset:4px;background:#60c19016}.paint-cursor{position:fixed;z-index:60;pointer-events:none;top:0;left:0;display:grid;justify-items:center;gap:9px;transform:translate(-50%,-36px)}.paint-cursor>i{height:35px;width:35px;background:var(--paint-color);border-radius:50% 50% 50% 10%;transform:rotate(-45deg);border:1px solid #eee2ff;box-shadow:0 0 24px color-mix(in srgb,var(--paint-color),transparent 40%),inset -5px -5px 12px #0003}.paint-cursor>span{font-size:11px;color:#efe5f6;background:#1d1428ed;border:1px solid #c3a4dc5c;padding:8px 12px;border-radius:20px;white-space:nowrap}.paint-cursor.valid>span{color:#c5fbdc;background:#16392ae8;border-color:#7cf5b577}.error-state .poster{opacity:1}.error-state .stage-loader>span{display:none}
@media(min-width:1600px){.topbar{height:84px}.experience{height:calc(100% - 84px)}#viewport{inset:85px 5% 150px}.paint-palette{top:30px}.camera-preview{width:245px;top:100px}.bottom-controls{bottom:30px;gap:16px}}
@media(max-width:700px){.app{min-height:560px}.topbar{height:60px;padding:0 5%;border:0}.brand{font-size:9px;gap:9px}.brand-mark{font-size:27px}.brand small{font-size:6px;margin-top:4px}.camera-toggle{min-height:38px;padding:8px 11px;gap:7px;font-size:11px}.camera-toggle>svg{width:16px;height:16px}.camera-state{font-size:9px}.switch-dot{width:6px;height:6px}.experience{height:calc(100% - 60px)}#viewport{inset:105px 0 134px}.backdrop-word{top:35%;font-size:27vw;letter-spacing:-.09em}.poster{inset:16% -5% 16%;width:110%;height:68%}.paint-palette{top:10px;left:4%}.swatches{gap:1px}.swatch{height:37px;width:37px;padding:6px}.swatch>i{width:23px;height:23px}.paint-palette p{font-size:10px;margin:5px 7px 0;max-width:270px}.reset-view{top:10px;right:5%;width:35px;height:35px}.reset-view>svg{width:17px;height:17px}.camera-preview{top:78px;right:5%;width:120px;aspect-ratio:1.28;border-radius:10px}.camera-caption{font-size:8px;padding:12px 6px 6px;gap:4px}.camera-caption i{width:4px;height:4px}.bottom-controls{bottom:max(12px,env(safe-area-inset-bottom));gap:10px}.gesture-cue{gap:8px;min-height:40px;max-width:92%}.click-demo{width:38px;height:38px}.gesture-cue strong{font-size:13px}.gesture-cue span{font-size:10px;margin-top:4px}.gesture-cue.learned{min-height:35px}.scene-actions{max-width:94%;gap:1px;padding:4px}.scene-actions button{padding:11px 15px;min-height:45px;gap:7px;font-size:12px}.scene-actions button svg{width:18px;height:18px}.navigation-hint{font-size:9px}.feedback{top:79px;left:5%;right:5%;max-width:none;font-size:11px;padding:9px 12px}.camera-on .feedback{top:184px}.paint-target{top:65%;font-size:11px;padding:9px 13px}.paint-cursor>span{font-size:10px}.hand-pointer>span{font-size:11px}.studio-halo{left:0;right:0;top:34%;height:45%}}
@media(max-height:650px) and (min-width:701px){.topbar{height:60px}.experience{height:calc(100% - 60px)}.app{min-height:480px}.bottom-controls{bottom:10px;gap:7px}.gesture-cue{min-height:33px}.click-demo{height:33px;width:33px}#viewport{inset:40px 4% 128px}.camera-preview{top:76px;width:150px}.paint-palette{top:12px}}
@media(max-width:370px){.scene-actions button{padding:11px 12px;gap:5px;font-size:11px}.swatch{width:33px}.brand{font-size:8px}.gesture-cue strong{font-size:12px}.navigation-hint{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.finger-bent{display:none}}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes waiting{50%{opacity:.4}}@keyframes point-demo{0%,40%{opacity:1}48%,82%{opacity:0}90%,100%{opacity:1}}@keyframes click-demo{0%,40%{opacity:0}48%,82%{opacity:1}90%,100%{opacity:0}}

@media(max-height:520px) and (min-width:701px){.app{height:100svh;min-height:0}.topbar{height:50px}.experience{height:calc(100% - 50px)}.bottom-controls{bottom:8px;gap:5px}.gesture-cue{min-height:29px}.gesture-cue strong{font-size:12px}.gesture-cue span{font-size:10px;margin-top:2px}.click-demo{width:29px;height:29px}.scene-actions{padding:3px}.scene-actions button{min-height:37px;padding:8px 18px;font-size:11px}.navigation-hint{display:none}#viewport{inset:30px 10% 97px}.paint-palette{top:8px;left:3%}.swatch{width:34px;height:34px}.swatch>i{width:21px;height:21px}.paint-palette p{font-size:9px}.reset-view{top:10px;width:32px;height:32px}.camera-preview{top:55px;width:120px}.camera-toggle{min-height:34px;padding:7px 12px}}

/* V6: a small, persistent legend in place of the disappearing tutorial. */
.gesture-cue.sr-only{display:none}.paint-palette p{font-size:13px;line-height:1.55;color:#d0c2dd;margin-top:9px}.paint-palette p strong{font-weight:650;color:#fff}.palette-alternative{display:block;margin:4px 8px 0;color:#a99bb8;font-size:10px}.gesture-legend{display:flex;align-items:center;gap:34px;padding:5px 10px;max-width:96%}.legend-item{display:flex;align-items:center;gap:11px}.legend-item>svg{width:31px;height:31px;stroke:#eee6f8;stroke-width:1.35}.legend-item:first-child>svg{stroke:#b6f1d5}.legend-item strong{display:block;font-size:13px;line-height:1.5;font-weight:650}.legend-item span{display:block;font-size:11px;line-height:1.5;color:#b7abc4;white-space:nowrap}.bottom-controls{gap:17px;bottom:23px}.navigation-hint{color:#b1a4bf;font-size:10px}.paint-palette{top:19px}#viewport{inset:83px 2% 165px}.part-hint{position:absolute;top:44%;left:50%;transform:translate(-50%,-50%);pointer-events:none;font-size:12px;color:#d6ffe9;border:1px solid #83efb658;background:#14281fe6;border-radius:24px;padding:8px 14px;z-index:5}.part-hint:before{content:'';display:inline-block;width:5px;height:5px;margin:0 7px 2px 0;border-radius:50%;background:#89efb9}.scene-actions button[aria-pressed=true]:not(.engine-button){color:#c5f4dc;background:#37654d40;box-shadow:inset 0 0 0 1px #87daa54f}
@media(max-width:700px){.paint-palette{top:9px}.paint-palette p{font-size:11px;line-height:1.5;margin-top:6px}.palette-alternative{font-size:9px;margin-top:3px}.bottom-controls{bottom:max(12px,env(safe-area-inset-bottom));gap:13px}.gesture-legend{width:94%;gap:0;justify-content:space-between;padding:0}.legend-item{flex-direction:column;align-items:center;gap:5px;text-align:center;flex:1}.legend-item>svg{width:27px;height:27px}.legend-item strong{font-size:11px}.legend-item span{font-size:9px;letter-spacing:-.01em}.navigation-hint{font-size:8px;max-width:93%;text-align:center;line-height:1.5}.scene-actions button{padding:10px 15px;min-height:43px}.camera-preview{top:122px;width:120px}#viewport{inset:128px 0 170px}.feedback{top:125px}.camera-on .feedback{top:228px}.part-hint{font-size:10px;padding:7px 10px;top:52%}}
@media(max-width:370px){.legend-item span{font-size:8px}.scene-actions button{padding:10px 12px}.navigation-hint{font-size:8px}}
@media(max-height:520px) and (min-width:701px){.gesture-legend{gap:26px}.legend-item>svg{width:23px;height:23px}.legend-item strong{font-size:10px}.legend-item span{font-size:9px}.bottom-controls{gap:7px;bottom:8px}.paint-palette p{font-size:10px;margin-top:5px}.palette-alternative{font-size:8px}#viewport{inset:38px 10% 100px}.camera-preview{top:60px}.part-hint{top:42%}}
.part-hint{position:fixed;transform:translate(-50%,-50%);z-index:40}