:root{font-family:Tahoma,Arial,sans-serif;color:#eaf1ff;background:#09111f;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer;border:0}input{outline:0}.hidden{display:none!important}.login-screen{min-height:100vh;display:grid;place-items:center;background:radial-gradient(ellipse at 65% 30%,#194b77 0%,#0c1b31 38%,#070c16 100%);padding:20px}.login-card{max-width:420px;width:100%;padding:42px 38px;text-align:center;background:#122238e8;border:1px solid #36516c;border-radius:26px;box-shadow:0 30px 90px #0008}.brand-logo{background:linear-gradient(150deg,#34daff,#297cfc);box-shadow:0 0 40px #2e9bfc66;color:#fff;font:900 48px Arial;border-radius:25px;width:92px;height:92px;display:grid;place-items:center;margin:auto}.login-card h1{letter-spacing:3px;margin:24px 0 5px}.login-card h1 span,.brand-name span{color:#52cafa;font-size:.45em;letter-spacing:1px}.login-card p{color:#94aeca}.login-card form{display:grid;gap:13px;margin:32px 0}.login-card input,.modal input,.modal textarea{background:#0c1929;border:1px solid #30425a;padding:14px;color:#fff;border-radius:12px;width:100%;margin-bottom:9px}.login-card small{color:#6784a2}.primary,.send{border-radius:12px;background:linear-gradient(135deg,#1cb5ed,#3478fc);color:white;font-weight:700;padding:13px 18px}.shell{height:100dvh;display:grid;grid-template-columns:355px minmax(0,1fr)}.sidebar{background:#101d30;border-left:1px solid #293a50;display:flex;flex-direction:column;min-height:0}.side-head,.thread-head{height:80px;display:flex;align-items:center;gap:13px;padding:16px 22px;border-bottom:1px solid #273b54;flex-shrink:0}.small-logo{background:linear-gradient(135deg,#32d2f4,#3276ec);width:43px;height:43px;border-radius:14px;display:grid;place-items:center;font-size:27px;font-weight:900}.brand-name{font-size:20px;font-weight:900;white-space:nowrap}.brand-name span{display:block;font-size:10px}.icon-btn{background:transparent;color:#a6c8e8;font-size:25px;padding:7px;border-radius:10px}.icon-btn:hover,.text-btn:hover{background:#243b56}.side-head .icon-btn{margin-right:auto}.search{display:flex;gap:8px;padding:17px 14px}.search input{background:#1d3047;border:0;color:#fff;padding:14px;width:100%;border-radius:12px}.round{width:46px;flex-shrink:0;border-radius:12px;background:#236ca4;color:#fff;font-size:27px}.list-title{color:#83a6c7;padding:5px 22px 13px;font-size:12px}.chats{overflow:auto;flex:1}.chat{width:100%;text-align:right;background:transparent;display:flex;align-items:center;gap:13px;padding:15px 18px;color:#dcecff;border-right:3px solid transparent}.chat:hover{background:#1c3047}.chat.active{background:#1a3753;border-right-color:#35c6fc}.avatar{flex-shrink:0;width:49px;height:49px;background:linear-gradient(145deg,#29569a,#1b9aab);border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:900;font-size:22px;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.chat-info{min-width:0;flex:1}.chat-info strong,.chat-info small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-info small{margin-top:6px;color:#89a5bd}.sidebar-foot{padding:18px;display:flex;align-items:center;gap:9px;color:#6f9bba;font-size:11px;border-top:1px solid #243850}.live-dot{width:8px;height:8px;background:#46dca9;border-radius:50%}.text-btn{background:transparent;color:#bed8ed;margin-right:auto}.conversation{min-width:0;background:radial-gradient(circle at 40% 20%,#142f4b,#091625 70%)}.empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#a3bad2}.empty-art .brand-logo{width:110px;height:110px;border-radius:32px;font-size:68px}.empty h2{color:#f0f7ff;margin:30px 0 2px}.thread{display:flex;flex-direction:column;height:100%}.thread-head{background:#102039}.peer-info{display:flex;flex-direction:column;flex:1;gap:6px}.peer-info span{font-size:12px;color:#83a8c5}.messages{flex:1;overflow-y:auto;padding:25px max(5%,24px);display:flex;flex-direction:column;gap:10px}.bubble{max-width:min(72%,650px);align-self:flex-start;background:#1d334c;color:#f0f5ff;padding:11px 14px;border-radius:16px 16px 16px 4px;line-height:1.8;overflow-wrap:anywhere;white-space:pre-wrap}.bubble.mine{align-self:flex-end;background:#1b567c;border-radius:16px 16px 4px 16px}.bubble time{font-size:10px;color:#a8c9dc;display:block;text-align:left;direction:ltr}.bubble img,.bubble video{max-width:100%;max-height:300px;border-radius:10px;display:block;margin:6px 0}.bubble a{color:#8bd9fa}.composer{background:#102039;border-top:1px solid #28415a;padding:14px 25px;display:flex;gap:12px;align-items:center}.composer input[type=text],#messageInput{flex:1;border:0;border-radius:12px;background:#1a324b;padding:15px;color:#fff;min-width:0}.attachment{cursor:pointer;font-size:30px;color:#80cfff}.send{font-size:20px}.modal-back{position:fixed;inset:0;background:#000a;z-index:20;display:grid;place-items:center;padding:15px}.modal{width:min(510px,100%);max-height:90dvh;overflow:auto;background:#122338;border:1px solid #42617b;border-radius:19px;padding:24px}.modal-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.modal-top h3{margin:0}.modal label{display:block;margin:15px 0 7px;font-size:13px;color:#a3c1d9}.modal textarea{min-height:85px;resize:vertical}.modal button.primary{margin-top:12px}.user-item{width:100%;display:flex;gap:10px;align-items:center;background:#1b3149;color:#fff;border-radius:12px;padding:12px;margin:6px 0;text-align:right}.user-item:hover{background:#294a6b}.user-item small{color:#9db3c8;display:block}.admin-row{background:#1a2c41;border-radius:10px;padding:12px;margin:8px 0}.admin-row button{padding:8px;border-radius:8px;background:#315778;color:white;margin:3px}.danger{background:#d74458;color:white;padding:12px 19px;border-radius:12px}.call-panel{position:fixed;z-index:30;inset:0;background:#060d18ed;display:grid;place-items:center;padding:15px}.call-box{text-align:center;background:#13243b;border:1px solid #32577c;padding:24px;border-radius:20px;width:min(680px,100%)}.call-box .brand-logo{width:65px;height:65px;font-size:34px}.videos{display:flex;gap:10px;margin:18px 0}.videos video{background:#080f1a;border-radius:14px;min-width:0;flex:1;width:45%;height:210px;object-fit:cover}.call-actions{display:flex;justify-content:center;gap:12px}.mobile-back{display:none}#toast{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:100;color:white;background:#d14b58;padding:12px 25px;border-radius:12px;display:none}@media(max-width:740px){.shell{display:block}.sidebar,.conversation{width:100%;height:100dvh}.shell.thread-open .sidebar{display:none}.shell:not(.thread-open) .conversation{display:none}.mobile-back{display:block}.side-head{height:74px}.composer{padding:12px}.messages{padding:14px}.bubble{max-width:88%}.videos video{height:160px}}
/* OPNET 2.0 visual system — desktop & mobile */
:root{--ink:#eaf4ff;--muted:#8da5bc;--accent:#49baff;--stroke:rgba(150,195,244,.12);--surface:#121f31;--surface2:#172a40;--glass:rgba(17,31,48,.92);font-family:Inter,'Segoe UI',Tahoma,Arial,sans-serif;color:var(--ink);color-scheme:dark}
body{background:#07101d;letter-spacing:-.15px}button{transition:background .2s,transform .2s,box-shadow .2s}button:active{transform:scale(.97)}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #50bcff;outline-offset:2px}
.shell{grid-template-columns:370px minmax(0,1fr);background:#0a1321}
.sidebar{background:linear-gradient(170deg,#142137 0%,#0d192a 70%,#0d1828 100%);border-left:1px solid var(--stroke)}
.side-head{height:88px;padding:18px 23px;border-bottom:1px solid var(--stroke);gap:14px}
.small-logo{width:49px;height:49px;background:linear-gradient(145deg,#67d6fc,#2c84e9);box-shadow:0 7px 25px #2789da45;font-size:19px;letter-spacing:-2px;border-radius:17px}
.brand-name{font-size:20px;letter-spacing:1.5px;line-height:1.2}.brand-name span{font-size:9px;letter-spacing:2px;margin-top:6px;color:#80a6d0}
.icon-btn{border:1px solid transparent;display:inline-grid;place-items:center;min-width:42px;height:42px;line-height:1;font-size:23px;color:#c1d8ef}
.icon-btn:hover{background:#223b58;border-color:var(--stroke);color:#fff}
.search{padding:21px 17px 13px;gap:11px}.search input{border:1px solid #273e55;background:#1b2c42;border-radius:15px;padding:15px 18px;transition:border-color .2s}.search input:focus{border-color:#58bffe}.search input::placeholder{color:#7691ab}
.round{background:linear-gradient(145deg,#31b5ee,#337bf0);box-shadow:0 7px 22px #247ee141;border-radius:15px;font-size:30px}
.list-title{display:flex;justify-content:space-between;align-items:center;color:#c8def2;padding:12px 23px 14px;font-size:13px}.list-title span{color:#8fbad6;background:#243a54;border-radius:30px;padding:2px 9px}
.chat{margin:3px 11px;width:calc(100% - 22px);border:1px solid transparent;border-right:3px solid transparent;padding:13px 12px;border-radius:16px;gap:13px;min-height:77px}.chat.active{background:linear-gradient(100deg,#1d4e71,#1b3959);border-color:#2b6287;border-right-color:#5bc9ff;box-shadow:0 4px 20px #0a172477}.chat:not(.active):hover{background:#1d3048}.avatar{background:linear-gradient(145deg,#2d91c4,#3458a5);border:2px solid #ffffff18;width:52px;height:52px;font-size:22px}.chat-info strong{font-weight:700;font-size:14px;color:#eff8ff}.chat-info small{font-size:12px;margin-top:7px;color:#8eabc5}.sidebar-foot{background:#0e1a2b;min-height:65px;border-top:1px solid var(--stroke);padding:20px 23px}.live-dot{box-shadow:0 0 0 5px #48dda218}.text-btn{font-weight:600}
.conversation{background:radial-gradient(circle at 50% 10%,#1b344c 0%,#101f31 48%,#0b1625 90%);position:relative}.conversation:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.20;background-image:radial-gradient(#82b1c2 .7px,transparent .7px);background-size:28px 28px}
.thread,.empty{position:relative;z-index:1}.empty{text-align:center}.empty-art .brand-logo{width:115px;height:115px;font-size:38px;letter-spacing:-4px;border-radius:36px;box-shadow:0 25px 80px #238dda37}.empty h2{font-size:25px}.empty p{max-width:320px;line-height:2}
.thread-head{height:84px;background:var(--glass);backdrop-filter:blur(15px);border-bottom:1px solid var(--stroke);padding:16px 28px}.thread-head .avatar{height:49px;width:49px}.peer-profile-trigger{background:none;color:inherit;text-align:right;border:0;cursor:pointer}.peer-profile-trigger:hover strong{color:#67d1ff}.peer-info strong{font-size:16px}.peer-info span{font-size:12px;color:#8faecb}.thread-head>.icon-btn{font-size:24px;background:#1a3049;border:1px solid #ffffff0b}.thread-head>.icon-btn:hover{background:#265477;color:#fff}
.messages{gap:12px;padding:30px max(7%,32px)}.bubble{box-shadow:0 5px 16px #0002;max-width:min(72%,620px);background:linear-gradient(155deg,#223951,#1b3049);border:1px solid #ffffff0c;padding:11px 16px;border-radius:18px 18px 18px 5px;font-size:14px;line-height:1.9}.bubble.mine{background:linear-gradient(160deg,#1c709a,#225a88);border-color:#72c9f421;border-radius:18px 18px 5px 18px}.bubble time{font-size:10px;opacity:.7;margin-top:3px}.bubble img{border-radius:12px}
.composer{background:var(--glass);backdrop-filter:blur(16px);border-top:1px solid var(--stroke);padding:17px 27px;gap:15px}.composer #messageInput{padding:17px 20px;background:#1d324b;border:1px solid #304c64;border-radius:17px;font-size:14px}.composer #messageInput:focus{border-color:#57bafe}.attachment{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#1c344c;font-size:26px;flex-shrink:0}.send{width:51px;height:49px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(140deg,#3ac1ec,#3577ec);box-shadow:0 5px 20px #138acb35}.send:hover,.primary:hover{filter:brightness(1.12)}
.modal-back{backdrop-filter:blur(12px);background:rgba(3,9,18,.78)}.modal{background:linear-gradient(155deg,#1a2a40,#111f32);border:1px solid #3a5570;border-radius:24px;box-shadow:0 30px 100px #0008;padding:25px;width:min(530px,100%);scrollbar-width:thin}.modal-top{border-bottom:1px solid #ffffff14;padding-bottom:16px}.modal-top h3{font-size:18px}.modal input,.modal textarea,.modal select{background:#112035;border:1px solid #354d64;color:#fff;border-radius:12px;padding:13px;width:100%}.modal hr{border:0;border-top:1px solid #ffffff18;margin-top:24px}.modal label{color:#a9c9df}.primary{background:linear-gradient(120deg,#2daee1,#3975e9);border-radius:13px;box-shadow:0 5px 20px #155b8d30}.full-width{width:100%}
.contact-profile{overflow:hidden}.profile-cover{height:116px;background:radial-gradient(circle at 40% 0%,#299cce,#21547d 50%,#1a3452);border-radius:18px;position:relative;display:flex;align-items:flex-start;padding:18px;color:#dbf7ff;font-size:10px;letter-spacing:2px;direction:ltr}.profile-cover:after{content:'OPNET';font-size:58px;font-weight:900;letter-spacing:8px;position:absolute;left:10px;bottom:-18px;color:#ffffff10}.profile-main{text-align:center;margin-top:-38px;position:relative}.profile-avatar{margin:auto;width:82px;height:82px;font-size:36px;border:5px solid #15263a;box-shadow:0 7px 25px #0007}.profile-main h2{font-size:22px;margin:12px 0 6px}.profile-handle{color:#8ebcdb;margin:0;direction:ltr}.profile-tag{display:inline-block;background:#1e506b;color:#a6e7ff;font-size:11px;margin-top:15px;border-radius:20px;padding:7px 15px}.profile-about{background:#102138;border:1px solid #2c445e;padding:17px;border-radius:15px;margin:20px 0;color:#d6e9f9;line-height:1.9;overflow-wrap:anywhere}.profile-about small{display:block;color:#84b3d3;margin-bottom:7px}.profile-about p{margin:0}
.call-panel{background:#030b16e8;backdrop-filter:blur(19px)}.call-box{width:min(780px,100%);padding:33px;border-radius:28px;background:radial-gradient(circle at 50% 0%,#224b6c,#152a42 50%,#101d31);box-shadow:0 25px 100px #0009;border-color:#3c617e}.call-box .brand-logo{height:83px;width:83px;font-size:29px;border-radius:27px;letter-spacing:-4px}.call-box h2{font-size:23px;margin:20px 0 8px}.call-box p{color:#a9c8e3}.call-panel.incoming .call-box .brand-logo{animation:incoming-pulse 1.4s infinite alternate}.call-timer{min-height:24px;direction:ltr;color:#75d8ff;font-variant-numeric:tabular-nums}.videos{background:#0b1727;border-radius:21px;padding:10px;gap:10px;border:1px solid #ffffff12}.videos video{height:270px;background:#0a121e;border-radius:16px;object-fit:cover}.call-actions{flex-wrap:wrap;margin-top:22px;gap:13px}.call-actions .icon-btn{width:48px;height:48px;border-radius:50%;background:#2b425f}.call-actions .icon-btn.off{background:#ad384c}.call-actions button{min-height:46px}.call-actions .danger{background:#e04563;border-radius:30px;padding:12px 26px}.call-actions .primary{border-radius:30px;padding:12px 25px}
.login-screen{background:radial-gradient(ellipse at 40% 15%,#245b81,#0b1a2c 60%,#080f1d);}.login-card{border-radius:29px;border-color:#385876;background:linear-gradient(145deg,#182d46e8,#101d30ed);box-shadow:0 40px 130px #0008}.login-card .brand-logo{font-size:32px;letter-spacing:-5px}.login-card input{padding:16px;border-radius:14px}.login-card h1{font-size:25px}
@keyframes incoming-pulse{to{transform:scale(1.08);box-shadow:0 0 45px #3aacff9c}}
@media(max-width:900px){.shell{grid-template-columns:305px minmax(0,1fr)}.side-head{padding:14px}.brand-name{font-size:17px}.messages{padding:22px 20px}}
@media(max-width:740px){.shell{display:block}.sidebar,.conversation{height:100dvh}.side-head{height:77px;padding:13px 16px}.search{padding:13px}.chat{margin:2px 10px;min-height:76px}.thread-head{height:75px;padding:12px;gap:7px}.thread-head .avatar{width:42px;height:42px}.thread-head .icon-btn{min-width:38px;width:38px;height:38px;font-size:20px}.thread-head .peer-info strong{font-size:14px}.messages{padding:18px 12px;gap:9px}.bubble{max-width:86%;font-size:13px}.composer{padding:10px;gap:8px;padding-bottom:max(11px,env(safe-area-inset-bottom))}.composer #messageInput{padding:13px}.send{width:45px;height:45px}.attachment{width:39px;height:43px}.modal{padding:20px;border-radius:20px;max-height:90dvh}.call-box{padding:21px 12px;border-radius:22px}.videos video{height:190px}.call-actions{gap:7px}.call-actions .danger,.call-actions .primary{padding:11px 18px}.mobile-back{display:grid}}

/* OPNET v2.1 call and contact polish */
.call-avatar{width:96px;height:96px;font-size:35px;margin:0 auto;border:4px solid #ffffff33;box-shadow:0 0 0 14px #55bfff12,0 20px 60px #0007}.call-panel.incoming .call-avatar{animation:incoming-pulse 1.2s ease-in-out infinite alternate}.from-peer{cursor:pointer}.from-peer:hover{outline:1px solid #57bfff65}.peer-profile-trigger{min-width:0}.peer-info strong,.peer-info span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.contact-profile .profile-avatar{width:100px;height:100px}.modal{width:min(560px,100%)}#peerAvatar:hover{box-shadow:0 0 0 3px #50baff44}

/* OPNET 2.2 immersive calling, reliable scalable icons, voice recording */
.icon-btn svg,.voice-record svg{display:block;width:21px;height:21px;flex:none}.icon-btn{font-size:initial;vertical-align:middle;align-items:center;justify-content:center}.icon-btn:disabled{opacity:.4;cursor:not-allowed}
.call-panel{padding:0;background:#030b14;place-items:stretch;z-index:80}.call-box{width:100%;height:100dvh;min-height:0;border:0;border-radius:0;padding:24px 28px max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;position:relative;background:radial-gradient(ellipse at 50% 0%,#16324e,#07101b 75%)}
.call-brand{position:absolute;left:32px;top:23px;font-weight:900;letter-spacing:2px;font-size:17px;color:#e3f7ff;direction:ltr}.call-brand span{display:block;color:#79a9cd;font-size:9px;letter-spacing:3px;margin-top:4px}
.call-box .call-avatar{width:62px;height:62px;font-size:22px;margin:1px auto 8px;box-shadow:0 0 0 6px #4cbdff12}.call-box h2{margin:4px 0;font-size:20px}.call-box p{margin:5px 0;color:#a9c6db}.call-timer{min-height:20px;color:#6dd1ff}
.videos{direction:ltr;position:relative;flex:1;min-height:0;width:100%;max-width:none;margin:10px 0 16px;display:block;border:1px solid #28415a;border-radius:22px;overflow:hidden;background:#02070c}.videos .remote-stage{position:absolute;inset:0;background:#05090e;display:grid;place-items:center}.videos .remote-stage video{height:100%;width:100%;max-width:none;border-radius:0;object-fit:contain;background:#05090e}.remote-placeholder{position:absolute;color:#89a8c2;font-size:14px;pointer-events:none}.videos .local-stage{position:absolute;bottom:22px;right:22px;width:clamp(125px,19vw,260px);height:clamp(170px,26vh,300px);border:2px solid #4c7797;border-radius:18px;overflow:hidden;background:#0e2237;box-shadow:0 16px 40px #0009;z-index:2}.videos .local-stage video{width:100%;height:100%;object-fit:cover;border-radius:0;transform:scaleX(-1)}.local-stage span{position:absolute;bottom:9px;left:9px;background:#09182ec7;border-radius:8px;padding:4px 10px;font-size:11px}
.call-actions{display:flex;justify-content:center;align-items:center;gap:14px;margin:0;flex-wrap:wrap}.call-actions .icon-btn{width:54px;height:54px;border:1px solid #36516c;border-radius:50%;background:#1d314c;color:white}.call-actions .icon-btn.off{background:#af3853}.call-actions #hangup{height:54px;border-radius:30px;padding:0 30px}.call-actions .primary{height:54px;border-radius:30px}.call-panel:not(.video-call) .videos{max-height:0;border:0;margin:0;flex:0}.call-panel:not(.video-call) .call-box{justify-content:center;gap:16px}.call-panel:not(.video-call) .call-avatar{width:120px;height:120px;font-size:38px}
#notifyBtn{min-width:30px;width:36px;height:36px;margin:0 0 0 5px;padding:7px}.voice-record{min-width:44px;background:#1b344e;border:1px solid #37516c}.voice-record.recording{color:#fff;background:#b52b4c;animation:recordflash 1.2s infinite}.record-status{font-size:12px;color:#ffb1c2;white-space:nowrap}@keyframes recordflash{50%{filter:brightness(1.5)}}
@media(max-width:740px){.call-box{padding:16px 12px max(14px,env(safe-area-inset-bottom))}.call-brand{top:12px;left:12px;font-size:13px}.call-box .call-avatar{width:56px;height:56px}.call-box h2{font-size:17px}.videos{border-radius:15px;margin:9px 0 12px}.videos .local-stage{right:10px;bottom:12px;width:116px;height:165px;border-radius:12px}.call-actions{gap:8px}.call-actions .icon-btn{height:46px;width:46px}.call-actions #hangup{height:46px;padding:0 16px}.record-status{font-size:10px}.composer{gap:6px}.voice-record{min-width:38px;width:38px;height:40px}}

/* 2.3 Android-safe SVG controls and notification status */
.icon-btn svg,.call-actions svg{width:22px;height:22px;display:block;fill:none;stroke:currentColor;flex-shrink:0}
.call-actions button{display:inline-flex;align-items:center;justify-content:center;touch-action:manipulation;min-width:46px}
#notifyBtn.notification-enabled{color:#64e0b7;background:#143b39}
.search-note{color:#a2b9cf;line-height:1.8;margin:0 0 14px}
#peopleList{margin-top:12px}
@media(max-width:740px){.call-actions{gap:7px}.call-actions .icon-btn{flex:0 0 44px}.call-actions #hangup{min-width:50px;padding:0 14px}}

/* v2.4: deterministic full-screen call layout. Overrides all legacy 2.2/2.3 video rules. */
#callPanel.video-call .call-box{position:fixed!important;inset:0!important;width:100%!important;height:100dvh!important;max-height:100dvh!important;padding:0!important;display:block!important;overflow:hidden!important;border:0!important;border-radius:0!important;background:#050c16!important}
#callPanel.video-call .videos{position:absolute!important;inset:0!important;margin:0!important;padding:0!important;width:100%!important;height:100%!important;max-height:none!important;min-height:100%!important;display:block!important;overflow:hidden!important;border:0!important;border-radius:0!important;background:#050c16!important;flex:none!important}
#callPanel.video-call .remote-stage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:block!important;overflow:hidden!important}
#callPanel.video-call #remoteVideo{position:absolute!important;inset:0!important;display:block!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important;background:#050c16!important;flex:none!important;transform:none!important}
#callPanel.video-call .local-stage{position:absolute!important;z-index:5!important;top:calc(72px + env(safe-area-inset-top))!important;right:14px!important;bottom:auto!important;left:auto!important;width:clamp(115px,24vw,190px)!important;height:clamp(155px,27vh,240px)!important;overflow:hidden!important;border:2px solid #6bbdf1!important;border-radius:16px!important}
#callPanel.video-call #localVideo{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;max-height:none!important;transform:scaleX(-1)!important}
#callPanel.video-call .call-brand{z-index:7;top:calc(16px + env(safe-area-inset-top));left:18px;text-shadow:0 2px 10px #000}
#callPanel.video-call .call-avatar,#callPanel.video-call #callName,#callPanel.video-call #callStatus,#callPanel.video-call #callTimer{position:absolute!important;z-index:6;left:18px;text-align:left;pointer-events:none;text-shadow:0 2px 10px #000}
#callPanel.video-call .call-avatar{top:calc(74px + env(safe-area-inset-top));width:48px;height:48px;margin:0;font-size:17px}
#callPanel.video-call #callName{top:calc(122px + env(safe-area-inset-top));margin:0;font-size:17px}
#callPanel.video-call #callStatus{top:calc(150px + env(safe-area-inset-top));font-size:12px;margin:0}
#callPanel.video-call #callTimer{top:calc(177px + env(safe-area-inset-top));font-size:12px;margin:0}
#callPanel.video-call .call-actions{position:absolute!important;z-index:12!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;padding:18px 12px max(22px,env(safe-area-inset-bottom))!important;background:linear-gradient(transparent,#010712e8 30%,#010712f5)!important;display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:10px!important}
#callPanel.video-call .remote-placeholder{position:absolute;top:45%;left:0;width:100%;text-align:center}
#callPanel button{touch-action:manipulation}#callPanel .icon-btn svg{pointer-events:none}
#callPanel .icon-btn:disabled{opacity:.45}#callPanel button:focus-visible{outline:3px solid #6dd5ff;outline-offset:2px}
@media(max-width:740px){#callPanel.video-call .call-actions .icon-btn{width:49px!important;height:49px!important;min-width:49px!important;flex:none!important}#callPanel.video-call #hangup{height:49px!important;min-width:55px!important}#callPanel.video-call .local-stage{width:115px!important;height:154px!important}#callPanel.video-call .call-brand{font-size:12px}}

/* v2.5: separate actual voice and video call states; prevent collapsed media strip */
#callPanel.audio-call .videos,#callPanel:not(.video-call) .videos{display:none!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;overflow:hidden!important}
#callPanel.video-call .videos{display:block!important;position:absolute!important;inset:0!important;width:100vw!important;height:100dvh!important;min-height:100dvh!important;margin:0!important;overflow:visible!important}
#callPanel.video-call .remote-stage{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
#callPanel.video-call #remoteVideo{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:contain!important}
#callPanel.video-call .local-stage{display:block!important;position:absolute!important;z-index:8!important;top:calc(env(safe-area-inset-top) + 75px)!important;right:14px!important;bottom:auto!important;width:118px!important;height:165px!important;overflow:hidden!important}
#callPanel #hangup{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:55px!important;width:55px!important;height:55px!important;padding:0!important;border-radius:50%!important;background:#e63b63!important;color:#fff!important}
#callPanel #hangup svg{width:28px!important;height:28px!important;fill:none!important;stroke:currentColor!important;display:block!important}
#callPanel .call-actions{z-index:15!important}