/* Shared HD overlay canvas for Encoder and DVR Trim. */
.overlay-canvas,.trim-overlay-canvas {width:100%;max-width:640px;max-height:none;margin:0 auto;aspect-ratio:16/9;position:relative;border:1px solid #37617a;overflow:visible;background-color:#0e2636;background-image:linear-gradient(#4582a12b 1px,transparent 1px),linear-gradient(90deg,#4582a12b 1px,transparent 1px);background-size:20px 20px;}
.overlay-canvas:focus-visible,.trim-overlay-canvas:focus-visible {outline:2px solid #12e6cc;outline-offset:3px;}
.overlay-layer,.trim-overlay-layer {position:absolute;border:1px solid transparent;background:transparent;overflow:visible;cursor:move;min-width:8px;min-height:8px;box-sizing:border-box;}
.overlay-layer.active,.trim-overlay-layer.selected {z-index:3;border:3px solid #12e6cc;background:rgba(18,230,204,.14);box-shadow:0 0 0 2px #07131b,0 0 14px rgba(18,230,204,.9);}
.overlay-layer-image,.trim-overlay-layer-preview {display:block;position:absolute;z-index:1;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;pointer-events:none;user-select:none;}
.overlay-resize-handle,.trim-overlay-resize {display:none;position:absolute;z-index:4;width:10px;height:10px;border:1px solid #102331;border-radius:2px;background:#ffb84c;}
.overlay-layer.active .overlay-resize-handle,.trim-overlay-layer.selected .trim-overlay-resize {display:block;}
.overlay-resize-handle.nw,.trim-overlay-resize.nw {left:-1px;top:-1px;cursor:nwse-resize;}
.overlay-resize-handle.ne,.trim-overlay-resize.ne {right:-1px;top:-1px;cursor:nesw-resize;}
.overlay-resize-handle.sw,.trim-overlay-resize.sw {left:-1px;bottom:-1px;cursor:nesw-resize;}
.overlay-resize-handle.se,.trim-overlay-resize.se {right:-1px;bottom:-1px;cursor:nwse-resize;}