.square-crop-dialog{border:1px solid var(--line);background:var(--surface);width:min(440px,100vw - 32px);max-height:calc(100dvh - 32px);color:var(--foreground);border-radius:16px;margin:auto;padding:24px;overflow-y:auto}.square-crop-dialog::backdrop{background:#0008}.square-crop-dialog>header{justify-content:space-between;align-items:center;gap:16px;display:flex}.square-crop-dialog h2{font-size:20px;font-weight:700}.square-crop-dialog>header>button{border-radius:8px;place-items:center;width:32px;height:32px;display:grid}.square-crop-help{color:var(--muted);word-break:keep-all;margin-block:12px 20px;font-size:13px;line-height:1.7}.square-crop-stage{aspect-ratio:1;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;background-color:#e5e7eb;background-image:linear-gradient(45deg,#fff 25%,#0000 25%),linear-gradient(-45deg,#fff 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#fff 75%),linear-gradient(-45deg,#0000 75%,#fff 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;width:min(100%,320px);margin-inline:auto;position:relative;overflow:hidden}.square-crop-stage:active{cursor:grabbing}.square-crop-stage>img{pointer-events:none;max-width:none;position:absolute}.square-crop-stage>span[role=status]{color:#4b5563;place-items:center;font-size:13px;display:grid;position:absolute;inset:0}.square-crop-grid{pointer-events:none;background:linear-gradient(90deg,#0000 calc(33.333% - .5px),#fff6 33.333%,#0000 calc(33.333% + .5px) calc(66.666% - .5px),#fff6 66.666%,#0000 calc(66.666% + .5px)),linear-gradient(#0000 calc(33.333% - .5px),#fff6 33.333%,#0000 calc(33.333% + .5px) calc(66.666% - .5px),#fff6 66.666%,#0000 calc(66.666% + .5px));border:1px solid #fffa;position:absolute;inset:0}.square-crop-controls{color:var(--muted);align-items:center;gap:12px;margin-top:20px;display:flex}.product-form .square-crop-controls input[type=range]{min-width:0;box-shadow:none;accent-color:var(--foreground);border:0;flex:1;padding:0}.square-crop-controls>button{flex-shrink:0;place-items:center;width:36px;height:36px;display:grid}.square-crop-dialog>footer{justify-content:flex-end;gap:10px;margin-top:20px;display:flex}.square-crop-error{color:#dc2626;margin-top:12px;font-size:13px}.square-crop-dialog :focus-visible{outline:2px solid var(--foreground);outline-offset:3px}.image-picker-square .image-picker-preview{aspect-ratio:1;width:112px;height:112px}.image-picker-square .image-picker-preview>img{object-fit:contain;width:100%;height:100%}@media (max-width:480px){.square-crop-dialog{padding:20px}}
