:root{--ink:#e8edf4;--muted:#a7b5c3;--paper:#10151d;--line:#344457;--orange:#f08b65;--green:#add8b8;--panel:#19222e;--input:#0d141d;color-scheme:dark;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;transition:background .15s,border-color .15s}button:disabled{cursor:wait;opacity:.45}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--orange);outline-offset:3px}svg{display:block}button svg,.access-badge svg,.privacy-note svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}a{color:inherit}[hidden]{display:none!important}
.header{min-height:92px;padding:22px max(22px,calc((100vw - 1760px)/2));border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px;background:#151c26}.brand{text-decoration:none;display:flex;align-items:center;gap:13px}.brand-number{font-weight:900;font-size:41px;letter-spacing:-3px;line-height:1}.brand-dot{color:var(--orange)}.brand-name{font-size:14px;font-weight:800;letter-spacing:1.4px;line-height:1.3}.brand-name>span{display:block;font-size:9px;color:var(--muted);letter-spacing:2.3px;margin-top:3px}.header-right{display:flex;align-items:center;gap:16px}.access-badge{display:flex;align-items:center;gap:7px;padding:8px 12px;border-radius:9px;background:#233b32;color:#badbcb;font-size:11px;font-weight:600}.edition{font-family:monospace;font-size:10px;letter-spacing:1px;color:var(--muted)}.language-switch{display:flex;gap:2px;padding:3px;background:#111a25;border:1px solid #607185;border-radius:9px}.language-switch button{border:0;padding:8px 10px;font-size:12px;font-weight:700;background:none;color:#c5d2df;border-radius:6px}.language-switch button.selected{background:#32465b;color:#fff}
main{max-width:1800px;margin:auto;padding:24px 22px 34px}.intro{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:700;color:var(--muted);margin:0 0 10px}h1{font-size:27px;letter-spacing:-.6px;line-height:1.2;margin:0 0 7px}h1>span{color:var(--orange)}h1>span:first-child{color:var(--ink)}.intro-copy{font-size:14px;color:var(--muted);margin:0;line-height:1.5}.live-pill{font-size:12px;color:var(--green);display:flex;gap:8px;align-items:center;white-space:nowrap;margin-bottom:3px}.live-pill>span:first-child{width:6px;height:6px;border-radius:50%;background:#93cba2;box-shadow:0 0 0 4px #213c32}.workspace{display:grid;grid-template-columns:320px minmax(0,1fr);gap:16px;align-items:start}.controls{background:var(--panel);border:1px solid var(--line);border-radius:15px;overflow:hidden}.control-section{padding:20px 18px;border-bottom:1px solid var(--line)}h2{font-size:16px;display:flex;align-items:center;gap:10px;margin:0 0 17px}.step{color:#bac8d8;font-size:10px;font-family:monospace;border:1px solid #526174;border-radius:4px;padding:4px 5px;font-weight:400}.drop-zone{border:1px dashed #f6ab8e;border-radius:9px;min-height:160px;background:#3a3031;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:20px 10px;transition:background .2s,border-color .2s}.drop-zone.drag-over{border-color:#fff1e7;background:#523b37}.upload-icon{width:25px;height:25px;margin-bottom:10px;fill:none;stroke:#ffb392;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.drop-zone>strong{font-size:13px;margin-bottom:5px;color:#ffe0d4}.drop-zone>span{font-size:11px;color:#e5c6bc}.upload-button{font-size:13px;font-weight:750;background:var(--orange);color:#151a20;border-radius:9px;padding:12px 16px;margin-top:14px;cursor:pointer}.upload-button:hover{background:#ffab86}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.drop-zone:focus-within{outline:3px solid var(--orange);outline-offset:3px}.file-row{display:flex;align-items:center;gap:9px;margin-top:14px}.thumb{width:38px;height:44px;flex-shrink:0;background:#111923;border:1px solid var(--line);border-radius:5px;display:flex;align-items:center;justify-content:center;overflow:hidden}.thumb>img{max-width:100%;max-height:100%;object-fit:contain}.file-row>div:nth-child(2){min-width:0;flex:1}.file-row strong{font-size:12px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-row span{display:block;font-size:11px;color:var(--muted);margin-top:4px}.icon-button{border:0;border-radius:6px;background:#334154;color:#edf2f7;width:30px;height:30px;font-size:18px;flex-shrink:0}.check-row{display:flex;align-items:center;gap:8px;font-size:12px;margin-top:13px;line-height:1.5;cursor:pointer}.check-row input,.preview-options input{accent-color:var(--orange);width:15px;height:15px;margin:0;flex-shrink:0}.label-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.field-label{font-size:12px;font-weight:650}.subtle{font-family:monospace;font-size:11px;color:var(--muted)}.garment-types{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:9px 0 17px}.garment-types button,.sizes button,.color-button{border:1px solid #526174;background:var(--input);color:var(--ink);border-radius:8px;font-size:12px;font-weight:650;min-height:42px}.garment-types button{padding:10px 2px}.sizes{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.sizes button{padding:10px 0}.garment-types button:hover,.sizes button:hover,.color-button:hover{background:#2c3b4d;border-color:#94a6ba}.garment-types button.selected,.sizes button.selected{background:var(--orange);border-color:var(--orange);color:#151a20}.color-label{display:block;margin-top:17px;margin-bottom:9px}.colors{display:flex;gap:9px}.color-button{flex:1;display:flex;align-items:center;gap:8px;padding:9px}.color-button.selected{border-color:var(--orange);background:#3a3031;color:#ffe0d4}.swatch{width:18px;height:18px;border-radius:50%;border:1px solid #a7b5c3;flex-shrink:0}.swatch.black{background:#252725}.swatch.white{background:#fff}.color-check{margin-left:auto;font-size:11px;visibility:hidden}.color-button.selected .color-check{visibility:visible}.dimension-row{display:flex;align-items:center;gap:10px}.dimension-row>label{font-size:12px;font-weight:650;flex:1;min-width:0}.dimension-row label>span{font-weight:400;color:var(--muted)}.dimension-row label>.dimension-name{font-weight:650;color:var(--ink)}.dimension-row input{width:100%;margin-top:7px;border:1px solid #526174;border-radius:8px;height:48px;padding:9px 11px;font-size:24px;font-weight:650;color:var(--ink);background:var(--input)}.dimension-row input[aria-invalid=true]{border-color:var(--orange)}.times{color:var(--muted);font-size:18px;margin-top:20px}.preset-row{display:flex;gap:6px;margin-top:14px}.preset-row button{border:1px solid #526174;background:var(--input);color:#c5d2df;padding:9px 6px;font-size:12px;border-radius:7px;flex:1}.preset-row button.active{border-color:var(--orange);background:#3a3031;color:#ffe0d4}.preset-row button:hover{background:#334154}.micro-note{font-size:12px;line-height:1.5;color:var(--muted);margin:9px 0 0}.position-header{display:flex;align-items:center;justify-content:space-between;margin:21px 0 15px;padding-top:17px;border-top:1px solid var(--line)}.text-button{border:0;background:none;font-size:12px;color:var(--orange);padding:4px 0}.text-button:hover{text-decoration:underline}.slider-label{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-bottom:6px;gap:8px}.slider-label output{font-family:monospace;color:#ffb392;font-size:12px}input[type=range]{width:100%;height:20px;margin:0 0 10px;accent-color:var(--orange);cursor:pointer}.drag-note{margin-top:0}.measurements{font-size:12px}.measurements summary{display:flex;justify-content:space-between;cursor:pointer;list-style:none;padding:17px 18px;font-weight:650;gap:8px}.measurements summary::-webkit-details-marker{display:none}.measurements[open] summary>span:last-child{transform:rotate(45deg)}.measure-content{padding:0 18px 16px}.measure-content p{font-size:12px;color:var(--muted);line-height:1.6;margin:0 0 12px}.measure-content table{width:100%;border-collapse:collapse;margin:13px 0 15px;text-align:left;font-size:12px}.measure-content td,.measure-content th{padding:8px 4px;border-bottom:1px solid var(--line)}.measure-content thead{color:var(--muted)}
.preview-column{min-width:0;scroll-margin-top:15px}.preview-panel{border:1px solid var(--line);border-radius:15px;overflow:hidden;background:var(--panel)}.preview-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;border-bottom:1px solid var(--line);background:#17212d;flex-wrap:wrap}.preview-top>div:first-child{display:flex;align-items:center;gap:10px}.preview-tag{font-size:11px;font-weight:750;letter-spacing:.8px}.scale-tag{font-size:11px;color:var(--muted);border-left:1px solid #526174;padding-left:10px}.preview-options{display:flex;gap:14px}.preview-options label{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:12px;color:#c5d2df}.scene-wrap{position:relative;min-height:650px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 48% 40%,#f9fafb 0%,#e6eaf0 78%);color-scheme:light;overflow:hidden}.scene-wrap>svg{width:100%;height:650px;user-select:none;touch-action:pan-y;overflow:hidden}#dragTarget{cursor:grab;touch-action:none}#dragTarget.dragging{cursor:grabbing}#dragTarget:focus-visible{outline:none;stroke:var(--orange);stroke-width:.1}#designImage{pointer-events:none!important}.scene-bottom{position:absolute;bottom:17px;left:20px;right:20px;display:flex;align-items:center;justify-content:space-between;gap:8px;pointer-events:none}.front-hint{font-size:9px;letter-spacing:.8px;color:#526477}.zoom-control{pointer-events:auto;display:flex;align-items:center;background:#35485d;border:1px solid #526174;border-radius:8px;overflow:hidden;flex-shrink:0}.zoom-control button{width:34px;height:34px;background:none;border:0;color:#fff;font-size:19px}.zoom-control button:hover{background:#4d6176}.zoom-control output{font-size:11px;min-width:43px;text-align:center;color:#e8edf4;font-family:monospace}.zoom-control #zoomReset{border-left:1px solid #526174;font-size:16px}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#111923;border:1px solid var(--line);border-radius:12px;margin-top:14px;overflow:hidden}.stats>div{padding:18px;min-width:0}.stats>div+div{border-left:1px solid var(--line)}.stats>div>span{font-size:10px;letter-spacing:.5px;color:var(--muted);display:block;margin-bottom:8px}.stats>div>span>b{color:var(--ink);font-size:11px;margin-left:4px}.stats strong{display:block;font-size:26px;letter-spacing:-.7px;line-height:1.2}.stats strong>span{font-size:12px;color:var(--muted);margin-left:6px;letter-spacing:0;font-weight:400}.stats small{display:block;color:var(--muted);font-size:11px;margin-top:7px;line-height:1.5}.status-panel{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border:1px solid #3c6055;background:#203a33;border-radius:9px;margin-top:14px;color:#c5e3d4}.status-panel>#statusIcon{width:23px;height:23px;border-radius:50%;background:#34574a;font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.status-panel strong{font-size:13px;display:block;margin-bottom:4px}.status-panel p{font-size:12px;line-height:1.6;margin:0}.status-panel.warning{background:#3c3028;border-color:#8d6446;color:#f5c9a6}.status-panel.warning>#statusIcon{background:#5c4432}.preview-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:17px 0}.preview-footer p{font-size:12px;line-height:1.6;color:var(--muted);max-width:510px;margin:0}.export-button{border:0;background:var(--orange);color:#151a20;border-radius:9px;display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 16px;font-size:13px;font-weight:750;white-space:nowrap}.export-button:hover{background:#ffab86}.privacy-note{font-size:12px;display:flex;align-items:center;gap:7px;color:var(--muted);margin:18px 0 0;line-height:1.5}.privacy-note svg{width:14px;height:14px;flex-shrink:0}.footer{display:flex;justify-content:space-between;gap:24px;margin:0 22px;padding:24px 0 27px;border-top:1px solid var(--line);font-size:10px;letter-spacing:1px;color:var(--muted)}.footer span:first-child{font-weight:700;color:var(--ink)}.error-text{font-size:12px;color:#ffbca9;line-height:1.5;margin:10px 0 0}.loading-overlay{position:absolute;inset:0;background:#142332e8;display:flex;align-items:center;justify-content:center;font-size:14px;color:#fff;z-index:3}.mobile-preview-link{display:none}
.embedded .brand,.embedded .access-badge,.embedded .edition,.embedded .footer{display:none}.embedded .header{min-height:0;padding:10px 22px;justify-content:flex-end}.embedded main{padding-top:8px}.embedded .eyebrow{display:none}
@media(min-width:1500px){.scene-wrap,.scene-wrap>svg{min-height:720px;height:720px}}
@media(max-width:1100px){.workspace{grid-template-columns:300px minmax(0,1fr)}.scale-tag{display:none}.stats>div{padding:15px 12px}.stats strong{font-size:22px}.scene-wrap,.scene-wrap>svg{min-height:600px;height:600px}.preview-footer{flex-direction:column;align-items:stretch;gap:12px}.preview-footer p{max-width:none}}
@media(max-width:800px){.header{padding:18px;min-height:78px}.brand-number{font-size:34px}.brand-name{font-size:12px}.edition,.access-badge{display:none}.header-right{gap:8px}main{padding:20px 14px 24px}.intro{align-items:flex-start;display:block;margin-bottom:20px}h1{font-size:25px}.live-pill{margin-top:12px}.workspace{display:flex;flex-direction:column;gap:16px}.controls{width:100%;order:2}.preview-column{width:100%;order:1}.scene-wrap,.scene-wrap>svg{height:460px;min-height:460px}.preview-top{padding:14px;gap:10px}.preview-tag{font-size:10px}.preview-options{gap:10px}.preview-options label{font-size:11px}.scene-bottom{left:12px;right:12px;bottom:12px}.front-hint{font-size:7px;letter-spacing:.4px}.stats>div{padding:13px 9px}.stats>div>span{font-size:9px;letter-spacing:0}.stats strong{font-size:19px}.stats strong>span{font-size:10px;margin-left:4px}.stats small{font-size:10px}.control-section{padding:20px}.footer{font-size:9px;line-height:1.5;margin:0 14px}.mobile-preview-link{display:block;text-align:center;font-size:13px;font-weight:650;text-decoration:none;padding:16px;background:#334154;color:#edf2f7}.embedded .header{padding:10px 14px}.embedded main{padding-top:0}}
@media(max-width:360px){.brand{gap:8px}.brand-number{font-size:29px}.language-switch button{padding:7px}.front-hint{display:none}.scene-bottom{justify-content:flex-end}.stats strong{font-size:17px}.stats small{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}