/* Shared artwork geometry: preview uses the same raster drawing as export. */
.studio-overlay { position:absolute; pointer-events:auto; touch-action:none; user-select:none; cursor:move; padding:0!important; background:none!important; box-shadow:none!important; text-shadow:none!important; animation:none!important; transform-origin:center; outline:none; }
.studio-overlay > canvas,.studio-overlay > img { width:100%;height:100%;display:block;pointer-events:none; }
.studio-overlay.selected { outline:2px dashed #f7e4af;outline-offset:4px; }
.studio-overlay .resize-handle { display:none;position:absolute;width:16px;height:16px;border:2px solid #153f33;border-radius:50%;background:white;padding:0;z-index:2;touch-action:none; }
.studio-overlay.selected .resize-handle { display:block; }
.studio-overlay .resize-handle.nw{left:-12px;top:-12px;cursor:nwse-resize}
.studio-overlay .resize-handle.ne{right:-12px;top:-12px;cursor:nesw-resize}
.studio-overlay .resize-handle.sw{left:-12px;bottom:-12px;cursor:nesw-resize}
.studio-overlay .resize-handle.se{right:-12px;bottom:-12px;cursor:nwse-resize}
#studioDecorationCanvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:10001}
body.studio-overlays-ready #captionOverlay,body.studio-overlays-ready #cornerMark {visibility:hidden!important;pointer-events:none}
.overlay-layer{z-index:4}
.overlay-help{font-size:11px;line-height:1.55;color:#62786d;margin:10px 0}
.overlay-layer-list{display:grid;gap:6px;margin:12px 0}
.overlay-layer-item{display:block;text-align:left;width:100%;border:1px solid #c5d2cb;background:#fff;border-radius:6px;padding:9px 10px;color:#183c31;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;font-size:12px}
.overlay-layer-item[aria-pressed=true]{border-color:#225c46;background:#e9f2ec;box-shadow:inset 3px 0 #225c46}
.overlay-numeric-row{display:grid;grid-template-columns:minmax(0,1fr) 74px;align-items:center;gap:10px}
.overlay-numeric-row input[type=range]{width:100%;min-width:0}
.overlay-numeric-row input[type=number]{width:100%;padding-inline:6px;min-height:36px}
.overlay-order{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.overlay-order button{font-size:11px;padding:7px;min-height:36px}
.overlay-coordinate-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.overlay-coordinate-grid .field-label{min-width:0;margin:8px 0}
.overlay-coordinate-grid input{width:100%;min-width:0}
#imageInput{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.image-upload-button:focus-within{outline:3px solid #a99457;outline-offset:3px}
.image-upload-button{display:flex;align-items:center;justify-content:center;cursor:pointer}
#textInput{padding:10px;resize:vertical;min-height:78px;line-height:1.5}
.studio-overlay:focus-visible{outline:3px solid #ffe096;outline-offset:5px}
.overlay-layer-list:empty:after{content:'No layers on this clip yet.';font-size:11px;color:#62786d;padding:8px 0}
.image-block{background:#dae7f2!important;border-color:#85a6bd!important;color:#234f69!important}
@media(max-width:760px){.studio-overlay .resize-handle{width:22px;height:22px}.studio-overlay .resize-handle.nw{left:-16px;top:-16px}.studio-overlay .resize-handle.ne{right:-16px;top:-16px}.studio-overlay .resize-handle.sw{left:-16px;bottom:-16px}.studio-overlay .resize-handle.se{right:-16px;bottom:-16px}.overlay-coordinate-grid .form-control{min-height:44px}.overlay-layer-item{min-height:42px}}