.piano-keyboard{background:var(--panel);min-width:0}.piano-keyboard--hidden{display:none}.piano-keyboard__bottom{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:.4rem;padding:.35rem 0 .5rem;display:grid}.piano-keyboard__zoom{grid-column:1;justify-self:start;align-items:center;gap:.25rem;display:flex}.piano-keyboard__trailing{grid-column:3;justify-self:end}.piano-keyboard__trailing:empty{display:none}.piano-keyboard .piano-keyboard__zoom-btn{justify-content:center;align-items:center;height:2rem;padding:.25rem .5rem;font-size:1rem;line-height:1;display:inline-flex}.piano-keyboard__zoom-btn svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.piano-keyboard__zoom-btn--out svg{width:14px;height:14px}.piano-keyboard__zoom-btn--in svg{width:21px;height:21px}.piano-keyboard__zoom-btn:disabled{opacity:.4;cursor:default}.piano-keyboard__pan-scroll{appearance:none;cursor:pointer;background:0 0;width:100%;height:.85rem;margin:0;display:block;position:absolute;bottom:0;left:0}.piano-keyboard__pan-scroll[hidden]{display:none}.piano-keyboard__pan-scroll::-webkit-slider-runnable-track{background:color-mix(in srgb, var(--accent) 18%, var(--panel));border-radius:6px;height:12px}.piano-keyboard__pan-scroll::-moz-range-track{background:color-mix(in srgb, var(--accent) 18%, var(--panel));border-radius:6px;height:12px}.piano-keyboard__pan-scroll::-webkit-slider-thumb{appearance:none;width:var(--pan-thumb-width);background:var(--accent);border-radius:6px;height:12px}.piano-keyboard__pan-scroll::-moz-range-thumb{width:var(--pan-thumb-width);background:var(--accent);border:0;border-radius:6px;height:12px}.piano-keyboard__pan-scroll:disabled{cursor:default}.piano-keyboard__stage{padding-bottom:1.1rem;position:relative}.piano-keyboard__canvas{touch-action:none;cursor:pointer;width:100%;max-width:100%;display:block}.piano-keyboard__middle-c-hint{z-index:1;color:var(--warning);pointer-events:none;font-size:.65rem;line-height:1;position:absolute;bottom:.2rem;transform:translate(-50%)}.piano-keyboard__pedals{grid-column:2;justify-content:center;gap:clamp(.25rem,3vw,3rem);display:flex}.piano-keyboard__pedal{min-width:5.5rem;min-height:2.5rem;color:var(--text);cursor:pointer;touch-action:none;background:linear-gradient(#b2b4ba,#646770);border:2px solid #42454e;border-radius:.4rem .4rem 1.2rem 1.2rem;padding:.3rem .75rem;box-shadow:0 4px #303239}.piano-keyboard__pedal--local{background:linear-gradient(#93c5fd,#3b82f6)}.piano-keyboard__pedal--remote{border-color:#f97316;box-shadow:0 4px #9a3412}.piano-keyboard__pedal--local.piano-keyboard__pedal--remote{background:linear-gradient(90deg,#3b82f6 50%,#f97316 50%)}.piano-keyboard__pedal[aria-pressed=true]{transform:translateY(3px);box-shadow:0 1px #303239}@media (width<=500px){.piano-keyboard__bottom{gap:.25rem}.piano-keyboard__zoom{gap:.125rem}.piano-keyboard .piano-keyboard__zoom-btn{height:1.65rem;padding:.1rem;font-size:.75rem}.piano-keyboard__zoom-btn--out svg{width:12px;height:12px}.piano-keyboard__zoom-btn--in svg{width:17px;height:17px}.piano-keyboard__pedal{white-space:nowrap;min-width:0;min-height:2rem;padding:.2rem;font-size:.625rem}}@media (width<=365px){.piano-keyboard__zoom{grid-area:1/1/auto/-1}.piano-keyboard__pedals,.piano-keyboard__trailing{grid-row:2}}@media (width<=395px){.piano-keyboard:lang(ru) .piano-keyboard__zoom{grid-area:1/1/auto/-1}.piano-keyboard:lang(ru) .piano-keyboard__pedals,.piano-keyboard:lang(ru) .piano-keyboard__trailing{grid-row:2}}:root{--bg:#f6f7fb;--panel:#fff;--text:#1d2430;--muted:#5f6877;--accent:#3b82f6;--danger:#ef4444;--warning:#f59e0b;--border:#d5dae3;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root:not([data-theme]){--bg:#111318;--panel:#1b1e26;--text:#eef0f4;--muted:#9aa0ac;--border:#2c303a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#111318;--panel:#1b1e26;--text:#eef0f4;--muted:#9aa0ac;--border:#2c303a;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}body{background:var(--bg);min-height:100vh;color:var(--text);margin:0}#app{max-width:960px;margin:0 auto;padding:1.5rem}#app:has(.call-screen){max-width:1600px}body:has(.call-screen:not(.call-screen--demo)){height:100dvh;overflow:hidden}#app:has(.call-screen:not(.call-screen--demo)){height:100dvh;padding:max(.5rem, env(safe-area-inset-top)) max(.5rem, env(safe-area-inset-right)) max(.5rem, env(safe-area-inset-bottom)) max(.5rem, env(safe-area-inset-left))}.call-screen:not(.call-screen--demo){flex-direction:column;height:100%;min-height:0;display:flex}h1{margin:0 0 .5rem;font-size:1.5rem}.btn{background:var(--panel);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:.5rem 1rem;font-size:1rem}.btn:hover{border-color:var(--accent)}.btn--active{border-color:var(--warning);color:var(--warning)}.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn--danger{border-color:var(--danger);color:var(--danger)}.btn--danger:hover{background:#ef444426}.btn:disabled{opacity:.4;cursor:default;border-color:var(--border);color:var(--muted)}.banner{border-radius:6px;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.banner--warning{border:1px solid var(--warning);color:var(--warning);background:#f59e0b26}.banner--error{border:1px solid var(--danger);color:var(--danger);background:#ef444426}.banner--error .btn{margin-top:.75rem;display:block}.room-screen{text-align:center;max-width:480px;margin:4rem auto;position:relative}.room-screen--host{max-width:960px}.room-screen__role-switch{border:1px solid var(--border);background:var(--panel);border-radius:8px;max-width:480px;margin:1rem auto;padding:4px;display:flex}.room-screen__role-switch button{color:var(--text);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:6px;flex:1;padding:.6rem}.room-screen__role-switch button[aria-pressed=true]{background:var(--accent);color:#fff}.room-screen__role-switch button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.room-screen__host-form,.room-screen__browser-data{max-width:480px;margin-left:auto;margin-right:auto}.room-screen__subtitle{color:var(--muted);margin-bottom:1.5rem}.demo-screen{grid-template-columns:minmax(0,1fr);display:grid}.demo-screen__controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin-top:1rem;display:flex}.demo-screen__controls a{text-decoration:none}.demo-screen__progress{color:#475569;font-size:.85rem}.room-screen__account{color:var(--accent);margin:.25rem 0 1rem;display:inline-block}.room-screen__footer{border-top:1px solid var(--border);gap:1rem;margin-top:2rem;padding-top:1.25rem;font-size:.85rem;display:grid}.room-screen__preferences,.room-screen__links{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem 1.25rem;display:flex}.room-screen__links a{color:var(--accent)}.room-screen__analytics{color:var(--accent);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.room-screen__browser-data{border:1px solid var(--border);text-align:left;color:var(--muted);border-radius:8px;margin-top:1.5rem;padding:.75rem 1rem;font-size:.85rem}.room-screen__browser-data summary{cursor:pointer;color:var(--text)}.room-screen__browser-data p{margin:.75rem 0}.room-screen__form{flex-wrap:wrap;gap:.5rem;margin-top:1rem;display:flex}.room-screen__form input,.room-screen__host-form input,.session-timer__settings input{border:1px solid var(--border);background:var(--panel);min-width:0;color:var(--text);border-radius:6px;flex:1;padding:.5rem .75rem;font-size:1rem}.room-screen__host-form input[type=number]{text-align:right}.room-screen__host-form{border:1px solid var(--border);background:var(--panel);text-align:left;border-radius:8px;gap:1rem;padding:1.25rem;display:grid}.room-screen__hint{color:var(--muted);margin:0;font-size:.85rem}.room-screen__invite-name{overflow-wrap:anywhere;font-size:1.2rem}.room-screen__sessions{text-align:left;margin-top:1.5rem}.room-screen__sessions h2{margin:0 0 .25rem;font-size:1.1rem}.hosted-sessions{text-align:left;gap:.5rem;margin:.75rem 0 0;padding:0;list-style:none;display:grid}.hosted-session{border:1px solid var(--border);background:var(--panel);border-radius:8px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex}.hosted-session--prominent{border-color:var(--accent)}.hosted-session__info{flex:12rem;gap:.15rem;min-width:0;display:grid}.hosted-session__name{overflow-wrap:anywhere;font-weight:600}.hosted-session__meta{color:var(--muted);font-size:.8rem}.hosted-session__actions{flex-wrap:wrap;gap:.4rem;display:flex}.hosted-sessions-table-wrap{border:1px solid var(--border);border-radius:8px;margin-top:.75rem;overflow-x:auto}.hosted-sessions-table{border-collapse:collapse;text-align:left;width:100%}.hosted-sessions-table th,.hosted-sessions-table td{border-bottom:1px solid var(--border);vertical-align:middle;padding:.55rem .75rem}.hosted-sessions-table tbody tr:last-child th,.hosted-sessions-table tbody tr:last-child td{border-bottom:0}.hosted-sessions-table thead{background:var(--panel);color:var(--muted);font-size:.85rem}.hosted-sessions-table tbody th{overflow-wrap:anywhere;min-width:8rem;font-weight:600}.hosted-sessions-table tbody td:nth-child(2),.hosted-sessions-table tbody td:nth-child(3),.hosted-sessions-table tbody td:nth-child(4){white-space:nowrap}.hosted-session__room-link{align-items:center;gap:.4rem;display:flex}.hosted-session__room-link a{color:var(--accent)}.hosted-sessions-table .hosted-session__actions{flex-wrap:nowrap}.hosted-sessions-table .btn{white-space:nowrap;padding:.4rem .65rem;font-size:.85rem}@media (width<=700px){.hosted-sessions-table-wrap{border:0;overflow:visible}.hosted-sessions-table,.hosted-sessions-table tbody,.hosted-sessions-table tr{display:block}.hosted-sessions-table thead{display:none}.hosted-sessions-table tr{border:1px solid var(--border);background:var(--panel);border-radius:8px;margin-bottom:.75rem}.hosted-sessions-table th,.hosted-sessions-table td{justify-content:space-between;gap:.75rem;min-width:0;padding:.4rem .75rem;display:flex;white-space:normal!important}.hosted-sessions-table th:before,.hosted-sessions-table td:before{content:attr(data-label);color:var(--muted);flex:0 0 6rem;font-size:.85rem;font-weight:400}.hosted-sessions-table tbody tr:last-child th,.hosted-sessions-table tbody tr:last-child td{border-bottom:1px solid var(--border)}.hosted-sessions-table tr td:last-child{border-bottom:0!important}.hosted-sessions-table .hosted-session__actions{flex-wrap:wrap;justify-content:flex-end}.hosted-sessions-table .btn{white-space:normal}}.session-timer__button--overtime{color:var(--warning)}.session-timer__controls{width:100%}.session-timer__target-row{align-items:end;gap:.5rem;display:flex}.session-timer__target-row .settings__field{flex:1;min-width:0}.session-timer__settings input{box-sizing:border-box;text-align:right;width:100%}.room-bar{background:var(--panel);border:1px solid var(--border);border-radius:6px;flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:.75rem;padding:.5rem .75rem;display:flex}.beta-label{border:1px solid var(--border);color:var(--muted);text-transform:uppercase;border-radius:999px;flex:none;padding:.15rem .4rem;font-size:.65rem}.room-screen>.beta-label{position:absolute;top:0;right:0}.status-bar{gap:.75rem;margin-bottom:1rem;display:grid}.status-bar__actions{flex-wrap:wrap;gap:.5rem;display:flex}.status-bar__text{color:var(--muted);font-size:.9rem}.status-bar[data-status=connected] .status-bar__text{color:#22c55e}.status-bar[data-status=failed] .status-bar__text{color:var(--danger)}.video-panel{background:var(--panel);border:1px solid var(--border);border-radius:8px 8px 0 0;flex-direction:column;display:flex;overflow:hidden;container-type:inline-size}.video-panel__stage{background:#000;width:100%;height:min(56.25cqw,65dvh);min-height:0;position:relative;overflow:hidden}.video-panel__cameras{width:100%;min-width:0;height:100%;min-height:0;position:relative;overflow:hidden}.video-panel__participant{gap:2px;min-width:0;height:100%;min-height:0}.video-panel__camera{background:#000;min-width:0;min-height:0;position:relative;overflow:hidden}.video-panel__video{object-fit:cover;background:#000;width:100%;height:100%;display:block;position:absolute;inset:0}.video-panel:not(.video-panel--pip) .video-panel__camera--full .video-panel__video,.video-panel--demo.video-panel--pip .video-panel__camera--full .video-panel__video{object-fit:contain}.video-panel__participant--local .video-panel__video{transform:scaleX(-1)}.video-panel__camera-controls{z-index:2;visibility:hidden;opacity:0;pointer-events:none;position:absolute;top:.4rem;right:.4rem}.video-panel__fit-button{color:#fff;cursor:pointer;background:#000c;border:1px solid #fffc;border-radius:6px;place-items:center;min-width:44px;min-height:44px;padding:.2rem;font:1.5rem/1 sans-serif;display:grid}.video-panel__fit-button:hover,.video-panel__fit-button:focus-visible{background:var(--accent);outline:2px solid #fff}.video-panel__camera:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.video-panel:not(.video-panel--pip) .video-panel__camera--controls-open .video-panel__camera-controls,.video-panel:not(.video-panel--pip) .video-panel__camera:focus-visible .video-panel__camera-controls{visibility:visible;opacity:1;pointer-events:auto}.video-panel:not(.video-panel--pip) .video-panel__camera:has(.video-panel__fit-button:focus-visible) .video-panel__camera-controls{visibility:visible;opacity:1;pointer-events:auto}.video-panel--demo.video-panel--pip .video-panel__camera--controls-open .video-panel__camera-controls,.video-panel--demo.video-panel--pip .video-panel__camera:focus-visible .video-panel__camera-controls{visibility:visible;opacity:1;pointer-events:auto}.video-panel--demo.video-panel--pip .video-panel__camera:has(.video-panel__fit-button:focus-visible) .video-panel__camera-controls{visibility:visible;opacity:1;pointer-events:auto}.video-panel__camera-label{z-index:1;color:#fff;text-overflow:ellipsis;white-space:nowrap;background:#000000a6;border-radius:3px;max-width:calc(100% - .7rem);padding:.15rem .3rem;font-size:.7rem;position:absolute;bottom:.3rem;left:.35rem;overflow:hidden}.video-panel__empty{color:#fff;background:#171923;place-items:center;height:100%;min-height:0;display:grid}.video-panel--demo .video-panel__participant--remote{background-color:#3c4552;place-items:center;min-height:0;padding:1rem;display:grid;position:relative;overflow:hidden}.video-panel__demo-background{object-fit:cover;filter:blur(24px)brightness(.65);pointer-events:none;width:100%;height:100%;position:absolute;inset:0;transform:scale(1.12)}.video-panel__demo-card{color:#1d2430;text-align:center;background:#f7f9fbf2;border-radius:12px;width:min(100%,560px);max-height:100%;padding:clamp(1rem,3vw,2rem);position:relative;overflow-y:auto;box-shadow:0 10px 35px #00000038}.video-panel__demo-card h1{margin:0 0 .65rem;padding-inline:3rem;font-size:clamp(1.1rem,3vw,1.6rem)}.video-panel__demo-card p{margin:0;line-height:1.5}.video-panel__demo-exit{color:#1d2430;cursor:pointer;background:0 0;border:0;border-radius:6px;width:44px;height:44px;padding:0;font:2rem/1 system-ui;position:absolute;top:.35rem;right:.35rem}.video-panel__demo-exit:hover,.video-panel__demo-exit:focus-visible{background:#dce5e9;outline:2px solid #1d2430}.video-panel__resume-camera,.video-panel__resume-video{z-index:3;max-width:calc(100% - 1rem);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.video-panel__resume-camera[hidden],.video-panel__resume-video[hidden]{display:none}.video-panel--demo.video-panel--pip .video-panel__participant--remote{padding-right:27%}.video-panel--demo.video-panel--pip:has(.video-panel__participant--pip-left) .video-panel__participant--remote{padding-left:27%;padding-right:1rem}.video-panel--demo.video-panel--pip .video-panel__participant--local{background:#171923}.video-panel--pip .video-panel__participant--remote{width:100%}.video-panel--pip .video-panel__participant--local{z-index:1;aspect-ratio:16/9;border:2px solid var(--border);border-radius:6px;width:25%;max-width:280px;height:auto;position:absolute;bottom:.75rem;right:.75rem;overflow:hidden}.video-panel--pip:not(.video-panel--solo) .video-panel__participant--local{cursor:pointer}.video-panel--pip:not(.video-panel--solo) .video-panel__participant--local:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.video-panel--pip .video-panel__participant--pip-top{top:.75rem;bottom:auto}.video-panel--pip .video-panel__participant--pip-left{left:.75rem;right:auto}.video-panel__pip-arrow{z-index:3;color:#fff;cursor:pointer;visibility:hidden;opacity:0;pointer-events:none;background:#000c;border:1px solid #fffc;border-radius:50%;place-items:center;width:2rem;height:2rem;padding:0;font:700 1.3rem/1 sans-serif;display:grid;position:absolute}.video-panel__pip-arrow--vertical{top:.25rem;left:50%;transform:translate(-50%)}.video-panel__participant--pip-top .video-panel__pip-arrow--vertical{top:auto;bottom:.25rem}.video-panel__pip-arrow--horizontal{top:50%;left:.25rem;transform:translateY(-50%)}.video-panel__participant--pip-left .video-panel__pip-arrow--horizontal{left:auto;right:.25rem}.video-panel--pip:not(.video-panel--solo) .video-panel__participant--pip-open .video-panel__pip-arrow,.video-panel--pip:not(.video-panel--solo) .video-panel__participant--local:not(.video-panel__participant--pip-dismissed):focus-within .video-panel__pip-arrow{visibility:visible;opacity:1;pointer-events:auto}@media (hover:hover){.video-panel--pip:not(.video-panel--solo) .video-panel__participant--local:not(.video-panel__participant--pip-dismissed):hover .video-panel__pip-arrow{visibility:visible;opacity:1;pointer-events:auto}}.video-panel__pip-arrow:hover,.video-panel__pip-arrow:focus-visible{background:var(--accent);outline:2px solid #fff}.video-panel--sharing.video-panel--pip .video-panel__participant--local{width:40%}.video-panel--side-by-side .video-panel__cameras{grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;display:grid}.video-panel--top-bottom .video-panel__cameras{grid-template-rows:repeat(2,minmax(0,1fr));gap:2px;display:grid}.video-panel--side-by-side-reversed .video-panel__cameras{grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;display:grid}.video-panel--side-by-side-reversed .video-panel__participant--remote{grid-area:1/2}.video-panel--side-by-side-reversed .video-panel__participant--local{grid-area:1/1}.video-panel--top-bottom-reversed .video-panel__cameras{grid-template-rows:repeat(2,minmax(0,1fr));gap:2px;display:grid}.video-panel--top-bottom-reversed .video-panel__participant--remote{grid-area:2/1}.video-panel--top-bottom-reversed .video-panel__participant--local{grid-area:1/1}.video-panel--cameras-grid .video-panel__participant{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));display:grid}.video-panel--cameras-side-by-side .video-panel__participant{grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;display:grid}.video-panel--cameras-top-bottom .video-panel__participant{grid-template-rows:repeat(auto-fit,minmax(0,1fr));display:grid}.video-panel--solo .video-panel__cameras{display:block}.video-panel--solo .video-panel__participant--remote{display:none}.video-panel--solo .video-panel__participant--local{aspect-ratio:auto;border:none;border-radius:0;width:100%;max-width:none;height:100%;position:static}.video-panel__screens{min-width:0;min-height:0;position:relative;overflow:hidden}.video-panel__screens[hidden],.video-panel__screen[hidden]{display:none}.video-panel__screen{width:100%;height:100%;color:inherit;background:#000;border:0;padding:0;display:block;position:absolute;inset:0;overflow:hidden}.video-panel__screen-video{object-fit:contain;width:100%;height:100%;display:block}.video-panel__scroll-hint{z-index:1;color:#fff;pointer-events:none;background:#000000bf;border-radius:4px;max-width:calc(100% - 1rem);padding:.3rem .5rem;font-size:.8rem;position:absolute;top:.5rem;left:.5rem}.video-panel__scroll-hint[hidden]{display:none}.video-panel__annotations{pointer-events:none;position:absolute;overflow:visible}.video-panel__annotations--interactive{pointer-events:auto;touch-action:none;cursor:crosshair}.video-panel__annotations--laser-mode{cursor:none}.video-panel__annotations line{stroke-width:4px;stroke-linecap:round;vector-effect:non-scaling-stroke}.video-panel__annotations line[data-author=host]{stroke-width:5px;filter:drop-shadow(0 0 2px #fff)}.video-panel__annotations line[data-author=guest]{stroke-width:3px;stroke-opacity:.7}.video-panel__annotations .video-panel__laser{fill:#f33;stroke:#fff;stroke-width:3px;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 5px #f33)}.video-panel__annotations .video-panel__laser[hidden]{display:none}.video-panel__annotation-tools{z-index:2;background:#000000b3;border-radius:8px;flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem;width:max-content;max-width:calc(100% - 1rem);padding:.3rem;display:flex;position:absolute;bottom:.5rem;left:50%;transform:translate(-50%)}.video-panel__annotation-tools[hidden]{display:none}.video-panel__annotation-tools .btn{background:var(--panel);place-items:center;min-width:48px;min-height:48px;padding:.3rem;font-size:1.4rem;display:grid}.video-panel__annotation-tools .btn[hidden]{display:none}.video-panel__annotation-tools .btn--active{outline:2px solid var(--accent);outline-offset:-2px}.video-panel__colors{flex-wrap:wrap;justify-content:center;gap:.35rem;display:flex}.video-panel__colors[hidden]{display:none}.video-panel__color{cursor:pointer;border:2px solid #555;border-radius:50%;width:42px;height:42px}.video-panel__color[aria-pressed=true]{outline-offset:2px;outline:3px solid #fff}.video-panel__color:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.video-panel__screen--secondary{z-index:1;aspect-ratio:16/9;border:2px solid var(--border);cursor:pointer;border-radius:6px;width:min(28%,220px);height:auto;inset:auto .75rem .75rem auto}.video-panel__screen--secondary:hover,.video-panel__screen--secondary:focus-visible{border-color:var(--accent);outline:2px solid var(--accent)}.video-panel.video-panel--sharing .video-panel__stage{grid-template-columns:minmax(0, var(--screen-width,3.17fr)) minmax(0, 1fr);grid-template-rows:minmax(0,1fr);gap:2px;display:grid}.video-panel.video-panel--sharing .video-panel__screens{grid-area:1/1}.video-panel.video-panel--sharing .video-panel__cameras{grid-area:1/2}.video-panel--sharing.video-panel--solo .video-panel__participant--local{width:100%}.video-panel.video-panel--sharing.video-panel--demo .video-panel__stage{grid-template-columns:minmax(0, var(--screen-width,3fr)) minmax(0, 2fr)}.video-panel.video-panel--sharing.video-panel--demo.video-panel--pip .video-panel__participant--local{z-index:2;aspect-ratio:16/9;border:2px solid var(--border);border-radius:6px;width:min(35%,180px);height:auto;position:absolute;top:.5rem;bottom:auto;right:.5rem}.video-panel.video-panel--sharing.video-panel--demo.video-panel--pip .video-panel__participant--pip-top{top:.5rem;bottom:auto}.video-panel.video-panel--sharing.video-panel--demo.video-panel--pip .video-panel__participant--local:not(.video-panel__participant--pip-top){top:auto;bottom:.5rem}.video-panel.video-panel--sharing.video-panel--demo.video-panel--pip .video-panel__participant--pip-left{left:.5rem;right:auto}@container (width<=650px){.video-panel.video-panel--sharing:not(.video-panel--demo) .video-panel__stage{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr)}.video-panel.video-panel--sharing:not(.video-panel--demo) .video-panel__screens{grid-area:1/1}.video-panel.video-panel--sharing:not(.video-panel--demo) .video-panel__cameras{z-index:1;border:2px solid var(--border);border-radius:6px;grid-area:1/1;place-self:start end;width:min(44%,200px);height:clamp(96px,18dvh,140px);margin:.5rem}.video-panel.video-panel--sharing.video-panel--demo .video-panel__stage{grid-template-rows:minmax(0,3fr) minmax(0,2fr);grid-template-columns:minmax(0,1fr);height:min(110cqw,70dvh)}.video-panel.video-panel--sharing.video-panel--demo .video-panel__screens{grid-area:1/1}.video-panel.video-panel--sharing.video-panel--demo .video-panel__cameras{grid-area:2/1}.video-panel__screen--secondary{width:min(32%,150px)}}.call-stage{min-width:0;position:relative}.call-screen:not(.call-screen--demo) .call-stage,.call-stage--fullscreen{flex-direction:column;flex:1;min-height:0;display:flex}.call-stage__content{min-width:0}.call-screen:not(.call-screen--demo) .call-stage__content,.call-stage--fullscreen .call-stage__content{flex-direction:column;flex:1;min-height:0;display:flex}.call-screen:not(.call-screen--demo) .video-panel{flex:1;min-height:0}.call-screen:not(.call-screen--demo) .video-panel__stage,.call-screen:not(.call-screen--demo) .video-panel.video-panel--sharing .video-panel__stage{flex:1;height:100%;min-height:0}.call-screen:not(.call-screen--demo) .piano-keyboard{flex:none}.call-stage>.banner{margin-bottom:1rem}.call-settings-dialog .status-bar{margin:0}.call-settings-dialog .status-bar__text{text-align:center;display:block}.call-settings-dialog .status-bar__actions{flex-direction:column}.call-settings-dialog .settings{border:0;flex-flow:column;align-items:stretch;gap:.65rem;margin:0;padding:0}.call-settings-dialog [role=tabpanel][hidden]{display:none}.settings__divider{border:0;border-top:1px solid var(--border);width:100%;margin:0}.call-settings-dialog__tabs{border-bottom:1px solid var(--border);flex-wrap:wrap;gap:.25rem;margin-bottom:.75rem;display:flex}.call-settings-dialog__tab{color:var(--muted);cursor:pointer;background:0 0;border:0;border-bottom:2px solid #0000;flex:auto;padding:.6rem .7rem}.call-settings-dialog__tab[aria-selected=true]{color:var(--text);border-bottom-color:var(--accent)}.call-settings-dialog__tab:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.call-settings-dialog .settings__title{color:var(--text);margin:0;font-size:1rem;font-weight:600}.call-settings-dialog .settings--audio{border:0;gap:.4rem;padding:0}.call-settings-dialog .settings--audio .settings__title{color:var(--muted);font-size:.85rem}.camera-list{flex-direction:column;gap:.5rem;font-size:.85rem;display:flex}.camera-list .settings__checkbox-field{overflow-wrap:anywhere}.camera-list__device{flex-direction:column;gap:.25rem;display:flex}.camera-list__effect{margin-left:1.5rem}.layout-picker{gap:.4rem;display:grid}.layout-picker__heading{color:var(--muted);margin:0;font-size:.85rem;font-weight:600}.layout-picker__options{flex-wrap:wrap;gap:.5rem;display:flex}.layout-picker__options[hidden]{display:none}.layout-picker__button{border:1px solid var(--border);background:var(--panel);cursor:pointer;border-radius:6px;place-items:center;width:4.5rem;height:3.5rem;padding:.45rem;display:grid}.layout-picker__button:hover,.layout-picker__button:focus-visible{border-color:var(--accent)}.layout-picker__button[aria-pressed=true]{border-color:var(--accent);background:var(--bg);box-shadow:inset 0 0 0 1px var(--accent)}.layout-picker__icon{gap:3px;width:100%;height:100%;display:grid;position:relative}.layout-picker__cell{background:var(--accent);border-radius:2px;min-width:0;min-height:0}.layout-picker__cell--peer{background:var(--muted)}.layout-picker__icon--participants-side-by-side,.layout-picker__icon--participants-side-by-side-reversed,.layout-picker__icon--cameras-side-by-side{grid-template-columns:repeat(2,minmax(0,1fr))}.layout-picker__icon--participants-top-bottom,.layout-picker__icon--participants-top-bottom-reversed,.layout-picker__icon--cameras-top-bottom{grid-template-rows:repeat(2,minmax(0,1fr))}.layout-picker__icon--participants-side-by-side-reversed .layout-picker__cell--peer,.layout-picker__icon--participants-top-bottom-reversed .layout-picker__cell--peer{order:2}.layout-picker__icon--cameras-grid{grid-template-rows:repeat(2,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr))}.layout-picker__icon--participants-pip .layout-picker__cell--peer{grid-area:1/1}.layout-picker__icon--participants-pip .layout-picker__cell:not(.layout-picker__cell--peer){z-index:1;border:1px solid var(--panel);grid-area:1/1;place-self:end;width:35%;height:40%;margin:3px}.call-settings-dialog select{background:var(--bg);width:100%;min-width:0;color:var(--text);border:1px solid var(--border);border-radius:6px;padding:.5rem}.camera-error{color:var(--danger);overflow-wrap:anywhere;margin:0;font-size:.85rem}.call-stage__settings-dock{z-index:2;flex:none;margin-top:.5rem}.call-stage__settings-dock>.beta-label{background:var(--panel);position:absolute;bottom:calc(100% + .2rem);right:.5rem}.call-stage__settings-bar{background:var(--panel);border:1px solid var(--border);border-radius:8px;flex-wrap:wrap;justify-content:center;gap:.5rem;padding:.5rem;display:flex}.call-stage__settings-bar .btn{white-space:nowrap;font-size:1.1rem}.call-screen:not(.call-screen--demo) .call-stage--settings-side,.call-screen--demo .call-stage--settings-side{flex-direction:row;gap:.25rem;display:flex}.call-stage--settings-side .call-stage__content{flex:1;min-width:0}.call-stage--settings-side>.banner{z-index:3;position:absolute;top:0;left:0;right:0}.call-stage--settings-side .call-stage__settings-dock{flex:none;order:1;width:max-content;max-width:30%;max-height:100%;margin:0}.call-stage--settings-side.call-stage--settings-left .call-stage__settings-dock{order:-1}.call-stage--settings-side .call-stage__settings-bar{flex-flow:column;justify-content:flex-start;align-items:stretch;gap:.2rem;width:auto;max-height:100%;padding:.2rem;overflow-y:auto}.call-stage--settings-side .call-stage__settings-bar .btn{min-width:44px;min-height:44px;padding:.3rem}.call-stage--settings-side .call-stage__button-label{display:none}.call-stage--settings-side .session-timer__bar-controls{flex-direction:column}.call-stage--settings-side .session-timer__bar-controls .session-timer__button{width:auto;margin:0}.call-stage--settings-side .session-timer__bar-controls>.btn:not(.session-timer__clock-button),.call-stage--settings-side .call-stage__help{display:none}.call-stage--settings-side .call-settings-dialog__help{display:inline-flex}@media (orientation:landscape) and (height<=600px) and (width<=1000px){body:has(.call-screen--demo){height:100dvh;overflow:hidden}#app:has(.call-screen--demo){height:100dvh;padding:max(.5rem, env(safe-area-inset-top)) max(.5rem, env(safe-area-inset-right)) max(.5rem, env(safe-area-inset-bottom)) max(.5rem, env(safe-area-inset-left))}.demo-screen:has(>.call-screen--demo){flex-direction:column;height:100%;min-height:0;display:flex}.call-screen--demo{flex-direction:column;height:100%;min-height:0;display:flex}.call-screen--demo .call-stage{flex-direction:column;flex:1;min-height:0;display:flex}.call-screen--demo .call-stage--settings-side{flex-direction:row}.call-screen--demo .call-stage__content{flex-direction:column;flex:1;min-height:0;display:flex}.call-screen--demo .video-panel{flex:1;min-height:0}.call-screen--demo .video-panel__stage{flex:1;height:100%;min-height:0}.call-screen--demo .piano-keyboard{flex:none}}@media (orientation:landscape) and (height<=400px) and (width<=1000px){.video-panel--demo .video-panel__demo-card{padding:.4rem .7rem}.video-panel--demo .video-panel__demo-card h1{margin-bottom:.15rem;font-size:1rem;line-height:1.2}.video-panel--demo .video-panel__demo-card p{padding-inline:2.25rem;font-size:.8rem;line-height:1.25}.video-panel--demo .demo-screen__controls{gap:.25rem;margin-top:.25rem}.video-panel--demo .demo-screen__controls .btn{padding:.35rem .6rem}}.fullscreen-icon{width:1.25em;height:1.25em;display:block}.call-stage__help{align-self:flex-end;margin-left:auto;text-decoration:none}.call-stage__connection-button--waiting:after{content:"";vertical-align:-.05em;border:2px solid;border-right-color:#0000;border-radius:50%;width:.75em;height:.75em;margin-left:.5em;animation:1s linear infinite connection-waiting;display:inline-block}@keyframes connection-waiting{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.call-stage__connection-button--waiting:after{animation:none}}.call-stage__settings-bar .media-toggle__icon{font-size:1.25rem}.call-stage__mic-button{align-items:center;gap:.4rem;display:inline-flex}.media-toggle__icon{place-items:center;line-height:1;display:inline-grid;position:relative}.media-toggle__off-mark{width:1.5em;height:1.5em;color:var(--warning);filter:drop-shadow(0 0 2px var(--panel));pointer-events:none;display:none;position:absolute}.media-toggle--off .media-toggle__off-mark{display:block}.session-timer__bar-controls{border:1px solid var(--border);background:var(--panel);border-radius:6px;flex-wrap:nowrap;flex:none;align-items:stretch;display:flex}.session-timer__bar-controls .btn{background:0 0;border:0;flex:none;padding:.5rem}.session-timer__bar-controls .btn:hover{background:var(--bg)}.session-timer__bar-controls>.session-timer__button{align-self:center;margin:0 .75rem 0 .25rem}.session-timer__button{text-align:right;font-variant-numeric:tabular-nums;width:9ch;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;display:inline-block}.session-timer__mobile-controls{display:none}.call-stage--settings-side .session-timer__mobile-controls{flex-wrap:wrap;gap:.5rem;display:flex}.call-settings-dialog{width:min(420px,100vw - 2rem);max-height:min(80dvh,700px);color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:10px;margin:0;padding:1rem;position:fixed;inset:auto;overflow-y:auto;box-shadow:0 16px 48px #00000073}.call-settings-dialog--tabs{width:min(680px,100vw - 2rem);height:min(70dvh,620px)}.call-settings-dialog--connection{width:min(500px,100vw - 2rem);height:min(70dvh,620px)}.audio-device-test audio{display:none}.audio-device-test{margin:.25rem 0 .75rem}.audio-device-test__controls{align-items:center;gap:.5rem;display:flex}.audio-device-test .btn{white-space:normal;min-width:0;margin:0}.audio-device-test p:empty{display:none}.audio-device-test__progress{flex:1 0 2rem;min-width:2rem}.audio-device-test__progress progress{width:100%;height:1rem;accent-color:var(--accent);display:block}.call-settings-dialog::backdrop{background:0 0}.call-settings-dialog__close{margin-bottom:.75rem;margin-left:auto;padding:.25rem .6rem;font-size:1.3rem;line-height:1;display:block}.call-settings-dialog__help{text-decoration:none;display:none;position:absolute;top:1rem;left:1rem}.media-diagnostics h2{margin:0 0 .5rem;font-size:1.1rem}.media-diagnostics p{color:var(--muted);margin:0 0 1rem;font-size:.85rem}.media-diagnostics ul{gap:.5rem;margin:0;padding:0;list-style:none;display:grid}.media-check{border:1px solid var(--border);border-radius:8px;align-items:flex-start;gap:.7rem;padding:.65rem;display:flex}.media-check__icon{text-align:center;color:var(--muted);border-radius:50%;flex:0 0 1.4rem;font-weight:700}.media-check[data-status=ok] .media-check__icon{color:#16803a}.media-check[data-status=problem] .media-check__icon{color:var(--danger)}.media-check strong,.media-check span:not(.media-check__icon){display:block}.media-check strong{font-size:.9rem}.media-check div span{color:var(--muted);margin-top:.2rem;font-size:.82rem}.media-diagnostics>.btn{margin-top:.75rem}.settings__hint{color:var(--muted);margin:0;font-size:.8rem}.call-stage--fullscreen{background:#000;height:100dvh;padding:.75rem;position:relative;overflow:hidden}.call-stage--fullscreen .call-stage__content{height:auto}.call-stage--fullscreen .video-panel{border:none;border-radius:0;flex:1;min-height:0}.call-stage--fullscreen .video-panel__stage{flex:1;height:100%;min-height:0}.call-stage--fullscreen .video-panel.video-panel--sharing .video-panel__stage,.call-stage--fullscreen .video-panel--pip .video-panel__stage,.call-stage--fullscreen .video-panel--side-by-side .video-panel__stage,.call-stage--fullscreen .video-panel--top-bottom .video-panel__stage,.call-stage--fullscreen .video-panel__participant,.call-stage--fullscreen .video-panel__camera,.call-stage--fullscreen .video-panel__video{height:100%}.call-stage--fullscreen .piano-keyboard{flex-shrink:0}.mic-meter{border:1px solid var(--border);background:linear-gradient(#4a2022,#423711 35%,#123820);border-radius:4px;width:10px;height:28px;overflow:hidden}.mic-meter[hidden]{display:none}.mic-meter__bar{clip-path:inset(100% 0 0);background:linear-gradient(#ef4444,#eab308 35%,#22c55e);width:100%;height:100%;transition:clip-path 60ms linear}.settings{background:var(--panel);border:1px solid var(--border);border-radius:8px;flex-wrap:wrap;align-items:end;gap:1rem;margin-bottom:1rem;padding:1rem;display:flex}.settings__field{color:var(--muted);flex-direction:column;gap:.25rem;font-size:.85rem;display:flex}.settings select{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:6px;min-width:180px;padding:.4rem}.settings--audio{align-items:center}.settings__title{color:var(--muted);margin-right:.25rem;font-size:.85rem}.settings__checkbox-field{color:var(--text);align-items:center;gap:.4rem;font-size:.85rem;display:flex}.theme-control{color:var(--muted);white-space:nowrap;align-items:center;gap:.35rem;font-size:.85rem;display:inline-flex}.theme-control select{border:1px solid var(--border);background:var(--panel);color:var(--text);font:inherit;border-radius:6px;padding:.3rem}.fatal-error{text-align:center;max-width:560px;margin:4rem auto}@media (width<=1000px){.call-stage__settings-bar .btn{padding:.4rem .55rem}.call-stage__button-label{display:none}}@media (width<=600px){.call-stage__settings-bar{padding:0}.call-screen:not(.call-screen--demo) .call-stage__settings-bar{flex-wrap:nowrap;gap:.2rem;width:100%}.call-screen:not(.call-screen--demo) .call-stage__settings-bar .btn{padding-inline:.3rem}.call-stage__settings-bar>.call-stage__help{display:none}.call-settings-dialog__help{display:inline-flex}.call-stage__settings-bar .btn{font-size:1rem}.call-stage__connection-button--waiting{position:relative}.call-stage__connection-button--waiting:after{width:.5em;height:.5em;margin:0;position:absolute;top:0;right:0}.session-timer__bar-controls>.btn:not(.session-timer__clock-button){display:none}.call-stage__settings-bar .session-timer__button{width:auto;min-width:5ch;margin:0}.session-timer__mobile-controls{flex-wrap:wrap;gap:.5rem;display:flex}.call-stage__settings-dock{margin-top:.25rem}#app{padding:.75rem}#app:has(.call-screen:not(.call-screen--demo)){padding:max(.25rem, env(safe-area-inset-top)) max(.25rem, env(safe-area-inset-right)) max(.25rem, env(safe-area-inset-bottom)) max(.25rem, env(safe-area-inset-left))}.room-bar,.status-bar{gap:.5rem}.status-bar__actions{width:100%}.status-bar__actions .btn{flex:1}.btn{padding:.6rem .9rem}.video-panel__controls{gap:.4rem;padding:.4rem}.video-panel--pip:not(.video-panel--solo) .video-panel__participant--local{width:35%}.video-panel--demo.video-panel--pip:not(.video-panel--sharing) .video-panel__stage{height:510px}.video-panel--demo.video-panel--pip:not(.video-panel--sharing) .video-panel__cameras{grid-template-rows:minmax(0,1fr) minmax(0,150px);gap:2px;display:grid}.video-panel--demo.video-panel--pip:not(.video-panel--sharing) .video-panel__participant--remote{min-height:0;padding-right:1rem}.video-panel--demo.video-panel--pip:not(.video-panel--sharing):has(.video-panel__participant--pip-left) .video-panel__participant--remote{padding-left:1rem}.video-panel--demo.video-panel--pip:not(.video-panel--sharing) .video-panel__participant--local{aspect-ratio:auto;border:none;border-radius:0;width:100%;max-width:none;height:100%;position:static}.video-panel--demo.video-panel--pip:not(.video-panel--sharing) .video-panel__pip-arrow{display:none}.video-panel--demo.video-panel--pip:not(.video-panel--sharing) .video-panel__participant--remote{padding-left:1rem}.video-panel.video-panel--sharing.video-panel--demo .video-panel__stage{height:420px}.call-stage--fullscreen .video-panel.video-panel--sharing.video-panel--demo .video-panel__stage,.call-stage--fullscreen .video-panel--demo.video-panel--pip:not(.video-panel--sharing) .video-panel__stage{height:100%}.settings{padding:.75rem}.settings select{width:100%;min-width:0}}.telemetry-control{border:1px solid var(--border);text-align:left;border-radius:8px;max-width:38rem;margin:.75rem auto;padding:1rem;font-size:.9rem}.telemetry-control h3{margin:0 0 .4rem;font-size:1rem}.telemetry-control p{color:var(--muted);margin:.4rem 0}.telemetry-control__switch{cursor:pointer;align-items:center;gap:.6rem;margin:.6rem 0;font-weight:600;display:inline-flex}.telemetry-control__switch input{appearance:none;background:var(--muted);cursor:pointer;border-radius:1rem;width:2.5rem;height:1.4rem;margin:0;position:relative}.telemetry-control__switch input:before{content:"";background:#fff;border-radius:50%;width:1rem;height:1rem;transition:transform .15s;position:absolute;top:.2rem;left:.2rem}.telemetry-control__switch input:checked{background:var(--accent)}.telemetry-control__switch input:checked:before{transform:translate(1.1rem)}.telemetry-control__switch input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.telemetry-control details{margin-top:.3rem}.telemetry-control summary{cursor:pointer;color:var(--text)}.telemetry-control ul{margin:.65rem 0;padding-left:1.5rem}.telemetry-control li+li{margin-top:.3rem}.analytics-choice{z-index:1000;border:1px solid var(--accent);color:#e5e9f0;background:#192330;border-radius:.75rem;width:min(620px,100% - 1.5rem);max-height:calc(100vh - 2rem);padding:1rem;font:.9rem/1.5 system-ui,sans-serif;position:fixed;bottom:1rem;left:50%;overflow:auto;transform:translate(-50%);box-shadow:0 10px 40px #000a}.analytics-choice[hidden]{display:none}.analytics-choice p{margin:0 .75rem .75rem 0;padding-right:1.25rem}.analytics-choice button{cursor:pointer;margin:0 .5rem .5rem 0;padding:.5rem .9rem}.analytics-choice .analytics-choice__close{color:inherit;background:0 0;border:0;margin:0;padding:.15rem .5rem;font:1.5rem/1 system-ui,sans-serif;position:absolute;top:.35rem;right:.35rem}.analytics-choice a{color:#9ecaff;display:inline-block}