*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#111;background:#f5f5f0;font-family:monospace}.page{z-index:1;max-width:480px;padding:2rem;position:relative}h1{letter-spacing:.05em;margin-bottom:1.5rem;font-size:1.5rem;font-weight:400}h1 a{color:inherit;text-decoration:none}h1 a:hover{text-decoration:underline}p{color:#555;margin-bottom:.75rem}input{background:#fff;border:1px solid #ccc;width:100%;margin-bottom:.5rem;padding:.4rem .6rem;font-family:monospace;font-size:1.1rem}input:focus{outline-offset:-1px;outline:2px solid #111}button{color:#fff;cursor:pointer;background:#111;border:none;margin-right:.5rem;padding:.4rem 1rem;font-family:monospace;font-size:1rem}button:hover{background:#333}button:disabled{opacity:.4;cursor:default}button.secondary{color:#111;background:0 0;border:1px solid #ccc}button.secondary:hover{background:#eee}.status{color:#888;margin-bottom:1rem;font-size:.8rem}.actions{gap:.5rem;margin-top:1rem;display:flex}.error{color:#c00;margin-top:.5rem;font-size:.9rem}.user-label{align-items:baseline;gap:.2em;display:inline-flex;position:relative}.signout-btn{color:#999;cursor:pointer;opacity:0;background:0 0;border:none;margin:0;padding:0;font-family:monospace;font-size:.85em;line-height:1;transition:opacity .15s}.user-label:hover .signout-btn,.signout-btn:focus{opacity:1}.signout-btn:hover{color:#c00;background:0 0}.stream-panel{margin:1.5rem 0}.stream-panel--idle .stream-sources{flex-wrap:wrap;gap:.5rem;display:flex}.stream-status{color:#555;align-items:center;gap:.75rem;margin-bottom:.75rem;font-size:.9rem;display:flex}.stream-indicator{color:#c00;font-size:.7rem;animation:1.4s step-start infinite blink}@keyframes blink{50%{opacity:0}}.stream-stop-btn{margin-left:auto}.local-preview{border:1px solid #ccc;width:120px;display:block}.stream-panel--viewing{z-index:0;background:#000;margin:0;position:fixed;inset:0}.remote-video{object-fit:cover;width:100%;height:100%;display:block}.stream-viewer-controls{opacity:0;transition:opacity .2s;position:absolute;bottom:.75rem;right:.75rem}.stream-panel--viewing:hover .stream-viewer-controls{opacity:1}.fullscreen-btn{color:#fff;cursor:pointer;background:#00000080;border:1px solid #ffffff4d;padding:.3rem .6rem;font-size:1.1rem}.fullscreen-btn:hover{background:#000000b3}.stream-waiting{color:#555;justify-content:center;align-items:center;font-size:.9rem;display:flex;position:absolute;inset:0}@media (prefers-color-scheme:dark){body{color:#d4d4d4;background:#1e1e1e}p{color:#9d9d9d}input{color:#d4d4d4;background:#3c3c3c;border-color:#3c3c3c}input:focus{outline-color:#007fd4}button{color:#fff;background:#0e639c}button:hover{background:#17b}button.secondary{color:#d4d4d4;background:0 0;border-color:#454545}button.secondary:hover{background:#2a2d2e}.status{color:#6a9955}.error{color:#f14c4c}.stream-status{color:#9d9d9d}.stream-indicator{color:#f14c4c}.local-preview{border-color:#3c3c3c}}