*{box-sizing:border-box;margin:0;padding:0}html,body{color:#e2e8f0;background-color:#0f172a;max-width:100vw;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;color:#fff;background-color:#2563eb;border:none;border-radius:6px;padding:.6rem 1.2rem;font-size:.95rem;transition:background-color .2s}button:hover{background-color:#1d4ed8}button:disabled{cursor:not-allowed;background-color:#475569}input{color:#e2e8f0;background-color:#1e293b;border:1px solid #334155;border-radius:6px;padding:.6rem;font-size:.95rem}input:focus{border-color:#2563eb;outline:none}.card{background-color:#1e293b;border:1px solid #334155;border-radius:8px;padding:1.5rem}.container{max-width:960px;margin:0 auto;padding:2rem 1rem}.error{color:#ef4444;margin-top:.5rem}.stream-viewer-shell{position:relative}.stream-stats-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;margin-top:.75rem;display:grid}.stream-surface video,.stream-surface canvas{cursor:crosshair;-webkit-user-select:none;user-select:none;touch-action:none;object-fit:contain;max-width:100%;max-height:70vh}.stream-viewer-shell:fullscreen{background:#080d18;width:100vw;height:100vh;overflow:hidden}.stream-viewer-shell:fullscreen .stream-viewer-header,.stream-viewer-shell:fullscreen .stream-viewer-error,.stream-viewer-shell:fullscreen>#stream-stats-panel,.stream-viewer-shell:fullscreen .stream-viewer-help{display:none}.stream-viewer-shell:fullscreen .stream-surface{background:#080d18;border:0;border-radius:0;width:100%;height:100%;min-height:100%;padding:0}.stream-viewer-shell:fullscreen .stream-surface video,.stream-viewer-shell:fullscreen .stream-surface canvas{max-width:100%;max-height:100%}.fullscreen-drawer-backdrop{z-index:20;background:#0000002e;position:absolute;inset:0}.fullscreen-edge-handle{z-index:22;background:#0f172ad1;border:1px solid #ffffff47;border-right:0;border-radius:8px 0 0 8px;width:34px;height:52px;padding:0;font-size:1.6rem;transition:background-color .18s;position:absolute;top:50%;right:0;transform:translateY(-50%);box-shadow:0 2px 12px #00000059}.fullscreen-edge-handle.open{transform:translate(calc(0px - min(320px,90vw)))translateY(-50%)}.fullscreen-control-drawer{z-index:23;visibility:hidden;background:#0f172af7;border-left:1px solid #334155;width:min(320px,90vw);padding:1.25rem;transition:transform .18s,visibility 0s linear .18s;position:absolute;inset:0 0 0 auto;overflow-y:auto;transform:translate(100%);box-shadow:-8px 0 24px #00000059}.fullscreen-control-drawer.open{visibility:visible;transition:transform .18s;transform:translate(0)}.fullscreen-control-drawer h2{margin-bottom:1.25rem}.fullscreen-control-drawer>button{width:100%;margin-top:1rem}.fullscreen-status{color:#cbd5e1;gap:.35rem;margin-bottom:1.25rem;display:grid}.fullscreen-status small,.fullscreen-controls-label{color:#94a3b8;letter-spacing:.08em;font-size:.7rem;font-weight:700}.fullscreen-status strong{color:#f8fafc;font-size:1.25rem}.fullscreen-status strong.connected{color:#22c55e;font-size:.95rem}.fullscreen-status strong.disconnected{color:#ef4444;font-size:.95rem}.fullscreen-control-drawer>.fullscreen-disconnect{background:#dc2626}.fullscreen-control-drawer>.fullscreen-disconnect:hover{background:#b91c1c}.fullscreen-stream-stats{margin-top:1rem;font-size:.8rem}.fullscreen-stream-stats .stream-stats-grid{grid-template-columns:1fr}