:root{color-scheme:dark}*{box-sizing:border-box}body,html{margin:0;padding:0;width:100%;min-height:100%;height:100%;background:#000;color:#fff;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,sans-serif}main{background:#000}.frame-page,.frame-shell,main{position:relative;width:100%;min-height:100dvh;height:100dvh;overflow:hidden}.frame-shell{background:#000}.stream-stage{position:absolute;left:50%;top:50%;width:94%;height:94%;transform:translate(-50%,-50%);overflow:hidden}.stream{width:100%;height:100%;object-fit:cover;background:#000}.overlay,.stream{position:absolute;left:0;top:0}.overlay{z-index:2;padding:10px 12px;font-size:12px;line-height:1.5;text-shadow:0 1px 4px rgba(0,0,0,.9);color:#fff;max-width:min(92vw,340px)}.status-dot{display:inline-block;width:8px;height:8px;border-radius:999px;margin-right:6px}.status-live{background:#16a34a}.status-offline{background:#ef4444}.overlay-key{color:#fff}.overlay-value,.overlay-value-green{color:#34d399}.overlay-value-red{color:#f87171}.compass{position:absolute;left:12px;bottom:10px;z-index:2;width:76px;height:76px;text-shadow:0 1px 4px rgba(0,0,0,.95),0 0 14px rgba(0,0,0,.55)}.compass-cross-v{left:50%;top:22%;bottom:22%;width:2px;transform:translateX(-50%)}.compass-cross-h,.compass-cross-v{position:absolute;background:hsla(0,0%,100%,.95)}.compass-cross-h{top:50%;left:22%;right:22%;height:2px;transform:translateY(-50%)}.compass-letter{position:absolute;color:hsla(0,0%,100%,.95);font-weight:700;font-size:14px;line-height:1}.compass-n{left:50%;top:0;transform:translateX(-50%)}.compass-e{left:0}.compass-e,.compass-w{top:50%;transform:translateY(-50%)}.compass-w{right:0}.compass-s{left:50%;bottom:0;transform:translateX(-50%)}@media (orientation:landscape){.stream-stage{top:0;height:100%;transform:translateX(-50%)}}@media (orientation:portrait){.stream-stage{position:fixed;left:0;top:0;right:0;bottom:0;width:100%;height:100%;max-width:100vw;max-height:100dvh;transform:none;z-index:1}.stream{left:50%;top:50%;width:100dvh;height:100dvw;max-width:100dvh;max-height:100dvw;transform:translate(-50%,-50%) rotate(90deg);transform-origin:center center;object-fit:cover}.overlay{left:0;right:auto;text-align:left}.compass{left:12px;right:auto}.compass-n{left:0;top:50%;transform:translateY(-50%)}.compass-e,.compass-n{right:auto;bottom:auto}.compass-e{top:0}.compass-e,.compass-w{left:50%;transform:translateX(-50%)}.compass-w{top:auto;right:auto;bottom:0}.compass-s{right:0;top:50%;left:auto;bottom:auto;transform:translateY(-50%)}}