/* Field chrome is a sibling of the rendered document, never customer output. */
/* A bar is a subobject: its label and the surrounding field are not selected.
 * The external resize frame supplies the only bar selection outline. */
.studio-render.studio-render--editor [data-studio-field][data-studio-field-selection="bar"] { outline: none; outline-offset: 0; box-shadow: none; background: transparent; border-color: transparent; }
.studio-render.studio-render--editor [data-studio-field][data-studio-field-selection="bar"] > label { outline: none; outline-offset: 0; box-shadow: none; background: transparent; }
.studio-render.studio-render--editor [data-studio-field][data-studio-field-selection="bar"] > [data-canvas-drag-handle] { display: none; pointer-events: none; }
.studio-render.studio-render--editor [data-studio-section]:not(.is-selected):has([data-studio-field][data-studio-field-selection="bar"]:hover) { --studio-section-editor-shadow: var(--studio-section-shadow,none); box-shadow: var(--studio-section-shadow,none); outline: none; }
.studio-canvas-field-resize { position: absolute; inset: 0; z-index: 8; overflow: hidden; pointer-events: none; color: #376f99; font: 11px/1.3 "DM Sans",Arial,sans-serif; }
.studio-canvas-field-resize[hidden], .studio-canvas-field-resize-frame[hidden] { display: none; }
.studio-canvas-field-resize-frame { position: absolute; outline: 1px solid #78aacf; pointer-events: none; }
.studio-canvas-field-resize button { position: absolute; display: grid; place-items: center; width: 44px; height: 44px; min-width: 44px; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; box-shadow: none; pointer-events: auto; touch-action: none; transform: translate(-50%,-50%); }
.studio-canvas-field-resize button::after { content: ""; position: absolute; width: 8px; height: 8px; border: 1px solid #528fbd; background: #fff; }
.studio-canvas-field-resize button:hover::after { background: #d9eefb; }
.studio-canvas-field-resize button:focus-visible { outline: 2px solid #528fbd !important; outline-offset: -3px !important; }
/* Offset invisible hit areas so their centers remain distinct on skinny bars.
 * The visible knobs still sit on the bar's real right and bottom edges. */
.studio-canvas-field-resize [data-canvas-field-resize=e] { left: calc(100% + 14px); top: 50%; cursor: ew-resize; }
.studio-canvas-field-resize [data-canvas-field-resize=e]::after { left: 4px; top: 18px; }
.studio-canvas-field-resize [data-canvas-field-resize=s] { left: 50%; top: calc(100% + 14px); cursor: ns-resize; }
.studio-canvas-field-resize [data-canvas-field-resize=s]::after { left: 18px; top: 4px; }
.studio-canvas-field-resize [data-canvas-field-resize=se] { left: calc(100% + 14px); top: calc(100% + 14px); cursor: nwse-resize; }
.studio-canvas-field-resize [data-canvas-field-resize=se]::after { left: 4px; top: 4px; }
.studio-canvas-field-resize-size { position: absolute; right: 0; bottom: calc(100% + 6px); max-width: 100%; padding: 3px 5px; border-radius: 3px; background: #528fbd; color: #fff; white-space: nowrap; font-variant-numeric: tabular-nums; pointer-events: none; }
.studio-canvas-field-resize-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.studio-canvas-field-resize.is-field-resizing .studio-canvas-field-resize-frame { outline-width: 2px; }