:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#11151c;--panel:#1d2330;--text:#f2f4f8;--muted:#a9b1c1;--accent:#fc3;--danger:#ff6b6b;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;overflow:hidden}#app{position:fixed;inset:0}#app canvas{width:100%;height:100%;display:block}[hidden]{display:none!important}.overlay{z-index:10;text-align:center;background:#0000008c;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:24px;display:flex;position:absolute;inset:0}.overlay h2{margin:0;font-size:32px}.hint{color:var(--muted);max-width:640px;margin:0;font-size:18px}.button{font:inherit;background:var(--accent);color:#111;cursor:pointer;border:0;border-radius:10px;padding:12px 28px;font-size:20px;font-weight:700}.button:disabled{opacity:.6;cursor:default}.button.secondary{color:var(--text);background:#3a4254}.crosshair{z-index:5;pointer-events:none;background:#fff;border-radius:50%;width:6px;height:6px;margin:-3px 0 0 -3px;position:absolute;top:50%;left:50%;box-shadow:0 0 0 2px #0009}.join{z-index:20;background:var(--panel);border-radius:16px;flex-direction:column;gap:16px;width:min(440px,100% - 32px);height:fit-content;margin:auto;padding:28px;display:flex;position:absolute;inset:0}.join h1{margin:0 0 4px;font-size:36px}.join label{color:var(--muted);flex-direction:column;gap:6px;font-size:18px;display:flex}.join input,.join select{font:inherit;color:var(--text);background:#0f131a;border:2px solid #3a4254;border-radius:8px;padding:10px 12px;font-size:20px}.join input:focus,.join select:focus{border-color:var(--accent);outline:none}.error{min-height:1.4em;color:var(--danger);margin:0;font-size:18px}.self-view{z-index:6;aspect-ratio:16/9;background:var(--panel);width:220px;color:var(--muted);pointer-events:none;border:2px solid #ffffff40;border-radius:10px;justify-content:center;align-items:center;display:flex;position:absolute;bottom:16px;left:16px;overflow:hidden}.self-view video{object-fit:contain;width:100%;height:100%;transform:scaleX(-1)}.video-sink{opacity:0;pointer-events:none;width:2px;height:2px;position:fixed;top:0;left:0;overflow:hidden}.video-sink video{width:2px;height:2px}.banner{z-index:7;color:#fff;text-align:center;background:#781e1ee6;border-radius:10px;max-width:calc(100% - 32px);padding:10px 18px;font-size:18px;position:absolute;top:16px;left:50%;transform:translate(-50%)}.join{max-height:calc(100% - 32px);overflow-y:auto}.preview-box{aspect-ratio:16/9;background:#0f131a;border-radius:10px;overflow:hidden}.preview{object-fit:contain;width:100%;height:100%;transform:scaleX(-1)}.menu-buttons{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.overlay .error{max-width:640px}.camera-retry{align-self:flex-start;padding:8px 18px;font-size:16px}