.backdrop.scene-ready { background: none; overflow: hidden; }
.scene-plane { position: absolute; top: 0; left: 0; transform-origin: 0 0; overflow: hidden; }
.scene-base { position: absolute; inset: 0; width: 100%; height: 100%; }
.scene-slot-mask { position: absolute; inset: 0; }
.scene-photo { position: absolute; left: 0; top: 0; transform-origin: 0 0; overflow: hidden; background: var(--scene-paper-light); }
.scene-photo-ink { position:absolute;inset:0;mask-mode:alpha;mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat; }
.scene-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.scene-print-finish { position:absolute;inset:0;pointer-events:none;backdrop-filter:blur(.8px);-webkit-backdrop-filter:blur(.8px);mask-mode:alpha;mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat; }
.scene-print-light .scene-photo { background: var(--scene-paper-light); isolation: isolate; }
.scene-print-light .scene-photo-ink { mix-blend-mode: multiply; }
.scene-print-light .scene-photo::after { content:'';position:absolute;inset:0;pointer-events:none;opacity:.035;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath d='M0 0h160v160H0z' filter='url(%23paper)'/%3E%3C/svg%3E"); }
.scene-light { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(8,8,7,.67), rgba(8,8,7,.54) 50%, rgba(8,8,7,.3)), linear-gradient(0deg, rgba(8,8,7,.8), transparent 30%, rgba(8,8,7,.22)); }
.backdrop.scene-ready::before { z-index: 2; pointer-events: none; }
.backdrop.scene-ready::after { z-index: 3; pointer-events: none; }
.scene-outlines { position: fixed; inset: 0; z-index: 4; pointer-events: none; overflow: hidden; }
.scene-outline-plane { position: absolute; transform-origin: 0 0; overflow: visible; }
.scene-outline-plane polygon { fill: #dfbb6720; stroke: #ecd18d; stroke-width: 2; vector-effect: non-scaling-stroke; }
.scene-outline-plane text { fill: #fff4ce; font: 700 20px Manrope, sans-serif; paint-order: stroke; stroke: #17130d; stroke-width: 5px; }
.scene-controls { position: fixed; z-index: 8; left: 18px; bottom: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 5px; max-width: calc(100% - 36px); padding: 6px; border: 1px solid var(--line); border-radius: 7px; background: #151410ed; box-shadow: 0 4px 25px #0004; }
.scene-controls button { color: #bbb4a6; border: 0; background: none; padding: 9px 11px; border-radius: 4px; font-size: 10px; }
.scene-controls button[aria-pressed="true"] { background: #d9b58320; color: var(--gold-light); }
.scene-controls button:hover { color: var(--ink); }
.scene-slot-mask { pointer-events: none; }
.scene-editing .backdrop { z-index: 1; }
.scene-editing .scene-slot-mask { pointer-events: auto; cursor: grab; touch-action: none; }
.scene-editing .scene-slot-mask.is-dragging { cursor: grabbing; }
.scene-editing.scene-edge-editing .scene-slot-mask { pointer-events: none; }
.scene-photo img { position: absolute; max-width: none; }
.scene-editor { position: fixed; z-index: 9; right: 12px; top: 12px; bottom: 90px; width: 280px; overflow-y: auto; padding: 16px; border: 1px solid var(--line); border-radius: 9px; background: #171612f5; box-shadow: 0 8px 35px #0006; }
.scene-editor-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.scene-editor-heading h2 { font-size: 25px; margin: 0; }
.scene-editor-close { background: none; border: 0; color: var(--muted); font-size: 25px; padding: 0 5px; }
.scene-view-tools { display:flex;align-items:center;gap:5px;margin-top:13px; }
.scene-view-tools button, .scene-pan-control, .scene-restore-contours { height:30px;padding:0 9px;border:1px solid var(--line);border-radius:4px;background:none;font-size:10px; }
.scene-view-tools button:first-child, .scene-view-tools button:nth-child(3) { font-size:18px;min-width:30px; }
.scene-view-tools button:last-child { margin-left:auto; }
.scene-view-scale { min-width:42px;text-align:center;font-size:11px;color:var(--gold-light); }
.scene-pan-control { width:100%;margin-top:7px; }
.scene-pan-control[aria-pressed="true"] { background:#d9b58325;color:var(--gold-light); }
.scene-view-hint { font-size:9px;line-height:1.6;color:var(--muted);margin:8px 0; }
.scene-panning .scene-slot-mask, .scene-panning .scene-boundary-handle { cursor:grab; }
.scene-restore-contours { width:100%;margin-top:10px; }
.scene-frame-tabs { display: grid; grid-template-columns: repeat(8,1fr); gap: 3px; margin-top: 17px; }
.scene-editor button { color: var(--muted); }
.scene-frame-tabs button { padding: 7px 0; border: 1px solid var(--line); border-radius: 3px; background: none; font-size: 10px; }
.scene-frame-tabs button[aria-pressed="true"], .scene-edge-button[aria-pressed="true"] { background: #d9b58325; color: var(--gold-light); }
.scene-editor-active { font-size: 11px; margin: 17px 0 8px; color: var(--gold-light); }
.scene-editor-hint { font-size: 10px; color: var(--muted); line-height: 1.7; margin: 0 0 18px; }
.scene-zoom-label { display: flex; align-items: center; justify-content: space-between; font-size: 11px; }
#scene-photo-zoom { width: 100%; accent-color: var(--gold); margin: 12px 0; }
.scene-nudge { display: flex; gap: 6px; }
.scene-nudge button, .scene-edge-button, .scene-editor-footer button { height: 31px; padding: 0 9px; border: 1px solid var(--line); border-radius: 4px; background: none; font-size: 10px; }
.scene-nudge button { flex: 1; font-size: 15px; }
.scene-edge-button { width: 100%; margin-top: 13px; }
.scene-editor-label { font-size: 11px; margin: 21px 0 10px; }
.scene-photo-picker { display: grid; grid-template-columns: repeat(4,1fr); gap: 5px; max-height: 205px; overflow-y: auto; }
.scene-photo-picker button { min-width: 0; padding: 0; border: 2px solid transparent; background: none; border-radius: 4px; overflow: hidden; }
.scene-photo-picker button[aria-pressed="true"] { border-color: var(--gold); }
.scene-photo-picker img { display: block; width: 100%; aspect-ratio: 1.4; object-fit: cover; }
.scene-editor-save-status { font-size: 9px; line-height: 1.7; color: var(--muted); margin: 17px 0 12px; }
.scene-editor-footer { display: flex; gap: 7px; }
.scene-editor-footer button { flex: 1; padding-inline: 6px; }
.scene-editor-footer .scene-editor-save { background: #bfa582; color: #17130e; }
.scene-editing .scene-outline-plane polygon { fill: none; stroke-opacity: .35; }
.scene-editing .scene-outline-plane polygon[data-active="true"] { stroke-opacity: 1; stroke-width: 3; }
.scene-boundary-handle { fill: #efd1a4; stroke: #17130d; stroke-width: 2; vector-effect: non-scaling-stroke; pointer-events: all; cursor: move; touch-action: none; }
.scene-editing .scene-outline-plane text { font-size: 24px; }
.scene-boundary-handle[data-selected="true"] { fill: #fff8e4; stroke: #b58138; stroke-width: 3; }
.scene-add-point { fill: #171612; stroke: #d9b583; stroke-width: 1; vector-effect: non-scaling-stroke; pointer-events: all; cursor: copy; }
.scene-outline-plane .scene-add-point-label { fill: #efd1a4; stroke: none; pointer-events: none; font-weight: 500; }
.scene-points-panel { margin-top: 10px; padding: 10px; border: 1px solid var(--line); border-radius: 5px; }
.scene-fit-points { width: 100%; height: 29px; border: 1px solid var(--line); border-radius: 4px; background: #d9b58310; font-size: 10px; }
.scene-point-tabs { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 10px; }
.scene-point-tabs button { min-width: 23px; height: 24px; padding: 0 5px; border: 1px solid var(--line); border-radius: 3px; background: none; font-size: 9px; }
.scene-point-tabs button[aria-pressed="true"] { color: var(--gold-light); background: #d9b58325; }
.scene-point-coordinates { display: flex; gap: 8px; margin-top: 10px; }
.scene-point-coordinates label { display: flex; align-items: center; gap: 5px; width: 50%; color: var(--muted); font-size: 10px; }
.scene-point-coordinates input { width: 100%; min-width: 0; height: 28px; padding: 0 5px; border: 1px solid var(--line); border-radius: 3px; color: var(--ink); background: #11110f; font-size: 10px; }
.scene-point-actions { display: flex; gap: 6px; margin-top: 9px; }
.scene-point-actions button { flex: 1; height: 29px; border: 1px solid var(--line); border-radius: 3px; background: none; font-size: 9px; }
.scene-editor button:disabled { opacity: .35; cursor: default; }
.scene-layout-backup { margin-top: 16px; color: var(--muted); font-size: 9px; }
.scene-layout-backup summary { cursor: pointer; }
.scene-layout-backup textarea { display: block; margin-top: 8px; width: 100%; height: 100px; padding: 7px; border: 1px solid var(--line); border-radius: 4px; background: #11110f; color: var(--ink); font-size: 9px; resize: vertical; }
.scene-controls p { width: 100%; margin: 2px 11px 4px; font-size: 9px; color: var(--muted); }
body.scene-inspect .page-shell { visibility: hidden; }
body.scene-inspect .scene-light, body.scene-inspect .backdrop::before, body.scene-inspect .backdrop::after { opacity: 0; }
@media (max-width: 600px) {
  .scene-controls { left: 10px; bottom: 10px; max-width: calc(100% - 20px); }
  .scene-controls button { font-size: 9px; padding: 8px; }
  .scene-editor { top: auto; bottom: 84px; right: 10px; left: 10px; width: auto; max-height: 40svh; }
}

.scene-monochrome .scene-photo-ink img { filter:grayscale(1); }
.scene-back { position:fixed;top:14px;left:14px;z-index:15;color:var(--gold-light);background:#171612e8;padding:10px 14px;border-radius:5px;font-size:12px; }