.display-stage { position:relative; overflow:hidden; background:#000; touch-action:none; min-width:0; }
.display-frame { position:absolute; overflow:hidden; background:#000; }
.display-frame img { position:absolute; max-width:none; max-height:none; transform-origin:center; user-select:none; pointer-events:none; }
.display-overlays { position:absolute; inset:0; pointer-events:none; }
.display-workspace { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(18rem,1fr); gap:1rem; align-items:start; }
.display-preview { width:100%; aspect-ratio:16/9; border:1px solid var(--line); border-radius:.5rem; cursor:grab; }
.display-preview:active { cursor:grabbing; }
.display-controls { display:grid; gap:1rem; }
.display-controls .panel { margin:0; }
.display-controls .panel > label { margin-top:.8rem; }
.display-zoom-controls { display:grid; gap:.8rem; min-width:0; margin:1rem 0; padding:1rem; border:1px solid var(--line); border-radius:.5rem; }
.display-zoom-controls legend { padding:0 .4rem; color:var(--yellow); font-weight:800; }
.display-zoom-controls .muted { margin:0; }
.display-actions { display:flex; flex-wrap:wrap; gap:.5rem; margin:1rem 0; }
.display-readout { min-height:1.5rem; margin:.5rem 0; color:var(--cyan); }
.display-mode { padding:.65rem; border:1px solid var(--cyan); border-radius:.4rem; }
.display-mode.live-mode { color:var(--yellow); border-color:var(--yellow); }
.display-controls input[type=range] { padding:0; width:100%; }
.display-controls input[type=checkbox] { width:auto; }
body.tv-display { background:#000; color:#fff; margin:0; width:100vw; height:100vh; overflow:hidden; font-family:system-ui,sans-serif; }
.tv-display .display-stage { position:fixed; inset:0; }
.tv-controls { position:fixed; z-index:10; left:50%; bottom:1rem; transform:translateX(-50%); display:flex; gap:.5rem; padding:.5rem; background:#111e; border-radius:.5rem; }
.tv-controls :is(button, a:where(.route-link)),.tv-controls a { padding:.6rem 1rem; background:#222; color:#fff; border:1px solid #777; border-radius:.3rem; cursor:pointer; }
.tv-display:fullscreen .tv-controls { display:none; }
.tv-status { position:fixed; bottom:5rem; left:1rem; z-index:11; color:#ccc; background:#111; padding:.5rem; }
@media(max-width:950px){.display-workspace{grid-template-columns:1fr}}
@media(max-width:620px){.display-controls{grid-template-columns:1fr}}
