/* Scoped workspace: the storefront and the artwork coordinate system are unchanged. */
body.studio-workspace{height:100vh;height:100dvh;overflow:hidden;background:#f2f5fa;font-size:14px;line-height:1.45;display:flex;flex-direction:column}
.studio-workspace>.announcement,.studio-workspace>footer{display:none}
.studio-workspace>.header{height:64px;min-height:64px;max-width:none;width:100%;padding:6px 24px;gap:20px;border-bottom:1px solid #dce3ee;flex-shrink:0}
.studio-workspace .brand img{width:112px;height:auto}.studio-workspace .header-actions{gap:24px}.workspace-back{font-size:13px;font-weight:600}
.studio-workspace #main{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.workspace-top{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:0 24px;height:48px;flex-shrink:0;background:white;border-bottom:1px solid #dce3ee}
.workspace-top>div{display:flex;align-items:center;gap:10px}.workspace-top h1{font-size:17px;letter-spacing:-.025em;margin:0}.workspace-top a,.workspace-caption{font-size:12px;color:#56657a}.workspace-caption{border-left:1px solid #dbe2ec;padding-left:10px}.workspace-dot{width:8px;height:8px;border-radius:50%;background:#ff9c3b}
.studio-workspace #designer{max-width:none;width:100%;padding:14px 16px 0;margin:0;min-height:0;flex:1;display:grid;grid-template-columns:264px minmax(0,1fr) 290px;grid-template-rows:minmax(0,1fr) auto;gap:12px 16px;overflow:hidden}
.studio-workspace #design-tools,.workspace-right{position:static;min-width:0;min-height:0;height:100%;align-self:stretch;border:1px solid #dde4ef;border-radius:14px;background:white;box-shadow:0 3px 15px #142d5610;padding:0;display:flex;flex-direction:column;overflow:hidden}
.workspace-left-tabs,.workspace-right-tabs{display:flex;gap:3px;padding:7px;border-bottom:1px solid #e3e8ef;flex-shrink:0;background:#fafbfd}
.workspace-tab{flex:1;border-radius:7px;min-height:40px;font-size:12px;font-weight:700;color:#59697f;padding:7px 8px;white-space:nowrap}.workspace-tab[aria-selected=true]{background:#e9f0ff;color:#1759be;box-shadow:inset 0 0 0 1px #d7e4ff}
.workspace-pane{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:18px 16px;flex:1}
.workspace-pane h2{font-size:19px;letter-spacing:-.035em;margin:0 0 7px}.workspace-pane p.pane-description{font-size:12px;line-height:1.55;margin:0 0 18px;color:#627087}
.studio-workspace .workspace-pane label{font-size:12px;margin:0 0 13px;gap:6px}.studio-workspace .workspace-pane input,.studio-workspace .workspace-pane select,.studio-workspace .workspace-pane textarea{font-size:13px;min-height:42px;padding:9px 10px}.studio-workspace .workspace-pane input[type=range]{padding:0;min-height:28px}
.studio-workspace .workspace-pane .btn{font-size:12px;min-height:44px;min-width:0;padding:10px 12px;width:100%;gap:8px}.studio-workspace .workspace-pane .fine{font-size:11px;line-height:1.5}
.studio-workspace #workspace-add .file-button{min-height:85px;background:#f0f5ff;border:1px dashed #799fde;color:#1759be;border-radius:10px;font-size:14px;font-weight:700}.studio-workspace #add-text{background:#1759be;color:white;border-color:#1759be}.workspace-tip{background:#f6f8fc;border:1px solid #e5eaf3;border-radius:10px;padding:13px;margin-top:20px;font-size:11px;color:#54647a;line-height:1.65}.workspace-tip strong{color:#334963;font-size:12px}.workspace-tip p{margin:7px 0 0}
.studio-workspace #layer-controls{display:flex;flex-direction:column;gap:0}.studio-workspace .physical-controls{display:grid;grid-template-columns:1fr 1fr;gap:0 10px;margin:0;padding:0;border:0}.studio-workspace .physical-controls>label:nth-child(3){grid-column:1/-1}.studio-workspace .physical-controls input{min-width:0}.studio-workspace .image-edit-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:0 0 12px}.studio-workspace .image-edit-actions button{font-size:11px;line-height:1.3;padding:8px!important;border:1px solid #d6e0ee;border-radius:6px;min-height:42px}.studio-workspace .workspace-slider{margin-bottom:8px!important}.studio-workspace .tool-row{display:grid;grid-template-columns:1fr 1fr;gap:6px}.studio-workspace .tool-row button{font-size:11px;border:1px solid #dbe3ef;border-radius:6px;padding:6px;min-height:38px}.studio-workspace #delete-layer{color:#aa3441}.workspace-text-tools{display:grid;grid-template-columns:72px 1fr;gap:10px;margin-top:14px}
.studio-workspace #order-summary{display:block;width:100%;padding:12px;background:#f4f7fd;margin:0 0 17px;border-radius:9px}.studio-workspace #order-summary .eyebrow{display:none}.studio-workspace #order-summary h2{font-size:16px;line-height:1.35;margin-bottom:6px}.studio-workspace #order-summary p{font-size:11px;line-height:1.6;overflow-wrap:anywhere}.studio-workspace #order-price{display:none}.studio-workspace #order-summary .text-link{font-size:11px;padding:6px 0 0}.studio-workspace .colour-row{gap:10px;padding:4px;margin:0 0 15px}.studio-workspace .colour-row button{width:30px;height:30px;min-height:30px}.studio-workspace .workspace-quantity{padding-top:15px;border-top:1px solid #e4e9f1}.studio-workspace .workspace-quantity input{max-width:125px}
.studio-workspace .studio-price-card{border:0;padding:0;background:transparent;margin:0 0 16px;border-radius:0}.studio-workspace .studio-price-card #studio-pricing>strong{font-size:23px}.studio-workspace .studio-price-card p{font-size:11px;line-height:1.6;margin:8px 0}.studio-workspace .studio-price-card #studio-pricing>div{font-size:12px;padding:5px 0;gap:10px}.studio-workspace .studio-price-card small{font-size:11px}.studio-workspace .whatsapp-button{font-size:11px!important;line-height:1.4;min-height:44px}.studio-workspace .form-grid{gap:8px}.studio-workspace #design-submit .check{display:flex;align-items:flex-start;gap:9px;line-height:1.55;font-size:11px}.studio-workspace #design-submit input[type=checkbox]{min-height:19px;padding:0;width:19px;margin-top:2px}.studio-workspace #design-submit>p.fine{font-size:10px;line-height:1.6;margin:2px 0}.studio-workspace #design-next{font-size:12px}.studio-workspace #design-next p{margin:10px 0}.studio-workspace .design-actions{display:grid;margin:0;gap:10px}.studio-workspace .design-actions>*{width:100%;justify-content:center}.studio-workspace .design-actions .text-link{font-size:12px;min-height:44px}
.studio-workspace #design-stage{min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;gap:8px}.studio-workspace .stage-top{padding:0;min-height:40px;flex-shrink:0;background:none;flex-wrap:nowrap}.studio-workspace .stage-top>span{font-size:9px;max-width:none}.studio-workspace .chips{display:flex;gap:4px}.studio-workspace .chips button{min-height:36px;font-size:12px;padding:5px 15px;background:white;border:1px solid #dbe3ee}.studio-workspace .chips button.active{background:#1759be;color:white;border-color:#1759be}
.studio-workspace .canvas-edit-toolbar{margin:0;padding:7px 9px;gap:8px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;border-radius:9px;flex-shrink:0;order:1}.studio-workspace .canvas-edit-buttons{gap:5px}.studio-workspace .canvas-edit-buttons [data-action=upload],.studio-workspace .canvas-edit-buttons [data-action=restore]{display:none}.studio-workspace .canvas-edit-toolbar button{font-size:11px;min-height:32px;padding:5px 9px}.studio-workspace .canvas-view-tools{gap:5px}.studio-workspace .canvas-size{display:none}.studio-workspace .canvas-zoom{gap:2px}.studio-workspace .canvas-zoom button{min-width:31px}.studio-workspace .canvas-zoom output{min-width:36px}
.studio-workspace .canvas-wrap{order:2;flex:1;min-height:0;max-height:none!important;width:100%;border-radius:14px;background:radial-gradient(circle,#fff,#f0f2f6);overflow:auto;scrollbar-width:thin;scroll-padding:0;overscroll-behavior:contain}.studio-workspace .studio-canvas-surface{flex-shrink:0;max-width:none;margin-left:auto;margin-right:auto}.studio-workspace .studio-canvas-surface canvas{height:auto;width:100%;max-height:none;max-width:none;aspect-ratio:1}
.studio-workspace .canvas-edit-hint{order:3;flex-shrink:0;background:transparent;padding:0 6px;margin:0;min-height:30px;font-size:11px;line-height:1.4;text-align:center}.studio-workspace .studio-status{order:4;margin:0;text-align:center;font-size:10px;line-height:1.3}.studio-workspace .stage-bottom{order:5;margin:0 0 5px;display:block;min-height:16px;text-align:center;font-size:10px}.studio-workspace .stage-bottom>span:first-child{display:none}
.workspace-dock{grid-column:1/-1;display:flex;align-items:center;gap:24px;min-height:76px;background:white;border-top:1px solid #dce3ed;margin:0 -16px;padding:10px 24px;position:relative;z-index:5;flex-wrap:wrap}.workspace-total{display:grid;grid-template-columns:auto auto;gap:0 14px;align-items:baseline}.workspace-total>span{font-size:11px;color:#596a82}.workspace-total strong{font-size:24px;color:#183e9e;font-variant-numeric:tabular-nums;letter-spacing:-.04em}.workspace-total small{grid-column:1/-1;font-size:10px;line-height:1.3}.workspace-save-note{margin:0 auto 0 0;font-size:11px;color:#6a778b}.studio-workspace #studio-submit{min-height:46px;font-size:13px;min-width:224px;padding:11px 20px}.workspace-dock .form-status:empty{display:none}.workspace-dock .form-status{order:5;flex-basis:100%;font-size:12px;margin:0;max-height:70px;overflow:auto}.workspace-mobile-tabs{display:none}.studio-workspace #toast{bottom:calc(var(--studio-dock-height,76px) + 20px);max-height:calc(100dvh - var(--studio-dock-height,76px) - 44px)}
@media(min-width:1001px) and (max-width:1200px){.studio-workspace #designer{grid-template-columns:235px minmax(0,1fr) 252px;gap:10px;padding:10px 10px 0}.workspace-pane{padding:15px 12px}.workspace-dock{margin:0 -10px}.studio-workspace .canvas-edit-toolbar{justify-content:center}.studio-workspace .workspace-save-note{display:none}}
@media(max-width:1000px){
 .studio-workspace>.header{height:54px;min-height:54px;padding:5px 14px}.studio-workspace .brand img{width:94px}.studio-workspace .header-actions{gap:16px}.workspace-back{font-size:11px}.workspace-top{height:38px;padding:0 14px}.workspace-top h1{font-size:15px}.workspace-top a{font-size:11px}.workspace-caption{display:none}
 .studio-workspace #designer{padding:7px 10px 0;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(150px,1fr) 46px minmax(130px,29%) auto;gap:6px;position:relative}
 .studio-workspace #design-stage{grid-column:1;grid-row:1;gap:3px}.studio-workspace .stage-top{min-height:34px}.studio-workspace .stage-top>span{font-size:8px}.studio-workspace .chips button{min-height:32px;min-width:65px;font-size:11px}.studio-workspace .canvas-edit-toolbar{padding:2px 7px;gap:4px;min-height:38px;flex-wrap:nowrap}.studio-workspace .canvas-edit-toolbar button{min-height:32px;font-size:10px;padding:4px 7px}.studio-workspace .canvas-zoom button{min-width:30px}.studio-workspace .canvas-zoom output{font-size:10px;min-width:34px}
 .studio-workspace .canvas-wrap{border-radius:10px}.studio-workspace .canvas-edit-hint{font-size:10px;min-height:15px;line-height:1.3;padding:0;margin:0}.studio-workspace .studio-status,.studio-workspace .stage-bottom{display:none}
 .workspace-mobile-tabs{grid-column:1;grid-row:2;display:flex;background:white;padding:2px;border:1px solid #dce4f0;border-radius:9px}.workspace-mobile-tabs .workspace-tab{font-size:11px;min-height:40px;padding:6px}
 .workspace-left-tabs,.workspace-right-tabs{display:none}.studio-workspace #design-tools,.studio-workspace .workspace-right{grid-column:1;grid-row:3;border-radius:10px;box-shadow:none}
 .studio-workspace #designer[data-mobile-pane=product] #design-tools,.studio-workspace #designer[data-mobile-pane=order] #design-tools{display:none}.studio-workspace #designer:not([data-mobile-pane=product]):not([data-mobile-pane=order]) .workspace-right{display:none}
 .workspace-pane{padding:12px 14px}.workspace-pane h2{font-size:16px;margin-bottom:4px}.workspace-pane p.pane-description{font-size:11px;margin-bottom:10px}.studio-workspace .workspace-pane label{font-size:11px;margin-bottom:9px}.studio-workspace .workspace-pane input,.studio-workspace .workspace-pane select,.studio-workspace .workspace-pane textarea{font-size:16px;min-height:44px;padding:8px}.studio-workspace .workspace-pane input[type=range]{min-height:32px}
 .studio-workspace #workspace-add{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;align-content:start}.studio-workspace #workspace-add>h2,.studio-workspace #workspace-add>.pane-description,.studio-workspace #workspace-add>#upload-status{grid-column:1/-1}.studio-workspace #workspace-add .file-button{min-height:54px;grid-column:1;grid-row:3;margin:0}.studio-workspace #workspace-add>.fine:not(#upload-status){font-size:10px;grid-column:2;grid-row:3;margin:0;align-self:center}.studio-workspace #workspace-add label:has(#text-input){grid-column:1;margin:0}.studio-workspace #add-text{grid-column:2;align-self:end}.studio-workspace #workspace-add .workspace-tip{display:none}.studio-workspace #upload-status:empty{display:none}
 .studio-workspace #layer-controls .physical-controls{gap:0 12px}.studio-workspace #layer-controls .physical-controls>label:nth-child(3){margin-bottom:9px}.studio-workspace .image-edit-actions button,.studio-workspace .tool-row button{min-height:44px}.studio-workspace .colour-row button{min-height:36px;width:36px;height:36px}.studio-workspace .workspace-text-tools{grid-template-columns:85px 1fr}
 .workspace-dock{grid-row:4;grid-column:1;margin:0 -10px;min-height:72px;gap:10px;padding:8px 12px max(8px,env(safe-area-inset-bottom));flex-wrap:wrap}.workspace-total{display:flex;flex-direction:column;gap:1px;align-items:flex-start;min-width:90px;margin-right:auto}.workspace-total>span{font-size:9px}.workspace-total strong{font-size:20px;line-height:1.1}.workspace-total small{font-size:8px}.workspace-save-note{display:none}.studio-workspace #studio-submit{min-width:0;width:auto;max-width:58%;font-size:12px;min-height:46px;padding:10px 13px}.workspace-dock .form-status{font-size:11px;max-height:46px}.studio-workspace #toast{bottom:calc(var(--studio-dock-height,72px) + 16px);max-width:calc(100% - 24px);padding:12px 16px;font-size:13px;max-height:calc(100dvh - var(--studio-dock-height,72px) - 36px)}
}
@media(max-width:1000px) and (max-height:600px){.studio-workspace .workspace-top{display:none}.studio-workspace #designer{grid-template-rows:minmax(115px,1fr) 44px minmax(85px,25%) auto}.studio-workspace .canvas-edit-hint{display:none}.workspace-dock{min-height:60px}.workspace-total small{display:none}}
@media(prefers-reduced-motion:reduce){.studio-workspace *{scroll-behavior:auto!important;transition:none!important}}
.workspace-edit-modes{display:none}
@media(max-width:1000px){
 .workspace-edit-modes{display:flex;gap:4px;margin:0 0 8px}.workspace-edit-modes button{flex:1;min-height:38px;border:1px solid #dbe4f2;border-radius:6px;font-size:11px;padding:5px}.workspace-edit-modes button[aria-pressed=true]{background:#eaf1ff;color:#1759be;border-color:#a9c6f0}
 .studio-workspace #workspace-edit>h2,.studio-workspace #workspace-edit>.pane-description{display:none}.studio-workspace #workspace-edit .workspace-layer-picker{font-size:0;gap:0;margin-bottom:8px}.studio-workspace #workspace-edit .workspace-layer-picker select{font-size:14px;min-height:42px}
 .studio-workspace #workspace-edit:not([data-edit-mode=size]):not([data-edit-mode=print]) .physical-controls{display:none}
 .studio-workspace #workspace-edit[data-edit-mode=size] .physical-controls>label:nth-child(3){display:none}
 .studio-workspace #workspace-edit[data-edit-mode=print] .physical-controls>label:not(:nth-child(3)){display:none}
 .studio-workspace #workspace-edit:not([data-edit-mode=crop]) .image-edit-actions{display:none}
 .studio-workspace #workspace-edit .workspace-slider:has(#layer-size){display:none}
 .studio-workspace #workspace-edit:not([data-edit-mode=arrange]) .workspace-slider,.studio-workspace #workspace-edit:not([data-edit-mode=arrange]) .tool-row{display:none}
 .studio-workspace #workspace-edit:not([data-edit-mode=text]) .workspace-text-tools{display:none}
 .studio-workspace #workspace-edit .tool-row{grid-template-columns:repeat(4,1fr)}.studio-workspace #workspace-edit .tool-row button{font-size:10px;min-height:42px}.studio-workspace .workspace-text-tools{margin-top:0}
}
.studio-workspace #order-price.error{display:block;color:#aa3441}
@media(max-width:1000px) and (max-height:720px){
 .studio-workspace .workspace-top{display:none}
 .studio-workspace #designer{grid-template-rows:minmax(145px,1fr) 44px minmax(192px,29%) auto}
}
@media(max-width:1000px) and (max-height:500px){
 .studio-workspace #designer{grid-template-rows:minmax(90px,1fr) 40px minmax(80px,25%) auto}
}

/* Four view choices stay visible at desktop and phone widths. */
.studio-workspace .stage-top{display:block;min-height:40px}
.studio-workspace .stage-top .chips{display:flex;width:100%;gap:4px}
.studio-workspace .stage-top .chips button{flex:1;min-width:0;padding:7px 4px;white-space:nowrap}
.studio-workspace .stage-top .chips button[hidden]{display:none}
.studio-workspace .stage-top #design-reference{display:none}
.studio-workspace .colour-row{flex-wrap:wrap}
@media(max-width:1000px){.studio-workspace .stage-top .chips button{min-width:0;font-size:10px;min-height:34px;padding:4px 2px}.studio-workspace #mockup-status{font-size:9px}}

/* View panning keeps artwork editing separate. */
.studio-workspace .canvas-wrap.is-panning,.studio-workspace .canvas-wrap.is-panning *{cursor:grabbing!important;user-select:none}
.workspace-original-files{border-top:1px solid #dce4ef;padding:14px 0;margin-top:12px}
.workspace-original-files summary{font-size:12px;font-weight:650;color:#0055c9;cursor:pointer}
.workspace-original-files p{font-size:11px;line-height:1.5;margin:10px 0}
.workspace-original-files #original-file-list{display:grid;gap:8px;margin:12px 0;font-size:12px}
.workspace-original-files .original-file-download{width:100%;min-height:40px;padding:9px 10px;text-align:left;overflow-wrap:anywhere;border:1px solid #d7e1ee;border-radius:7px;background:white;color:#0055c9;font-size:12px}