/* Selection chrome is outside the document and never included in output. */
.studio-canvas-transform { position:absolute; inset:0; z-index:7; overflow:hidden; pointer-events:none; font:11px/1.2 "DM Sans",Arial,sans-serif; color:#376f99; }
.studio-canvas-transform[hidden] { display:none; }
.studio-canvas-transform-frame { position:absolute; outline:1px solid #78aacf; }
.studio-canvas-transform button { position:absolute; display:grid; place-items:center; width:20px; height:20px; min-width:0; min-height:0; margin:0; padding:0; border:0; border-radius:0; background:transparent; color:inherit; pointer-events:auto; touch-action:none; box-shadow:none; transform:translate(-50%,-50%); font:inherit; }
.studio-canvas-transform button::after { content:""; width:7px; height:7px; border:1px solid #528fbd; background:white; }
.studio-canvas-transform button:hover::after { background:#d9eefb; }
.studio-canvas-transform button:focus-visible { outline:2px solid #528fbd!important; outline-offset:1px; }
.studio-canvas-transform [data-canvas-transform=move] { left:50%; top:-18px; display:flex; justify-content:center; gap:4px; width:62px; height:24px; border:1px solid #78aacf; border-radius:5px; background:#fff; cursor:grab; box-shadow:0 1px 4px #163d591f; }
.studio-canvas-transform [data-canvas-transform=move]::after { content:none; }
.studio-canvas-transform [data-canvas-transform=nw] { left:0; top:0; cursor:nwse-resize; }
.studio-canvas-transform [data-canvas-transform=n] { left:50%; top:0; cursor:ns-resize; }
.studio-canvas-transform [data-canvas-transform=ne] { left:100%; top:0; cursor:nesw-resize; }
.studio-canvas-transform [data-canvas-transform=e] { left:100%; top:50%; cursor:ew-resize; }
.studio-canvas-transform [data-canvas-transform=se] { left:100%; top:100%; cursor:nwse-resize; }
.studio-canvas-transform [data-canvas-transform=s] { left:50%; top:100%; cursor:ns-resize; }
.studio-canvas-transform [data-canvas-transform=sw] { left:0; top:100%; cursor:nesw-resize; }
.studio-canvas-transform [data-canvas-transform=w] { left:0; top:50%; cursor:ew-resize; }
.studio-canvas-transform-size { position:absolute; left:50%; top:calc(100% + 12px); transform:translateX(-50%); border-radius:3px; padding:3px 5px; background:#528fbd; color:white; white-space:nowrap; }
.studio-canvas-transform.is-transforming [data-canvas-transform=move] { cursor:grabbing; }
.studio-canvas-transform.is-moving-object .studio-canvas-transform-size { visibility:hidden; }
.studio-canvas-move-rulers { position:absolute; inset:0; pointer-events:none; color:#376f99; }
.studio-canvas-move-rulers[hidden] { display:none; }
.studio-canvas-move-guides { position:absolute; inset:0; width:100%; height:100%; overflow:hidden; fill:none; stroke:currentColor; stroke-width:1; }
.studio-canvas-move-origin { stroke:#78aacf; stroke-dasharray:4 4; opacity:.8; }
.studio-canvas-move-readout { position:absolute; display:flex; align-items:center; white-space:nowrap; max-width:calc(100% - 16px); border:1px solid #78aacf; border-radius:5px; background:#fff; color:#294f6a; box-shadow:0 2px 6px #163d5924; font-size:11px; font-variant-numeric:tabular-nums; line-height:1.4; }
.studio-canvas-move-readout span { padding:5px 9px; }
.studio-canvas-move-readout span + span { border-left:1px solid #c9dfef; }
.studio-canvas-transform-status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(pointer:coarse) { .studio-canvas-transform button { width:44px; height:44px; } .studio-canvas-transform [data-canvas-transform=move] { width:76px; height:44px; top:-25px; } .studio-canvas-transform button::after { width:9px; height:9px; } }