:root{color-scheme:light dark;--bg:#f1f5f8;--surface:#fff;--sunken:#e8eef3;--border:#dfe5ee;--text:#1f1f1f;--muted:#596571;--accent:#1d60fb;--on-accent:#fff;--soft:#edf3ff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}
@media(prefers-color-scheme:dark){:root{--bg:#07111f;--surface:#162b45;--sunken:#0b1a2e;--border:#2c4566;--text:#f1f5f8;--muted:#a9b6c8;--accent:#77eaa9;--on-accent:#07111f;--soft:#173669}}
*{box-sizing:border-box}body{margin:0;background:var(--bg)}main{max-width:1300px;margin:auto;padding:24px 32px 32px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.brand{font-size:13px;font-weight:750;letter-spacing:.04em}.mark{font-size:20px;color:var(--accent);vertical-align:middle;margin-right:8px}.status{font-size:12px;color:var(--muted)}.status:before{content:"";display:inline-block;width:7px;height:7px;background:var(--accent);border-radius:100%;margin-right:8px}h1{font-size:22px;letter-spacing:-.02em;margin:0 0 5px}.intro p{font-size:13px;color:var(--muted);margin:0 0 16px}.stage{display:grid;grid-template-columns:2fr 1fr;gap:12px;align-items:stretch}.video{position:relative;border:1px solid var(--border);background:var(--sunken);border-radius:12px;overflow:hidden}.remote{aspect-ratio:16/9;max-height:455px}.video video{width:100%;height:100%;object-fit:cover}.remote video:fullscreen{width:min(100vw,177.7778vh);height:min(100vh,56.25vw);object-fit:cover;margin:auto}.remote video::backdrop{background:#000}.local video{transform:scaleX(-1)}.placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;color:var(--muted);pointer-events:none}.placeholder span{font-size:30px;color:var(--accent)}.placeholder strong{color:var(--text);font-size:14px}.placeholder small{font-size:12px}.video-label{position:absolute;left:12px;bottom:12px;font-size:10px;font-weight:700;letter-spacing:.08em;background:#07111fcc;color:#fff;padding:6px 8px;border-radius:5px}.fullscreen{position:absolute;right:12px;bottom:10px;background:#07111fcc;color:white;border:0;border-radius:5px;font-size:23px;cursor:pointer}.controls{display:flex;flex-wrap:wrap;gap:12px;align-items:end;margin-top:16px}.device{flex:1;min-width:160px}label{display:block;margin-bottom:7px;font-size:10px;letter-spacing:.08em;font-weight:700;color:var(--muted)}select,input{width:100%;height:42px;border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:8px;padding:0 12px;font:inherit;font-size:13px}button{font:inherit}.buttons{display:flex;gap:8px}button.primary,button.secondary,#copy{height:42px;padding:0 18px;border-radius:8px;border:0;font-size:13px;font-weight:700;cursor:pointer}.primary,#copy{background:var(--accent);color:var(--on-accent)}.primary span{margin-left:10px}.secondary{background:var(--surface);border:1px solid var(--border)!important;color:var(--text)}.invite{margin-top:16px;padding:16px;border:1px solid var(--border);background:var(--surface);border-radius:10px;display:flex;gap:20px;align-items:center;justify-content:space-between}.invite[hidden],button[hidden],.placeholder[hidden],.error[hidden],.device[hidden],.controls[hidden]{display:none}.invite strong{font-size:14px}.invite p,.hint{font-size:12px;color:var(--muted);margin:6px 0 0}.hint{margin-top:14px}.copyrow{display:flex;gap:8px;flex:1;max-width:520px}.copyrow input{min-width:0;background:var(--sunken)}.error{color:#c93d42;font-size:13px;margin-top:16px}@media(max-width:700px){main{padding:20px 16px}header{margin-bottom:20px}.stage{grid-template-columns:1fr}.remote{height:auto;min-height:0}.local{height:32vw;min-height:140px}.device{min-width:40%}.buttons{width:100%}.buttons button{flex:1}.invite{align-items:stretch;flex-direction:column}.copyrow{max-width:none}}