.stage-wrap{display:flex;justify-content:center;padding:20px;border-radius:var(--radius-lg);clip-path:inset(0 round var(--radius-lg));background:var(--surface-2);border:1px solid var(--border)}.stage{position:relative;touch-action:none;-webkit-user-select:none;user-select:none;background:repeating-conic-gradient(#8884 0,#8884 25%,#0000 0,#0000 50%) 0 0 / 16px 16px}.stage canvas{display:block}.crop{position:absolute;cursor:move;touch-action:none;outline:2px solid #fff;box-shadow:0 0 0 9999px #0000008c;background:linear-gradient(#fff6,#fff6) 33.33% 0 / 1px 100% no-repeat,linear-gradient(#fff6,#fff6) 66.66% 0 / 1px 100% no-repeat,linear-gradient(#fff6,#fff6) 0 33.33% / 100% 1px no-repeat,linear-gradient(#fff6,#fff6) 0 66.66% / 100% 1px no-repeat}.crop i{position:absolute;width:32px;height:32px;margin:-16px 0 0 -16px}.crop i:after{content:"";position:absolute;top:10px;right:10px;bottom:10px;left:10px;border-radius:50%;background:var(--accent);border:2px solid #fff}.crop i[data-h=nw]{left:0;top:0;cursor:nwse-resize}.crop i[data-h=n]{left:50%;top:0;cursor:ns-resize}.crop i[data-h=ne]{left:100%;top:0;cursor:nesw-resize}.crop i[data-h=w]{left:0;top:50%;cursor:ew-resize}.crop i[data-h=e]{left:100%;top:50%;cursor:ew-resize}.crop i[data-h=sw]{left:0;top:100%;cursor:nesw-resize}.crop i[data-h=s]{left:50%;top:100%;cursor:ns-resize}.crop i[data-h=se]{left:100%;top:100%;cursor:nwse-resize}@media (max-width: 560px){.stage-wrap{padding:16px}}