/* 样式独立于脚本，使本地与云端均无需放开内联脚本。 */
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; background: #000; overflow: hidden; color: #fff; font-family: system-ui, sans-serif; }
[hidden] { display: none !important; }
#screen, #video-canvas { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: contain; }
#overlay { position: fixed; inset: 0; z-index: 10; background: rgba(0,0,0,.9); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; overflow: auto; }
#overlay.hidden { opacity: 0; pointer-events: none; }
h1 { font-size: 20px; }
p { font-size: 14px; line-height: 1.6; }
#detail { color: #ccc; }
#fallback { max-width: 540px; }
#fallback label { display: block; margin: 12px 0; }
input, button { font: inherit; padding: 8px; }
button, a { cursor: pointer; }
a { display: block; color: #4fc3f7; margin: 12px 0; }
#local-url { display: block; width: 100%; margin: 8px 0; }
#stats { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; background: rgba(0,0,0,.78); color: #00ff66; font: 12px/1.5 monospace; padding: 6px 8px; white-space: pre-wrap; overflow-wrap: anywhere; pointer-events: none; }
#fs-btn { position: fixed; top: 12px; right: 12px; z-index: 30; border: 1px solid #555; border-radius: 6px; background: rgba(0,0,0,.55); color: #fff; }
