/* The on-screen studio is entirely 3D. The hidden proof retains order-template measurements. */
.studio-shell .studio-2d-backing{position:fixed!important;left:-10000px!important;top:0!important;width:600px!important;height:600px!important;visibility:hidden!important;pointer-events:none!important;display:block!important;contain:layout style}
.studio-2d-backing .mobile-preview-window,.studio-2d-backing .garment-stage{width:600px!important;height:600px!important;max-width:none!important;max-height:none!important;aspect-ratio:1!important;display:block!important;transform:none!important}
.studio-shell[data-studio3d=true] .design-visual{padding:0;justify-content:stretch;min-height:0;overflow:hidden}
.studio-shell .garment3d-view{display:flex;position:relative;flex-direction:column;align-items:stretch;width:100%;height:100%;min-height:0;flex:1;isolation:isolate;border-radius:22px;background:radial-gradient(ellipse at 50% 40%,#f7f7f9,#e3e5e9 75%);overflow:hidden}
.garment3d-top{position:absolute;inset:14px 16px auto;display:flex;align-items:center;justify-content:space-between;gap:8px;z-index:3;pointer-events:none}
.garment3d-top>*{pointer-events:auto}.garment3d-top select{min-height:40px;padding:8px 30px 8px 12px;border:1px solid #d1d7df;border-radius:24px;background:#ffffffeb;color:#33435a;font:500 12px inherit;max-width:140px}
.garment3d-mode{display:flex;flex-shrink:0;gap:2px;padding:3px;border:1px solid #d1d7df;background:#ffffffeb;border-radius:24px}
.garment3d-mode button{font-size:11px;min-height:32px;padding:6px 12px;border-radius:20px;color:#52627b;white-space:nowrap}.garment3d-mode [aria-pressed=true]{background:#253a5a;color:white}.garment3d-mode button:disabled{opacity:.4}
.garment3d-canvas{width:100%;min-height:0;flex:1;position:relative;margin-top:52px}
.garment3d-canvas canvas{display:block;width:100%;height:100%;touch-action:none;outline:none;cursor:grab}.garment3d-canvas canvas:active{cursor:grabbing}.garment3d-canvas[data-move-mode=true] canvas{cursor:move}.garment3d-canvas canvas:focus-visible{outline:2px solid #2b62ed;outline-offset:-3px;border-radius:12px}
.garment3d-bottom{display:flex;align-items:center;justify-content:center;gap:10px;flex:none;padding:0 16px;z-index:4}
.garment3d-controls{display:flex;gap:4px;flex:none}.garment3d-controls button{font-size:11px;min-height:38px;padding:8px 13px;border:1px solid #d1d7e1;border-radius:22px;background:#ffffffed;color:#344c70;white-space:nowrap}.garment3d-controls button:disabled{opacity:.4}.garment3d-controls [aria-pressed=true]{background:#253a5a;color:white;border-color:#253a5a}
.garment3d-layer-slot{min-width:0;max-width:150px;flex:1}.garment3d-view .studio-layers{position:relative;inset:auto;width:100%;margin:0}.garment3d-view .studio-layers>summary{min-height:38px;padding:7px 12px;font-size:11px;background:#ffffffed}.garment3d-view .studio-layers svg{width:16px;height:16px}.garment3d-view .studio-layer-chevron{display:none}.garment3d-view .studio-layer-body{position:absolute;bottom:50px;top:auto;left:auto;right:0;width:min(340px,calc(100vw - 36px));max-height:250px}.garment3d-view .studio-layer-item strong{max-width:200px}
.garment3d-help{font-size:10px;line-height:1.5;color:#59697e;margin:9px 12px 18px;text-align:center;flex:none}.garment3d-concept{position:absolute;left:16px;bottom:15px;font-size:9px;color:#7b8594;pointer-events:none}
.garment3d-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;z-index:5;background:#edf0f5ef;padding:20px;text-align:center}.garment3d-loading[hidden]{display:none}.garment3d-loading strong{font-size:15px;font-weight:550;color:#32435d}.garment3d-loading>span:last-of-type{font-size:12px;line-height:1.5;color:#65748b;max-width:290px}.garment3d-loading button{border-radius:22px;background:#253a5a;color:white;padding:10px 20px;font-size:12px}
.garment3d-loading-shape{width:38px;height:38px;border:2px solid #c4d0e1;border-top-color:#315c9f;border-radius:50%;animation:garment3d-loading 1s linear infinite;margin-bottom:6px}@keyframes garment3d-loading{to{transform:rotate(360deg)}}
@media(min-width:1024px){.studio-shell[data-studio3d=true] .designer{gap:24px}.garment3d-concept{display:none}}
@media(max-width:1023px){
 .studio-shell[data-studio3d=true] .design-visual{padding:0 10px 8px!important;flex:none}
 .studio-shell .garment3d-view{height:clamp(240px,34dvh,390px);flex:none;border-radius:14px}
 .garment3d-top{inset:8px 8px auto;gap:6px}.garment3d-top select{min-height:34px;font-size:10px;padding:6px 24px 6px 9px;max-width:108px}.garment3d-mode{padding:2px}.garment3d-mode button{font-size:10px;min-height:28px;padding:5px 10px}
 .garment3d-canvas{margin-top:38px}.garment3d-bottom{gap:5px;padding:0 8px}.garment3d-controls{gap:4px}.garment3d-controls button{font-size:10px;min-height:34px;padding:6px 10px}.garment3d-layer-slot{max-width:106px}.garment3d-view .studio-layers>summary{min-height:34px;font-size:10px;gap:5px;padding:6px 9px}.garment3d-view .studio-layers svg{width:14px;height:14px}.garment3d-help{font-size:9px;margin:5px 6px 8px}.garment3d-concept{display:none}
 .studio-shell[data-mobile-keyboard=true] .garment3d-view{height:160px}.studio-shell[data-mobile-keyboard=true] .garment3d-top,.studio-shell[data-mobile-keyboard=true] .garment3d-bottom{display:none}.studio-shell[data-mobile-keyboard=true] .garment3d-canvas{margin:0}.studio-shell[data-mobile-keyboard=true] .garment3d-help{font-size:8px;margin:1px 0 4px}.studio-shell[data-mobile-compact=true] .garment3d-view{height:115px}
}
@media(max-width:599px) and (max-height:700px){.studio-shell .garment3d-view{height:222px}}
@media(min-width:600px) and (max-width:1023px) and (max-height:600px){.studio-shell .garment3d-view{height:100%;min-height:190px}.garment3d-mode button{padding-inline:7px}.garment3d-controls button{padding-inline:7px}.garment3d-help{font-size:8px}}
@media(prefers-reduced-motion:reduce){.garment3d-loading-shape{animation:none}}

.studio-shell[data-studio3d=true] .mobile-text-size{display:flex!important}

.garment3d-history{display:flex;justify-content:flex-end;gap:6px;margin-bottom:8px}.garment3d-history button{display:grid;place-items:center;width:34px;height:34px;border:1px solid #d8e0ec;border-radius:50%;color:#395c91;background:#f3f6fb}.garment3d-history button:disabled{opacity:.35}.garment3d-history svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}

/* Locked views keep the editing plane steady; only Free view uses an orbit cursor. */
.garment3d-canvas[data-view-mode=fixed] canvas{cursor:default}.garment3d-canvas[data-move-mode=true] canvas{cursor:move}
.garment3d-top label[hidden]{display:none}
.garment3d-mode button[hidden]{display:none!important}
@media(max-width:359px){.garment3d-mode button{padding-inline:8px}.garment3d-top select{max-width:100px;padding-left:7px}}

/* Four fixed faces remain one tap away, including on a narrow phone. */
.garment3d-top{justify-content:center;inset:12px 14px auto}.garment3d-top .garment3d-mode{width:min(100%,440px);display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}.garment3d-mode button{min-height:34px;padding-inline:8px}
.garment3d-area-bar{position:absolute;inset:62px 18px auto;display:flex;align-items:center;gap:8px;z-index:3;pointer-events:none}.garment3d-area-bar>*{pointer-events:auto}.garment3d-area-key{display:flex;align-items:center;gap:6px;font-size:11px;color:#425678;margin-right:auto}.garment3d-area-key i{width:20px;border-top:2px dashed #3264e8}.garment3d-area-bar [hidden]{display:none!important}.garment3d-area-bar select{font-size:11px;min-height:28px;max-width:115px;border:1px solid #d1d7df;border-radius:18px;background:#ffffffed;padding:4px 8px;color:#33435a}.garment3d-area-bar button{font-size:11px;min-height:30px;border-radius:18px;padding:4px 12px;background:#253a5a;color:white}
.garment3d-canvas{margin-top:96px}
.garment3d-area-bar button.garment3d-area-key{background:transparent;color:#425678;border-radius:5px;padding:4px 0;min-height:30px;text-align:left}
.garment3d-area-bar button.garment3d-area-key:not(:disabled):hover{color:#2457d8;text-decoration:underline;text-underline-offset:3px}
.garment3d-area-bar button.garment3d-area-key:focus-visible{outline:2px solid #3264e8;outline-offset:3px}
@media(max-width:1023px){.garment3d-top{inset:8px 8px auto}.garment3d-top .garment3d-mode{width:100%}.garment3d-mode button{min-height:30px;font-size:10px}.garment3d-area-bar{inset:49px 12px auto;gap:6px}.garment3d-area-key,.garment3d-area-bar button,.garment3d-area-bar select{font-size:10px}.garment3d-area-bar select{max-width:98px}.garment3d-area-bar button{padding-inline:10px;min-height:28px}.garment3d-canvas{margin-top:82px}.studio-shell .garment3d-view{height:clamp(275px,38dvh,425px)}.studio-shell[data-mobile-keyboard=true] .garment3d-area-bar{display:none}}
@media(max-width:599px) and (max-height:700px){.studio-shell .garment3d-view{height:260px}}

/* Phone studio: garment first, one compact inspector step underneath. */
.studio-tools-toggle,.studio-mobile-tabs{display:none}
@media(max-width:599px),(max-width:1023px) and (min-height:601px){
 .studio-shell[data-studio3d=true].design-dialog[open]{grid-template-rows:44px minmax(0,1fr)}
 .studio-shell[data-studio3d=true]>.dialog-header{min-height:44px;padding:4px 12px}
 .studio-shell[data-studio3d=true] .dialog-brand>span{font-size:10px;padding-left:10px}
 .studio-shell[data-studio3d=true] .design-visual{padding:0 6px 4px!important}
 .studio-shell[data-studio3d=true] .garment3d-view{height:min(52dvh,calc(var(--studio-viewport-height,100dvh) - 300px));min-height:0;border-radius:12px}
 .studio-shell[data-studio3d=true] .garment3d-top{inset:6px 7px auto}
 .studio-shell[data-studio3d=true] .garment3d-mode button{min-height:32px;font-size:11px;padding:5px 3px}
 .studio-shell[data-studio3d=true] .garment3d-area-bar{inset:47px 12px auto;align-items:flex-start}
 .studio-shell[data-studio3d=true] .garment3d-area-key{font-size:9px;padding:5px 0;background:#edf0f5a6;border-radius:4px}
 .studio-shell[data-studio3d=true] .garment3d-area-key i{width:14px}
 .studio-shell[data-studio3d=true] .garment3d-area-bar select{min-height:28px;background:#ffffffec}
 .studio-shell[data-studio3d=true] .garment3d-canvas{margin-top:46px}
 .studio-shell[data-studio3d=true] .garment3d-bottom{gap:5px;padding:0 8px}
 .studio-shell[data-studio3d=true] .garment3d-controls button,.studio-shell[data-studio3d=true] .garment3d-view .studio-layers>summary{min-height:34px;padding-block:6px}
 .studio-shell[data-studio3d=true] .garment3d-help{font-size:9px;margin:3px 8px 5px}
 .studio-shell[data-studio3d=true] .studio-inspector{border-radius:14px 14px 0 0}
 .studio-shell[data-studio3d=true] .studio-product-summary{min-height:50px;padding:5px 12px;gap:8px}
 .studio-shell[data-studio3d=true] .studio-product-summary>div:first-child{min-width:0;flex:1}
 .studio-shell[data-studio3d=true] .studio-product-summary h2{font-size:12px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .studio-shell[data-studio3d=true] .studio-product-summary p{font-size:10px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .studio-shell[data-studio3d=true] .studio-summary-price strong{font-size:17px;letter-spacing:-.03em}
 .studio-shell[data-studio3d=true] .studio-summary-price>span{font-size:8px;margin-top:3px}
 .studio-shell[data-studio3d=true] .studio-tools-toggle{display:flex;align-items:center;justify-content:center;min-height:40px;flex:none;padding:6px 9px;font-size:10px;font-weight:550;color:#285ccc;background:#eef3fe;border:1px solid #dce6fa;border-radius:8px}
 .studio-shell[data-studio3d=true] .studio-mobile-tabs{display:flex;flex:none;gap:4px;padding:3px 12px;border-bottom:1px solid #e8edf5;background:white}
 .studio-shell[data-studio3d=true] .studio-mobile-tabs button{display:flex;flex:1;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:38px;border-radius:7px;font-size:11px;color:#66768d;white-space:nowrap}
 .studio-shell[data-studio3d=true] .studio-mobile-tabs button[hidden]{display:none}
 .studio-shell[data-studio3d=true] .studio-mobile-tabs button:disabled{color:#9ca6b7;cursor:default}
 .studio-shell[data-studio3d=true] .studio-mobile-tabs button[aria-current=step]{color:#285ccd;background:#edf3ff;font-weight:600}
 .studio-shell[data-studio3d=true] .studio-mobile-tabs button>span{font-size:9px;font-variant-numeric:tabular-nums}
 .studio-shell[data-studio3d=true] .studio-mobile-tabs button:focus-visible,.studio-shell[data-studio3d=true] .studio-tools-toggle:focus-visible{outline:2px solid #2b62ed;outline-offset:-2px}
 .studio-shell[data-studio3d=true] .studio-accordion-section:not([data-open=true]),.studio-shell[data-studio3d=true] .studio-accordion-section>h3{display:none!important}
 .studio-shell[data-studio3d=true] .design-controls{padding:10px 12px 14px;scroll-padding-block:10px;min-height:0}
 .studio-shell[data-studio3d=true] .studio-section-content{padding-bottom:8px}
 .studio-shell[data-studio3d=true] .studio-section-content>#design-subtitle{display:none!important}
 .studio-shell[data-studio3d=true] .studio-section-content .product-pills{gap:5px;margin-bottom:10px}
 .studio-shell[data-studio3d=true] .product-pills button{min-height:38px;font-size:10px}
 .studio-shell[data-studio3d=true] .garment-colour-row{margin-bottom:10px;gap:6px;font-size:11px}
 .studio-shell[data-studio3d=true] .garment-colour-row>div{gap:8px}
 .studio-shell[data-studio3d=true] .mobile-text-label{margin:0;min-height:0;height:0;overflow:hidden}
 .studio-shell[data-studio3d=true] #full-name{min-height:44px;font-size:16px;padding:10px 12px}
 .studio-shell[data-studio3d=true] .input-meta{margin:4px 0 6px;font-size:9px}
 .studio-shell[data-studio3d=true] .mobile-text-options{gap:6px}
 .studio-shell[data-studio3d=true] .mobile-text-options .mobile-picker>summary{min-height:40px;margin:0;padding:6px 0;font-size:10px}
 .studio-shell[data-studio3d=true] .mobile-text-options summary strong{font-size:11px}
 .studio-shell[data-studio3d=true] .mobile-text-size{min-height:44px;margin:6px 0;padding:4px 7px 4px 10px}
 .studio-shell[data-studio3d=true] .mobile-text-size button{min-height:34px;min-width:38px}
 .studio-shell[data-studio3d=true] .mobile-text-size>div:first-child{font-size:11px}
 .studio-shell[data-studio3d=true] .studio-finish-options button{min-height:44px;padding:7px 10px;gap:2px}
 .studio-shell[data-studio3d=true] .studio-finish-options strong{font-size:12px}
 .studio-shell[data-studio3d=true] .studio-finish-options span{font-size:9px}
 .studio-shell[data-studio3d=true] #editor-adjust-panel{position:relative;margin-top:10px!important;padding-top:8px!important}
 .studio-shell[data-studio3d=true] .garment3d-history{position:absolute;right:0;top:8px;margin:0}
 .studio-shell[data-studio3d=true] .editor-adjust-heading{min-height:34px;padding-right:82px;font-size:12px}
 .studio-shell[data-studio3d=true] .photo-adjust-tools{margin:6px 0;padding:3px}
 .studio-shell[data-studio3d=true] .photo-adjust-tools button{min-height:36px}
 .studio-shell[data-studio3d=true] .customer-art{padding:12px;margin-bottom:12px}
 .studio-shell[data-studio3d=true] .customer-art h3{font-size:13px}
 .studio-shell[data-studio3d=true] .customer-art>p{font-size:11px;margin-block:6px}
 .studio-shell[data-studio3d=true] .design-buy{min-height:60px;padding:7px 12px max(7px,env(safe-area-inset-bottom));gap:8px}
 .studio-shell[data-studio3d=true] .studio-footer-progress{display:none}
 .studio-shell[data-studio3d=true] .design-buy .studio-next,.studio-shell[data-studio3d=true] .design-buy #add-design{min-height:44px;font-size:12px}
 /* Hide tools gives the 3D canvas all remaining space; one tap restores the same step. */
 .studio-shell[data-studio3d=true][data-tools-collapsed=true] .designer{grid-template-rows:minmax(0,1fr) auto auto}
 .studio-shell[data-studio3d=true][data-tools-collapsed=true] .design-visual,.studio-shell[data-studio3d=true][data-tools-collapsed=true] .garment3d-view{height:100%;min-height:0}
 .studio-shell[data-studio3d=true][data-tools-collapsed=true] .design-controls,.studio-shell[data-studio3d=true][data-tools-collapsed=true] .studio-mobile-tabs{display:none!important}
 /* Keep the input visible above the on-screen keyboard. */
 .studio-shell[data-studio3d=true][data-mobile-keyboard=true] .garment3d-view{height:clamp(86px,calc(var(--studio-viewport-height,100dvh)*.32),150px)}
 .studio-shell[data-studio3d=true][data-mobile-keyboard=true] .garment3d-canvas{margin:0}
 .studio-shell[data-studio3d=true][data-mobile-keyboard=true] .studio-product-summary,.studio-shell[data-studio3d=true][data-mobile-keyboard=true] .studio-mobile-tabs{display:none}
 .studio-shell[data-studio3d=true][data-mobile-keyboard=true] .mobile-text-label{height:auto;min-height:28px;overflow:visible;margin-bottom:3px}
 .studio-shell[data-studio3d=true][data-mobile-keyboard=true] .design-buy{display:none}
}

@media(max-width:599px),(max-width:1023px) and (min-height:601px){
 .studio-shell[data-studio3d=true].design-dialog{height:min(100dvh,var(--studio-viewport-height,100dvh));max-height:min(100dvh,var(--studio-viewport-height,100dvh));inset:var(--studio-viewport-top,0px) 0 auto}
 .studio-shell[data-studio3d=true] .studio-design-tabs{display:none!important}
}

/* The selected design has its own visible controls on the 3D garment. */
.garment3d-selection{position:absolute;z-index:2;pointer-events:none;box-sizing:border-box}
.garment3d-selection[hidden],.garment3d-selection-tools[hidden]{display:none!important}
.garment3d-selection button{touch-action:none;pointer-events:auto;user-select:none;-webkit-user-select:none}
.garment3d-selection .selection-drag{position:absolute;inset:0;border:2px solid #3264ed;border-radius:5px;background:transparent;cursor:move;padding:0;box-shadow:0 0 0 1px #fff8}
.selection-drag span{position:absolute;bottom:-19px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:9px;line-height:16px;background:#fffefc;color:#234b9a;padding:0 5px;border-radius:3px;pointer-events:none}
.garment3d-selection .selection-handle{position:absolute;display:grid;place-items:center;width:44px;height:44px;padding:7px;border:0;background:transparent;color:#285de5}
.selection-handle svg{box-sizing:border-box;width:30px;height:30px;border:1.5px solid #3264ed;border-radius:50%;padding:5px;background:white;fill:none;stroke:currentColor;stroke-width:1.7;box-shadow:0 2px 8px #182a4920}
.selection-delete{left:-22px;top:-22px}.selection-rotate{right:-22px;top:-22px}.selection-resize{right:-22px;bottom:-22px;cursor:nwse-resize}
.garment3d-selection button:focus-visible{outline:2px solid #172e60;outline-offset:2px}
.garment3d-selection-tools{position:absolute;z-index:3;left:50%;bottom:7px;transform:translateX(-50%);display:flex;align-items:center;gap:2px;max-width:calc(100% - 16px);border:1px solid #d0dbee;border-radius:23px;padding:3px;background:#fffffff5;box-shadow:0 3px 14px #192c4714;white-space:nowrap}
.garment3d-selection-tools button{min-width:40px;min-height:40px;padding:6px 10px;border-radius:20px;color:#244773;font-size:12px}.garment3d-selection-tools button:hover{background:#eaf1ff}.garment3d-selection-tools [data-selection-action=smaller],.garment3d-selection-tools [data-selection-action=larger]{font-size:22px;line-height:1}
.garment3d-selection-tools .selection-kind{font-size:10px;color:#69778b;padding:0 8px}.garment3d-selection-tools [data-selection-action=delete]{color:#963537}
@media(max-width:599px){.garment3d-selection-tools{bottom:4px}.garment3d-selection-tools button{min-width:38px;font-size:11px;padding-inline:8px}.selection-drag span{font-size:8px}}
.studio-shell[data-mobile-keyboard=true] .garment3d-selection-tools{display:none}

.garment3d-leg-areas{display:flex;gap:3px;padding:2px;border:1px solid #c9d6ed;border-radius:18px;background:#ffffffed}.garment3d-leg-areas button{min-height:30px;font-size:11px;padding:4px 10px;border-radius:15px;background:transparent;color:#35537c}.garment3d-leg-areas button[aria-pressed=true]{background:#295cde;color:white}.garment3d-leg-areas button:disabled{opacity:.5}
@media(max-width:599px){.garment3d-leg-areas button{min-height:30px;font-size:10px;padding:4px 8px}}

/* Creative area: a plain box on the garment, calm while you read it and clear while you move something inside it. */
.garment3d-canvas{--area:#2f5fe0;--area-halo:#ffffff;--area-text:#1f3f9c;--area-paper:#ffffffee}
.garment3d-canvas[data-cloth=dark]{--area:#ffffff;--area-halo:#0f172a;--area-text:#ffffff;--area-paper:#1b2536e6}
.garment3d-areas,.garment3d-area-marks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:1}
.garment3d-areas{animation:garment3d-area-in .2s ease-out}.garment3d-area-marks{z-index:2}
.garment3d-areas[hidden],.garment3d-area-marks[hidden],.garment3d-area-marks [hidden]{display:none}
@keyframes garment3d-area-in{from{opacity:0}}
.area-halo{fill:none;stroke:var(--area-halo);stroke-width:3.5;opacity:.45}
.area-line{fill:none;stroke:var(--area);stroke-width:1.5;stroke-dasharray:7 5;opacity:.8;transition:opacity .15s,stroke-width .15s}
.area-line[data-state=other],.area-line[data-state=idle]{opacity:.5}.area-halo[data-state=other]{opacity:.25}
.garment3d-canvas[data-area-emphasis=true] .area-line[data-state=selected]{opacity:1;stroke-width:2}
.area-centre{stroke:var(--area);stroke-width:1;stroke-dasharray:2 5;opacity:.65}.area-centre[data-snapped=true]{stroke-dasharray:none;stroke-width:1.5;opacity:1}
.area-edge{stroke:var(--area);stroke-width:3.5;stroke-linecap:round}
.area-chip{position:absolute;left:0;top:0;font-size:10px;line-height:16px;padding:0 6px;border-radius:8px;background:var(--area-paper);color:var(--area-text);white-space:nowrap;box-shadow:0 1px 3px #0f172a24;font-weight:500}
.area-chip[data-state=strong]{font-weight:600}
.area-hint{position:absolute;left:0;top:0;font-size:12px;line-height:1.3;padding:4px 10px;border-radius:12px;color:var(--area-text);background:var(--area-paper);white-space:nowrap}
.area-move{position:absolute;left:0;top:0;pointer-events:auto;font-size:11px;font-weight:500;min-height:36px;padding:6px 14px;border-radius:18px;background:#253a5a;color:#fff;white-space:nowrap;box-shadow:0 4px 14px #0f172a33}
.area-move:hover{background:#1b2c46}.area-move:focus-visible{outline:2px solid #fff;outline-offset:-4px}
/* Out of the way while moving, so the design can be judged against the box. */
.garment3d-canvas[data-area-dragging=true] .selection-handle,.garment3d-canvas[data-area-dragging=true] .selection-drag span,.garment3d-canvas[data-area-dragging=true] .garment3d-selection-tools{opacity:0;pointer-events:none}
.garment3d-canvas[data-area-dragging=true] .selection-drag{border-color:transparent;box-shadow:none}
.studio-shell[data-mobile-keyboard=true] .garment3d-area-marks{display:none}
/* A close-up runs past the canvas; let the garment fade rather than stop on a hard line. */
.garment3d-canvas[data-zoomed=true] canvas,.garment3d-canvas[data-zoomed=true] .garment3d-areas{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 14px,#000 calc(100% - 14px),transparent);mask-image:linear-gradient(to bottom,transparent,#000 14px,#000 calc(100% - 14px),transparent)}
@media(prefers-reduced-motion:reduce){.garment3d-areas{animation:none}.area-line{transition:none}}