:root{color-scheme:dark;--bg:#07111f;--card:#101827;--line:#263244;--text:#f8fafc;--muted:#aab5c4;--orange:#ff7a00;--green:#22c55e}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#1f2937,#030712 65%);font-family:Inter,system-ui,Segoe UI,sans-serif;color:var(--text)}button,input{font:inherit}
.shell{min-height:100vh;padding:18px;display:grid;gap:16px;align-content:start}.card{background:rgba(16,24,39,.92);border:1px solid var(--line);border-radius:30px;padding:22px;box-shadow:0 24px 80px #0008}.hero{margin-top:8vh}.eyebrow{color:var(--orange);font-weight:900;text-transform:uppercase;letter-spacing:.12em}.muted{color:var(--muted)}.hidden{display:none!important}
.stack{display:grid;gap:12px}.row{display:flex;gap:10px;align-items:center}input{width:100%;border:1px solid var(--line);background:#0b1220;color:var(--text);border-radius:18px;padding:14px}button{border:0;border-radius:18px;padding:13px 16px;background:var(--orange);color:white;font-weight:900}.list{display:grid;gap:12px}.contact{display:grid;grid-template-columns:1fr auto auto auto;gap:8px;align-items:center;background:#0b1220;border:1px solid var(--line);padding:14px;border-radius:22px}.online{color:var(--green)}.offline{color:var(--muted)}.messages{height:52vh;overflow:auto;display:grid;align-content:end;gap:10px}.msg{max-width:80%;padding:12px 14px;border-radius:18px;background:#1f2937}.msg.me{margin-left:auto;background:#1d4ed8}
.call{position:fixed;inset:0;background:#030712;overflow:hidden}.call video#remote-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#020617}.avatar{position:absolute;inset:0;display:grid;place-items:center;font-size:72px;font-weight:900;background:linear-gradient(135deg,#111827,#020617);color:#94a3b8}.self{position:absolute;right:18px;top:108px;width:31vw;max-width:170px;aspect-ratio:3/4;object-fit:cover;border-radius:22px;border:2px solid #ffffff30;background:#020617;z-index:9999;isolation:isolate;transform:translateZ(0) scaleX(-1);box-shadow:0 18px 50px #0009}.call-top{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:14px;padding:22px;background:linear-gradient(#000b,#0000);z-index:10}.call-top span{display:block;color:#d1d5db;margin-top:4px}.call-actions{position:absolute;left:12px;right:12px;bottom:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;background:#0f172acc;border:1px solid #ffffff20;border-radius:28px;padding:12px;z-index:20}.call-actions button,#call-back,#retry{background:#1f2937}#end{background:#ef4444}@media (min-width:760px){.shell{max-width:960px;margin:0 auto}.hero{margin-top:4vh}.self{width:150px}.call{border-radius:24px;inset:20px}}