:root{--teal:#064B57;--deep:#003d48;--orange:#ff6324;--text:#063648;--muted:#627992;--soft:#f2f6f8;--line:#e2eaf0;--green:#17a137;--red:#f34f26;--side:244px;--header:80px;--footer:104px;font-family:Arial,"Segoe UI",sans-serif;color:var(--text)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#f3f7f9}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffb388;outline-offset:2px}button{border:0}svg{height:22px;width:22px;flex-shrink:0;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}.hidden{display:none!important}.muted{color:var(--muted)}.orange{color:var(--orange)}.green{color:var(--green)}.tag{padding:4px 8px;background:#e9f3f7;border-radius:12px}.text-btn{background:transparent;color:#1373cf;font-size:13px;padding:4px 2px}.app{min-height:100vh;display:grid;grid-template-columns:var(--side) minmax(0,1fr);grid-template-rows:var(--header) minmax(calc(100vh - var(--header) - var(--footer)),auto) var(--footer)}
.topbar{grid-column:1/-1;grid-row:1;background:white;display:flex;align-items:center;gap:24px;padding:0 28px;box-shadow:0 1px 0 #dce6eb;z-index:2}.brand{width:calc(var(--side) - 12px);flex-shrink:0;display:flex;align-items:flex-start;gap:2px;color:#00515a;letter-spacing:-2px;font-size:44px;font-weight:750;line-height:1}.brand-arcs{width:40px;height:40px;color:var(--orange);stroke-width:6;margin:-2px 0 0 -1px}.global-search{height:46px;max-width:620px;width:100%;background:linear-gradient(#f8fbfd,#f4f7f9);border:1px solid #dbe4eb;border-radius:9px;display:flex;align-items:center;padding:0 12px;gap:11px;color:#60758c}.global-search input{min-width:0;width:100%;background:none;border:0;outline:none;color:var(--text);font-size:15px}.search-shortcut{white-space:nowrap;background:#e9eef3;border-radius:5px;padding:5px 8px;font-size:14px;color:#567088}.right-head{margin-left:auto;display:flex;align-items:center;gap:20px;white-space:nowrap}.head-icon{background:transparent;color:#004255;position:relative;padding:8px}.badge{position:absolute;right:-3px;top:0;background:var(--orange);color:#fff;font-size:12px;border-radius:12px;min-width:20px;height:20px;display:grid;place-items:center;font-weight:700}.head-sep{width:1px;height:39px;background:#e8edf1}.avatar{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;background:linear-gradient(140deg,#036171,#002c35);color:white;font-size:18px}.user{display:flex;align-items:center;gap:11px;min-width:180px}.user strong{font-size:16px;font-weight:650}.user small{color:var(--muted);display:block;margin-top:4px;font-size:14px}.dropdown{display:flex;align-items:center;gap:9px;padding:12px;border-radius:9px;background:#fff;border:1px solid #dce6ec;font-weight:600;white-space:nowrap}.dot{height:14px;width:14px;border-radius:50%;display:inline-block;background:var(--green);flex:none}.dot.away{background:#ffbc12}.dot.busy{background:#ef4a36}.dot.offline{background:#97a8b2}.tiny-svg{width:16px;height:16px}.availability{position:relative}.availability-menu{position:absolute;right:0;top:50px;background:white;border:1px solid #dce6ec;box-shadow:0 8px 20px #1c415633;border-radius:8px;min-width:180px;z-index:10;padding:7px}.availability-menu button{width:100%;background:transparent;text-align:left;padding:10px;display:flex;gap:9px;align-items:center;border-radius:6px}.availability-menu button:hover{background:#f1f6f8}
.sidebar{grid-column:1;grid-row:2;background:linear-gradient(155deg,#034957 0%,#034b58 42%,#003341 100%);color:white;position:relative;overflow:hidden;min-height:0}.sidebar::before{content:"";position:absolute;bottom:95px;left:-245px;width:540px;height:220px;border-radius:50%;border:50px solid #03596d;transform:rotate(-29deg);opacity:.72;pointer-events:none}.sidebar::after{content:"";position:absolute;bottom:72px;left:-150px;width:440px;height:110px;border-radius:50%;border-bottom:31px solid #ff651f;transform:rotate(-22deg);opacity:.98;pointer-events:none}.navinner{position:relative;z-index:1;padding:30px 14px 18px;height:100%;display:flex;flex-direction:column}.menu{display:grid;gap:5px}.navitem{height:51px;width:100%;display:flex;align-items:center;gap:24px;border-radius:8px;background:transparent;color:white;text-align:left;padding:0 16px;font-size:16px}.navitem svg{width:24px;height:24px}.navitem.selected{background:#ff6425}.navitem:hover:not(.selected){background:#ffffff17}.navitem .bubble{margin-left:auto;border-radius:30px;background:var(--orange);height:28px;min-width:28px;display:grid;place-items:center}.collapse{margin-top:auto;background:transparent;display:flex;align-items:center;gap:15px;color:white;font-size:15px;padding:15px 20px;text-align:left}.collapse svg{height:20px}
.main{grid-column:2;grid-row:2;padding:22px 21px 18px;min-width:0;min-height:0}.panel{background:white;border:1px solid #e2eaf0;border-radius:9px;min-width:0;box-shadow:0 1px 2px #becbd313}.dial-layout{display:grid;grid-template-columns:minmax(420px,.82fr) minmax(500px,1fr);gap:13px;min-height:795px}.dial-card{padding:23px 16px 20px;display:flex;flex-direction:column}.card-title{display:flex;align-items:center;justify-content:space-between;padding:1px 18px}.card-title h1{font-size:35px;letter-spacing:-1px;margin:0 0 7px;font-weight:700}.card-title p{font-size:16px;margin:0;color:#617894}.iconbtn{height:42px;width:42px;border:1px solid #e5ecf1;background:#fbfdfe;border-radius:10px;color:#0c4252;display:inline-grid;place-items:center}.inputwrap{margin:30px 0 20px;background:#f3f6f8;border-radius:14px;padding:11px;height:87px;display:flex;align-items:center}.numberbox{height:62px;width:100%;background:white;border-radius:10px;display:flex;align-items:center;padding:0 15px;box-shadow:0 3px 12px #163d550a}.country{display:flex;align-items:center;gap:10px;border-right:1px solid #e4ebf0;padding-right:15px;margin-right:15px;font-size:18px;font-weight:700}.numberbox input{font-size:19px;border:0;min-width:0;flex:1;outline:0;background:transparent}.numberbox input::placeholder{color:#7d91a4}.clearbtn{background:#98a6b2;color:white;border-radius:5px;width:22px;height:22px;display:grid;place-items:center;font-weight:800}.keypad{display:grid;grid-template-columns:repeat(3,96px);grid-template-rows:repeat(4,96px);justify-content:center;gap:11px 42px}.key{width:96px;height:96px;border-radius:50%;background:radial-gradient(circle at 50% 10%,#f5f8fa,#eaf0f4);display:flex;align-items:center;justify-content:center;flex-direction:column;color:#003d4c}.key:hover{background:#e3eef2}.key strong{font-weight:600;font-size:37px;line-height:43px}.key small{font-size:14px;color:#58728d;height:19px}.dial-actions{display:grid;grid-template-columns:repeat(3,1fr);max-width:390px;width:100%;align-items:end;gap:22px;margin:21px auto 0}.dial-action{background:transparent;display:flex;align-items:center;justify-content:center;gap:10px;flex-direction:column;color:#003747;font-size:16px;font-weight:600;white-space:nowrap}.dial-action .actiondisc{height:78px;width:78px;border-radius:50%;background:#f1f6f8;display:grid;place-items:center}.dial-action .actiondisc svg{width:29px;height:29px;fill:currentColor;stroke-width:1.3}.dial-action.primary .actiondisc{height:94px;width:94px;background:var(--orange);color:white}.dial-action.primary .actiondisc svg{width:40px;height:40px}.dial-right{display:grid;grid-template-rows:auto minmax(0,1fr);gap:16px;min-width:0}.state-card{min-height:170px;padding:23px 26px;position:relative;overflow:hidden;background:linear-gradient(120deg,#f9fbfd,#f5f9fb);border:1px solid #dfe8ee}.state-card .large-avatar{height:89px;width:89px;border-radius:50%;background:#dfeaf0;display:grid;place-items:center;font-size:37px;font-weight:500}.state-top{display:flex;align-items:center;gap:25px}.state-top h2{font-size:21px;margin:0 0 8px}.state-top p{font-size:15px;color:#607895;margin:0}.watermark{position:absolute;right:25px;top:25px;color:#f3cabc;opacity:.62;pointer-events:none}.watermark svg{width:100px;height:100px;stroke-width:5}.state-collapse{position:absolute;right:22px;bottom:12px;background:transparent;color:#66819d}.call-controls{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.call-controls button{background:#e9f1f5;border:1px solid #dce6ec;border-radius:7px;padding:9px 11px;display:flex;align-items:center;gap:6px;color:#194657}.call-controls button.cta{background:var(--orange);border-color:var(--orange);color:white}.call-controls button.hangup{background:#e94f47;border-color:#e94f47;color:white}.call-controls svg{height:17px;width:17px}.recent{display:flex;flex-direction:column;min-height:0;padding:0 13px 8px;overflow:hidden}.tabsrow{display:flex;align-items:center;gap:28px;min-height:63px;border-bottom:1px solid #ebeff2;min-width:0}.tabs{display:flex;align-items:stretch;gap:22px;height:100%}.tab{color:#627991;font-size:15px;background:none;position:relative;padding:0 8px;white-space:nowrap}.tab.active{color:#06374a;font-weight:700}.tab.active::after{position:absolute;content:"";bottom:0;left:2px;right:2px;height:3px;background:var(--orange);border-radius:3px 3px 0 0}.search-sm{display:flex;align-items:center;gap:7px;border:1px solid #dce7ee;border-radius:8px;height:40px;min-width:145px;width:210px;padding:0 8px;margin-left:auto;color:#6d879b}.search-sm input{border:0;outline:0;background:transparent;min-width:0;width:100%;font-size:13px}.list-filter{margin-left:-13px;background:transparent;color:#456c81;padding:7px}.call-list{overflow:auto;min-height:0;flex:1;scrollbar-width:thin}.callrow{height:62px;display:grid;grid-template-columns:52px minmax(135px,1.6fr) 25px minmax(130px,1.25fr) 55px 30px 18px;gap:9px;align-items:center;border-bottom:1px solid #edf1f5;padding:3px 7px;font-size:14px}.callrow:hover{background:#f7fafc}.round-person{height:49px;width:49px;border-radius:50%;background:#e9f0f3;color:#13485b;display:grid;place-items:center;font-size:21px;font-weight:600}.callwho{min-width:0}.callwho strong{font-size:15px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px}.callwho small{font-size:14px;color:#647b94;white-space:nowrap}.callwhen{font-size:13px;color:#607895;white-space:nowrap}.duration{color:#698099;font-size:14px}.rowaction{background:transparent;color:#003d4a;padding:4px}.rowaction svg{fill:#003d4a;stroke-width:1.5}.arrow-out{color:#11a843;font-size:25px}.arrow-in{color:var(--orange);font-size:25px}
.footer{grid-column:1/-1;grid-row:3;background:white;border-top:1px solid #e6edf0;display:flex;align-items:center;padding:0 28px;gap:0;min-width:0;position:relative;z-index:2}.footitem{height:46px;display:flex;align-items:center;gap:20px;padding:0 30px;border-right:1px solid #dbe6ed;min-width:0}.footitem:first-child{padding-left:3px}.footitem:last-child{margin-left:auto;border-right:0;padding-right:0}.footitem>svg{height:33px;width:33px;color:#004557;fill:#004557;stroke:white;stroke-width:1.2}.footitem strong{font-size:15px;white-space:nowrap}.footitem small{font-size:14px;display:block;color:#6e8399;margin-top:7px;white-space:nowrap}.footdrop{background:transparent;color:#647c92;margin-left:0;padding:3px}.levels{display:flex;align-items:flex-end;gap:3px}.levels i{background:#15ab3a;width:7px;height:17px;border-radius:2px}.levels i:nth-child(n+7){background:#dce5eb}.levels i:nth-child(6){background:linear-gradient(to top,#15ab3a,#dce5eb)}.volume{display:flex;align-items:center;gap:7px}.volume input{width:105px;accent-color:var(--orange)}.quality{color:var(--green);display:flex;gap:4px;align-items:end;height:30px}.quality i{width:5px;background:var(--green);border-radius:2px}.quality i:nth-child(1){height:9px}.quality i:nth-child(2){height:15px}.quality i:nth-child(3){height:21px}.quality i:nth-child(4){height:29px}.quality strong{color:var(--text)}.audio-settings{background:transparent;display:flex;align-items:center;gap:13px;font-weight:600;color:#062e43;white-space:nowrap}.audio-settings svg{height:26px;width:26px;fill:#064b57;stroke:white;stroke-width:1.5}
/* Approved Messages layout */
.messages-layout{display:grid;grid-template-columns:minmax(295px,365px) minmax(365px,1fr) minmax(250px,300px);gap:9px;min-height:795px;align-items:stretch}.conversations{display:flex;flex-direction:column;overflow:hidden}.convo-heading{padding:15px 16px 0}.convo-heading h1{margin:0 0 5px;font-size:28px}.convo-heading p{font-size:15px;color:#627991;margin:0 0 12px}.newmsg{display:flex;align-items:center;justify-content:center;background:var(--orange);color:white;font-size:16px;border-radius:6px;height:41px;width:100%}.newmsg span:first-child{font-size:23px;margin-right:8px}.convsearch{margin:17px 16px 0;display:flex;align-items:center;gap:10px;height:41px;border:1px solid #dae4ec;border-radius:7px;padding:0 11px;color:#6d819a}.convsearch input{width:100%;border:0;outline:0;min-width:0}.convfilters{display:flex;justify-content:space-around;border-bottom:1px solid #e5edf1;height:50px;margin:0 8px;flex:none}.convfilters button{background:transparent;color:#57718e;position:relative;padding:0 7px;font-size:14px}.convfilters button.active{color:#002f44;font-weight:700}.convfilters button.active::after{content:"";height:3px;background:var(--orange);position:absolute;bottom:0;left:0;right:0}.smallbadge{background:var(--orange);color:white;border-radius:50%;height:21px;width:21px;display:inline-grid;place-items:center;margin-left:4px}.convo-list{overflow:auto;flex:1;scrollbar-width:thin}.convo-item{border:0;border-bottom:1px solid #edf1f5;width:100%;height:64px;padding:8px 12px;display:flex;align-items:center;gap:12px;background:white;text-align:left;color:#0a394c}.convo-item.active{background:#eaf6ff}.convo-item:hover{background:#f4f9fc}.convo-item .round-person{width:47px;height:47px;flex:none}.convo-details{min-width:0;flex:1}.convo-details strong{font-size:15px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.convo-details small{font-size:13px;color:#647b93;display:block;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.convo-timestamp{font-size:12px;color:#68839b;white-space:nowrap;text-align:right;align-self:flex-start}.convo-timestamp b{display:grid;place-items:center;width:21px;height:21px;margin:6px 0 0 auto;border-radius:50%;background:var(--orange);color:white}.chatpanel{display:flex;flex-direction:column;min-height:0;overflow:hidden}.chat-head{height:87px;flex:none;padding:10px 15px;display:flex;align-items:center;gap:14px}.chat-head .round-person{width:70px;height:70px;font-size:30px}.chat-title{min-width:0;flex:1}.chat-title strong{font-size:18px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-title small{margin-top:7px;font-size:14px;color:#6f86a0;display:block}.chat-tools{display:flex;gap:8px}.chat-tools .iconbtn{width:42px;height:44px}.chat-tabs{display:flex;align-items:center;height:40px;gap:12px;border-bottom:1px solid #e8eef2;padding:0 12px}.chat-tabs .tab{font-size:14px}.chat-feed{flex:1;overflow:auto;scrollbar-width:thin;padding:13px 16px 15px;background:white;min-height:0}.daymark{text-align:center;margin:0 auto 12px;width:max-content;padding:4px 14px;border-radius:15px;background:#edf2f6;color:#58728c;font-size:12px}.bubble-wrap{display:flex;gap:10px;margin:0 0 14px;align-items:flex-start}.bubble-wrap.mine{justify-content:flex-end}.bubble-wrap .round-person{width:46px;height:46px;font-size:16px}.bubble-wrap .who{font-size:13px;font-weight:700;color:#093849;margin:4px 0 4px}.bubble-wrap .who span{font-size:12px;color:#6e849c;font-weight:400;margin-left:7px}.msgbubble{display:inline-block;background:#f0f4f7;border-radius:11px;padding:10px 13px;line-height:1.4;font-size:14px;max-width:100%;word-break:break-word}.mine .msgbubble{background:#d9efff;max-width:260px}.msgbody{min-width:0;max-width:380px}.mine .msgbody{max-width:280px}.reacts{display:flex;gap:7px;align-items:center;margin:4px 0}.reacts button{background:white;border:1px solid #dce7ef;border-radius:12px;font-size:12px;color:#476580;padding:4px 8px}.filebubble{display:flex;align-items:center;gap:12px;border:1px solid #dce7ed;background:#f6f9fb;padding:10px 12px;border-radius:9px}.filebubble .pdf{background:#ed4139;color:#fff;font-size:10px;font-weight:700;padding:9px 5px;border-radius:3px}.filebubble strong{display:block;font-size:13px}.filebubble small{display:block;margin-top:5px;color:#70859c}.joinbubble{border:1px solid #d5e9f4;background:#eff8fe;padding:12px 13px;border-radius:9px}.joinbubble strong{display:block}.joinbubble a{display:block;margin:6px 0;color:#1574aa;font-size:13px;text-decoration:underline;overflow-wrap:anywhere}.joinbubble button{padding:8px 12px;background:var(--orange);color:white;border-radius:5px;font-weight:600}.composer{height:53px;margin:0 9px 8px;border:1px solid #d9e5ec;border-radius:8px;display:flex;align-items:center;gap:6px;padding:5px 6px 5px 10px}.composer input{border:0;outline:0;min-width:0;flex:1;font-size:14px}.composer button{background:transparent;color:#496f88;display:grid;place-items:center;width:32px;height:38px}.composer button.send{background:#a9bfd1;color:white;border-radius:6px;width:42px}.composer button.send.ready{background:var(--orange)}.composer input:focus+.send{color:#333}.chat-details{padding:15px 16px;overflow:auto;scrollbar-width:thin}.details-top{text-align:center}.details-top .round-person{width:83px;height:83px;font-size:32px;margin:0 auto 7px}.details-top h2{margin:0 0 6px;font-size:19px}.details-top small{color:#6f86a0;font-size:14px}.details-top p{font-size:14px;color:#5c7390;line-height:1.45;max-width:270px;margin:9px auto}.detail-actions{display:flex;justify-content:space-around;padding:12px 0 23px;border-bottom:1px solid #edf0f4}.detail-actions button{border:0;background:transparent;display:flex;align-items:center;flex-direction:column;gap:6px;color:#0a394c;font-size:13px;white-space:nowrap}.detail-actions button span{display:grid;place-items:center;border-radius:50%;height:55px;width:55px;background:#eef4f8}.detail-actions button svg{fill:#05485a;stroke-width:1}.details-section{padding-top:13px}.details-section h3{font-size:14px;margin:0 0 9px}.details-section .membersrow{display:flex;align-items:center;gap:9px;height:39px;border-top:1px solid #edf0f3}.membersrow .round-person{width:29px;height:29px;font-size:12px}.membersrow .name{font-size:12px;min-width:0;flex:1}.membersrow small{display:block;color:#6d819a;font-size:11px;margin-top:3px}.membersrow .presence{font-size:12px;color:#6d819a;display:flex;align-items:center;gap:6px}.membersrow .presence .dot{height:10px;width:10px}.sharefile{border:1px solid #dce6ed;border-radius:8px;display:flex;align-items:center;padding:12px;gap:11px}.sharefile .pdf{background:#f14e3f;color:white;padding:9px 6px;border-radius:3px;font-size:10px}.sharefile strong{font-size:12px}.sharefile small{display:block;color:#6e859c;font-size:11px;margin-top:5px}
.modal-backdrop{position:fixed;inset:0;background:#002b3aa6;z-index:15;display:grid;place-items:center;padding:18px}.modal{width:min(440px,100%);background:white;padding:23px;border-radius:14px;box-shadow:0 20px 60px #00252c44}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.modal-head h2{font-size:22px;margin:0}.modal .field{display:block;margin-bottom:13px;font-weight:600}.modal .field input,.modal .field select{width:100%;height:41px;margin-top:7px;padding:6px 10px;border:1px solid #cddce6;border-radius:7px;background:#fff}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}.btn{padding:11px 16px;border-radius:7px;font-weight:600;background:#eff4f7;color:#064351}.btn.primary{background:var(--orange);color:#fff}.toast{position:fixed;bottom:118px;right:22px;background:#003f4b;color:#fff;padding:12px 16px;box-shadow:0 7px 20px #002b3444;border-radius:9px;max-width:min(430px,90vw);z-index:20;display:none}.toast.show{display:block}.mobile-nav{display:none}
@media(min-width:1650px){.dial-layout,.messages-layout{max-width:1600px;margin:auto}.dial-layout{grid-template-columns:minmax(530px,.82fr) minmax(650px,1fr)}}
@media(max-width:1320px){:root{--side:210px}.topbar{padding:0 18px;gap:13px}.brand{font-size:38px}.brand-arcs{width:35px;height:35px}.navitem{gap:16px;font-size:14px}.main{padding:16px 12px}.dial-layout{grid-template-columns:minmax(390px,.8fr) minmax(400px,1fr)}.keypad{gap:8px 23px}.messages-layout{grid-template-columns:minmax(260px,325px) minmax(360px,1fr) minmax(220px,270px)}.footitem{padding:0 15px;gap:9px}.footitem strong{font-size:13px}.footitem small{font-size:12px}.volume input{width:80px}.right-head{gap:10px}.user{min-width:145px}.global-search{max-width:520px}}
@media(max-width:1100px){:root{--side:70px}.brand{width:180px}.navinner{padding:15px 9px}.navitem{padding:0;justify-content:center}.navitem span.label,.navitem .bubble,.collapse span{display:none}.collapse{padding:12px;justify-content:center}.sidebar::before,.sidebar::after{opacity:.4}.dial-layout{grid-template-columns:minmax(360px,.82fr) minmax(420px,1fr)}.messages-layout{grid-template-columns:310px minmax(350px,1fr)}.chat-details{display:none}.footer{padding:0 16px}.footitem{padding:0 12px}.quality{gap:2px}.head-sep{display:none}.user{min-width:auto}.user strong,.user small{display:none}}
@media(max-width:880px){.dial-layout{display:block}.dial-card{max-width:none;min-height:780px}.dial-right{margin-top:12px}.recent{height:420px}.keypad{gap:8px 32px}.footer{flex-wrap:wrap;height:auto;gap:8px;padding:10px 16px}.app{grid-template-rows:70px minmax(0,auto) auto}.topbar{height:70px}.main{padding:12px}.footitem{height:40px}.footitem:last-child{margin-left:0}.messages-layout{grid-template-columns:260px minmax(340px,1fr)}.convo-heading h1{font-size:23px}}
@media(max-width:640px){:root{--side:0px;--header:60px;--footer:80px}.app{display:block;padding-bottom:125px}.topbar{height:60px;padding:0 12px;gap:10px}.brand{font-size:31px;min-width:0;width:auto;flex-shrink:0}.brand-arcs{width:28px;height:28px;stroke-width:6}.global-search{display:none}.right-head{gap:8px}.head-icon{padding:5px}.user{display:none}.dropdown{font-size:12px;padding:8px;gap:4px}.sidebar{display:none}.main{padding:10px}.dial-card{padding:18px 10px;min-height:auto}.card-title h1{font-size:28px}.card-title p{font-size:13px}.inputwrap{margin:18px 0;padding:7px;height:70px}.numberbox{height:54px;padding:0 10px}.numberbox input{font-size:15px}.country{gap:5px;margin-right:8px;padding-right:8px;font-size:15px}.keypad{grid-template-columns:repeat(3, minmax(0,82px));grid-template-rows:repeat(4,82px);gap:7px 21px}.key{height:82px;width:82px}.key strong{font-size:32px}.dial-actions{max-width:320px;gap:4px;margin:17px auto}.dial-action{font-size:13px}.dial-action .actiondisc{width:65px;height:65px}.dial-action.primary .actiondisc{width:78px;height:78px}.dial-right{margin:10px 0}.state-card{min-height:130px;padding:15px}.state-card .large-avatar{height:60px;width:60px;font-size:25px}.state-top{gap:10px}.state-top h2{font-size:17px}.state-top p{font-size:12px}.watermark{display:none}.recent{height:420px}.tabsrow{gap:6px}.tabs{gap:4px}.tab{font-size:13px;padding:0 6px}.search-sm{width:130px;min-width:100px}.callrow{grid-template-columns:41px minmax(90px,1fr) 23px 23px;gap:5px;height:62px}.callrow .round-person{height:40px;width:40px}.callwho strong{font-size:13px}.callwho small{font-size:11px}.callwhen,.duration,.callrow .rowaction:last-child{display:none}.footer{position:fixed;bottom:55px;left:0;right:0;height:65px;overflow:auto;flex-wrap:nowrap;padding:5px 7px;box-shadow:0 -2px 10px #0c45651a}.footitem{padding:0 9px;gap:6px;min-width:max-content}.footitem>svg{width:20px;height:20px}.footitem strong{font-size:11px}.footitem small{font-size:10px;margin-top:3px}.levels,.volume,.footitem:last-child{display:none}.messages-layout{display:block;min-height:calc(100vh - 185px)}.conversations{height:calc(100vh - 195px)}.chatpanel{display:none;height:calc(100vh - 195px)}.messages-layout.open-chat .conversations{display:none}.messages-layout.open-chat .chatpanel{display:flex}.chat-head{height:72px;padding:8px}.chat-head .round-person{height:48px;width:48px}.chat-title strong{font-size:15px}.chat-title small{font-size:12px}.chat-tools{gap:2px}.chat-tools .iconbtn{width:33px;height:36px}.chat-feed{padding:12px 10px}.chat-details{display:none}.mobile-back{display:block!important;background:transparent;padding:5px}.mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;height:55px;background:var(--deep);z-index:3;justify-content:space-around;align-items:center}.mobile-nav button{display:flex;flex-direction:column;align-items:center;gap:3px;background:transparent;color:#d6e6eb;font-size:10px}.mobile-nav button.selected{color:#ff905d}.mobile-nav svg{height:20px;width:20px}.toast{bottom:125px;right:10px}.convo-item{height:70px}}
/* EXTENDED PAGES — preserves the previously approved Dial Pad and Messages layout */
.logo-button{background:none;border:0;padding:0;width:calc(var(--side) - 14px);height:75px;display:flex;align-items:center;justify-content:flex-start;letter-spacing:normal;min-width:0}
.logo-button img{display:block;width:min(210px,100%);height:74px;object-fit:contain;object-position:left center}
#extraPage{min-width:0;width:100%;max-width:1600px;margin:0 auto}
.xpage{min-width:0;animation:xappear .13s ease-out}@keyframes xappear{from{opacity:.5;transform:translateY(3px)}to{opacity:1;transform:none}}
.xhead{display:flex;align-items:flex-start;gap:15px;justify-content:space-between;margin:0 0 18px}
.xhead h1{font-size:33px;line-height:1.12;letter-spacing:-.6px;margin:2px 0 8px}
.xhead p{margin:0;color:var(--muted);font-size:15px}
.xactions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.xbtn{display:inline-flex;justify-content:center;align-items:center;gap:8px;border-radius:9px;padding:11px 16px;color:#064151;background:#eef4f7;border:1px solid #dce6ed;font-weight:650;font-size:14px;min-height:42px}
.xbtn:hover{background:#e3eef3}.xbtn svg{width:17px;height:17px}.xbtn.accent{background:var(--orange);color:#fff;border-color:var(--orange)}.xbtn.accent:hover{background:#ea551b}.xbtn.ghost{background:#fff}.xbtn.danger{color:#b63a26;background:#fff0ed;border-color:#f4d4cd}.xbtn.tiny{min-height:30px;padding:5px 9px;font-size:12px}
.xchip{border-radius:18px;padding:5px 10px;background:#e6f2f4;color:#075462;font-size:12px;font-weight:700;display:inline-block}.xchip.alert{background:#fff1e7;color:#b65a11}.xchip.success{background:#e9f7ed;color:#1c8939}
.xcard{background:white;border:1px solid #e2eaf0;border-radius:10px;box-shadow:0 2px 3px #18405306;min-width:0}.xpad{padding:22px}.xgrid{display:grid;gap:16px}.xgrid.two{grid-template-columns:minmax(0,1.45fr) minmax(285px,.85fr)}.xgrid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.xgrid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.xstat{padding:18px 20px;display:flex;gap:12px;align-items:center}.xstat strong{font-size:28px;display:block;margin:4px 0}.xstat span{color:var(--muted);font-size:13px}.xicon{border-radius:12px;background:#edf5f7;width:46px;height:46px;display:grid;place-items:center;color:#075766;flex-shrink:0}.xicon.orange{background:#fff0e9;color:var(--orange)}.xicon svg{width:23px;height:23px}
.xsection{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}.xsection h2{margin:0;font-size:20px}.xsection p{font-size:13px;color:var(--muted);margin:5px 0 0}
.xsearch{display:flex;gap:9px;align-items:center;background:#f8fafb;border:1px solid #dce5eb;padding:9px 12px;height:44px;border-radius:8px;min-width:210px;flex:1}.xsearch input{width:100%;min-width:0;border:0;outline:0;background:none;font-size:14px}
.xtabs{display:flex;align-items:center;border-bottom:1px solid #e5edf2;gap:7px;flex-wrap:wrap;margin-bottom:13px}.xtab{background:none;color:#6e8299;padding:12px 15px;position:relative}.xtab.active{font-weight:700;color:#034251}.xtab.active:after{content:"";background:var(--orange);height:3px;border-radius:3px;position:absolute;bottom:0;left:8px;right:8px}
.xtable-scroll{overflow:auto}.xtable{border-collapse:collapse;width:100%;font-size:14px;min-width:600px}.xtable th{text-align:left;background:#f7fafc;color:#617891;font-size:12px;text-transform:uppercase;letter-spacing:.04em;font-weight:700;padding:13px 12px;border-bottom:1px solid #e2edf1}.xtable td{padding:13px 12px;border-bottom:1px solid #edf1f4;vertical-align:middle}.xtable tr:last-child td{border-bottom:0}.xtable tr:hover td{background:#fcfdfe}.xperson{display:flex;align-items:center;gap:12px;min-width:0}.xperson .round-person{width:43px;height:43px;font-size:14px}.xperson strong{font-size:14px;display:block}.xperson small{font-size:12px;color:var(--muted);display:block;margin-top:3px}
.xpresence{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#60788f}.xpresence .dot{height:9px;width:9px}
.xlink{background:none;color:#137ab0;font-weight:650;padding:6px;cursor:pointer}.xlink:hover{text-decoration:underline}.xflex{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.xmuted{font-size:13px;color:var(--muted);line-height:1.5}.xempty{padding:44px 22px;text-align:center;color:var(--muted)}.xempty svg{width:48px;height:48px;color:#a0b5c1}.xempty h3{color:#064052;margin:15px 0 8px}.xinput,.xselect{border:1px solid #d5e2ea;border-radius:8px;background:#fff;padding:11px 12px;color:#143e4b;font-size:14px;min-height:42px;max-width:100%}.xinput{width:100%}.xfield{display:block;font-size:13px;color:#496679;font-weight:700;margin-bottom:14px}.xfield input,.xfield select,.xfield textarea{margin-top:6px;width:100%}.xfield textarea{resize:vertical;min-height:75px}.xswitch{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:15px 0;border-bottom:1px solid #ebf0f4}.xswitch:last-child{border:0}.xswitch strong{display:block;font-size:14px}.xswitch small{display:block;font-size:12px;color:var(--muted);line-height:1.4;margin-top:4px}.xswitch input[type="checkbox"]{appearance:none;cursor:pointer;background:#c9d5dc;border-radius:99px;width:42px;height:24px;flex:0 0 42px;position:relative;transition:background .2s}.xswitch input:checked{background:var(--orange)}.xswitch input[type="checkbox"]:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:white;transition:transform .2s}.xswitch input:checked:after{transform:translateX(18px)}
.xcontact-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:12px}.xcontact{padding:16px;background:#fff;border:1px solid #e3eaf0;border-radius:10px;min-width:0}.xcontact-head{display:flex;justify-content:space-between;align-items:center}.xcontact .round-person{height:49px;width:49px}.xcontact h3{font-size:15px;margin:13px 0 3px}.xcontact p{margin:2px 0 13px;font-size:12px;color:var(--muted)}.xcontact .actions{display:flex;gap:7px}.xcontact .actions button{flex:1}
.xcall-type{font-size:20px;font-weight:750}.xcall-type.missed{color:#f25b2c}.xcall-type.outgoing{color:#11a34c}
.xroom-card{padding:20px}.xroom-card .xicon{margin-bottom:14px}.xroom-card h3{font-size:17px;margin:5px 0}.xroom-card p{font-size:13px;color:var(--muted);line-height:1.5;min-height:32px}.xroom-actions{display:flex;gap:7px;flex-wrap:wrap}
.xconference-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:15px;min-width:0}.xmeeting-stage{background:#053d49;border-radius:14px;padding:18px;min-width:0;color:#fff}.xmeeting-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 0 15px}.xmeeting-bar h2{font-size:18px;margin:0 0 4px}.xmeeting-bar small{color:#b9d3da}.xmeeting-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.xtile{min-height:173px;background:linear-gradient(145deg,#116674,#073743);border:1px solid #277586;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;gap:11px}.xtile:nth-child(2n){background:linear-gradient(140deg,#134a60,#073441)}.xtile .tile-avatar{height:75px;width:75px;background:linear-gradient(145deg,#dfe8ee,#aebec8);color:#024653;display:grid;place-items:center;border-radius:50%;font-size:27px;font-weight:750}.xtile.missing .tile-avatar{background:#ffffff1d;color:#a8e0ec}.xtile small{font-size:12px;color:#d1e8ed}.xtile .nameplate{position:absolute;bottom:8px;left:11px;font-size:12px}.xtile.speaking{outline:3px solid #ff7a3d}.xmeeting-controls{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;padding-top:17px}.xmeeting-controls button{background:#1d606d;color:#fff;border:1px solid #347583;border-radius:10px;padding:10px 16px}.xmeeting-controls button.off{background:#83412f}.xmeeting-controls .leave{background:#e44e32;border-color:#e44e32}.xmeet-aside{padding:20px}.xmeet-aside h3{font-size:17px;margin:0 0 15px}.xmeet-aside .join-link{background:#f2f7fa;border:1px dashed #b8d4df;border-radius:9px;padding:12px;word-break:break-all;font-size:12px;color:#175876;margin:10px 0 16px}.xmeet-member{display:flex;justify-content:space-between;gap:9px;align-items:center;border-bottom:1px solid #e6edf2;padding:10px 0;font-size:13px}.xmeet-member:last-child{border:0}
.xsettings-nav{display:flex;flex-direction:column;gap:4px}.xsettings-nav button{padding:12px 15px;text-align:left;background:none;color:#60768d;border-radius:7px}.xsettings-nav button.active{background:#fff0e8;color:#d95116;font-weight:700}.xsettings-nav button:hover{background:#f5f9fb}.xsettings-pane{min-height:460px}.xhelp{background:#f1f7f8;color:#466775;padding:12px 15px;border-radius:8px;font-size:13px;line-height:1.6}
.xkbd{background:#f2f6f8;border:1px solid #dbe5eb;border-radius:5px;padding:3px 7px;font-family:monospace;font-size:12px;color:#436a7e}.xmeeting-intro{background:linear-gradient(120deg,#064954,#0c6875);color:#fff;padding:22px;border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:15px}.xmeeting-intro h2{margin:0 0 7px}.xmeeting-intro p{margin:0;color:#cce2e7;font-size:13px}
.xcompact-float{position:fixed;right:22px;bottom:126px;width:310px;max-width:calc(100vw - 25px);background:#fff;border:1px solid #cfdfe7;border-radius:14px;box-shadow:0 20px 55px #0d394e55;z-index:12;overflow:hidden}.xcompact-head{background:#064b57;color:white;padding:14px;display:flex;justify-content:space-between;align-items:center;gap:8px;cursor:move}.xcompact-head button{color:white;background:transparent;padding:4px}.xcompact-body{padding:15px}.xcompact-body .keypad{grid-template-columns:repeat(3,55px);grid-template-rows:repeat(4,55px);gap:5px 17px}.xcompact-body .key{width:55px;height:55px}.xcompact-body .key strong{font-size:25px;line-height:27px}.xcompact-body .key small{font-size:9px;height:12px}.xcompact-voice{width:100%;border:0;border-radius:8px;background:var(--orange);color:#fff;padding:11px;margin-top:12px;font-weight:750}
.xnotify{position:fixed;right:25px;bottom:122px;width:340px;max-width:calc(100vw - 35px);background:#fff;box-shadow:0 8px 28px #183c5240;border:1px solid #dbe7ed;border-left:4px solid var(--orange);border-radius:11px;padding:15px;z-index:18}.xnotify h3{margin:0 0 8px}.xnotify p{font-size:14px;margin:0 0 10px;color:var(--muted)}
.mobile-more-menu{display:none}
@media(max-width:1320px){.logo-button img{width:187px}.xconference-layout{grid-template-columns:minmax(0,1fr) 240px}.xmeeting-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1100px){.logo-button{width:178px}.logo-button img{width:178px}.xgrid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.xgrid.two{grid-template-columns:minmax(0,1fr)}.xconference-layout{grid-template-columns:minmax(0,1fr)}.xmeeting-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.xhead{flex-wrap:wrap}.xhead h1{font-size:26px}.xactions{width:100%}.xgrid.three,.xgrid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.xpad{padding:15px}.xtable{min-width:590px}.xmeeting-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.xtile{min-height:130px}.xtile .tile-avatar{width:50px;height:50px;font-size:21px}.xtile small{font-size:10px}.xmeeting-intro{align-items:flex-start;flex-direction:column}.xroom-card{padding:14px}.xcompact-float{bottom:125px;right:8px}}
@media(max-width:640px){.logo-button{height:58px;width:134px;max-width:134px}.logo-button img{height:56px;width:134px}.xgrid.three{grid-template-columns:minmax(0,1fr)}.xgrid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.xcontact-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.xcontact{padding:11px}.xcontact .actions{flex-direction:column}.xhead{gap:8px}.xhead p{font-size:12px}.xsection{flex-wrap:wrap}.xsection .xsearch{width:100%}.xmeeting-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.xmeeting-controls button{padding:10px 11px}.xtile{min-height:122px}.xmeeting-stage{padding:9px}.xnotify{right:10px;bottom:124px}.mobile-more-menu{position:fixed;right:8px;left:8px;bottom:120px;background:white;border-radius:12px;box-shadow:0 12px 40px #0e314851;z-index:14;display:grid;grid-template-columns:repeat(2,1fr);padding:10px;gap:7px}.mobile-more-menu.hidden{display:none}.mobile-more-menu button{background:#f3f7f9;color:#124554;border-radius:8px;padding:12px;font-size:13px;min-height:42px}}

.xsettings-layout{grid-template-columns:230px minmax(0,1fr)!important}.app.nav-collapsed{--side:70px}.app.nav-collapsed .navinner{padding:15px 9px}.app.nav-collapsed .navitem{padding:0;justify-content:center}.app.nav-collapsed .navitem .label,.app.nav-collapsed .navitem .bubble,.app.nav-collapsed .collapse span{display:none}.app.nav-collapsed .collapse{padding:12px;justify-content:center}
@media(max-width:700px){.xsettings-layout{grid-template-columns:minmax(0,1fr)!important}.xsettings-nav{flex-direction:row;flex-wrap:wrap}.xsettings-nav button{font-size:12px;padding:8px 10px}}
@media(max-width:640px){
 .dial-card{padding:12px 9px 10px}
 .card-title h1{font-size:26px;margin:0 0 5px}
 .card-title p{font-size:12px;max-width:250px;line-height:1.3}
 .inputwrap{margin:13px 0 11px;height:61px}
 .numberbox{height:49px}
 .keypad{grid-template-columns:repeat(3,69px);grid-template-rows:repeat(4,69px);gap:5px 22px}
 .key{width:69px;height:69px}
 .key strong{font-size:29px;line-height:32px}
 .key small{font-size:11px;height:14px}
 .dial-actions{margin:11px auto 2px;gap:4px}
 .dial-action{font-size:12px;gap:5px}
 .dial-action .actiondisc{width:57px;height:57px}
 .dial-action.primary .actiondisc{height:69px;width:69px}
 .dial-action .actiondisc svg{width:23px;height:23px}
 .dial-action.primary .actiondisc svg{width:32px;height:32px}
}



/* V2: existing approved visual language, missing functional views only. */
.profile-wrap{position:relative;display:flex;align-items:center}.profile-trigger{background:none;border:0;padding:5px;border-radius:8px;text-align:left;cursor:pointer}.profile-trigger:hover{background:#f1f7f9}.profile-menu{position:absolute;right:0;top:calc(100% + 15px);min-width:235px;background:#fff;border:1px solid #dfebf1;border-radius:12px;z-index:16;box-shadow:0 15px 38px #193b4a28;padding:7px}.profile-menu.hidden{display:none}.profile-menu-head{padding:12px 14px 13px;border-bottom:1px solid #e5edf1;display:flex;flex-direction:column;gap:5px}.profile-menu-head small{font-size:12px;color:#718598}.profile-menu>button{width:100%;text-align:left;padding:11px 13px;background:transparent;color:#064151;border-radius:7px;font-size:14px}.profile-menu>button:hover{background:#eef5f7}.profile-menu>.logout-menu-button{color:#b13723;margin-top:5px;border-top:1px solid #e8eef1;border-radius:0}.sidebar-foot{display:flex;flex-direction:column;gap:0;margin-top:auto}.sidebar-signout{background:transparent;color:#d0e4e8;display:flex;gap:14px;align-items:center;padding:10px 19px 4px;font-size:13px;text-align:left}.sidebar-signout:hover{color:#fff}.nav-collapsed .sidebar-signout span{display:none}.nav-collapsed .sidebar-signout{justify-content:center;padding:12px}
.contact-picture{width:48px;height:48px;display:flex;align-items:center;justify-content:center}.contact-photo{width:48px;height:48px;object-fit:cover;border-radius:50%;border:2px solid #edf4f7}.xcontact-line{margin:0 0 15px;min-height:23px;color:#476980;font-size:12px}.contact-preview{display:flex;gap:14px;align-items:center;min-height:50px;margin:6px 0 18px;color:#708393;font-size:12px}.contact-preview img{width:50px;height:50px;border-radius:50%;object-fit:cover}
.incoming-rich{width:388px;bottom:124px;border-left:0;border-top:4px solid #ff6324;padding:22px;box-shadow:0 18px 65px #06334250;border-radius:15px}.incoming-eyebrow{color:#df5925;font-size:11px;font-weight:800;letter-spacing:1.2px;display:flex;gap:7px;align-items:center}.ring-dot{height:9px;width:9px;display:inline-block;background:#f56029;border-radius:50%;box-shadow:0 0 0 5px #fff0e9;animation:arrival 1.5s infinite}.xnotify-ext{margin-left:auto;font-size:11px;font-weight:550;letter-spacing:0;color:#8a9cab}.incoming-person{display:flex;align-items:center;gap:16px;margin:22px 0}.incoming-person h3{font-size:21px;margin:0 0 5px;color:#053949}.incoming-person p{color:#42647d;font-weight:700;margin:0 0 5px;font-size:16px}.incoming-person small{color:#8092a0;font-size:12px}.incoming-avatar{width:88px;height:88px;min-width:88px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 6px #e8f3f6;border:2px solid #fff}.incoming-initials{display:grid;place-items:center;font-size:29px;font-weight:800;background:#dcebef;color:#075061}.incoming-actions{display:grid;grid-template-columns:1fr 1fr;gap:11px}.incoming-actions button{min-height:49px}.incoming-actions .answer{background:#1d9b55;color:#fff;border:1px solid #168748}.incoming-hint{text-align:center;color:#90a2ac;margin-top:13px;font-size:11px}.state-card.call-ringing{border-color:#f8b899;background:linear-gradient(120deg,#fff,#fffaf8)}.state-card.call-ringing #callTitle{color:#da4c1c}.state-card .large-avatar{background-size:cover;background-position:center;display:grid;place-items:center}.demo-signed-out{position:fixed;z-index:90;inset:0;background:linear-gradient(135deg,#022d38db,#033c4aee);display:grid;place-items:center;padding:20px;backdrop-filter:blur(6px)}.demo-signed-out.hidden{display:none}.logout-card{max-width:440px;width:100%;border-radius:17px;padding:42px 33px;background:#fff;text-align:center;box-shadow:0 22px 95px #001f28aa}.signout-logo{width:225px;height:105px;object-fit:contain;display:block;margin:0 auto 14px}.signout-icon{width:67px;height:67px;border-radius:50%;background:#e6f6ec;color:#16874a;font-size:35px;line-height:67px;margin:0 auto 15px}.logout-card h2{margin:5px 0 10px;font-size:28px;color:#064b57}.logout-card p{color:#637d8c;font-size:14px;line-height:1.7}.logout-card>.xbtn{margin:18px auto 14px;display:flex;width:90%;justify-content:center}.logout-card>small{display:block;color:#94a2a9;line-height:1.5}.preview-locked #app{user-select:none}.live-pulse{color:#77f0ab;font-weight:800;letter-spacing:.7px}.xtile.speaking{border-color:#ff7943;box-shadow:inset 0 0 0 2px #ff8f54}.xtile .tile-avatar{overflow:hidden}.meet-photo{height:100%;width:100%;object-fit:cover;border-radius:50%}.xmeeting-stage{min-height:570px}.xmeeting-controls button{min-height:47px}.xmeeting-controls .leave{background:#e64d37}.xmeeting-tiles .xtile small{color:#c6e0e8}
@keyframes arrival{50%{box-shadow:0 0 0 9px #fff0e91f}}
@media(max-width:640px){.incoming-rich{left:8px;right:8px;width:auto;bottom:112px;padding:16px}.incoming-avatar{height:69px;width:69px;min-width:69px}.incoming-person{margin:16px 0}.incoming-person h3{font-size:18px}.sidebar-signout{display:none}.xmeeting-stage{min-height:0}.profile-menu{right:-10px}.contact-picture{width:42px;height:42px}.contact-photo{height:42px;width:42px}}
@media(prefers-reduced-motion:reduce){.ring-dot{animation:none}}



/* Incoming-call placement: show within the approved Dial Pad only while in the foreground. */
.dial-card.incoming-inline-active>.inputwrap,
.dial-card.incoming-inline-active>.keypad,
.dial-card.incoming-inline-active>.dial-actions{display:none!important}
.dial-card.incoming-inline-active{justify-content:flex-start}
.incoming-dial-card{display:flex;flex:1;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:480px;margin-top:16px;padding:32px 22px;background:linear-gradient(160deg,#f9fcfd 0%,#fff 55%,#fff6f0 100%);border:1px solid #f0e8e3;border-radius:15px;text-align:center;box-shadow:inset 0 2px 20px #d8e5e82b}
.incoming-dial-eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;font-weight:800;letter-spacing:2px;color:#dc571f;text-transform:uppercase}
.incoming-dial-pulse{margin:30px auto 22px;position:relative;width:158px;height:158px;flex:0 0 158px}
.incoming-dial-pulse:before,.incoming-dial-pulse:after{content:'';position:absolute;inset:-9px;border:2px solid #ffad85;border-radius:50%;opacity:.7;animation:munitel-rings 2.4s ease-out infinite}
.incoming-dial-pulse:after{animation-delay:1.2s}
.incoming-dial-pulse img,.incoming-dial-pulse .incoming-dial-initials{position:relative;z-index:1;display:grid;place-items:center;border-radius:50%;width:158px;height:158px;object-fit:cover;border:5px solid #fff;box-shadow:0 12px 32px #0b4d5c30;background:#e2eff3;color:#075267;font-size:53px;font-weight:750}
@keyframes munitel-rings{0%{transform:scale(.96);opacity:.72}90%,100%{transform:scale(1.27);opacity:0}}
.incoming-dial-card h2{font-size:33px;margin:6px 0 7px;color:#053746;line-height:1.18}
.incoming-dial-number{font-weight:750;color:#315b6e;font-size:22px;margin:0 0 7px}
.incoming-dial-meta{font-size:13px;color:#738c9b;margin:0 0 28px}
.incoming-dial-actions{display:grid;grid-template-columns:repeat(2,minmax(0,180px));gap:15px;justify-content:center;width:min(100%,390px)}
.incoming-dial-actions button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:92px;border-radius:12px;font-weight:750;font-size:15px;transition:transform .12s}
.incoming-dial-actions button:active{transform:scale(.97)}
.incoming-dial-actions svg{height:28px;width:28px;stroke:currentColor;fill:none}
.incoming-dial-actions .decline{color:#c83f32;background:#fff;border:1px solid #f0c9c2}
.incoming-dial-actions .answer{color:white;background:#169b55;box-shadow:0 7px 20px #13985335}
.incoming-dial-caption{margin-top:22px;font-size:12px;color:#78909d}
#stateCard.incoming-inline-companion{display:none}
.incoming-rich.is-compact{top:91px;bottom:auto;width:350px;max-width:calc(100vw - 30px)}
.incoming-rich.is-compact .incoming-person{margin:14px 0}
.incoming-rich.is-compact .incoming-avatar{width:64px;height:64px;min-width:64px}
.incoming-rich.is-compact .incoming-person h3{font-size:17px}
.incoming-rich.is-compact .incoming-hint{display:none}
@media (prefers-reduced-motion:reduce){.incoming-dial-pulse:before,.incoming-dial-pulse:after{animation:none;opacity:.35}}
@media(max-width:640px){.incoming-dial-card{min-height:490px;margin-top:8px;padding:22px 12px}.incoming-dial-pulse{width:132px;height:132px;flex-basis:132px;margin-top:26px}.incoming-dial-pulse img,.incoming-dial-pulse .incoming-dial-initials{width:132px;height:132px;font-size:43px}.incoming-dial-card h2{font-size:25px}.incoming-dial-number{font-size:18px}.incoming-dial-actions{gap:9px}.incoming-dial-actions button{min-height:82px}.incoming-rich.is-compact{top:69px;bottom:auto;left:8px;right:8px;width:auto;max-width:none}.incoming-rich:not(.is-compact){bottom:124px}}

.footer-device{display:flex;flex-direction:column;min-width:140px;max-width:210px;gap:2px}.footer-device strong{line-height:16px}.footer-device select{appearance:auto;width:100%;max-width:210px;border:0;background:transparent;color:#5d7589;font-size:12px;line-height:16px;padding:0 18px 0 0;cursor:pointer;text-overflow:ellipsis}.footer-device select:focus{outline:2px solid #ff7a3d55;outline-offset:2px;border-radius:3px}.device-footitem .levels{margin-left:3px}.audio-test-meter{height:9px;border-radius:99px;background:#dbe5eb;overflow:hidden;margin:10px 0}.audio-test-meter>i{display:block;width:0;height:100%;background:linear-gradient(90deg,#27b468,#f5b83b,#ef533f);transition:width .08s linear}.audio-status{margin:9px 0 14px;padding:10px 12px;border-radius:8px;background:#f3f8fa;color:#315f72;font-size:12px;line-height:1.5}

/* MUNITEL secure cinematic sign-in */
.login-active{background:#041d28;overflow:hidden}
.login-active #app{visibility:hidden}
.login-active .modal-backdrop{visibility:visible;z-index:200;background:
 linear-gradient(90deg,rgba(1,25,34,.04) 0%,rgba(1,25,34,.08) 42%,rgba(2,22,30,.73) 68%,rgba(2,19,27,.94) 100%),
 url('/assets/munitel-login-cinematic-teal.png') center/cover no-repeat;place-items:center end;padding:clamp(22px,5vw,82px)}
.login-active .modal{width:min(470px,100%);padding:34px 37px;border:1px solid rgba(255,255,255,.25);border-radius:20px;background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(239,249,250,.93));box-shadow:0 30px 100px #00151ddd,0 0 0 1px #65e0ec18;backdrop-filter:blur(18px)}
.login-active .modal-head{margin-bottom:5px}.login-active .modal-head h2{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#5f7f89}.login-active .modal-actions{margin-top:22px}.login-active .modal-actions .primary{width:100%;min-height:50px;font-size:15px;background:linear-gradient(110deg,#e6451c,#ff6928);box-shadow:0 10px 28px #ec4d2340}.login-brand{display:flex;flex-direction:column;align-items:flex-start;margin:0 0 16px}.login-brand img{width:205px;height:72px;object-fit:contain;object-position:left center}.login-brand span{font-size:10px;font-weight:800;letter-spacing:2.2px;color:#0a5664}.login-brand.compact{align-items:center}.login-active #modalBody>h3{font-size:30px;margin:6px 0 7px;color:#063c48}.login-intro{color:#5a7480;line-height:1.65;margin:0 0 21px}.login-active .xfield{color:#163f4b;font-size:13px}.login-active .xinput{height:49px;margin-top:7px;border:1px solid #bed2d8;border-radius:9px;background:#fff;padding:9px 12px;font-size:15px}.login-active .xinput:focus{border-color:#f26631;box-shadow:0 0 0 3px #ff67251c;outline:0}.login-security{text-align:center;color:#4e777f;font-size:11px;margin-top:15px}.login-security::first-letter{color:#28ac6c}.login-error{background:#fff0ec;border:1px solid #f2c1b5;color:#a83a22;padding:10px 12px;border-radius:8px;margin:0 0 16px;font-size:13px}.mfa-qr{width:220px;height:220px;background:#fff;padding:11px;border-radius:15px;margin:12px auto;box-shadow:0 8px 25px #082f3d25}.mfa-qr img{width:100%;height:100%;display:block}.mfa-manual{font-size:12px;color:#55737e;margin:10px 0 18px;text-align:center}.mfa-manual code{display:block;margin-top:8px;padding:9px;background:#eaf2f4;color:#083f4b;letter-spacing:2px;word-break:break-all;border-radius:7px}.mfa-code{text-align:center;font-size:25px!important;letter-spacing:9px;font-weight:800}.login-active #cancelModal,.login-active #closeModal{display:none!important}

/* Tenant-scoped administration */
.tenant-admin{position:fixed;inset:0;z-index:150;background:#eff5f7;color:#083a47;display:grid;grid-template-columns:255px 1fr;font-family:inherit}.tenant-admin.hidden{display:none}.admin-side{background:linear-gradient(175deg,#033f4c,#002d38 70%);color:#fff;padding:27px 18px 18px;display:flex;flex-direction:column;box-shadow:7px 0 28px #0539461c}.admin-side>img{width:183px;height:70px;object-fit:contain;filter:brightness(0) invert(1);margin:0 auto 3px}.admin-side>small{text-align:center;font-size:9px;letter-spacing:1.7px;color:#8bc5cf;margin-bottom:29px}.admin-side nav{display:grid;gap:6px}.admin-side button{color:#cee6e9;background:transparent;padding:13px 14px;border-radius:9px;text-align:left;font-size:13px;display:flex;gap:12px;align-items:center}.admin-side nav button b{width:20px;text-align:center;font-size:17px;color:#70b9c5}.admin-side nav button:hover,.admin-side nav button.active{background:#ffffff16;color:#fff}.admin-side nav button.active{box-shadow:inset 3px 0 #ff6425}.admin-side-foot{margin-top:auto;border-top:1px solid #ffffff19;padding-top:12px;display:grid;gap:3px}.admin-main{min-width:0;overflow:auto}.admin-main>header{height:93px;background:#fff;border-bottom:1px solid #dae6e9;display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:sticky;top:0;z-index:2}.admin-main>header small{font-size:9px;letter-spacing:1.6px;font-weight:800;color:#ef5b24}.admin-main>header h1{margin:5px 0 0;font-size:26px}.admin-identity{display:grid;grid-template-columns:auto auto 39px;column-gap:10px;align-items:center}.admin-identity span{color:#718892;font-size:11px;grid-column:1}.admin-identity strong{font-size:13px;grid-column:1}.admin-identity button{grid-column:3;grid-row:1/3;background:#edf4f6;width:38px;height:38px;border-radius:8px;color:#0a5866;font-size:20px}.admin-content{padding:28px 32px 45px;max-width:1600px;margin:auto}.admin-loading,.admin-error{padding:50px;background:#fff;border-radius:13px;text-align:center;color:#6a838c}.admin-error{color:#a43d29}.admin-stats{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:15px;margin-bottom:18px}.admin-stat{background:#fff;border:1px solid #dce8eb;border-radius:13px;padding:19px;display:flex;gap:15px;align-items:center;box-shadow:0 5px 18px #07384608}.admin-stat>span{width:45px;height:45px;min-width:45px;border-radius:12px;background:#e8f4f5;color:#087080;display:grid;place-items:center;font-size:21px}.admin-stat small{display:block;color:#69808a;font-size:11px}.admin-stat strong{display:block;font-size:26px;margin:2px 0;color:#073b47}.admin-stat p{margin:0;color:#91a1a7;font-size:10px}.admin-panel{background:#fff;border:1px solid #dce8eb;border-radius:14px;overflow:hidden;box-shadow:0 5px 20px #07384608;margin-bottom:18px}.admin-panel-head{display:flex;align-items:center;justify-content:space-between;padding:19px 21px;border-bottom:1px solid #e4edef}.admin-panel-head h2{margin:0;font-size:17px}.admin-panel-head p{margin:4px 0 0;color:#758b94;font-size:11px}.admin-grid.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}.admin-table-wrap{overflow:auto}.admin-table{width:100%;border-collapse:collapse;font-size:12px}.admin-table th{text-align:left;padding:11px 13px;background:#f4f8f9;color:#647b84;font-size:10px;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.admin-table td{padding:12px 13px;border-top:1px solid #e7eef0;white-space:nowrap}.admin-table select{border:1px solid #cedde1;background:#fff;padding:5px;border-radius:6px;color:#174c58}.admin-table .empty{text-align:center;color:#869ba3;padding:28px}.admin-pill{display:inline-block;border-radius:99px;padding:4px 8px;font-size:10px;font-weight:750}.admin-pill.good{background:#def5e8;color:#168049}.admin-pill.warn{background:#fff0d9;color:#9b650a}.admin-pill.off{background:#e9eff1;color:#73858b}.admin-action{padding:6px 8px;border-radius:6px;background:#e8f3f5;color:#086273;font-size:10px;margin-right:5px}.admin-action.danger{background:#fff0ed;color:#bd432b}.admin-search{height:35px;border:1px solid #ccdce0;border-radius:8px;padding:7px 10px}.admin-chart{padding-bottom:15px}.admin-bars{height:220px;display:flex;gap:10px;align-items:flex-end;padding:28px 25px 5px}.admin-bars>div{height:100%;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;min-width:25px}.admin-bars i{display:block;width:min(28px,80%);min-height:4px;border-radius:6px 6px 2px 2px;background:linear-gradient(#ff7339,#ef4c1d);order:2}.admin-bars b{font-size:10px;color:#466973;margin-bottom:4px;order:1}.admin-bars small{font-size:9px;color:#7c9299;margin-top:5px;order:3}.admin-feature-grid{display:grid;grid-template-columns:repeat(2,1fr);padding:10px 20px 22px;gap:0 25px}.admin-feature-grid label{display:flex;align-items:center;justify-content:space-between;padding:14px 5px;border-bottom:1px solid #e5edef}.admin-feature-grid strong,.admin-feature-grid small{display:block}.admin-feature-grid small{font-size:10px;color:#82969d;margin-top:4px}.admin-feature-grid input{accent-color:#f05b24;width:19px;height:19px}
@media(max-width:1050px){.admin-stats{grid-template-columns:repeat(2,1fr)}.admin-grid.two{grid-template-columns:1fr}.tenant-admin{grid-template-columns:205px 1fr}.admin-side{padding-left:12px;padding-right:12px}.admin-content{padding:22px 18px}}
@media(max-width:700px){.login-active .modal-backdrop{padding:14px;background-position:34% center}.login-active .modal{padding:25px 22px;background:rgba(249,253,253,.96)}.tenant-admin{display:block;overflow:auto}.admin-side{position:relative;min-height:0}.admin-side nav{grid-template-columns:repeat(2,1fr)}.admin-side-foot{margin-top:18px}.admin-main>header{padding:0 17px}.admin-stats{grid-template-columns:1fr}.admin-feature-grid{grid-template-columns:1fr}.admin-identity span{display:none}}

/* Live collaboration and media controls */
.meeting-invite-list{max-height:270px;overflow:auto;border:1px solid #dce8ec;border-radius:10px;background:#f8fbfc;padding:6px;margin:8px 0 15px}
.meeting-invite-row{display:flex;align-items:center;gap:11px;padding:10px;border-bottom:1px solid #e4edef;cursor:pointer}
.meeting-invite-row:last-child{border-bottom:0}.meeting-invite-row input{width:18px;height:18px;accent-color:#087b87}
.meeting-invite-row span{display:flex;flex-direction:column;gap:3px}.meeting-invite-row small{color:#718994}
.inline-recording{width:min(390px,55vw);height:38px;vertical-align:middle}.recording-speed{margin-left:8px;border:1px solid #cfdde2;border-radius:7px;background:#fff;padding:6px;color:#244f5b}
.xroom-card h4{font-size:14px;margin:6px 0;color:#476976}.xroom-card p{line-height:1.55}
@media(max-width:700px){.inline-recording{width:220px}.recording-speed{margin:5px 0 0;display:block}}