:root{--ink:#203b61;--paper:#faf8f3;--line:#e8e3db;--muted:#88909c}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font:14px system-ui,-apple-system,sans-serif}button,input{font:inherit}button{cursor:pointer;color:inherit;background:#fff;border:1px solid var(--line);border-radius:9px;padding:9px 13px}button:hover{background:#f2f0eb}button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid #709bc4;outline-offset:3px}button:disabled{opacity:.4;cursor:default}.primary{background:var(--ink);color:#fff;border-color:var(--ink)}.primary:hover{background:#2e507a}header{height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#fffdf9;border-bottom:1px solid var(--line)}.brand{font:bold 29px Georgia;color:var(--ink);text-decoration:none;letter-spacing:-1px;display:flex;align-items:center;gap:16px}.brand span{font:9px system-ui;letter-spacing:2px;color:var(--muted);border-left:1px solid var(--line);padding-left:15px}.project-title{font-size:13px;color:#727b86}.actions{display:flex;align-items:center;gap:15px}.local{font-size:11px;color:var(--muted)}.iconbutton{border:0;background:none;padding:8px}.iconbutton svg{width:19px;height:19px}.layout{height:calc(100dvh - 60px);display:grid;grid-template-columns:86px minmax(360px,1fr) 290px}.left{border-right:1px solid var(--line);background:#fffdf9;padding:22px 10px}.left #clothes{display:grid;gap:14px}.garment{width:64px;height:70px;background:transparent;border:1px solid transparent;padding:14px;display:grid;place-items:center}.garment svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}.garment.active{background:#eef1f5;border-color:#ccd5e1}.garment:hover{background:#f3f2ed}.stage{min-height:0;display:flex;align-items:center;flex-direction:column;padding:18px 32px 15px;background:radial-gradient(ellipse at center,#fffefa,#f6f3ed)}.toolbar{display:flex;justify-content:center;gap:5px;align-items:center;position:relative;background:#fffdfb;border:1px solid var(--line);padding:5px 9px;border-radius:13px;box-shadow:0 4px 18px #203b6105;z-index:3;flex-shrink:0}.tool{background:none;border-color:transparent;padding:7px 11px;display:grid;justify-items:center;gap:4px;font-size:10px;min-width:51px}.tool svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.tool.active{background:#ecf0f5;color:var(--ink)}.tool-divider{height:25px;width:1px;background:var(--line);margin:0 4px}.tool-wrap{position:relative}.popover{position:absolute;top:67px;left:0;padding:16px;width:205px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 30px #203b6115;border-radius:12px}.popover strong{display:block;font-size:12px;margin-bottom:15px}.colors{display:flex;gap:13px}.color{width:32px;height:32px;border-radius:50%;padding:0}.color.active{outline:2px solid var(--ink);outline-offset:2px}.sizes{display:flex;gap:6px;flex-wrap:wrap}.sizes button{padding:7px 11px}.sizes .active{background:var(--ink);color:white}.pattern-panel{left:auto;right:0}.pattern-panel button{display:block;width:100%;text-align:left;margin-top:7px}.canvas-wrap{width:100%;flex:1;min-height:180px;position:relative;display:flex;justify-content:center}.canvas{width:100%;height:100%;position:absolute;inset:0;touch-action:none;user-select:none;overflow:hidden}.canvas-caption{position:absolute;top:18px;left:0;font-size:11px;color:#9b9b95;z-index:1}.canvas-hint{position:absolute;bottom:5px;left:0;right:0;text-align:center;color:#9c9e9f;font-size:10px;pointer-events:none}.object{cursor:grab}.object:active{cursor:grabbing}.selection{pointer-events:none;fill:none;stroke:#335f8f;stroke-width:1.5;stroke-dasharray:4 3}.handle{fill:white;stroke:#335f8f;stroke-width:2;cursor:nwse-resize}.rotate{cursor:crosshair;fill:#203b61}.preview-badge{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);border-radius:18px;background:#fff8;padding:8px 13px;font-size:11px;white-space:nowrap}.preview-mode .object{cursor:default;filter:drop-shadow(1px 1px 1px #39231355)}.ai-area{width:min(780px,100%);flex-shrink:0}.status{font-size:12px;text-align:center;min-height:28px;line-height:26px;color:#687787}.composer{padding:11px;background:white;border:1px solid #e8e3dc;border-radius:22px;box-shadow:0 8px 24px #203b6106}.suggestions{display:flex;gap:8px;margin-bottom:9px}.suggestions button{font-size:11px;padding:6px 11px;border-radius:16px}.inputrow{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:16px;padding:7px 9px}.target{font-size:10px;background:#eff2f5;border-radius:7px;padding:7px;white-space:nowrap;cursor:pointer}.inputrow input{min-width:0;flex:1;border:0;outline:0;background:none;padding:8px 0;font-size:13px}.send{border-radius:50%;width:34px;height:34px;padding:0;font-size:20px}.ai-note{text-align:center;font-size:9px;color:#a2a4a6;margin:9px 0 0}.right{border-left:1px solid var(--line);overflow:auto;background:#fffdf9;padding:23px 21px}.right section+section{border-top:1px solid var(--line);padding-top:21px;margin-top:21px}h2{font-size:15px;margin:0 0 18px;font-weight:600}.user-row{display:flex;align-items:center;gap:12px;margin-bottom:20px}.avatar{width:35px;height:35px;border-radius:50%;background:#e9edf2;display:grid;place-items:center;font:14px Georgia}.user-row strong{font-size:12px;font-weight:500}.user-row small{display:block;color:#969da5;font-size:10px;margin-top:4px}dl{margin:0;display:grid;gap:13px}dl div{display:flex;justify-content:space-between;font-size:11px;align-items:center}dt{color:#8a9098}dd{margin:0;display:flex;align-items:center;gap:7px}#infoColorDot{display:inline-block;width:11px;height:11px;border:1px solid #d6d0c4;border-radius:50%;background:#eee8da}.section-title{display:flex;justify-content:space-between;align-items:baseline}.section-title span{font-size:10px;color:#929aa4}.layer-list{display:grid;gap:5px}.layer-row{display:flex;gap:7px;align-items:center;border:1px solid transparent;border-radius:9px;padding:6px;background:#faf8f4}.layer-row.active{background:#edf1f6;border-color:#d8e1ec}.layer-select{display:flex;align-items:center;gap:10px;flex:1;border:0;background:transparent;padding:3px;text-align:left;font-size:11px;min-width:0}.layer-thumb{width:32px;height:32px;display:grid;place-items:center;background:#fff;border-radius:6px;font:bold 20px Georgia;color:var(--layer-color,#b27049)}.layer-eye{padding:3px;background:none;border:0}.layer-eye svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5}.layer-row.hidden-layer{opacity:.45}.right p{font-size:11px;color:#8b939d;line-height:1.7;margin:0 0 13px}.fabrics{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.fabric{padding:6px;border-radius:8px;display:grid;gap:7px;justify-items:center}.fabric.active{border-color:var(--ink);background:#edf1f5}.fabric strong{font-size:10px;font-weight:400}.swatch{width:100%;height:42px;border-radius:5px;background-color:var(--color);background-image:repeating-linear-gradient(0deg,#ffffff14 0px,#ffffff14 1px,transparent 1px,transparent 3px),repeating-linear-gradient(90deg,#00000012 0px,#00000012 1px,transparent 1px,transparent 3px)}.swatch.denim{background-color:#3f7195;background-image:repeating-linear-gradient(135deg,#fff2 0 1px,transparent 1px 4px)}.swatch.check{background-color:#ecede5;background-image:repeating-linear-gradient(0deg,#41688488 0 8px,transparent 8px 16px),repeating-linear-gradient(90deg,#41688488 0 8px,transparent 8px 16px)}details{margin-top:18px}summary{font-size:11px;cursor:pointer;color:#7e8793}details label{display:flex;justify-content:space-between;align-items:center;font-size:11px;margin-top:12px}details input{width:78px;padding:6px;border:1px solid var(--line);border-radius:5px}.settings-actions{display:flex;gap:7px;margin-top:13px}.settings-actions button{font-size:10px;padding:7px}.toast{position:fixed;top:80px;left:50%;transform:translateX(-50%);padding:11px 20px;background:var(--ink);color:white;border-radius:10px;box-shadow:0 8px 30px #0002;z-index:10;display:none;font-size:12px}dialog{border:1px solid var(--line);border-radius:18px;padding:25px;color:var(--ink);width:350px}dialog::backdrop{background:#203b612b}dialog input{width:100%;padding:12px;border:1px solid var(--line);border-radius:8px;margin:12px 0 20px}dialog form>div{display:flex;justify-content:flex-end;gap:10px}dialog p{font-size:12px;color:#89909b}[hidden]{display:none!important}@media(max-width:1000px){.layout{grid-template-columns:70px minmax(330px,1fr) 245px}.left{padding:20px 7px}.garment{width:54px}.stage{padding:16px 15px}.right{padding:20px 15px}.tool{padding:7px 8px;min-width:42px}.brand span,.local{display:none}}@media(max-width:720px){header{padding:0 14px;height:62px}.brand{font-size:25px}.project-title{display:none}.layout{grid-template-columns:60px minmax(0,1fr);height:auto}.stage{height:750px;padding:13px 10px}.left{padding:15px 3px}.right{grid-column:1/-1;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:20px}.right section+section{margin-top:0}.right .layer-settings{grid-column:1/-1}.toolbar{gap:0;padding:4px;max-width:100%;flex-wrap:wrap}.tool{padding:6px;min-width:34px}.tool-divider{margin:0 2px}.toolbar svg{width:17px;height:17px}.inputrow{flex-wrap:wrap}.inputrow input{flex-basis:100px}.canvas-caption{top:10px}.ai-note{font-size:8px}}

#colorPanel{width:252px}.colors{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 10px}.color-option{padding:4px 0;border:0;background:transparent;display:grid;justify-items:center;gap:7px;font-size:10px}.color-option .color{display:block;border:1px solid #00000016}.color-option.active .color{outline:2px solid var(--ink);outline-offset:3px}.color-option.active{font-weight:600}

/* Icon-only product rail */
.left{background:#1d2c3e;border-right:1px solid #142336;padding-top:24px;color:#c7d2df}.left #clothes{gap:18px;justify-items:center}.left .garment{position:relative;color:#c7d2df;height:64px;padding:15px;border-radius:12px;border-color:transparent;background:transparent}.left .garment svg{width:31px;height:31px;stroke-width:1.45}.left .garment:hover{background:#2b3d52;color:#fff}.left .garment.active{color:#fff;background:#354b65;border-color:#597089}.left .garment.active::before{content:"";position:absolute;left:-10px;top:18px;width:3px;height:28px;border-radius:3px;background:#dcb28b}.left .garment:focus-visible{outline:2px solid #dcb28b;outline-offset:3px}@media(max-width:1000px){.left .garment{width:54px}}@media(max-width:720px){.left .garment{width:50px;height:60px;padding:12px}.left .garment.active::before{left:-4px}}

/* Compact icon toolbar and larger product stage */
.tool{width:43px;min-width:43px;height:42px;padding:9px;display:flex;align-items:center;justify-content:center}.tool i{display:flex}.tool svg{width:23px;height:23px}.toolbar{gap:7px;padding:6px 12px}.current-color{width:22px;height:22px;display:block;border:1px solid #c9cdd3;border-radius:4px;box-shadow:inset 0 0 0 2px #ffffff28}.current-size{font-size:17px;font-weight:600;line-height:1}.current-size.bag-dimensions{font-size:8px;line-height:1.3}.text-icon{font:500 25px Georgia}.tool.back-side svg{stroke-dasharray:2 1}.sides{display:flex;gap:9px}.sides .active{background:var(--ink);color:white}.sizes{gap:7px}.canvas{transform:scale(1.18);transform-origin:50% 48%}.canvas-wrap{overflow:hidden}.canvas-caption{z-index:1}.ai-area{position:relative;z-index:1}.color-option>span:last-child{display:none}.color-option{padding:6px 0}.popover{top:57px}#effectDialog{width:min(650px,90vw);max-height:90vh}#effectImage{display:block;width:100%;max-height:62vh;object-fit:contain}#effectDialog p{color:#8b939d;font-size:11px}.effect-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px}.effect-actions a{display:inline-block;padding:9px 13px;border:1px solid var(--line);border-radius:9px;text-decoration:none;font:inherit;color:var(--ink);background:#fff;cursor:pointer}.effect-actions a:hover{background:#f2f0eb}.effect-actions a:focus-visible{outline:2px solid #709bc4;outline-offset:3px}@media(max-width:720px){.toolbar{gap:3px;padding:4px}.tool{width:32px;min-width:32px;padding:6px}.tool svg{width:20px;height:20px}.current-size{font-size:15px}.canvas{transform:scale(1.1)}}

.toolbar .tool{flex-shrink:0;color:#203b61}.toolbar .tool i{width:24px;height:24px;min-width:24px;display:inline-flex;align-items:center;justify-content:center;font-style:normal;flex-shrink:0}.toolbar .tool i svg{display:block;width:24px;height:24px;min-width:24px;overflow:visible;fill:none;stroke:#203b61;stroke-width:1.7}.toolbar .current-color{display:block;flex-shrink:0;width:24px;height:24px;border:1.5px solid #8290a0}.toolbar .current-size,.toolbar .text-icon{display:block;flex-shrink:0;color:#203b61}

/* Four distinct product silhouettes, no visible labels */
.left{background:#172638;color:#cdd8e4}.left .garment{color:#b8c7d9}.left .garment .product-icon{display:block;width:38px;height:38px;fill:currentColor;stroke:none}.left .garment .product-icon .detail{fill:none;stroke:#172638;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}.left .garment.active{background:#354d68;color:#fff;border-color:#536e8e}.left .garment.active .detail{stroke:#354d68}.left .garment:hover .detail{stroke:#2b3d52}.left .garment.active:hover .detail{stroke:#354d68}@media(max-width:720px){.left .garment .product-icon{width:34px;height:34px}}

/* Refined outline product icons */
.left{background:#1a2737}.left #clothes{gap:12px}.left .garment{height:62px;border-radius:10px;color:#a9b8cb;transition:color .15s,background .15s}.left .garment .product-icon{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.left .garment.active{color:#f8fafc;background:#30445d;border-color:#455d79}.left .garment:hover{color:#f8fafc;background:#293b50}.left .garment.active::before{height:22px;top:20px;width:2px;background:#d6b28e}.left .garment svg path{vector-effect:non-scaling-stroke;stroke-width:1.35px}@media(max-width:720px){.left .garment .product-icon{width:32px;height:32px}}

/* Center product icons within the rail and their buttons. */
.left{padding-left:0;padding-right:0}.left #clothes{width:100%;justify-items:center}.left .garment{display:flex;align-items:center;justify-content:center;padding:0;margin:0 auto;flex-shrink:0}.left .garment .product-icon{display:block;margin:0;flex-shrink:0}

/* Half-size toolbar; popovers keep their readable size. */
.toolbar{gap:3.5px;padding:3px 6px;border-radius:7px}.toolbar .tool{width:22px;min-width:22px;height:21px;padding:4px;border-radius:4px}.toolbar .tool i{width:12px;height:12px;min-width:12px}.toolbar .tool i svg,.toolbar .tool svg{width:12px;height:12px;min-width:12px}.toolbar .current-color{width:12px;height:12px;border-radius:2px;border-width:1px}.toolbar .current-size{font-size:8.5px}.toolbar .current-size.bag-dimensions{font-size:5px}.toolbar .text-icon{font-size:13px}.toolbar .tool-divider{height:13px;margin:0 2px}.toolbar .popover{top:32px}

/* Snip&See wordmark: ink lettering with a terracotta cut-and-reveal accent. */
.brand.snip-brand{gap:10px;letter-spacing:0}.snip-brand .snip-mark{display:block;width:32px;height:32px;flex-shrink:0}.snip-brand .snip-wordmark{display:flex;align-items:baseline;border:0;padding:0;color:#203b61;font:600 29px system-ui,-apple-system,sans-serif;letter-spacing:-1.4px;text-transform:none}.snip-brand .snip-amp{display:inline;border:0;padding:0 2px;color:#c77759;font:italic 32px Georgia,serif;letter-spacing:-1px}.snip-brand .snip-dot{display:inline;border:0;padding:0;color:#c77759;font:600 29px system-ui;letter-spacing:0}@media(max-width:1000px){.snip-brand .snip-wordmark{display:flex}.snip-brand .snip-amp,.snip-brand .snip-dot{display:inline}}@media(max-width:720px){.snip-brand .snip-wordmark{font-size:24px}.snip-brand .snip-mark{width:27px;height:27px}.snip-brand .snip-amp{font-size:27px}.snip-brand .snip-dot{font-size:24px}}

/* Larger L baseline; garment size is controlled by SVG image dimensions. */
.canvas{transform:translateY(-32px) scale(1.24);transform-origin:50% 50%}@media(max-width:720px){.canvas{transform:translateY(-24px) scale(1.16)}}

/* Snip&See: restrained wordmark with scissors as the connecting ampersand. */
.brand.snip-brand{display:flex;align-items:center;gap:5px;color:#203b61;white-space:nowrap}.snip-brand .snip-word{display:block;margin:0;padding:0;border:0;font:650 30px system-ui,-apple-system,sans-serif;letter-spacing:-1.5px;color:#203b61;text-transform:none;line-height:1}.snip-brand .snip-scissors{display:block;flex-shrink:0;width:27px;height:31px;stroke:#b87558;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transform:rotate(-8deg);margin:0 1px}.snip-scissors .scissor-pivot{fill:#b87558;stroke:none}@media(max-width:1000px){.snip-brand .snip-word{display:block}}@media(max-width:720px){.snip-brand .snip-word{font-size:25px;letter-spacing:-1.2px}.snip-brand .snip-scissors{width:23px;height:27px}}

.brand.snip-brand{gap:10px}.snip-brand .snip-scissors{margin:0}

/* A lively typographic wordmark, with no graphic symbol. */
.snip-brand .snip-wordmark{gap:2px;align-items:baseline}.snip-brand .snip-name{display:inline-block;border:0;padding:0;color:#203b61;font:700 italic 32px Georgia,"Times New Roman",serif;letter-spacing:-1.2px;text-transform:none}.snip-brand .snip-first{transform:rotate(-3deg);transform-origin:70% 70%}.snip-brand .snip-last{transform:rotate(2deg);transform-origin:20% 70%}.snip-brand .snip-amp{padding:0 3px;font-size:32px}.snip-brand .snip-dot{margin-left:0}@media(max-width:1000px){.snip-brand .snip-name{display:inline-block}}@media(max-width:720px){.snip-brand .snip-name{font-size:27px}.snip-brand .snip-amp{font-size:28px}}

.chest-form{height:48px;display:flex;align-items:center;gap:3px;background:#fffdf9dc;border:1px dashed #9aa7b4;border-radius:7px;box-shadow:0 2px 8px #203b6106;padding:4px 6px}.chest-form input{flex:1;min-width:0;width:100%;border:0;background:transparent;padding:8px 4px;color:#203b61;font:12px system-ui;outline:none}.chest-form input::placeholder{color:#88929c}.chest-form:focus-within{border-style:solid;border-color:#55799e;background:#fffdf9}.chest-form button{padding:5px;border:0;background:transparent;color:#71869b;font-size:16px}

.right{display:flex;flex-direction:column}.right-tabs{display:flex;gap:18px;border-bottom:1px solid var(--line);margin-bottom:24px}.right-tabs button{border:0;border-radius:0;background:none;padding:0 4px 12px;font-size:12px;color:#8993a0}.right-tabs button.active{border-bottom:2px solid #203b61;color:#203b61}#aiPanel{flex:1;min-height:0;display:flex;flex-direction:column}#conversation{flex:1;overflow:auto;min-height:120px}.chat-message{margin:12px 0;padding:12px;border-radius:10px;background:#f1eee8;font-size:12px;line-height:1.7}.chat-message.user{background:#203b61;color:white;margin-left:20px}#answerChoices{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0}#answerChoices button{font-size:11px;padding:7px 10px}#answerForm{display:flex;gap:6px;padding:6px;border:1px solid var(--line);border-radius:12px;background:white}#answerInput{flex:1;min-width:0;border:0;outline:none;font-size:12px;padding:6px}#aiPanel small{margin-top:10px;text-align:center;font-size:9px;color:#a0a5ac}@media(max-width:720px){.right{display:flex;min-height:480px}#aiPanel{min-height:380px}}

#conversation #answerChoices{margin:0 0 18px;gap:7px}#conversation .chat-message{margin-bottom:9px}#answerForm{flex-shrink:0}#aiPanel{padding-top:0}

/* Conversation bubbles fit their contents and wrap only when needed. */
#conversation{display:flex;flex-direction:column;align-items:flex-start;gap:10px}#conversation .chat-message{width:fit-content;max-width:92%;margin:0;padding:10px 12px;flex-shrink:0;overflow-wrap:anywhere;white-space:pre-wrap}#conversation .chat-message.user{align-self:flex-end;margin-left:0}#conversation #answerChoices{align-self:flex-start;flex-shrink:0;width:100%;margin:0 0 12px}

#answerChoices:has(.font-choice){display:grid;grid-template-columns:1fr 1fr;width:100%}#answerChoices .font-choice{display:flex;flex-direction:column;gap:8px;align-items:flex-start;padding:11px;text-align:left;min-width:0}.font-choice strong{font-size:11px;font-weight:500}.font-choice span{font-size:23px;line-height:1.4;max-width:100%;overflow-wrap:anywhere}.font-choice small{color:#8d95a0;font-size:9px;line-height:1.5}

#answerChoices .font-choice{gap:5px;padding:10px;min-height:65px}.font-choice strong{font-size:12px;font-weight:600}.font-choice small{font-size:10px;line-height:1.5}#conversation{scroll-padding-bottom:12px}#conversation #answerChoices{margin-bottom:12px}

.generation-overlay{position:absolute;z-index:2;left:50%;top:42%;transform:translate(-50%,-50%);width:min(370px,85%);padding:20px;background:#fffdf9ed;border:1px solid #ded8cd;border-radius:12px;box-shadow:0 8px 30px #203b6112;display:grid;gap:12px;text-align:center;pointer-events:none}.generation-overlay>span{font-size:13px;color:#203b61}.generation-overlay progress{width:100%;height:5px;accent-color:#203b61}.generation-overlay small{font-size:10px;color:#88929e}

/* Continuous fine contours for artwork; selection controls are separate. */
#objects .object path:not(defs path){stroke-dasharray:none!important;stroke-width:.85px;stroke-linecap:round;stroke-linejoin:round}

#canvas{touch-action:none}.marquee{fill:#335f8f18;stroke:#335f8f;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}

#answerChoices .refresh-fonts{grid-column:1/-1;justify-self:center;border:0;background:transparent;font-size:12px;color:#66758a;padding:9px 16px}#answerChoices .refresh-fonts:hover{background:#edf1f5}
#answerChoices .font-choice small{margin-top:0;text-align:left;color:#66758a;font-size:10px;line-height:1.5}
#answerChoices .font-choice{gap:7px;padding:10px;justify-content:flex-start}
#answerChoices .font-choice-preview{display:block;width:100%;height:70px;object-fit:contain;background:#fff;border-radius:5px;pointer-events:none}

/* Invisible filled hit target: the visible contour remains thin. */
#objects .object .glyph-hit-area{fill:transparent;stroke:transparent;stroke-width:12px;pointer-events:all}

#restartDesignDialog{width:min(420px,calc(100vw - 40px));padding:28px;border:1px solid #e8e3db;border-radius:20px;background:#fffdf9;color:#203b61;box-shadow:0 24px 90px #14243d33}#restartDesignDialog::backdrop{background:#17263855;backdrop-filter:blur(3px)}#restartDesignDialog h2{font-size:20px;margin:0 0 14px}#restartDesignDialog p{font-size:14px;line-height:1.8;color:#718094;margin:0 0 26px}.restart-dialog-actions{display:flex;justify-content:flex-end;gap:10px}.restart-dialog-actions button{padding:11px 16px}


/* Generated raster artwork stays off the vector workspace. */
#generatedDesignPreview{display:none!important}
.step-retry-actions{align-self:flex-start;flex-shrink:0;margin:0 0 12px}.step-retry-actions button{padding:9px 18px;font-size:12px}

#answerChoices:has(.fabric-direction){display:grid;grid-template-columns:1fr 1fr}.fabric-direction{text-align:left;display:flex;flex-direction:column;gap:10px;padding:12px!important}.fabric-direction strong{font-size:12px}.fabric-direction-swatches{display:flex;flex-wrap:wrap;gap:5px}.fabric-mini{display:block;width:25px;height:25px;border-radius:5px;background-color:var(--fabric-color);border:1px solid #0001}.fabric-mini.stripe{background-image:repeating-linear-gradient(90deg,transparent 0 5px,#fff7e4bb 5px 9px)}.fabric-mini.check{background-image:repeating-linear-gradient(90deg,#fff7e466 0 5px,transparent 5px 10px),repeating-linear-gradient(0deg,#fff7e466 0 5px,transparent 5px 10px)}.fabric-mini.dot{background-image:radial-gradient(#fff7e4 2px,transparent 2px);background-size:10px 10px}.fabric-mini.weave{background-image:repeating-linear-gradient(0deg,#fff6 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,#fff4 0 1px,transparent 1px 4px)}.fabric-direction.active{border-color:var(--ink);background:#eef1f4}

.generation-overlay{top:43%;width:min(340px,70%);padding:12px;background:transparent;border:0;box-shadow:none;gap:8px;color:var(--status-ink,#203b61)}.generation-overlay>span{color:inherit;font-size:15px;font-weight:500;line-height:1.6;text-shadow:0 1px 4px #0001}.generation-overlay>span::after{content:'…';display:inline-block;animation:processing-text 1.4s ease-in-out infinite}.generation-overlay.paused>span::after{content:'';animation:none}.generation-overlay small{color:inherit;opacity:.8;line-height:1.5;font-size:11px}.generation-overlay progress{display:none}@keyframes processing-text{0%,100%{opacity:.25}50%{opacity:1}}@media(prefers-reduced-motion:reduce){.generation-overlay>span::after{animation:none}}

.fabric-choice-archive{display:grid;grid-template-columns:1fr 1fr;gap:7px;width:100%;flex-shrink:0}.fabric-choice-archive button:disabled{cursor:default;opacity:.5}.fabric-choice-archive button.active:disabled{opacity:1}

svg.fabric-mini{width:32px;height:32px;overflow:hidden;background:transparent}.fabric-choice-archive svg.fabric-mini{width:32px;height:32px}#answerChoices:has(.fabric-direction)>.refresh-fonts{grid-column:1/-1}

/* Compact frosted status: only the live detail line appears over the garment. */
.generation-overlay{width:fit-content;max-width:min(360px,76%);padding:12px 18px;border-radius:14px;background:rgba(250,248,243,.72);border:1px solid rgba(255,255,255,.6);backdrop-filter:blur(16px) saturate(125%);-webkit-backdrop-filter:blur(16px) saturate(125%);box-shadow:0 5px 22px rgba(20,30,45,.08);gap:0;color:#344052}
.generation-overlay>span,.generation-overlay progress{display:none}
.generation-overlay small{color:#344052;opacity:1;font-size:12px;font-weight:400;line-height:1.7;text-align:center;overflow-wrap:anywhere}
.generation-overlay:not(.paused) small::after{content:'…';display:inline-block;animation:processing-text 1.4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.generation-overlay:not(.paused) small::after{animation:none}}

.layer-item{border:1px solid transparent;border-radius:12px;overflow:hidden;background:#f8f6f2}.layer-item.active{border-color:#d7e2ef}.layer-item .layer-row{border:0;border-radius:0;background:transparent;margin:0;gap:8px}.layer-item .layer-select{flex:1;min-width:0;font-size:11px;gap:8px}.layer-item .layer-thumb{width:28px;height:30px;flex-shrink:0}.layer-fabric-toggle{padding:3px;flex-shrink:0;border-radius:7px;background:white}.layer-fabric-preview{width:30px;height:30px;display:block;border-radius:4px;overflow:hidden}.layer-fabric-picker{padding:10px 12px 12px;border-top:1px solid var(--line)}.layer-fabric-categories{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}.layer-fabric-categories button{font-size:10px;padding:5px 7px;flex:1}.layer-fabric-categories button.active,.layer-fabric-grid button.active{border-color:var(--ink);background:#edf1f5}.layer-fabric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.layer-fabric-grid button{padding:3px;display:flex;justify-content:center}.layer-fabric-grid svg{width:100%;height:auto;aspect-ratio:1}.layer-fabric-refresh{display:block;margin:8px auto 0;font-size:11px;padding:5px 12px;border:0;background:transparent}.layer-settings[hidden]{display:none!important}

.snip-website-logo{display:block;width:180px;height:auto}@media(max-width:720px){.snip-website-logo{width:154px}}

#effectDialog{position:relative;padding-top:28px}#effectDialog h2{padding-right:48px}.effect-close{position:absolute;top:14px;right:14px;width:40px;height:40px;display:grid;place-items:center;padding:8px;border-radius:50%;background:#f3f1ed;border:1px solid #e8e3db;z-index:2}.effect-close:hover{background:#e7ebf1}.effect-close svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
/* The skill runner supplies the complete menu, rather than a rotating subset. */
#answerChoices button small{display:block;font-size:12px;line-height:1.6;font-weight:400;margin-top:6px;opacity:.8}
.skill-size-table{width:100%;border-collapse:collapse;margin:12px 0 20px;font-size:14px}
.skill-size-table td,.skill-size-table th{padding:8px;border-bottom:1px solid #e8e2da;text-align:left}
.skill-side-previews{display:flex;gap:12px;margin:16px 0}.skill-side-previews figure{margin:0;flex:1;text-align:center}.skill-side-previews img{width:100%;height:140px;object-fit:contain}
#answerChoices a{display:block;padding:14px 18px;border-radius:12px;text-decoration:none;text-align:center}
#aiPanel>.skill-restart{align-self:flex-end;border:0;background:transparent;color:#8993a0;font-size:11px;padding:0 0 10px;margin:0;flex-shrink:0}
#aiPanel>.skill-restart:hover{color:#203b61}
.skill-outline-preview{display:block;width:100%;max-height:280px;object-fit:contain;border-radius:12px;flex-shrink:0;background:#faf9f5}
#skillMainPreview{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#faf9f5;z-index:1}
#answerChoices>a.primary{background:#203b61;color:white}

.layer-drag-handle{padding:3px 5px;border:0;background:transparent;color:#8b97a6;font-size:21px;cursor:grab;flex-shrink:0;touch-action:none}.layer-drag-handle:active{cursor:grabbing}.layer-item.dragging{opacity:.45}.layer-item.drop-before{border-top:3px solid #203b61}.layer-item.drop-after{border-bottom:3px solid #203b61}
.completed-actions{display:flex;flex-wrap:wrap;gap:8px}.completed-design-step p{margin:0 0 12px}.completed-actions .primary{min-width:120px}#orderDialog{position:relative;width:min(920px,95vw);max-height:90dvh;overflow:auto;padding:30px;border:1px solid var(--line);border-radius:20px;color:var(--ink);background:#fffdf9}#orderDialog h2{padding-right:45px}.order-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,1fr);gap:28px;align-items:start}#orderPreview{width:100%;height:auto;border-radius:10px}.order-version{font-size:12px;color:var(--muted)}#orderSummary{display:grid;grid-template-columns:85px 1fr;gap:10px;font-size:13px}#orderSummary dd{margin:0;overflow-wrap:anywhere}.order-quantity{display:flex;align-items:center;gap:15px}.order-quantity input{width:75px}#orderForm{display:grid;gap:12px}#orderForm label{display:grid;gap:5px}#orderForm input,#orderForm textarea,.order-quantity input{font:inherit;color:inherit;border:1px solid var(--line);border-radius:8px;padding:9px;background:#fff}#orderForm textarea{min-height:65px;resize:vertical}.order-delivery{font-size:12px;line-height:1.7;color:#727b86}.order-total{margin:6px 0}#orderEdit{margin-top:12px}@media(max-width:650px){.order-grid{grid-template-columns:1fr}#orderPreview{max-height:260px;object-fit:contain}}

.canvas-hint{display:none}.stage{position:relative}.design-quote{position:absolute;z-index:2;bottom:20px;left:32px;right:32px;display:flex;align-items:flex-end;gap:24px;pointer-events:none;font-size:12px}.design-quote>div{min-width:0;display:flex;flex-direction:column;gap:6px}.design-quote small{color:var(--muted);font-size:10px}.design-quote span{line-height:1.4}.quote-base,.quote-fabric{flex:1}.quote-total{margin-left:auto;text-align:right;flex-shrink:0}.quote-total strong{font-size:26px;font-weight:750;white-space:nowrap}.design-quote .quote-total small{color:var(--ink)}@media(max-width:1000px){.design-quote{left:16px;right:16px;bottom:16px;gap:16px}}@media(max-width:720px){.design-quote{left:12px;right:12px;gap:10px;font-size:11px}.quote-total strong{font-size:22px}}

header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:24px}.header-left{display:flex;align-items:center;gap:26px;min-width:0}.top-nav{display:flex;align-items:center;gap:16px;white-space:nowrap}.top-nav button{padding:8px 0;background:transparent;border:0;border-radius:0;font-size:13px}.top-nav button:hover{color:#b87558}.project-title{display:block;white-space:nowrap;font-size:14px}.actions{justify-self:end}.snip-website-logo{max-width:210px}.header-left .brand{flex-shrink:0}@media(max-width:1100px){header{gap:14px}.header-left{gap:18px}.top-nav{gap:12px}.snip-website-logo{max-width:175px}.top-nav button{font-size:12px}}@media(max-width:720px){header{height:92px;padding:10px 14px;grid-template-areas:"brand title auth" "nav nav nav";grid-template-columns:1fr auto 1fr;gap:4px 10px}.header-left{display:contents}.header-left .brand{grid-area:brand}.top-nav{grid-area:nav;justify-content:center;gap:30px}.project-title{grid-area:title;display:block;font-size:13px}.actions{grid-area:auth}.snip-website-logo{max-width:130px}.layout{min-height:calc(100dvh - 92px)}}

header{grid-template-columns:auto minmax(0,1fr) auto}.top-nav{justify-self:center;gap:26px}.top-nav button{font-size:14px;font-weight:400;padding:9px 0 7px;border-bottom:2px solid transparent}.top-nav button[aria-current="page"]{border-bottom-color:var(--ink)}.design-quote{align-items:center;gap:18px}.design-quote #buyDesign{pointer-events:auto;flex-shrink:0;padding:11px 18px}.design-quote .quote-total{margin-left:auto}.quote-base,.quote-fabric{flex:initial}.quote-fabric{max-width:35%}@media(max-width:1100px){.top-nav{gap:22px}.top-nav button{font-size:14px}}@media(max-width:720px){header{grid-template-areas:"brand brand auth" "nav nav nav";grid-template-columns:1fr 1fr auto}.brand{grid-area:brand}.top-nav{grid-area:nav;gap:25px;justify-self:center}.top-nav button{font-size:14px}.design-quote{gap:10px;flex-wrap:wrap}.quote-base,.quote-fabric{font-size:10px}.quote-fabric{max-width:35%}.quote-total strong{font-size:21px}.design-quote #buyDesign{padding:9px 12px}}

.right-tabs button{flex:1;text-align:center}.order-tab-details{margin-top:22px}.order-tab-details h2{font-size:14px}.order-tab-details dl{margin:0}.order-tab-details dl>div{display:flex;justify-content:space-between;gap:15px;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px}.order-tab-details dt{color:var(--muted);flex-shrink:0}.order-tab-details dd{margin:0;text-align:right}#refreshEffectDialog{max-width:440px}#refreshEffectDialog>div{display:flex;justify-content:flex-end;gap:10px}

.layout{grid-template-columns:86px minmax(360px,1fr)}.stage{padding-right:360px}.right{position:fixed;z-index:5;right:16px;top:76px;bottom:16px;width:310px;padding:22px 18px;background:#fffdf9;border:1px solid var(--line);border-radius:18px;box-shadow:0 10px 35px #203b6114;overflow:visible;display:flex;flex-direction:column}.right-tabs{flex-shrink:0}.right #aiPanel,.right #layersPanel,.right #orderPanel{min-height:0;overflow:auto;flex:1}.panel-collapse,.panel-expand{position:absolute;z-index:6;width:30px;height:42px;padding:0;font-size:24px;border-radius:10px;box-shadow:0 4px 16px #203b6110}.panel-collapse{left:-16px;top:20px}.panel-expand{position:fixed;right:16px;top:96px}.panel-collapsed .stage{padding-right:32px}.design-quote{right:360px}.panel-collapsed .design-quote{right:32px}.quote-total{gap:0!important}@media(max-width:1000px){.layout{grid-template-columns:70px minmax(300px,1fr)}.stage{padding-right:305px}.right{width:275px;right:10px;top:70px;bottom:10px;padding:18px 15px}.design-quote{right:305px}.panel-collapsed .stage{padding-right:15px}.panel-collapsed .design-quote{right:16px}}@media(max-width:720px){.layout{grid-template-columns:60px minmax(0,1fr)}.stage{padding-right:10px}.right{top:104px;width:min(290px,calc(100vw - 80px));bottom:12px;grid-column:auto}.design-quote{right:12px}.panel-collapsed .stage{padding-right:10px}.panel-collapsed .design-quote{right:12px}.panel-expand{top:118px}.panel-collapse{top:18px}}
.design-quote .quote-base{max-width:45%;overflow-wrap:anywhere}

.panel-collapse,.panel-expand{border:0;border-radius:0;box-shadow:none;background:transparent;width:24px;height:40px;display:grid;place-items:center;color:#7d8997}.panel-collapse{top:calc(50% - 20px);left:-24px}.panel-collapse:hover,.panel-expand:hover{background:transparent;color:var(--ink)}.panel-expand{top:calc(50% - 20px);right:7px}.panel-expand svg{transform:rotate(180deg)}

.admin-fabric-choices{display:flex;gap:8px;flex-wrap:wrap;padding:16px 0}.admin-fabric-choices button{font-size:11px;padding:8px}

.order-checkout{padding-top:25px;margin-top:20px;border-top:1px solid var(--line)}.order-checkout h2{font-size:16px}.order-checkout .order-grid{display:flex;flex-direction:column;gap:16px}.checkout-preview{font-size:12px;color:var(--muted)}.checkout-preview img{width:100%;margin-top:12px}.order-checkout label{font-size:12px}.order-checkout input,.order-checkout textarea{width:100%;padding:10px;border:1px solid var(--line);border-radius:7px;font:inherit;margin:7px 0 16px}.order-checkout textarea{min-height:80px;resize:vertical}.order-checkout form{display:block}.order-checkout form button,#payWithPayPal{width:100%}.order-checkout p{font-size:12px;line-height:1.6}.order-checkout dl{font-size:11px}.order-checkout dd{margin-left:0}.order-checkout dt{color:var(--muted);margin-top:9px}#checkoutError,#paymentError{color:#ae3d38}#paymentStage{padding:18px 0}#paymentAmount{font-size:22px;font-weight:700;color:var(--ink)}

.order-checkout select{width:100%;padding:10px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font:inherit;margin:7px 0 16px}.checkout-phone{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.checkout-phone label{min-width:0}

#customerAuthDialog{width:min(420px,calc(100vw - 40px));padding:28px;position:relative}#customerAuthDialog h2{font-size:23px;margin:0 0 16px}#customerAuthDialog label{display:block;font-size:13px;margin-bottom:15px}#customerAuthDialog input{display:block;width:100%;margin-top:7px;padding:12px;border:1px solid var(--line);border-radius:8px;font:inherit}#customerAuthDialog form>button{width:100%;margin-top:12px}#customerAuthDialog .auth-note{font-size:12px;line-height:1.6;color:var(--muted)}#customerAuthError{color:#ae3d38;font-size:13px}#customerAuthReason{font-size:13px;line-height:1.6}#customerAuthDialog .auth-close{position:absolute;right:12px;top:8px;border:0;background:none;padding:5px;font-size:25px}

#customerProfileDialog{padding:0;width:min(1160px,calc(100vw - 35px));height:calc(100vh - 45px);max-width:none;max-height:none;overflow:hidden}#customerProfileDialog iframe{width:100%;height:100%;border:0;display:block}

.auth-code-row{display:flex;gap:9px;align-items:center}.auth-code-row input{min-width:0;flex:1}.auth-code-row button{white-space:nowrap;padding:12px}#customerCodeStatus{display:block;font-size:11px;line-height:1.5;margin-top:7px;color:var(--muted)}#customerActivation button{width:100%;margin-bottom:14px}

#accountButton{display:flex;align-items:center;gap:8px}.account-mini-avatar{width:25px;height:25px;border-radius:50%;object-fit:cover}

.batch-fabric{padding:7px 10px;border:1px solid #dce1e8;border-radius:9px;background:white;color:#203b61;font:inherit;cursor:pointer}#draftStatus{display:block;min-height:1.3em;padding:5px 0;font-size:11px;line-height:1.4;color:#68778c}

.layer-region-fabrics{display:flex;flex-wrap:wrap;gap:8px;padding:0 12px 10px 42px}.layer-region-fabrics .layer-fabric-toggle{display:flex;align-items:center;gap:6px;width:auto;max-width:100%;padding:5px 8px;font-size:12px}.layer-region-fabrics .layer-fabric-preview{width:30px;height:30px;flex-shrink:0}.layer-region-fabrics .layer-fabric-toggle[aria-expanded=true]{border-color:var(--ink);background:#edf1f5}

.task-recovery{width:100%;padding:14px;border:1px solid #ded8cd;border-radius:12px;background:#fffdf9}.task-recovery p{margin:0 0 9px;font-size:12px;line-height:1.6;color:var(--ink)}.task-recovery .task-recovery-note{font-size:11px;color:#718094}.task-recovery-buttons{display:flex;flex-wrap:wrap;gap:8px}.task-recovery-buttons button{flex:1 1 120px;min-height:40px}.task-recovery[aria-busy="true"]{border-color:#9caec2}