:root{--bg:#f7f2ea;--fg:#1f2a30;--muted:#5d6a70;--line:#e3d9cb;--accent:#2f6f73;--label-bg:#1f2a30;--label-fg:#fff;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#12181b;--fg:#e9eef0;--muted:#a3b0b5;--line:#26313a;--accent:#7cc4c4;--label-bg:#fff;--label-fg:#1f2a30;color-scheme:dark}}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);height:100dvh;color:var(--fg);grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1fr);font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,Noto Sans Arabic,Noto Sans Hebrew,sans-serif;display:grid}.bar{padding:10px max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left));border-bottom:1px solid var(--line);align-items:center;gap:12px;display:flex}.brand{letter-spacing:.02em;color:var(--accent);font-weight:700}.scene-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;margin:0;font-size:1.05rem;font-weight:600;overflow:hidden}.scene-picker{max-width:100%;font:inherit;color:var(--fg);background:var(--bg);text-overflow:ellipsis;cursor:pointer;border:1px solid #0000;border-radius:8px;margin-inline-start:-7px;padding:4px 6px}.scene-picker:hover{border-color:var(--line)}.scene-picker:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.styles{gap:6px;display:flex}.style{cursor:pointer;opacity:.65;background:0 0;border:2px solid #0000;border-radius:7px;padding:0;line-height:0}.style img{object-fit:cover;border-radius:5px;width:48px;height:32px}.style.on{border-color:var(--accent);opacity:1}.style:hover{opacity:1}.style:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.picker{font:inherit;border:1px solid var(--line);background:var(--bg);color:var(--fg);border-radius:8px;padding:6px 10px;font-size:1rem}@media (width<=600px){.bar{flex-wrap:wrap;row-gap:8px}.scene-name{flex:calc(100% - 64px)}.picker{margin-inline-start:auto}}.main{min-height:0;display:grid}.viewport{place-items:center;min-height:0;display:grid;overflow:hidden;container-type:size}.stage{aspect-ratio:var(--w) / var(--h);width:min(100cqw, 100cqh * var(--w) / var(--h));-webkit-user-select:none;user-select:none;position:relative}@media (orientation:portrait) and (width<=600px){.viewport{-webkit-overflow-scrolling:touch;place-items:center start;overflow:auto hidden}.stage{width:auto;height:100cqh}}.stage>img,.stage>svg{width:100%;height:100%;position:absolute;inset:0}.stage>img{object-fit:contain;pointer-events:none;-webkit-touch-callout:none}.region{fill:#0000;pointer-events:fill;fill-rule:evenodd;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none}.region:focus-visible{stroke:var(--accent);stroke-width:4px;vector-effect:non-scaling-stroke}.dim,.outline{pointer-events:none;opacity:0;transition:opacity .15s .15s}.dim.on,.outline.on{opacity:1;transition-delay:0s}.dim{fill:#141c2061;fill-rule:evenodd}.outline{fill:none;fill-rule:evenodd;stroke:#fff;stroke-width:3px;stroke-linejoin:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 2px #000000b3)}.label{background:var(--label-bg);color:var(--label-fg);white-space:nowrap;pointer-events:none;opacity:0;border-radius:10px;padding:6px 14px;font-size:clamp(1.1rem,3.5vmin,2rem);font-weight:600;line-height:1.3;transition:opacity .15s .15s;position:absolute;transform:translate(-50%,calc(-100% - 10px));box-shadow:0 4px 14px #00000040}.label.on{opacity:1;transition-delay:0s}.label[data-edge=below]{transform:translate(-50%,10px)}.label[data-edge=start]{transform:translate(10px,-50%)}.label[data-edge=end]{transform:translate(calc(-100% - 10px),-50%)}@media (prefers-reduced-motion:reduce){.dim,.outline,.label{transition:none}}