.call-layout { min-height:calc(100vh - 80px); display:flex; flex-direction:column; gap:18px; }
.call-profile { display:flex; align-items:center; gap:12px; align-self:flex-start; padding:12px 16px; border:1px solid var(--border); background:var(--surface); border-radius:18px; max-width:100%; }
.call-profile .avatar { width:52px;height:52px; }
.call-profile-info { min-width:0; }
.call-profile-info strong { display:block; }
.call-profile-info small { color:var(--muted); }
.call-stage { flex:1; min-height:260px; display:grid; place-items:center; position:relative; overflow:hidden; border:1px solid var(--border); border-radius:24px; background:radial-gradient(ellipse at center,color-mix(in srgb,var(--primary) 17%,var(--surface)),var(--surface)); }
.remote-video { position:absolute; inset:0; width:100%;height:100%;object-fit:cover; }
.local-video { position:absolute; right:15px; bottom:15px; width:clamp(90px,22vw,160px); aspect-ratio:3/4; object-fit:cover; border-radius:16px; border:2px solid #ffffff55; background:#17243b; }
.call-placeholder { display:grid; place-items:center; gap:15px; color:var(--muted); text-align:center; }
.call-placeholder .avatar { width:100px;height:100px;font-size:2rem; }
.call-controls { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.call-timer { font-size:1.6rem; font-weight:850; font-variant-numeric:tabular-nums; }