.panel-document { min-height: 100svh; }
.panel-document[data-mode="public"] { scroll-snap-type: y mandatory; overflow-y: auto; height: 100svh; }
.panel-stage { position: relative; min-height: 100svh; overflow: hidden; scroll-snap-align: start; scroll-snap-stop: always; }
.panel-height-content { min-height: 120svh; }
.panel-world { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.panel-object-layer, .panel-view-frames { position: absolute; inset: 0; }
.panel-view-frames { z-index: 9998; pointer-events: none; }
.panel-view-frame { position: absolute; border: 5px dashed rgba(21, 21, 21, .34); background: rgba(239, 189, 70, .045); }
.panel-view-frame.is-active { border-color: #cf4772; background: rgba(207, 71, 114, .06); }
.panel-view-frame span { position: absolute; left: 14px; top: 12px; padding: 7px 12px; background: #f8ecd4; border: 2px solid #151515; font: 700 30px "Caveat", cursive; box-shadow: 4px 5px 0 rgba(21, 21, 21, .18); }
.panel-object { position: absolute; white-space: pre-wrap; transform-origin: center; box-sizing: border-box; }
.panel-object-text, .panel-object-link { padding: .1em; }
.panel-object-link { display: block; text-decoration: none; padding: .25em .5em; }
.panel-object-image img { pointer-events: none; transform-origin: center; }
.panel-image-placeholder { width: 100%; height: 100%; display: grid; place-items: center; border: 3px dashed currentColor; font: 700 34px "Caveat", cursive; }
.panel-stage.is-editor { position: relative; inset: auto; min-height: 0; box-shadow: 0 0 0 2px #000, 0 22px 70px #0008; touch-action: none; user-select: none; }
.panel-stage.is-editor .panel-object { cursor: grab; touch-action: none; user-select: none; }
.panel-stage.is-editor .panel-object:active { cursor: grabbing; }
.panel-stage.is-editor .panel-object.is-locked { cursor: not-allowed; }
.panel-stage.is-editor .panel-object.is-selected { outline: 7px solid #cf4772; outline-offset: 8px; }
.panel-stage.is-editor .panel-transform-handle { position: absolute; z-index: 9999; width: 34px; height: 34px; padding: 0; border: 4px solid #151515; border-radius: 999px; background: #efbd46; box-shadow: 4px 5px 0 rgba(21, 21, 21, .22); pointer-events: auto; transform: translate(-50%, -50%); }
.panel-stage.is-editor .panel-transform-nw { left: 0; top: 0; cursor: nwse-resize; }
.panel-stage.is-editor .panel-transform-ne { left: 100%; top: 0; cursor: nesw-resize; }
.panel-stage.is-editor .panel-transform-sw { left: 0; top: 100%; cursor: nesw-resize; }
.panel-stage.is-editor .panel-transform-se { left: 100%; top: 100%; cursor: nwse-resize; }
.panel-stage.is-editor .panel-transform-rotate { left: 50%; top: -74px; background: #cf4772; cursor: grab; }
.panel-stage.is-editor .panel-transform-rotate::after { content: ""; position: absolute; left: 50%; top: 100%; width: 4px; height: 46px; background: #151515; transform: translateX(-50%); }
.panel-object-group { overflow: visible !important; }
.panel-group-children { position: absolute; top: 0; left: 0; width: 0; height: 0; overflow: visible; }
.panel-stage.is-editor .panel-object-group { outline: 2px dashed rgba(207,71,114,.38); outline-offset: 4px; }
.panel-stage.is-editor .panel-object-group[data-group-active] { outline: 3px dashed #cf4772; outline-offset: 10px; }
.panel-stage.is-editor .panel-object-group:not([data-group-active]) .panel-object { pointer-events: none !important; }
.snap-guide { position: absolute; pointer-events: none; z-index: 9997; opacity: .85; }
.snap-guide-v { width: 2px; background: #00c8e0; transform: translateX(-50%); }
.snap-guide-h { height: 2px; background: #00c8e0; transform: translateY(-50%); }