.viewport-top{top:12px;left:12px;right:12px;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;z-index:3;pointer-events:none}
.viewport-top .camera-angle-control{pointer-events:auto;flex:0 1 auto;min-width:0;max-width:220px;background:#15201be8;height:34px;box-shadow:0 2px 8px #0003}
.viewport-top .camera-angle-control select{min-width:0;width:165px;max-width:100%;height:32px;outline-offset:2px}
#viewportQuality{pointer-events:auto;display:inline-flex;flex:0 0 auto;gap:0;padding:2px;border:1px solid #506057;border-radius:6px;background:#15201be8;box-shadow:0 2px 8px #0003}
#viewportQuality button{display:grid;place-items:center;width:29px;height:28px;min-height:28px;padding:3px;border:0;border-radius:4px;color:#afbeb6;background:transparent;cursor:pointer}
#viewportQuality button svg{display:block;width:21px;height:21px;pointer-events:none}
#viewportQuality button:hover{color:#f0fff6;background:#3a4b42}#viewportQuality button.active-source{color:#effff9;background:#4d7462}
#viewportQuality button:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
.statusbar{align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px 16px}.statusbar #fps{font:10px monospace;white-space:nowrap;color:#a4b9ae}.statusbar #saveStatus{margin-left:auto}
@media(max-width:580px){.viewport-top{gap:6px;left:8px;right:8px}.viewport-top .camera-angle-control{max-width:175px;padding-left:8px}.viewport-top .camera-angle-control select{width:130px}#viewportQuality button{width:25px;height:28px}}
