/* MaxiChat v1.1.4 — isolated group call UI */
.group-call-banner[hidden],.group-call-overlay[hidden]{display:none!important}
.group-call-banner{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:9px 16px;background:color-mix(in srgb,var(--accent) 11%,var(--panel));border-bottom:1px solid var(--line);font-size:13px}
.group-call-banner strong{color:var(--text)}.group-call-banner button{white-space:nowrap}
.group-call-overlay{position:fixed;inset:0;z-index:9000;display:flex;flex-direction:column;padding:max(18px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));background:var(--bg,#111217);color:var(--text,#fff);overflow-y:auto}
.group-call-head{text-align:center;display:flex;flex-direction:column;gap:6px;align-items:center;padding:8px 0 20px}
.group-call-head img{width:38px;height:38px;object-fit:contain;border-radius:10px}
.group-call-head h2{font-size:20px;margin:0}.group-call-head p{opacity:.75;font-size:13px;margin:0}
.group-call-tiles{flex:1;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,42vw),1fr));gap:12px;align-content:center;max-width:1100px;width:100%;margin:auto}
.group-call-tile{position:relative;min-height:180px;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:color-mix(in srgb,var(--panel) 90%,#666);border:1px solid var(--line);display:grid;place-items:center}
.group-call-avatar{width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:white;font-weight:700;font-size:24px}
.group-call-video{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#181818}
.group-call-tile.has-video .group-call-video{display:block}.group-call-name{position:absolute;left:12px;bottom:10px;padding:5px 10px;border-radius:8px;background:#111b;color:white;font-size:12px;font-weight:700;max-width:calc(100% - 24px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.group-call-controls{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;padding:24px 0 5px}
.group-call-controls button{border-radius:50px;padding:11px 20px;min-height:46px;border:1px solid var(--line);color:var(--text);background:var(--panel);font-weight:600;cursor:pointer}
.group-call-controls #groupLeaveBtn{background:#bd3044;color:#fff;border-color:transparent}
@media(max-width:650px){.group-call-overlay{padding:calc(10px + env(safe-area-inset-top)) 10px calc(12px + env(safe-area-inset-bottom))}.group-call-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.group-call-tile{min-height:145px;aspect-ratio:3/4}.group-call-controls{gap:7px}.group-call-controls button{padding:10px 14px;font-size:12px}}

/* v1.1.5: Screen share gives the desktop capture a wider primary tile. */
.group-call-tile.sharing-screen{grid-column:1/-1;aspect-ratio:16/9;min-height:270px;max-height:65vh}
.group-call-tile.sharing-screen .group-call-video{object-fit:contain}
.group-call-share-label{position:absolute;right:12px;top:12px;padding:6px 10px;border-radius:8px;background:#101118cf;color:#fff;font-size:12px;font-weight:700}
.group-call-controls #groupScreenBtn[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.group-call-share-label[hidden]{display:none!important}
@media(max-width:650px){.group-call-tile.sharing-screen{min-height:185px;aspect-ratio:16/10}}

/* The viewer can expand any participant's stream, including a shared desktop. */
.group-call-expand{position:absolute;left:10px;top:10px;z-index:3;width:35px;height:35px;padding:0;border:1px solid #fff5;border-radius:10px;background:#101118b3;color:#fff;font-size:24px;line-height:1;cursor:pointer}
.group-call-tile.tile-expanded{grid-column:1/-1;aspect-ratio:16/9;min-height:300px;max-height:68vh}
.group-call-tile.tile-expanded .group-call-video{object-fit:contain}
.group-call-expand:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:650px){.group-call-tile.tile-expanded{min-height:195px;aspect-ratio:16/10}}

/* v1.2.6: phone video-call tiles maintain a portrait video view. */
@media(max-width:650px){.group-call-tile:not(.sharing-screen):not(.tile-expanded){aspect-ratio:3/4}.group-call-tile:not(.sharing-screen) .group-call-video{object-fit:contain}}

/* v1.2.7: uncropped video and consistent camera-off tiles. */
.group-call-tile .group-call-video{object-fit:contain!important;object-position:center;background:#14111b}
.group-call-tile:not(.has-video){background:radial-gradient(circle at 50% 28%,rgba(168,53,180,.20),transparent 55%),linear-gradient(145deg,#25202c,#13121b)}
.group-call-tile:not(.has-video) .group-call-avatar{width:72px;height:72px;max-width:34%;max-height:36%;border:2px solid rgba(192,82,205,.6);box-shadow:0 8px 24px rgba(0,0,0,.19)}
.group-call-camera-off{position:absolute;left:9px;right:9px;top:calc(50% + 43px);text-align:center;color:#c8bbcb;font-size:10px;pointer-events:none}
.group-call-tile.has-video .group-call-camera-off{display:none}

/* v1.2.8: camera participant frames are vertical 9:16, screen shares are not. */
.group-call-tile:not(.sharing-screen){aspect-ratio:9/16;}
.group-call-tile:not(.sharing-screen) .group-call-video{object-fit:contain!important;object-position:center;}
.group-call-tile.tile-expanded:not(.sharing-screen){aspect-ratio:9/16;max-height:min(72dvh,700px);}
@media(max-width:650px){
  .group-call-tile:not(.sharing-screen):not(.tile-expanded){aspect-ratio:9/16;min-height:0;}
  .group-call-tile.tile-expanded:not(.sharing-screen){aspect-ratio:9/16;min-height:0;}
}