:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0d1117;--line:#262d38;--border:1px solid var(--line);--text:#e6edf3;--muted:#8b949e;--ok:#4ade80;--warn:#fbbf24;--bad:#f87171;--overlay-inset:16px;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{height:100%}body{background:radial-gradient(circle at 20% 0%, #142033 0%, var(--bg) 55%);min-height:100vh;color:var(--text);grid-template-rows:minmax(0,1fr) auto;margin:0;display:grid}.bar{border-bottom:var(--border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0a0f16d9;flex-wrap:wrap;align-items:center;gap:16px;padding:12px 20px;display:flex}button{border:var(--border);color:var(--text);font:inherit;cursor:pointer;background:#1b2330;border-radius:8px;padding:8px 16px;font-size:14px}button:hover{background:#222c3b;border-color:#3a4554}button:disabled{opacity:.6;cursor:default}.status{z-index:1;border:var(--border);color:var(--muted);white-space:nowrap;background:#0a0f16d9;border-radius:999px;padding:6px 12px;font-size:13px;position:absolute;top:12px;right:12px}.status.connected{color:var(--ok);background:#4ade8014;border-color:#4ade8059}.status.connecting{color:var(--warn);background:#fbbf2414;border-color:#fbbf2459}.status.error{color:var(--bad);background:#f8717114;border-color:#f8717159}.stage{background:#05080d;justify-content:center;align-items:center;min-height:0;display:flex;position:relative;overflow:hidden}.remote{object-fit:contain;background:#000;width:100%;height:100%}.sharing #remote{top:var(--overlay-inset);left:var(--overlay-inset);z-index:1;aspect-ratio:4/3;object-fit:cover;border:1px solid #ffffff1f;border-radius:12px;width:clamp(150px,22vw,280px);height:auto;position:absolute;box-shadow:0 10px 30px #00000073}.tile{right:var(--overlay-inset);bottom:var(--overlay-inset);aspect-ratio:4/3;background:#0b1017;border:1px solid #ffffff1f;border-radius:12px;width:clamp(150px,22vw,280px);position:absolute;overflow:hidden;box-shadow:0 10px 30px #00000073}.tile video{object-fit:cover;width:100%;height:100%;display:block}.tile.off video{visibility:hidden}.tile-label{color:var(--muted);justify-content:center;align-items:center;font-size:12px;display:flex;position:absolute;inset:0}.remote[hidden],.tile-label[hidden],.notice[hidden]{display:none}.controls{border-top:var(--border);border-bottom:none;justify-content:flex-start}.toggle.active{color:#cfe6ff;background:#4aa8ff24;border-color:#4aa8ff80}.toggle[aria-pressed=false]{color:var(--muted)}.hint{color:var(--muted);margin-left:auto;font-size:12px}.notice{color:#ffe1a8;background:#2a1d10;border:1px solid #fbbf2473;border-radius:10px;max-width:min(560px,100vw - 32px);padding:10px 16px;font-size:13px;position:fixed;bottom:76px;left:50%;transform:translate(-50%);box-shadow:0 12px 30px #00000080}@media (width<=720px){.bar{gap:10px;padding:10px 12px}.tile{width:clamp(110px,34vw,180px);bottom:10px;right:10px}.hint{display:none}}