/* Rooms: a native-style lobby card and a dark call stage with a floating icon control bar. */
.meeting{--call-bg:#111418;--call-tile:#202428;--call-control:#3a3f45;--call-control-hover:#4a5057;--call-ink:#f3f5f7;--call-muted:#c9ced4;--call-off:#d93025;
 width:100%;min-width:0;height:100%;display:flex;flex-direction:column;gap:8px}
/* Lobby */
.meeting-lobby{display:flex;justify-content:center;padding:12px 0}
.lobby-card{width:min(100%,420px);display:grid;gap:14px;padding:20px;border:1px solid var(--border);border-radius:20px;background:var(--surface);box-shadow:var(--shadow-sm)}
.lobby-preview{display:grid;place-items:center;aspect-ratio:16/9;border-radius:14px;background:var(--call-bg)}
.lobby-avatar{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--call-control);color:var(--call-ink)}
.lobby-field{display:grid;gap:6px;font-weight:600;font-size:.92rem}
.lobby-field input{font-size:16px;min-height:48px;border-radius:12px;padding:0 14px;width:100%;box-sizing:border-box}
.lobby-create{min-height:50px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:8px}
.lobby-or{display:flex;align-items:center;gap:10px;margin:0;color:var(--muted);font-size:.85rem}.lobby-or::before,.lobby-or::after{content:"";flex:1;border-top:1px solid var(--border)}
.lobby-join{display:flex;align-items:end;gap:8px}.lobby-join .lobby-field{flex:1;min-width:0}
.lobby-join input{text-transform:uppercase;letter-spacing:.12em;font-family:var(--mono)}
.lobby-card .hint{margin:0;font-size:.82rem;color:var(--muted)}
.lobby-card>.btn:last-child{border-radius:999px;min-height:46px}
/* Call */
.meeting #rooms-call{display:flex;flex-direction:column;flex:1;min-height:0;position:relative;border-radius:18px;background:var(--call-bg);color:var(--call-ink);overflow:hidden}
.meeting #rooms-call[hidden]{display:none}
.meeting-top{display:flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap}
.meeting-heading{margin:0;font-size:.95rem;font-weight:700;padding:6px 12px;border-radius:999px;background:var(--surface-2);font-family:var(--mono);letter-spacing:.06em}
.meeting-heading[hidden]{display:none}
.meeting #rooms-status{margin:0;font-size:.85rem;color:var(--muted);min-width:0;flex:1}
.meeting-stage{flex:1;min-height:120px;overflow:auto;overscroll-behavior:contain;padding:10px}
.meeting-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:10px;align-content:center;min-height:100%}
.meeting-grid:has(.meeting-tile:only-child){max-width:720px;margin:auto}
.meeting-tile{position:relative;min-width:0;border-radius:14px;background:var(--call-tile);overflow:hidden;aspect-ratio:16/10;outline:3px solid transparent;outline-offset:-3px;transition:outline-color .15s}
.meeting-tile[data-speaking=true]{outline-color:#8ab4f8}
.meeting-tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}.meeting-tile[data-video=on] video{opacity:1}
.meeting-avatar{position:absolute;inset:0;display:grid;place-items:center}.meeting-avatar span{display:grid;place-items:center;width:clamp(48px,28%,96px);aspect-ratio:1;border-radius:50%;background:#5f6368;color:#fff;font-weight:700;font-size:clamp(1.2rem,4vw,2rem)}
.meeting-tile[data-video=on] .meeting-avatar{display:none}
.meeting-name{position:absolute;left:8px;bottom:8px;max-width:calc(100% - 16px);display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#0009;color:#fff;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meeting-name svg{flex:none;color:#f28b82}
.meeting-screen{min-width:0;margin-bottom:10px;border-radius:14px;overflow:hidden;background:#000}.meeting-screen video{display:block;width:100%;max-height:62dvh;object-fit:contain}
/* Control bar */
.meeting-actions{flex:none;display:flex;justify-content:center;align-items:center;gap:10px;padding:10px 10px max(12px,var(--safe-bottom));flex-wrap:nowrap}
.meeting-control{display:grid;place-items:center;width:52px;height:52px;min-width:44px;min-height:44px;border:0;border-radius:50%;background:var(--call-control);color:var(--call-ink);cursor:pointer;flex:none;list-style:none;touch-action:manipulation}
.meeting-control::-webkit-details-marker{display:none}
.meeting-control:hover{background:var(--call-control-hover)}.meeting-control:focus-visible{outline:3px solid #8ab4f8;outline-offset:2px}
.meeting-control:disabled{opacity:.45;cursor:default}
#rooms-mic[aria-pressed=false],#rooms-camera[aria-pressed=false]{background:var(--call-off)}
#rooms-share[data-sharing=true]{background:#8ab4f8;color:#111}
.meeting-leave{width:68px;border-radius:999px;background:var(--call-off)}.meeting-leave:hover{background:#b3261e}
.meeting-more{position:relative}
.meeting-menu{position:absolute;bottom:calc(100% + 10px);right:0;display:grid;min-width:220px;padding:6px;border-radius:14px;background:var(--surface);color:var(--text);border:1px solid var(--border);box-shadow:0 10px 30px #0006;z-index:3}
.meeting-menu button,.meeting-menu .app-locale{display:flex;align-items:center;gap:12px;min-height:46px;padding:0 12px;border:0;border-radius:10px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.meeting-menu button:hover{background:var(--surface-2)}
.lobby-go{background:var(--accent);color:var(--on-accent);width:48px;height:48px}
/* Sheets opened from the bar */
.meeting-panel{display:grid;gap:.6rem}.meeting-panel label{display:grid;gap:.4rem}.meeting-panel select,.meeting-panel input{font-size:16px;min-height:44px;width:100%}
.meeting-person{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;padding:.5rem;border-bottom:1px solid var(--border)}.meeting-person span{flex:1}
.meeting-panel ol{max-height:35dvh;overflow:auto;overflow-wrap:anywhere}
.ui-keyboard-on .meeting-actions{padding-block:4px}.ui-keyboard-on .meeting-tile{aspect-ratio:16/9}
@media(max-width:600px){.meeting-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.meeting-grid:has(.meeting-tile:only-child){grid-template-columns:1fr}.meeting-actions{gap:8px;padding-inline:6px}.meeting-control{width:48px;height:48px}.meeting-leave{width:58px}.meeting-tile{aspect-ratio:3/4}.meeting-screen video{max-height:45dvh}}
@media(max-width:360px){.meeting-actions{gap:5px}.meeting-control{width:44px;height:44px}.meeting-leave{width:52px}}
@media(max-height:500px)and(orientation:landscape){.meeting-tile{aspect-ratio:16/9}.meeting-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.meeting-screen video{max-height:55dvh}}
.meeting.pv-fs{box-sizing:border-box;overflow:hidden;padding:8px max(8px,var(--safe-right)) max(8px,var(--safe-bottom)) max(8px,var(--safe-left));background:var(--bg)}
.meeting.pv-fs .meeting-top{padding-right:56px}.meeting.pv-fs .meeting-menu{z-index:3}
.lobby-card>.app-locale{order:-1;justify-self:end;margin:0}
.meeting-lobby:not([hidden])+.meeting-top{justify-content:center;text-align:center}