/* One-to-one call overlay. Reuses the site theme variables so light/dark
 * follow the profile page; every selector is lv-call prefixed so call media
 * can never be confused with note media. No third-party code. */
.lv-call-entry{position:relative;display:flex;gap:10px;align-items:center;margin:14px 0;flex-wrap:wrap}
.lv-call-toggle{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;padding:0}
.lv-call-choose{position:absolute;top:52px;left:0;z-index:30;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;display:flex;flex-direction:column;gap:4px;min-width:150px}
.lv-call-choose button{min-height:44px;text-align:left;justify-content:flex-start}
.lv-call-note{font-size:12px;color:var(--muted)}
.lv-call-scrim{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end;justify-content:center;background:#10221a66;padding:0}
@media(min-width:700px){.lv-call-scrim{align-items:center;padding:24px}}
.lv-call-sheet{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:20px 20px 0 0;width:100%;max-height:94vh;overflow:auto;padding:20px 18px calc(20px + env(safe-area-inset-bottom));box-shadow:var(--shadow)}
@media(min-width:700px){.lv-call-sheet{border-radius:20px;max-width:860px;max-height:calc(100vh - 48px)}}
.lv-call-sheet:focus{outline:none}
.lv-call-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.lv-call-peer{font-weight:700;font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lv-call-state{font-size:13px;color:var(--muted)}
.lv-call-state[data-tone=bad]{color:#d45f46}
.lv-call-timer{margin-left:auto;font-variant-numeric:tabular-nums;font-size:14px;color:var(--muted);white-space:nowrap}
.lv-call-stage{position:relative;display:grid;gap:10px;grid-template-columns:1fr;background:#0c100e;border-radius:14px;overflow:hidden;min-height:280px}
@media(min-width:700px){.lv-call-stage{grid-template-columns:1fr 1fr;min-height:340px}}
.lv-call-stage.lv-call-audioonly{grid-template-columns:1fr;min-height:0}
.lv-call-tile{position:relative;min-height:200px;display:flex;align-items:center;justify-content:center;background:#141917;color:#edf0e9;overflow:hidden}
@media(min-width:700px){.lv-call-tile{min-height:300px}}
.lv-call-tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lv-call-video{position:absolute;inset:0}
.lv-call-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lv-call-avatar{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:24px;font-weight:700;background:var(--accent);color:var(--bg)}
.lv-call-tag{position:absolute;left:10px;bottom:10px;font-size:12px;background:#0009;color:#fff;padding:4px 10px;border-radius:8px}
.lv-call-tile[data-live=false] .lv-call-avatar{background:#3a443d}
.lv-call-bars{display:flex;flex-direction:column;gap:12px;margin:14px 2px}
.lv-call-quality{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.lv-call-quality i{width:9px;border-radius:3px;background:var(--line);display:inline-block}
.lv-call-quality i:nth-child(1){height:7px}.lv-call-quality i:nth-child(2){height:12px}.lv-call-quality i:nth-child(3){height:17px}
.lv-call-quality[data-q=good] i{background:var(--accent)}
.lv-call-quality[data-q=fair] i:nth-child(-n+2){background:#c98a2b}
.lv-call-quality[data-q=poor] i:nth-child(-n+1){background:#d45f46}
.lv-call-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(min-width:700px){.lv-call-controls{display:flex;flex-wrap:wrap}}
.lv-call-controls button{min-height:48px;border-radius:12px;font-size:14px}
.lv-call-controls button[aria-pressed=true]{background:var(--tint);border-color:var(--accent);color:var(--accent);font-weight:600}
.lv-call-hangup{background:#b3402e;border-color:#b3402e;color:#fff;font-weight:700}
.lv-call-hangup:hover{background:#a23727}
.lv-call-row{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.lv-call-row select{flex:1;min-width:0}
.lv-call-help{font-size:13px;line-height:1.8;color:var(--muted);margin:12px 2px}
.lv-call-help ol{margin:6px 0;padding-left:20px}
.lv-call-banner{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:61;background:var(--panel);color:var(--text);border:1px solid var(--accent);border-radius:16px;box-shadow:var(--shadow);padding:14px 16px;display:flex;gap:12px;align-items:center}
@media(min-width:700px){.lv-call-banner{left:auto;right:24px;bottom:24px;width:380px}}
.lv-call-banner .lv-call-peer{font-size:16px}
.lv-call-banner .lv-call-actions{margin-left:auto;display:flex;gap:8px}
.lv-call-banner button{min-height:44px}
.lv-call-ring{animation:lv-call-pulse 1.6s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.lv-call-ring{animation:none}}
@keyframes lv-call-pulse{0%,100%{box-shadow:0 0 0 0 #176f6300}50%{box-shadow:0 0 0 6px #176f6333}}
/* In-call overlays: the top bar and the verb dock ride on the video so the
 * sheet chrome disappears while talking. Text over video is always light —
 * the stage stays dark in both themes. */
.lv-call-topbar{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;gap:10px;padding:10px 12px;background:linear-gradient(rgba(0,0,0,.55),transparent);color:#fff}
.lv-call-topbar .lv-call-peer{font-size:15px;color:#fff}
.lv-call-topbar .lv-call-state{font-size:12px;color:#ffffffb3}
.lv-call-topbar .lv-call-timer{font-size:13px;color:#ffffffb3}
.lv-call-topbar .lv-call-quality{font-size:12px;color:#ffffffb3}
.lv-call-topbar .lv-call-quality span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lv-call-topbar .lv-call-quality i{background:#ffffff4d}
.lv-call-topbar .lv-call-quality[data-q=good] i{background:#4cc38a}
.lv-call-dock{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 12px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(0,0,0,.62))}
.lv-call-dock button{min-height:44px;min-width:44px;padding:0 16px;border-radius:999px;background:#ffffff24;color:#fff;border:1px solid #ffffff2e;font-size:14px}
.lv-call-dock button[aria-pressed=true]{background:#fff;color:#111;border-color:#fff;font-weight:600}
.lv-call-dock button:disabled{opacity:.4}
.lv-call-dock .lv-call-hangup{background:#b3402e;border-color:#b3402e;color:#fff;font-weight:700}
.lv-call-dock .lv-call-hangup:hover{background:#a23727}
.lv-call-more{position:absolute;right:10px;bottom:78px;z-index:3;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:8px;display:flex;flex-direction:column;gap:6px;min-width:190px}
.lv-call-more button{min-height:44px;text-align:left}
.lv-call-more button[aria-pressed=true]{background:var(--tint);border-color:var(--accent);color:var(--accent);font-weight:600}
.lv-call-more select{min-height:44px}
.lv-call-stage:has(.lv-call-dock) .lv-call-tag{bottom:78px}
@media(max-width:699px){.lv-call-dock{gap:8px;padding:12px 8px calc(10px + env(safe-area-inset-bottom))}.lv-call-dock button{padding:0 12px;font-size:13px}.lv-call-more{left:10px;min-width:0}}
[hidden]{display:none!important}
