.stage-viewport{grid-row:2;width:100%;height:100%;min-width:0;min-height:0;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;isolation:isolate}
.stage-viewport{touch-action:none;cursor:grab}
.stage-viewport.camera-panning{cursor:grabbing}
.canvas-quick-actions{position:absolute;z-index:30;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:6px;padding:5px;border:1px solid #d7ded0;border-radius:10px;background:#fff;box-shadow:0 3px 14px #18251b30;white-space:nowrap}
.canvas-quick-actions[hidden],.review-mode .canvas-quick-actions{display:none!important}
.canvas-quick-actions button{min-height:40px;padding:0 12px;border:0;border-radius:6px;background:#f2f4ee;color:#26352b;font-size:12px;font-weight:700;cursor:pointer}
.canvas-quick-actions button:first-child{background:#e7532f;color:#fff}
@media(max-width:600px){.canvas-quick-actions{bottom:6px;max-width:calc(100% - 16px)}.canvas-quick-actions button{padding:0 9px;font-size:11px}}
#stageGarment .print-guide{border:0!important}
#stageGarment .print-safe,#stageGarment .corner{display:none}
.camera-guide-svg{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible;pointer-events:none}
#stageGarment .transform-box{border:0!important;box-shadow:0 0 0 calc(1px / var(--camera-scale)) #2677e9}
#stageGarment .size-handle,#stageGarment .rotate-handle{border:0!important;box-shadow:0 0 0 calc(2px / var(--camera-scale)) #2677e9}
.stage-viewport>.garment-wrap{margin:0!important;max-width:none!important;flex-shrink:0;aspect-ratio:1;transition:none;--camera-scale:1}
.canvas-section>.canvas-top,.canvas-section>.canvas-bottom,.canvas-section>.canvas-note{position:relative;z-index:4}
.canvas-bottom .zoom{display:flex!important;align-items:center;gap:3px;padding:3px;flex-shrink:0;white-space:nowrap}
.zoom button{width:20px;height:27px;font-size:15px;padding:0;border-radius:3px}.zoom #zoomLabel{font-size:8px;min-width:47px;text-align:center}
.zoom #zoomFit,.zoom #zoomOverview{font-size:16px;color:#788668}.zoom #zoomFit.active,.zoom #zoomOverview.active{background:#e3ead8;color:#445a32}
#stageGarment .print-guide{border-width:calc(1px / var(--camera-scale))}
#stageGarment .print-safe{border-width:calc(1px / var(--camera-scale))}
#stageGarment .print-guide:before{width:calc(1px / var(--camera-scale))}
#stageGarment .print-guide:after{height:calc(1px / var(--camera-scale))}
#stageGarment .print-guide .ruler{font-size:calc(8px / var(--camera-scale));border-radius:calc(4px / var(--camera-scale));padding:calc(3px / var(--camera-scale)) calc(5px / var(--camera-scale))}
#stageGarment .ruler.width{top:calc(-22px / var(--camera-scale))}
#stageGarment .ruler.height{left:calc(100% + 7px / var(--camera-scale))}
#stageGarment .corner{width:calc(7px / var(--camera-scale));height:calc(7px / var(--camera-scale))}
#stageGarment .corner.tl{left:calc(-2px / var(--camera-scale));top:calc(-2px / var(--camera-scale));border-width:calc(2px / var(--camera-scale)) 0 0 calc(2px / var(--camera-scale))}
#stageGarment .corner.tr{right:calc(-2px / var(--camera-scale));top:calc(-2px / var(--camera-scale));border-width:calc(2px / var(--camera-scale)) calc(2px / var(--camera-scale)) 0 0}
#stageGarment .corner.bl{left:calc(-2px / var(--camera-scale));bottom:calc(-2px / var(--camera-scale));border-width:0 0 calc(2px / var(--camera-scale)) calc(2px / var(--camera-scale))}
#stageGarment .corner.br{right:calc(-2px / var(--camera-scale));bottom:calc(-2px / var(--camera-scale));border-width:0 calc(2px / var(--camera-scale)) calc(2px / var(--camera-scale)) 0}
#stageGarment .transform-box{border-width:calc(1px / var(--camera-scale))}
#stageGarment .size-handle{width:calc(13px / var(--camera-scale));height:calc(13px / var(--camera-scale));border-width:calc(2px / var(--camera-scale));border-radius:calc(2px / var(--camera-scale))}
#stageGarment .rotate-handle{width:calc(15px / var(--camera-scale));height:calc(15px / var(--camera-scale));top:calc(-27px / var(--camera-scale));border-width:calc(2px / var(--camera-scale))}
#stageGarment .rotation-stem{top:calc(-27px / var(--camera-scale));height:calc(27px / var(--camera-scale));width:calc(1px / var(--camera-scale))}
#stageGarment .object-delete{width:calc(21px / var(--camera-scale));height:calc(21px / var(--camera-scale));font-size:calc(18px / var(--camera-scale))}
#stageGarment .object-measure{top:calc(100% + 14px / var(--camera-scale));font-size:calc(9px / var(--camera-scale));padding:calc(4px / var(--camera-scale)) calc(6px / var(--camera-scale));border-radius:calc(4px / var(--camera-scale))}
#stageGarment .object-angle{bottom:calc(100% + 40px / var(--camera-scale));font-size:calc(10px / var(--camera-scale));padding:calc(4px / var(--camera-scale)) calc(6px / var(--camera-scale));border-radius:calc(4px / var(--camera-scale));border-width:calc(1px / var(--camera-scale))}
#stageGarment .transform-handle:before{inset:calc(-7px / var(--camera-scale))}
@media(max-width:1150px) and (min-width:901px){.canvas-section{grid-template-rows:35px minmax(0,1fr) 78px 27px}.canvas-bottom{justify-content:center}.canvas-bottom .side-switch{flex-basis:100%;flex-grow:0}.canvas-bottom .zoom{margin:0}.canvas-bottom .preview-btn{padding:9px}}
@media(max-width:900px){.canvas-bottom .zoom{gap:1px;padding:2px}.zoom button{width:17px;height:25px;font-size:14px}.zoom #zoomLabel{min-width:44px;font-size:7px}.zoom #zoomFit,.zoom #zoomOverview{font-size:15px}.canvas-bottom{column-gap:5px!important}.canvas-bottom .preview-btn,.adjust-toggle{padding:8px 9px;font-size:9px}#stageGarment .size-handle{width:calc(16px / var(--camera-scale));height:calc(16px / var(--camera-scale))}#stageGarment .rotate-handle{width:calc(18px / var(--camera-scale));height:calc(18px / var(--camera-scale))}#stageGarment .object-delete{width:calc(24px / var(--camera-scale));height:calc(24px / var(--camera-scale));font-size:calc(20px / var(--camera-scale))}}
@media(pointer:coarse){#stageGarment .transform-handle:before{inset:calc(-12px / var(--camera-scale))}}