@font-face{font-family:Recia;src:url(/assets/fonts/Recia-Light.otf) format("opentype");font-weight:300;font-style:normal}@font-face{font-family:Recia;src:url(/assets/fonts/Recia-Regular.otf) format("opentype");font-weight:400;font-style:normal}@font-face{font-family:Recia;src:url(/assets/fonts/Recia-Medium.otf) format("opentype");font-weight:500;font-style:normal}@font-face{font-family:Recia;src:url(/assets/fonts/Recia-Semibold.otf) format("opentype");font-weight:600;font-style:normal}@font-face{font-family:Recia;src:url(/assets/fonts/Recia-Bold.otf) format("opentype");font-weight:700;font-style:normal}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #E9E5DC;--canvas-bg: #DDD8CE;--surface: #F6F4EF;--surface-2: #ECE8DF;--surface-3: #E0DBCF;--border: rgba(26,24,20,.14);--border-strong: rgba(26,24,20,.26);--border-faint: rgba(26,24,20,.07);--text: #1A1815;--text-muted: #6B675E;--text-dim: #9A958A;--accent: #2B4C9B;--accent-2: #34579E;--accent-contrast:#FFFFFF;--accent-soft: rgba(43,76,155,.1);--accent-softer: rgba(43,76,155,.16);--accent-ring: rgba(43,76,155,.42);--primary-bg: #1A1815;--primary-fg: #F6F4EF;--danger: #C2371F;--danger-soft: rgba(194,55,31,.12);--glass-bg: rgba(246,244,239,.74);--glass-border: rgba(26,24,20,.1);--panel-bg: rgba(246,244,239,.8);--tint-a: rgba(43,76,155,.06);--tint-b: rgba(120,110,90,.07);--tech-line: rgba(26,24,20,.3);--radius-xs: 3px;--radius-sm: 6px;--radius: 8px;--radius-lg: 12px;--radius-xl: 14px;--radius-pill: 980px;--shadow-sm: 0 1px 2px rgba(0,0,0,.05);--shadow-card: 0 1px 2px rgba(0,0,0,.05), 0 6px 22px rgba(0,0,0,.06);--shadow-hover: 0 2px 6px rgba(0,0,0,.07), 0 12px 30px rgba(0,0,0,.1);--shadow-pop: 0 8px 26px rgba(0,0,0,.12), 0 30px 68px rgba(0,0,0,.18);--header-h: 60px;--sidebar-w: 300px;--dur-micro: .14s;--dur-base: .22s;--dur-panel: .32s;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Display", sans-serif;--font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Roboto Mono", Menlo, monospace;--font-display: "Archivo Narrow", "Arial Narrow", var(--font-sans)}.dark{--bg: #0B0B0C;--canvas-bg: #0E0E0F;--surface: #141416;--surface-2: #1D1D20;--surface-3: #29292D;--border: rgba(255,255,255,.11);--border-strong: rgba(255,255,255,.2);--border-faint: rgba(255,255,255,.06);--text: #ECECEE;--text-muted: #8C8C92;--text-dim: #66666C;--accent: #3E63DD;--accent-2: #4E72E8;--accent-contrast:#FFFFFF;--accent-soft: rgba(62,99,221,.16);--accent-softer: rgba(62,99,221,.24);--accent-ring: rgba(62,99,221,.5);--primary-bg: #ECECEE;--primary-fg: #141416;--danger: #FF5A45;--danger-soft: rgba(255,90,69,.16);--glass-bg: rgba(20,20,22,.66);--glass-border: rgba(255,255,255,.1);--panel-bg: rgba(20,20,22,.74);--tint-a: rgba(62,99,221,.1);--tint-b: rgba(120,130,150,.05);--tech-line: rgba(255,255,255,.28);--shadow-sm: 0 1px 2px rgba(0,0,0,.5);--shadow-card: 0 1px 2px rgba(0,0,0,.55), 0 6px 22px rgba(0,0,0,.5);--shadow-hover: 0 2px 6px rgba(0,0,0,.55), 0 12px 30px rgba(0,0,0,.6);--shadow-pop: 0 8px 26px rgba(0,0,0,.65), 0 30px 68px rgba(0,0,0,.75)}#header,#sidebar,#viewport,.accordion,.grid-btn,.hbtn,.fabric-sw,#logo-modal,.select-input,.garment-btn,body{transition-property:background-color,color,border-color,box-shadow;transition-duration:var(--dur-base);transition-timing-function:var(--ease-out)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}body{background:var(--bg);background-image:radial-gradient(130% 90% at 100% 0%,var(--tint-a) 0%,transparent 55%),radial-gradient(110% 90% at 0% 100%,var(--tint-b) 0%,transparent 50%);color:var(--text);font-family:var(--font-sans);font-size:13px;line-height:1.5;letter-spacing:-.005em;height:100vh;overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{display:flex;flex-direction:column;height:100vh}.tech-label{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted)}#header{height:var(--header-h);min-height:var(--header-h);margin:14px 14px 0;background:var(--panel-bg);-webkit-backdrop-filter:saturate(150%) blur(30px);backdrop-filter:saturate(150%) blur(30px);border:1px solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);display:flex;align-items:center;padding:0 14px 0 18px;gap:18px;z-index:100}.header-left{display:flex;align-items:center;gap:10px;flex-shrink:0}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;transition:opacity var(--dur-micro) var(--ease-out)}.brand:hover{opacity:.72}.brand-emblem{height:26px;width:auto;object-fit:contain;filter:brightness(0);flex-shrink:0;transition:filter var(--dur-base) var(--ease-out)}.dark .brand-emblem{filter:brightness(0) invert(1)}.brand-lockup{display:flex;flex-direction:column;justify-content:center;gap:3px;padding-left:13px;border-left:1px solid var(--border-strong);line-height:1}.brand-text{font-family:var(--font-display);font-size:21px;font-weight:700;letter-spacing:.22em;color:var(--text);line-height:.86;white-space:nowrap;text-transform:uppercase;text-indent:.22em}.brand-studio{font-family:var(--font-mono);font-size:8.5px;font-weight:500;text-transform:uppercase;letter-spacing:.3em;color:var(--text-dim);line-height:1;white-space:nowrap}.header-center{flex:1;display:flex;justify-content:center;overflow:hidden}#garment-nav{display:flex;align-items:center;gap:3px;overflow-x:auto;scrollbar-width:none;padding:4px;background:var(--surface-2);border-radius:var(--radius);border:1px solid var(--border-faint)}#garment-nav::-webkit-scrollbar{display:none}.garment-btn{padding:7px 14px;border-radius:var(--radius-sm);border:1px solid transparent;background:transparent;color:var(--text-muted);font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:color var(--dur-micro) var(--ease-out),background-color var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out)}.garment-btn:hover{color:var(--text)}.garment-btn.active{color:var(--accent-contrast);background:var(--accent);box-shadow:var(--shadow-sm)}.header-right{display:flex;align-items:center;gap:9px;flex-shrink:0}.hbtn{display:flex;align-items:center;gap:7px;padding:8px 16px;border-radius:var(--radius);font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:transform var(--dur-micro) var(--ease-out),background-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out),opacity var(--dur-micro) var(--ease-out);border:1px solid transparent}.hbtn:active{transform:scale(.97)}.hbtn.ghost{background:var(--surface);color:var(--text);border-color:var(--border)}.hbtn.ghost:hover{background:var(--surface-2);box-shadow:var(--shadow-sm)}.hbtn.primary{background:var(--primary-bg);color:var(--primary-fg);border-color:var(--primary-bg)}.hbtn.primary:hover{box-shadow:var(--shadow-hover);transform:translateY(-1px)}.hbtn.primary:active{transform:scale(.97)}.hbtn.recording{background:var(--danger);border-color:var(--danger);color:#fff}.theme-toggle{width:38px;height:38px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text-muted);cursor:pointer;transition:background-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out)}.theme-toggle:hover{color:var(--text);box-shadow:var(--shadow-sm)}.theme-toggle .icon-sun{display:none}.theme-toggle .icon-moon,.dark .theme-toggle .icon-sun{display:block}.dark .theme-toggle .icon-moon{display:none}#studio{flex:1;display:flex;overflow:hidden;padding:14px;gap:14px}#sidebar{width:var(--sidebar-w);min-width:var(--sidebar-w);background:var(--panel-bg);-webkit-backdrop-filter:saturate(150%) blur(30px);backdrop-filter:saturate(150%) blur(30px);border:1px solid var(--glass-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent;padding:6px}#sidebar::-webkit-scrollbar{width:8px}#sidebar::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:8px;border:2px solid transparent;background-clip:padding-box}.accordion{background:transparent;border:none;border-radius:var(--radius);overflow:hidden;flex-shrink:0}.accordion+.accordion{border-top:1px solid var(--border-faint);border-radius:0}.acc-header{display:flex;align-items:center;gap:11px;width:100%;padding:15px 16px;background:none;border:none;cursor:pointer;color:var(--text);transition:background-color var(--dur-micro) var(--ease-out)}.acc-header:hover{background:var(--accent-soft)}.acc-icon{color:var(--accent);display:flex;flex-shrink:0}.dark .acc-icon{color:var(--accent-2)}.acc-title{flex:1;text-align:left;font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}#acc-colour .acc-title:before{content:"C.01 — ";color:var(--text-dim)}#acc-fabric .acc-title:before{content:"F.02 — ";color:var(--text-dim)}#acc-motion .acc-title:before{content:"M.03 — ";color:var(--text-dim)}#acc-scene .acc-title:before{content:"S.04 — ";color:var(--text-dim)}#acc-camera .acc-title:before{content:"K.05 — ";color:var(--text-dim)}.acc-arrow{color:var(--text-dim);flex-shrink:0;transition:transform var(--dur-base) var(--ease-out)}.accordion.open .acc-header>.acc-arrow{transform:rotate(0)}.accordion:not(.open) .acc-header>.acc-arrow{transform:rotate(180deg)}.acc-body{display:flex;flex-direction:column;gap:0;overflow:hidden;max-height:1200px;opacity:1;transform:translateY(0);transition:max-height var(--dur-panel) var(--ease-out),opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}.accordion:not(.open) .acc-body{max-height:0;opacity:0;transform:translateY(-6px)}.color-row{display:flex;align-items:center;justify-content:space-between;padding:12px 16px}.color-row+.color-row{border-top:1px solid var(--border-faint)}.color-row-label{font-size:13px;font-weight:500;color:var(--text)}.color-swatch-btn{width:34px;height:34px;border-radius:var(--radius-sm);border:none;cursor:pointer;position:relative;transition:transform var(--dur-micro) var(--ease-out);box-shadow:inset 0 0 0 1px var(--border-strong),var(--shadow-sm)}.color-swatch-btn:after{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:var(--radius);pointer-events:none;border:1.5px solid transparent;transition:border-color var(--dur-micro) var(--ease-out)}.color-swatch-btn:hover{transform:scale(1.08)}.color-swatch-btn:hover:after{border-color:var(--accent)}.color-swatch-btn:active{transform:scale(1)}#color-popover{margin:0 16px 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);padding:12px}.palette-swatches{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}.pal-sw{width:24px;height:24px;border-radius:var(--radius-xs);border:1px solid var(--border-strong);cursor:pointer;transition:transform var(--dur-micro) var(--ease-out)}.pal-sw:hover{transform:scale(1.18)}.pal-custom{width:100%;height:30px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);cursor:pointer;padding:2px}.fabric-swatches{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;padding:14px 16px}.fabric-sw{position:relative;aspect-ratio:1 / 1;border-radius:var(--radius);border:1px solid var(--border);background-size:cover;background-position:center;cursor:pointer;overflow:hidden;transition:transform var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out)}.fabric-sw:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 1px var(--border-faint);transition:box-shadow var(--dur-micro) var(--ease-out)}.fabric-sw:hover{transform:scale(1.04);box-shadow:var(--shadow-card)}.fabric-sw:active{transform:scale(.98)}.fabric-sw.active{box-shadow:var(--shadow-card)}.fabric-sw.active:after{box-shadow:inset 0 0 0 2px var(--accent)}.fabric-sw-label{position:absolute;left:0;right:0;bottom:0;padding:6px;font-family:var(--font-mono);font-size:9px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#fff;text-align:center;background:linear-gradient(to top,#0009,#0000)}.fabric-sw-none{background-color:var(--surface-2);display:flex;align-items:center;justify-content:center;color:var(--text-muted);flex-direction:column;gap:4px}.fabric-sw-none .fabric-sw-label{color:var(--text);background:none;position:static;padding:0}.acc-sub{border-top:1px dashed var(--border-faint)}.acc-sub-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 16px;background:none;border:none;cursor:pointer;font-family:var(--font-mono);font-size:10.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);transition:background-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out)}.acc-sub-btn:hover{background:var(--accent-soft);color:var(--text)}#adv-options-body,#shadow-body,#lighting-body{padding:12px 16px 14px;display:flex;flex-direction:column;gap:12px;border-top:1px dashed var(--border-faint)}.btn-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:12px 14px;padding:4px;background:var(--surface-2);border-radius:var(--radius);border:1px solid var(--border-faint)}.grid-btn{padding:9px 8px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-muted);font-family:var(--font-mono);font-size:10.5px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;text-align:center;transition:transform var(--dur-micro) var(--ease-out),background-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out),box-shadow var(--dur-micro) var(--ease-out)}.grid-btn:hover{color:var(--text)}.grid-btn:active{transform:scale(.96)}.grid-btn.active{background:var(--accent);color:var(--accent-contrast);box-shadow:var(--shadow-sm)}.slider-row{display:flex;align-items:center;gap:10px;padding:5px 16px}.slider-row.top{padding-top:14px;padding-bottom:0}.ctrl-label{font-size:12px;color:var(--text-muted);flex-shrink:0;letter-spacing:-.01em}.ctrl-val{font-family:var(--font-mono);font-size:10.5px;color:var(--accent);min-width:36px;text-align:right;font-variant-numeric:tabular-nums}.dark .ctrl-val{color:var(--accent-2)}.full-slider{width:calc(100% - 32px);margin:6px 16px 12px}.speed-row{display:flex;align-items:center;justify-content:space-between;padding:12px 16px 0}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:3px;border-radius:2px;background:var(--border-strong);cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:var(--radius-xs);background:var(--surface);border:1px solid var(--border-strong);box-shadow:0 1px 3px #00000040;transition:transform var(--dur-micro) var(--ease-out),border-color var(--dur-micro) var(--ease-out)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.12);border-color:var(--accent)}input[type=range]::-webkit-slider-thumb:active{transform:scale(1.04)}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:var(--radius-xs);background:var(--surface);border:1px solid var(--border-strong);box-shadow:0 1px 3px #00000040}input[type=range]::-moz-range-track{height:3px;border-radius:2px;background:var(--border-strong)}input[type=color]{accent-color:var(--accent)}.control-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.upload-mini{display:flex;align-items:center;gap:6px;padding:7px 13px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);cursor:pointer;font-family:var(--font-mono);font-size:10px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);transition:background-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out)}.upload-mini:hover{background:var(--surface-3);color:var(--text)}.logo-preview-row{display:flex;align-items:center;gap:10px}#logo-thumb{width:46px;height:46px;border-radius:var(--radius-sm);border:1px solid var(--border);object-fit:contain;background:var(--surface-2)}.btn-remove-sm{width:24px;height:24px;border-radius:var(--radius-xs);border:1px solid var(--border);background:var(--surface-2);color:var(--text-muted);cursor:pointer;font-size:10px;display:flex;align-items:center;justify-content:center;transition:background-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out)}.btn-remove-sm:hover{background:var(--danger-soft);color:var(--danger);border-color:transparent}.ctrl-hint{font-size:10.5px;color:var(--text-muted);padding:7px 11px;background:var(--accent-soft);border-left:2px solid var(--accent);border-radius:0 var(--radius-sm) var(--radius-sm) 0;line-height:1.45}.slider-row input[type=range]{flex:1}.sidebar-export{padding:12px 12px 14px;display:flex;flex-direction:column;gap:10px;margin-top:auto;border-top:1px dashed var(--border-faint)}.export-row{display:flex;gap:8px;flex-wrap:wrap}.project-row{display:flex;gap:6px;flex-wrap:wrap}.project-row .hbtn{flex:1;min-width:0;justify-content:center;padding:7px 8px;font-size:11px}.select-input{flex:1;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:9px 26px 9px 10px;font-size:11.5px;font-family:var(--font-mono);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%239A958A' stroke-width='3'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}.select-input:hover{border-color:var(--border-strong)}.btn-record{display:flex;align-items:center;justify-content:center;gap:7px;flex:1 0 100%;padding:11px 16px;background:var(--primary-bg);color:var(--primary-fg);border:none;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:box-shadow var(--dur-micro) var(--ease-out),transform var(--dur-micro) var(--ease-out);white-space:nowrap}.btn-record:hover{box-shadow:var(--shadow-hover);transform:translateY(-1px)}.btn-record:active{transform:scale(.98)}.btn-record.recording{background:var(--danger);color:#fff}#recording-status{display:flex;flex-direction:column;gap:5px}.rec-row{display:flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--danger)}.rec-dot{width:7px;height:7px;background:var(--danger);border-radius:50%;flex-shrink:0;animation:blink 1s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}.rec-frames-lbl{margin-left:auto;color:var(--text-muted);font-variant-numeric:tabular-nums}#viewport{flex:1;position:relative;background:var(--canvas-bg);overflow:hidden;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-xl);border:1px solid var(--glass-border);box-shadow:var(--shadow-card)}#canvas-frame{position:relative;width:100%;height:100%}#canvas-frame.format-fixed{box-shadow:0 0 0 9999px #00000080;outline:1px solid rgba(255,255,255,.18);border-radius:2px}#three-canvas{width:100%;height:100%;display:block;cursor:grab}#three-canvas:active{cursor:grabbing}#vignette-canvas{display:none}#composite-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}#overlay-ui{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.ovl-guides{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9;overflow:visible}.ovl-guides line{stroke:#ff3b6b;stroke-width:1;shape-rendering:crispEdges}#canvas-frame.show-grid:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5;background-image:linear-gradient(to right,rgba(91,114,204,.16) 1px,transparent 1px),linear-gradient(to bottom,rgba(91,114,204,.16) 1px,transparent 1px);background-size:10% 10%}.ovl-box{position:absolute;box-sizing:border-box;pointer-events:auto;cursor:move;touch-action:none}.ovl-box.active{outline:1.5px dashed #5B72CC;outline-offset:0}.ovl-box.locked{cursor:not-allowed}.ovl-handle{position:absolute;width:14px;height:14px;background:#5b72cc;border:2px solid #fff;border-radius:50%;pointer-events:auto;touch-action:none;box-shadow:0 1px 3px #0006}.ovl-rs{right:-7px;bottom:-7px;cursor:se-resize}.ovl-rot{left:50%;top:-28px;margin-left:-7px;cursor:grab}.ovl-rot:after{content:"";position:absolute;left:5px;top:14px;width:2px;height:14px;background:#5b72cc}.ovl-add-row{display:flex;gap:8px}.ovl-add-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px;border:1px dashed var(--border);border-radius:8px;background:transparent;color:var(--text);font:inherit;font-size:12px;cursor:pointer;transition:border-color .15s ease,background .15s ease}.ovl-add-btn:hover{border-color:#5b72cc;background:#5b72cc14}.ovl-empty{margin-top:8px;font-size:11px;color:var(--text-dim);line-height:1.4}.ovl-layers{display:flex;flex-direction:column;gap:6px;margin-top:8px}.ovl-layer{display:flex;align-items:center;gap:6px;padding:4px 6px;border:1px solid var(--border);border-radius:8px;cursor:pointer}.ovl-layer.active{border-color:#5b72cc;background:#5b72cc0f}.ovl-layer img{width:28px;height:28px;object-fit:contain;background:#0000001f;border-radius:4px;flex:none}.ovl-layer-thumb-t{width:28px;height:28px;flex:none;display:inline-flex;align-items:center;justify-content:center;background:#5b72cc2e;color:#fff;border-radius:4px;font-weight:700}.ovl-layer-name{flex:1;font-size:11px;color:var(--text)}.ovl-mini{width:22px;height:22px;flex:none;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:6px;background:transparent;color:var(--text-dim);cursor:pointer;font-size:11px}.ovl-mini:hover{color:var(--text);border-color:#5b72cc}.ovl-props{margin-top:10px}.tour-panel{padding:6px 16px 10px}.tour-panel .ovl-empty{margin-bottom:2px}.tour-pt{gap:3px;padding:3px 4px}.tour-pt-n{width:16px;height:16px;flex:none;display:inline-flex;align-items:center;justify-content:center;border-radius:5px;background:#5b72cc2e;font-family:var(--font-mono);font-size:9.5px;font-weight:700;color:var(--text)}.tour-pt .ovl-layer-name{font-family:var(--font-mono);font-size:9.5px;color:var(--text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tour-pt .ovl-mini{width:18px;height:18px;font-size:9.5px}.ovl-textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:38px;padding:7px 9px;margin-bottom:8px;border:1px solid var(--border);border-radius:8px;background:var(--surface, rgba(0,0,0,.15));color:var(--text);font:inherit;font-size:12px}.ovl-textarea:focus{outline:none;border-color:#5b72cc}.ovl-field{display:flex;align-items:center;gap:8px;margin-bottom:8px}.ovl-field .ctrl-label{flex:none}.ovl-field .select-input{flex:1}.ovl-field-row{display:flex;align-items:center;gap:6px;margin-bottom:8px}.ovl-field-row .ovl-weight{flex:1;min-width:0}.ovl-toggle{width:30px;height:30px;flex:none;border:1px solid var(--border);border-radius:7px;background:transparent;color:var(--text-dim);cursor:pointer}.ovl-toggle i{font-style:italic;font-weight:600}.ovl-toggle.active{border-color:#5b72cc;color:#fff;background:#5b72cc2e}.ovl-toggle:disabled{opacity:.35;cursor:not-allowed}#ovl-color{width:30px;height:30px;flex:none;padding:0;border:1px solid var(--border);border-radius:7px;background:none;cursor:pointer}.ovl-align{display:inline-flex;flex:none;border:1px solid var(--border);border-radius:7px;overflow:hidden}.ovl-align button{width:26px;height:30px;border:0;background:transparent;color:var(--text-dim);cursor:pointer;font-size:11px;font-weight:600}.ovl-align button+button{border-left:1px solid var(--border)}.ovl-align button.active{color:#fff;background:#5b72cc2e}.ovl-check{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none}.ovl-check input{accent-color:#5B72CC}.ovl-global{margin-top:8px;color:var(--text-dim)}.ovl-contrast-row{gap:10px}.ovl-contrast-row .ovl-check{flex:1}.ovl-contrast-row .select-input{flex:none;width:96px}.ovl-contrast-row .select-input:disabled{opacity:.4}.vp-marks{position:absolute;top:14px;right:14px;bottom:14px;left:14px;pointer-events:none;z-index:6}.vp-marks i{position:absolute;width:13px;height:13px;opacity:.6}.vp-marks i:nth-child(1){top:0;left:0;border-left:1.5px solid var(--tech-line);border-top:1.5px solid var(--tech-line)}.vp-marks i:nth-child(2){top:0;right:0;border-right:1.5px solid var(--tech-line);border-top:1.5px solid var(--tech-line)}.vp-marks i:nth-child(3){bottom:0;left:0;border-left:1.5px solid var(--tech-line);border-bottom:1.5px solid var(--tech-line)}.vp-marks i:nth-child(4){bottom:0;right:0;border-right:1.5px solid var(--tech-line);border-bottom:1.5px solid var(--tech-line)}.vp-tag{position:absolute;top:16px;left:50%;transform:translate(-50%);z-index:6;pointer-events:none;font-family:var(--font-mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--text-dim)}#canvas-instruction{position:absolute;bottom:26px;left:50%;transform:translate(-50%);background:var(--glass-bg);-webkit-backdrop-filter:saturate(150%) blur(20px);backdrop-filter:saturate(150%) blur(20px);border:1px solid var(--glass-border);color:var(--text);font-family:var(--font-mono);font-size:10px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;padding:9px 18px;border-radius:var(--radius-pill);box-shadow:var(--shadow-card);pointer-events:none;white-space:nowrap;display:none;z-index:7}#loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--canvas-bg);gap:16px;z-index:10;transition:opacity var(--dur-panel) var(--ease-out)}#loading-overlay.fade-out{opacity:0;pointer-events:none}#loading-overlay p{color:var(--text-muted);font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase}#garment-loading{position:absolute;top:16px;right:16px;background:var(--glass-bg);-webkit-backdrop-filter:saturate(150%) blur(20px);backdrop-filter:saturate(150%) blur(20px);border:1px solid var(--glass-border);border-radius:var(--radius);width:34px;height:34px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-card);z-index:8}.spinner{width:26px;height:26px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}.spinner-sm{width:16px;height:16px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.hidden{display:none!important}#toast{position:absolute;top:20px;left:50%;transform:translate(-50%);background:var(--primary-bg);color:var(--primary-fg);font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.04em;padding:11px 20px;border-radius:var(--radius);box-shadow:var(--shadow-pop);z-index:60;max-width:80%;text-align:center;animation:toast-in var(--dur-base) var(--ease-out)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%)}}#logo-modal{position:absolute;top:16px;right:16px;width:352px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-pop);display:flex;flex-direction:column;z-index:50;overflow:hidden;-webkit-user-select:none;user-select:none;transform-origin:top right;transition:width var(--dur-panel) var(--ease-out);animation:lm-in var(--dur-panel) var(--ease-out)}#logo-modal.lm-expanded{width:580px}@keyframes lm-in{0%{opacity:0;transform:translateY(-10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.lm-header{display:flex;align-items:center;gap:8px;padding:14px 14px 12px}.lm-title-pill{flex:1;background:var(--surface-2);color:var(--text);font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:11px 16px;border-radius:var(--radius-sm);text-align:center}.lm-header-actions{display:flex;gap:7px}.lm-icon-btn{width:38px;height:38px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-2);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out)}.lm-icon-btn:hover{background:var(--surface-3);color:var(--text)}.lm-tabs{display:flex;gap:6px;margin:12px 14px 0}.lm-tab{flex:1;padding:9px 0;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-2);color:var(--text-muted);font-family:var(--font-mono);font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:background-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out),border-color var(--dur-micro) var(--ease-out)}.lm-tab:hover{background:var(--surface-3);color:var(--text)}.lm-tab.active{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast)}.lm-canvas-wrap{margin:12px 14px 0;background:var(--surface-2);border-radius:var(--radius);overflow:hidden;border:1px solid var(--border)}.garment-tab-svg{width:100%;height:100%;display:block}.garment-tab-svg.hidden{display:none}.lm-controls{padding:12px 14px 16px;display:flex;flex-direction:column;gap:10px}.lm-ctrl-row{display:flex;align-items:center;gap:10px}.lm-ctrl-label{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);min-width:52px}.lm-ctrl-row input[type=range]{flex:1}.lm-ctrl-val{font-family:var(--font-mono);font-size:10.5px;color:var(--accent);min-width:34px;text-align:right;font-variant-numeric:tabular-nums}.dark .lm-ctrl-val{color:var(--accent-2)}#logo-drag-layer image:hover{opacity:.9}#logo-strip-wrap{display:flex;align-items:center;gap:7px;padding:10px 14px 0;overflow-x:auto;scrollbar-width:none}#logo-strip-wrap::-webkit-scrollbar{display:none}#logo-strip{display:flex;gap:7px;flex-wrap:nowrap}.logo-strip-item{position:relative;width:42px;height:42px;border-radius:var(--radius-xs);border:2px solid var(--border);background:var(--surface-2);cursor:pointer;overflow:visible;flex-shrink:0;transition:border-color var(--dur-micro) var(--ease-out),transform var(--dur-micro) var(--ease-out);animation:strip-in var(--dur-base) var(--ease-out)}.logo-strip-item:hover{transform:scale(1.05)}.logo-strip-item.active{border-color:var(--accent)}@keyframes strip-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.logo-strip-item img{width:100%;height:100%;object-fit:contain;border-radius:2px;padding:3px}.logo-strip-del{position:absolute;top:-6px;right:-6px;width:17px;height:17px;border-radius:50%;background:var(--danger);border:2px solid var(--surface);color:#fff;font-size:9px;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}.lm-add-btn{width:42px;height:42px;border-radius:var(--radius-xs);border:1.5px dashed var(--border-strong);background:transparent;color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background-color var(--dur-micro) var(--ease-out),border-color var(--dur-micro) var(--ease-out),color var(--dur-micro) var(--ease-out)}.lm-add-btn:hover{background:var(--surface-2);border-color:var(--accent);color:var(--text)}#calib{position:absolute;left:16px;bottom:16px;z-index:70;width:352px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px;box-shadow:var(--shadow-pop);font-size:12px}.calib-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}.calib-head strong{flex:1;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.calib-head span{color:var(--text-muted);font-family:var(--font-mono);font-variant-numeric:tabular-nums}#calib-close{background:var(--surface-2);border:none;color:var(--text-muted);border-radius:var(--radius-sm);width:28px;height:28px;cursor:pointer}#calib-close:hover{background:var(--surface-3);color:var(--text)}#calib-scrub{width:100%}.calib-actions{margin:8px 0}.calib-actions button,#calib-apply{background:var(--surface-2);border:1px solid var(--border);color:var(--text);border-radius:var(--radius-sm);padding:8px 11px;cursor:pointer;font-family:var(--font-mono);font-size:11px;transition:background-color var(--dur-micro) var(--ease-out)}.calib-actions button:hover{background:var(--surface-3)}#calib-apply{width:100%;margin-top:10px;background:var(--accent);color:var(--accent-contrast);border-color:var(--accent);font-weight:600;letter-spacing:.06em;text-transform:uppercase}.calib-rows{display:flex;flex-direction:column;gap:6px;margin:8px 0}.calib-row{display:flex;align-items:center;gap:5px}.calib-row .ck{width:66px;color:var(--text-muted);font-family:var(--font-mono);font-size:11px}.calib-row input{width:48px;background:var(--surface-2);border:1px solid var(--border);color:var(--text);border-radius:var(--radius-xs);padding:4px 5px;font-size:11px;font-family:var(--font-mono)}.calib-row button{background:var(--surface-2);border:1px solid var(--border);color:var(--text-muted);border-radius:var(--radius-xs);padding:4px 7px;cursor:pointer;font-size:11px}.calib-row button:hover{background:var(--surface-3);color:var(--text)}.calib-hint{color:var(--text-dim);font-size:10.5px;margin-top:10px;line-height:1.5}:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring)}.garment-btn:focus-visible,.hbtn:focus-visible,.theme-toggle:focus-visible,.grid-btn:focus-visible,.lm-tab:focus-visible,.btn-record:focus-visible,.acc-sub-btn:focus-visible,.upload-mini:focus-visible{box-shadow:0 0 0 3px var(--accent-ring)}.acc-header:focus-visible{box-shadow:inset 0 0 0 2px var(--accent-ring)}input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px var(--accent-ring)}.fabric-sw:focus-visible:after,.color-swatch-btn:focus-visible{box-shadow:0 0 0 3px var(--accent-ring)}@media (max-width: 900px){:root{--sidebar-w: 256px}#header{padding:0 12px;gap:12px}}@media (max-width: 680px){#studio{flex-direction:column}#sidebar{width:100%;min-width:0;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;order:2;padding:10px;gap:10px;border-top:1px solid var(--border);max-height:46vh}.accordion{min-width:248px}#viewport{order:1;min-height:50vh}.sidebar-export{position:static;min-width:248px}.hbtn span,.hbtn{font-size:11px}#logo-modal{left:12px;right:12px;width:auto}#logo-modal.lm-expanded{width:auto}}
