@layer reset{*,:before,:after{box-sizing:border-box}*{margin:0}html,body,#root{height:100%}img,canvas,svg{max-width:100%;display:block}button,input,select,textarea{font:inherit;color:inherit}}@layer base{:root{--bg:#130f0a;--bg-deep:#090704;--panel:#1c1812;--panel-2:#26211a;--line:#37322c;--line-soft:#292621;--ink:#f5f1ec;--ink-2:#bbb7b0;--ink-3:#83807a;--brand:#d29754;--brand-2:#c57036;--accent:#e3b842;--ok:#62c689;--err:#ef6661;--r-sm:8px;--r:14px;--r-lg:22px;--shadow-1:0 1px 2px #0006;--shadow-2:0 8px 30px #00000073;--shadow-3:0 24px 70px #0000008c;--ease-out:cubic-bezier(.22, 1, .36, 1);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@supports (color:lab(0% 0 0)){:root{--bg:lab(4.44423% .85254 2.71283);--bg-deep:lab(1.98726% .422843 1.31049);--panel:lab(8.37185% 1.31667 4.52846);--panel-2:lab(13.014% 1.3956 5.32474);--line:lab(21.1354% 1.13514 4.51087);--line-soft:lab(15.3329% .944644 3.75803);--ink:lab(95.3832% .459492 3.01512);--ink-2:lab(74.5083% .587493 3.77758);--ink-3:lab(53.6276% .598729 3.78519);--brand:lab(67.3136% 17.7281 43.9533);--brand-2:lab(56.3558% 31.431 46.4081);--accent:lab(77.0975% 7.60436 62.8056);--ok:lab(72.7011% -41.1983 21.2091);--err:lab(61.2026% 53.402 31.0145);--shadow-1:0 1px 2px lab(0% 0 0/.4);--shadow-2:0 8px 30px lab(0% 0 0/.45);--shadow-3:0 24px 70px lab(0% 0 0/.55)}}body{background:var(--bg);color:var(--ink);font-feature-settings:"ss01", "cv11";-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;font-family:Inter Tight,Inter,system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}h1,h2,h3{letter-spacing:-.022em;font-weight:600;line-height:1.15}h2{font-size:1.02rem}h3{font-size:.9rem}::selection{background:var(--brand);color:var(--bg-deep)}:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:4px}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--line);border:3px solid var(--panel);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--ink-3)}}@layer layout{.app{grid-template-rows:auto 1fr;height:100dvh;display:grid}.stagerow{grid-template-columns:minmax(0,1fr) 372px;min-height:0;display:grid}@media (max-width:1100px){.stagerow{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:1fr}}.topbar{border-bottom:1px solid var(--line-soft);background:color-mix(in oklch, var(--bg-deep) 90%, transparent);-webkit-backdrop-filter:blur(16px)saturate(150%);backdrop-filter:blur(16px)saturate(150%);z-index:30;align-items:center;gap:14px;padding:11px 18px;display:flex;position:relative}.brand{align-items:center;gap:11px;display:flex}.brand-mark{background:linear-gradient(145deg, var(--brand) 0%, var(--brand-2) 62%, #7e432b 100%);border-radius:9px;flex-shrink:0;width:30px;height:30px;position:relative;box-shadow:inset 0 1px #ffffff47,0 3px 12px #b66b314d;box-shadow:inset 0 1px lab(100% 0 0/.28),0 3px 12px lab(53.0035% 27.5098 44.477/.3)}@supports (color:lab(0% 0 0)){.brand-mark{background:linear-gradient(145deg, var(--brand) 0%, var(--brand-2) 62%, lab(35.5507% 24.691 26.2647) 100%)}}.brand-mark:after{content:"";border:1px solid #fff3;border:1px solid lab(100% 0 0/.2);border-bottom-color:oklch(0% 0 0/.22);border-radius:4px;position:absolute;inset:6px}.brand-text{flex-direction:column;line-height:1.18;display:flex}.brand-text strong{letter-spacing:-.01em;font-size:.83rem}.brand-text span{color:var(--ink-3);letter-spacing:.09em;text-transform:uppercase;font-size:.63rem;font-weight:500}.topbar-spacer{flex:1}.badge{background:var(--panel);border:1px solid var(--line);color:var(--ink-2);white-space:nowrap;text-overflow:ellipsis;border-radius:999px;max-width:44ch;padding:5px 12px;font-size:.72rem;overflow:hidden}.stage{background:radial-gradient(ellipse 80% 60% at 50% 0%, #231e18 0%, transparent 70%), var(--bg-deep);place-items:center;min-height:0;padding:18px;display:grid;position:relative;overflow:hidden}@supports (color:lab(0% 0 0)){.stage{background:radial-gradient(ellipse 80% 60% at 50% 0%, lab(11.844% 1.63886 5.25208) 0%, transparent 70%), var(--bg-deep)}}.stage-photo{object-fit:contain;opacity:0;pointer-events:none;width:calc(100% - 36px);height:calc(100% - 36px);position:absolute;inset:18px}.stage-canvas{width:100%;height:100%;box-shadow:var(--shadow-3);z-index:1;border-radius:10px;display:block;position:absolute;inset:0}.stage-frame{border-radius:10px;max-width:100%;max-height:100%;position:relative;overflow:hidden}.stage-overlay{z-index:2;pointer-events:none;position:absolute;inset:0}.stage-svg{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.surf{fill:#0000;stroke:#e6cda580;stroke:lab(83.8753% 4.48924 23.4822/.5);stroke-width:.22px;stroke-dasharray:1.1 .7;vector-effect:non-scaling-stroke}.surf.is-active{stroke:var(--accent);stroke-width:.36px;stroke-dasharray:none;fill:#f1c9610d;fill:lab(82.9175% 6.37037 56.2191/.05)}.handles{pointer-events:none;position:absolute;inset:0}.handle{background:var(--bg-deep);border:2px solid var(--accent);cursor:grab;pointer-events:auto;touch-action:none;width:19px;height:19px;transition:transform .13s var(--ease-out), box-shadow .13s var(--ease-out);border-radius:50%;margin:-9.5px 0 0 -9.5px;position:absolute;box-shadow:0 0 #f1c96159;box-shadow:0 0 lab(82.9175% 6.37037 56.2191/.35)}.handle:hover{transform:scale(1.22);box-shadow:0 0 0 7px #f1c96129;box-shadow:0 0 0 7px lab(82.9175% 6.37037 56.2191/.16)}.handle:active{cursor:grabbing;transform:scale(1.12)}.surf-tag{background:var(--accent);color:var(--bg-deep);white-space:nowrap;letter-spacing:.01em;pointer-events:none;border-radius:6px;padding:3px 9px;font-size:.66rem;font-weight:650;position:absolute;transform:translate(-50%,-160%)}.stage-hint{background:color-mix(in oklch, var(--bg-deep) 82%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--line);color:var(--ink-2);z-index:3;pointer-events:none;border-radius:999px;padding:8px 15px;font-size:.74rem;position:absolute;bottom:26px;left:50%;transform:translate(-50%)}.empty{color:var(--ink-3);text-align:center;place-items:center;gap:14px;display:grid}.empty svg{color:var(--brand);opacity:.82}.empty p{font-size:.84rem}.sidebar{border-left:1px solid var(--line-soft);background:var(--panel);grid-template-rows:auto auto 1fr auto;min-height:0;max-height:100%;display:grid}@media (max-width:1100px){.sidebar{border-left:none;border-top:1px solid var(--line-soft);max-height:52vh}}.sidebar-head{border-bottom:1px solid var(--line-soft);gap:11px;padding:13px 15px 11px;display:grid}.sidebar-body{min-height:0;padding:13px 15px 6px;overflow-y:auto}.sidebar-foot{border-top:1px solid var(--line-soft);padding:12px 15px 15px}}@layer components{.upload{border-radius:var(--r);border:1px dashed var(--line);background:var(--panel-2);color:var(--ink-2);cursor:pointer;align-items:center;gap:9px;padding:10px 13px;font-size:.81rem;font-weight:500;transition:border-color .16s,background .16s,color .16s;display:flex}.upload:hover{border-color:var(--brand);color:var(--ink);background:color-mix(in oklch, var(--panel-2) 70%, var(--brand) 8%)}.upload input{display:none}.upload-icon{color:var(--brand);place-items:center;display:grid}.surfaces-head{text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3);justify-content:space-between;align-items:center;margin-bottom:7px;font-size:.66rem;font-weight:600;display:flex}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{background:var(--panel-2);border:1px solid var(--line-soft);color:var(--ink-2);cursor:pointer;transition:all .15s var(--ease-out);border-radius:999px;align-items:center;gap:5px;padding:5px 11px;font-size:.75rem;display:inline-flex}.chip:hover{border-color:var(--line);color:var(--ink)}.chip.is-active{background:color-mix(in oklch, var(--brand) 20%, var(--panel-2));border-color:var(--brand);color:var(--ink);font-weight:550}.chip-x{opacity:.55;padding:0 1px;font-size:.95rem;line-height:1}.chip-x:hover{opacity:1;color:var(--err)}.tabs{border-bottom:1px solid var(--line-soft);grid-template-columns:1fr 1fr;display:grid;position:relative}.tab{color:var(--ink-3);cursor:pointer;background:0 0;border:none;padding:11px 0;font-size:.79rem;font-weight:550;transition:color .15s;position:relative}.tab:hover{color:var(--ink-2)}.tab.is-active{color:var(--ink)}.tab-line{background:var(--brand);border-radius:2px;height:2px;position:absolute;bottom:-1px;left:22%;right:22%}.filters{flex-wrap:wrap;gap:5px;margin-bottom:14px;display:flex}.pill{border:1px solid var(--line-soft);color:var(--ink-3);cursor:pointer;background:0 0;border-radius:999px;padding:4px 10px;font-size:.71rem;transition:all .15s}.pill:hover{color:var(--ink-2);border-color:var(--line)}.pill.is-active{background:var(--ink);border-color:var(--ink);color:var(--bg-deep);font-weight:600}.group{margin-bottom:16px}.group-title{text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3);margin-bottom:8px;font-size:.64rem;font-weight:650}.swatches{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.swatch{cursor:pointer;text-align:left;background:0 0;border:none;gap:5px;padding:0;display:grid}.swatch-chip{aspect-ratio:1;transition:border-color .16s var(--ease-out), transform .16s var(--ease-out);border:2px solid #0000;border-radius:9px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #00000047;box-shadow:inset 0 0 0 1px lab(0% 0 0/.28)}.swatch-chip img{object-fit:cover;width:100%;height:100%;display:block}.swatch:hover .swatch-chip{border-color:var(--line)}.swatch.is-active .swatch-chip{border-color:var(--accent);box-shadow:inset 0 0 0 1px #00000047,0 0 0 3px #f1c96133;box-shadow:inset 0 0 0 1px lab(0% 0 0/.28),0 0 0 3px lab(82.9175% 6.37037 56.2191/.2)}.swatch-name{color:var(--ink-3);text-overflow:ellipsis;white-space:nowrap;font-size:.66rem;line-height:1.25;overflow:hidden}.swatch.is-active .swatch-name{color:var(--ink);font-weight:550}.adjust{gap:15px;display:grid}.adjust-product{border-radius:var(--r-sm);background:var(--panel-2);border:1px solid var(--line-soft);align-items:center;gap:10px;margin-bottom:3px;padding:10px 12px;display:flex}.adjust-product .dot{border-radius:7px;flex-shrink:0;width:26px;height:26px;box-shadow:inset 0 0 0 1px #0000004d;box-shadow:inset 0 0 0 1px lab(0% 0 0/.3)}.adjust-product strong{font-size:.79rem;font-weight:550;display:block}.adjust-product small{color:var(--ink-3);font-size:.66rem}.slider{gap:7px;display:grid}.slider-top{color:var(--ink-2);justify-content:space-between;align-items:baseline;font-size:.74rem;display:flex}.slider-val{font-variant-numeric:tabular-nums;color:var(--ink-3);font-size:.71rem}input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:20px}input[type=range]::-webkit-slider-runnable-track{background:var(--line);border-radius:2px;height:4px}input[type=range]::-moz-range-track{background:var(--line);border-radius:2px;height:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--ink);border:2px solid var(--bg-deep);width:15px;height:15px;box-shadow:var(--shadow-1);transition:transform .12s var(--ease-out);border-radius:50%;margin-top:-5.5px}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}input[type=range]::-moz-range-thumb{background:var(--ink);border:2px solid var(--bg-deep);border-radius:50%;width:13px;height:13px}.seg{gap:7px;display:grid}.seg>span{color:var(--ink-2);font-size:.74rem}.seg-btns{background:var(--panel-2);border:1px solid var(--line-soft);border-radius:9px;grid-template-columns:1fr 1fr;gap:4px;padding:3px;display:grid}.seg-btn{color:var(--ink-3);cursor:pointer;transition:all .15s var(--ease-out);background:0 0;border:none;border-radius:6px;padding:6px 0;font-size:.73rem}.seg-btn:hover{color:var(--ink-2)}.seg-btn.is-active{background:var(--ink);color:var(--bg-deep);font-weight:600}.btn{cursor:pointer;width:100%;transition:all .16s var(--ease-out);border:1px solid #0000;border-radius:11px;justify-content:center;align-items:center;gap:8px;padding:11px 18px;font-size:.82rem;font-weight:600;text-decoration:none;display:inline-flex}.btn.primary{background:linear-gradient(160deg, var(--brand) 0%, var(--brand-2) 100%);color:#140b05;color:lab(3.66174% 2.42036 3.38067);box-shadow:0 3px 14px #a15f2747;box-shadow:0 3px 14px lab(47.3144% 23.8639 42.56/.28)}.btn.primary:hover:not(:disabled){filter:brightness(1.08);box-shadow:0 5px 20px #a15f275c;box-shadow:0 5px 20px lab(47.3144% 23.8639 42.56/.36)}.btn.primary:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.42;cursor:not-allowed;filter:grayscale(.4)}.ghost{border:1px solid var(--line-soft);color:var(--ink-3);cursor:pointer;background:0 0;border-radius:6px;transition:all .15s}.ghost:hover{color:var(--ink);border-color:var(--line)}.ghost.small{width:20px;height:20px;padding:0;font-size:.9rem;line-height:1}.note{color:var(--ink-3);padding:10px 0;font-size:.78rem;line-height:1.55}.spinner{border:2px solid #1d140d4d;border:2px solid lab(7.17208% 3.64868 5.4563/.3);border-top-color:oklch(20% .02 60/.85);border-radius:50%;width:12px;height:12px;animation:.7s linear infinite spin}.toast{background:var(--panel-2);border:1px solid var(--line);box-shadow:var(--shadow-2);z-index:100;cursor:pointer;border-radius:11px;max-width:min(520px,90vw);padding:11px 18px;font-size:.81rem;position:fixed;bottom:22px;left:50%;transform:translate(-50%)}.toast.error{background:color-mix(in oklch, var(--panel-2) 78%, var(--err) 22%);border-color:color-mix(in oklch, var(--line) 50%, var(--err) 50%)}}@layer motion{@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}}