/* IBEX Phone — iOS-inspired interaction concept. Native platform features require SwiftUI/CallKit. */
:root{
 --navy:#00235A;--navy2:#103E7E;--deep:#001538;--orange:#F58220;
 --orange-dark:#EA7217;--ink:#17263F;--muted:#718098;--light:#F6F7FA;
 --border:#E9EDF3;--shadow:0 20px 54px rgba(0,35,90,.065);
 font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;
}
html {scroll-behavior:smooth}
body {background:var(--light);-webkit-tap-highlight-color:transparent}
button, a, input, select {touch-action:manipulation}
button:active {transition-duration:.05s}
.app {background:linear-gradient(115deg,#f8f9fc 0%,#f4f6fa 100%)}
.sidebar {background:linear-gradient(170deg,#062a66 0%,#001A46 75%,#001537 100%);border-right:1px solid rgba(255,255,255,.07)}
.side-logo {width:182px}.side-product{letter-spacing:2.8px}
.side-nav{gap:6px}.nav-link{border-radius:13px;font-size:14px;height:52px}
.nav-link.selected {background:rgba(255,255,255,.1)}
.side-ai{background:rgba(255,255,255,.05)}
.topbar{background:rgba(255,255,255,.85);-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px)}
.preview-status{border:1px solid #F8E3C8;background:#FFF7EF;font-size:11px}
.main{max-width:1350px}.page-intro h1{letter-spacing:-1.65px;font-weight:790;font-size:38px}
.page-intro p{font-size:14px}
.preview-note{border:0;background:#F0F3F8;color:#687994;border-radius:14px;padding:10px 14px;align-items:center}
.preview-note .icon{color:var(--orange);margin:0}.preview-note strong{color:var(--navy)}
.panel{border:1px solid #E8EBF2;box-shadow:0 10px 35px rgba(3,28,67,.045);border-radius:24px}
.stat-card{border-radius:21px;box-shadow:0 7px 24px rgba(3,28,67,.025)}
.dashboard-grid{grid-template-columns:minmax(365px,.95fr) minmax(360px,1.05fr);gap:24px}
.dialer-panel{background:#fff;padding:28px 36px 27px}
.dialer-panel-header h2{font-size:21px}
.line-select-wrap{padding:0;height:auto;border:0;border-radius:16px;background:none}
.line-picker{width:100%;height:65px;display:flex;align-items:center;text-align:left;border:1px solid #E6EAF1;border-radius:17px;padding:8px 15px 8px 12px;gap:13px;background:#F8FAFD;color:var(--navy);transition:background .16s,transform .16s}
.line-picker:active{background:#EAF0F8;transform:scale(.99)}
.line-picker-icon{width:39px;height:39px;border-radius:13px;background:#E7EDF7;display:grid;place-items:center;color:var(--navy)}
.line-picker-icon .icon{width:19px;height:19px}
.line-picker-label{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0}
.line-picker-label small{color:#8D9AB0;font-size:9px;letter-spacing:1.6px;font-weight:760}
.line-picker-label strong{font-size:13px;letter-spacing:-.1px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-weight:750}
.line-picker>.icon{width:17px;height:17px;color:#8794A5}
.number-field{border:0;border-bottom:1px solid #EFF0F4;min-height:78px;margin:15px 0 8px}
.number-field input{font-size:28px;font-weight:450;letter-spacing:1px;text-align:center;height:66px}
.number-field input::placeholder{color:#A3ACBC;font-size:22px;font-weight:400}
.erase{margin-left:-39px;z-index:2}
.keypad{max-width:323px;margin:13px auto 16px;gap:10px 23px}
.key{width:72px;height:72px;background:#EFF1F5;color:var(--navy);border-radius:50%;box-shadow:none;transition:transform .13s,background .13s}
.key:hover{background:#E9EDF4;box-shadow:none}.key:active{background:#DBE1EB;transform:scale(.91)}
.key strong{font-size:30px;font-weight:450;line-height:33px;letter-spacing:-.8px}.key small{color:#566781;font-size:9px;font-weight:600;letter-spacing:2px}
.dial-actions{display:flex;align-items:center;flex-direction:column;margin:10px auto 0}
.dial-button#start-call{width:73px;height:73px;border-radius:50%;box-shadow:0 14px 26px rgba(245,130,32,.22);background:var(--orange);padding:0}
.dial-button#start-call:hover{background:#eb771a}.dial-button#start-call .icon{width:29px;height:29px;stroke-width:2.2}
.dial-button#start-call span{display:none}
.call-action-hint{font-size:12px;font-weight:640;color:#8C97A7;margin-top:10px}
.dialer-foot{margin-top:20px;font-size:11px}
.activity-avatar,.contact-avatar{border-radius:50%;width:45px;height:45px;font-weight:700}
.activity-details strong{font-size:13px}.activity-details small{font-size:11px}.activity-time{font-size:11px}
.activity-row{min-height:66px}.mini-call{background:#ECF0F6;color:var(--navy);border-radius:50%;height:34px;width:34px}
.siren-promo{border-radius:24px;background:radial-gradient(circle at 93% 9%,rgba(74,145,234,.28),transparent 43%),linear-gradient(135deg,#073980,#001c48 75%);min-height:260px}
.siren-promo h2{letter-spacing:-.7px}
.siren-link{background:rgba(255,255,255,.95);border-radius:13px}
.page-panel{border-radius:22px}.filter-tabs{border-radius:12px}.filter-tab{border-radius:9px}
.contact-card{background:#fff;border-radius:18px}.search-field input{font-size:14px;background:#EDF0F5;border:0;border-radius:12px}
.call-result{font-weight:700}
/* iOS-style bottom sheet for choosing a line */
.sheet-overlay{position:fixed;inset:0;z-index:80;display:flex;align-items:flex-end;justify-content:center}
.sheet-overlay[hidden]{display:none}.sheet-scrim{position:absolute;inset:0;background:rgba(0,18,46,.43);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.line-sheet-panel{position:relative;background:#F8F9FB;width:min(100%,520px);max-height:min(90vh,780px);overflow-y:auto;border-radius:28px 28px 0 0;padding:9px 18px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -10px 50px rgba(0,20,60,.17);animation:sheetup .25s cubic-bezier(.22,1,.36,1)}
.sheet-handle{height:5px;width:37px;border-radius:6px;background:#CFD3DB;margin:0 auto 20px}
.sheet-top{display:flex;justify-content:space-between;align-items:center;padding:0 6px 19px}.sheet-top small{color:#8191A8;font-weight:750;font-size:10px;letter-spacing:1.4px}.sheet-top h2{margin:6px 0 0;color:var(--navy);font-size:23px;letter-spacing:-.8px}.sheet-close{border:0;border-radius:30px;background:#E9EDF3;color:var(--navy);padding:8px 14px;font-size:13px;font-weight:740}
.line-sheet-list{border-radius:17px;background:#fff;overflow:hidden;border:1px solid #E9EDF4}.sheet-line{background:white;width:100%;display:flex;gap:13px;padding:13px 15px;align-items:center;border:0;text-align:left;border-bottom:1px solid #EBEEF4}.sheet-line:last-child{border-bottom:0}.sheet-line:active{background:#F0F4FA}.sheet-line-badge{height:42px;width:42px;border-radius:13px;background:#EDF1F7;color:var(--navy);display:grid;place-items:center;font-size:11px;font-weight:820}.sheet-line-text{display:flex;flex-direction:column;gap:4px;flex:1}.sheet-line-text strong{font-size:15px;color:var(--ink);font-weight:640}.sheet-line-text small{font-size:12px;color:#8190A3}.sheet-line>.icon{color:var(--orange)}.sheet-footnote{font-size:11px;line-height:1.5;color:#8C96A5;text-align:center;margin:14px auto 0;max-width:360px}
@keyframes sheetup{from{transform:translateY(26px);opacity:.7}to{transform:translateY(0);opacity:1}}
/* Call surface evokes iOS native calling rather than a web modal; remains a non-networked demo. */
.call-overlay{background:rgba(0,13,37,.7);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.call-screen{background:radial-gradient(circle at 50% -12%,#325ba1,transparent 46%),linear-gradient(170deg,#0c316c 0%,#001736 100%);border:1px solid rgba(255,255,255,.16);box-shadow:0 32px 70px rgba(0,15,43,.3)}
.call-avatar-large{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.18);box-shadow:0 12px 45px rgba(0,0,0,.11)}
/* Authentic, mobile-first iPhone-feel without spoofing status bar or claiming native background calling. */
@media(max-width:740px){
 html,body{background:#F7F8FB}
 .app{background:#F7F8FB;min-height:100svh}
 .sidebar{display:none}
 .topbar{height:calc(56px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 22px 0;background:rgba(247,248,251,.91);border-bottom:0;position:sticky;top:0;z-index:24;-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px)}
 .top-brand{gap:10px}.top-brand img{width:98px}.top-brand-divider{height:20px;background:#D8DCE5}.top-brand strong{font-size:10px;letter-spacing:1.85px}
 .avatar-btn{background:#E9EDF3;color:var(--navy);width:34px;height:34px;border:1px solid #E0E5EC;border-radius:50%;font-size:11px;box-shadow:none}
 .preview-status{padding:5px 10px;border-radius:50px;background:#FFF4E8;border:0;color:#A86831;font-size:10px;font-weight:740}
 .preview-dot{width:5px;height:5px}
 .main{padding:13px 22px calc(118px + env(safe-area-inset-bottom));max-width:630px}
 .page-intro{margin-bottom:7px}.page-intro h1{font-size:35px;letter-spacing:-1.4px;margin:2px 0 3px;line-height:1.22;font-weight:790}
 .page-intro p{font-size:12px;margin-top:1px}.kicker{display:none}
 .preview-note{background:none;border:0;padding:0;align-items:center;margin:8px 0 7px;color:#8693A5;line-height:1.35;font-size:10px}
 .preview-note .icon{width:13px;height:13px;color:#91A2B7}.preview-note strong{color:#60738E}
 #page-dialer{display:block!important}
 #page-dialer .stat-grid{display:none!important}
 #page-dialer .dashboard-grid{display:block}
 #page-dialer .dialer-panel{border:0;background:transparent;box-shadow:none;padding:0;margin:0;max-width:100%}
 #page-dialer .dialer-panel-header{display:none}
 #page-dialer .dashboard-aside{display:none!important}
 .line-select-wrap{max-width:320px;margin:15px auto 0}
 .line-picker{height:51px;border-radius:15px;background:#EBEFF6;border:0;padding:7px 14px;gap:9px}
 .line-picker-icon{width:33px;height:33px;border-radius:11px;background:#fff}
 .line-picker-icon .icon{width:17px;height:17px}
 .line-picker-label{gap:3px}
 .line-picker-label small{font-size:8px;letter-spacing:1.35px}
 .line-picker-label strong{font-size:12px}
 .number-field{max-width:320px;margin:14px auto 3px;min-height:64px;border-bottom:none}
 .number-field input{text-align:center;height:61px;font-size:30px;font-weight:460;letter-spacing:1px}
 .number-field input::placeholder{font-size:23px;color:#9AA5B6}
 .erase{margin-left:-42px}
 .keypad{max-width:316px;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:18px;row-gap:12px;margin:7px auto 11px}
 .key{height:67px;width:67px;min-width:67px;background:#E9ECF2;border:0;border-radius:50%;box-shadow:none}
 .key strong{font-size:30px;line-height:33px;font-weight:430;color:#112A50}
 .key small{font-size:8.7px;letter-spacing:1.7px;color:#51637D}
 .dial-actions{margin:10px auto 0}
 .dial-button#start-call{width:68px;height:68px;min-height:68px;background:var(--orange);box-shadow:0 10px 22px rgba(245,130,32,.19);border-radius:50%}
 .dial-button#start-call .icon{width:27px;height:27px}
 .call-action-hint{font-size:11px;margin-top:7px;color:#607087}
 .dialer-foot{margin:10px auto 0;color:#98A2B2;font-size:9.5px}
 .dialer-foot .icon{height:13px;width:13px}
 .mobile-nav{bottom:max(8px,env(safe-area-inset-bottom));left:14px;right:14px;height:66px;padding:7px 6px 6px;border-radius:24px;z-index:30;display:flex;align-items:stretch;justify-content:space-between;border:1px solid rgba(255,255,255,.89);background:rgba(250,251,254,.89);-webkit-backdrop-filter:blur(34px) saturate(175%);backdrop-filter:blur(34px) saturate(175%);box-shadow:0 6px 26px rgba(9,31,66,.15)}
 .mobile-nav button{display:flex;flex:1;gap:4px;justify-content:center;align-items:center;flex-direction:column;position:relative;font-size:9.5px;font-weight:590;border-radius:18px;color:#8894A5;transition:color .15s}
 .mobile-nav button .icon{height:21px;width:21px;stroke-width:1.65}
 .mobile-nav button.mobile-selected{color:var(--navy);background:rgba(0,35,90,.06);font-weight:750}
 .mobile-nav button.mobile-selected:after{content:"";position:absolute;height:3px;width:17px;background:var(--orange);top:1px;border-radius:3px}
 .page:not(#page-dialer) .page-intro{margin:5px 0 18px}
 .page:not(#page-dialer) .page-intro h1{font-size:35px}
 .page-panel,.account-panel{border:0;background:white;box-shadow:none;border-radius:18px;margin-top:12px;padding:15px}
 .activity-row{min-height:72px;padding:11px 0;gap:12px}
 .activity-avatar,.contact-avatar{width:44px;height:44px;border-radius:50%}
 .activity-details strong{font-size:15px}.activity-details small{font-size:11px;margin-top:4px}
 .activity-time{font-size:10px}.mini-call{width:31px;height:31px;border-radius:50%;background:rgba(0,35,90,.06)}
 .records-list .activity-row{min-height:74px}.records-list .activity-time{margin-right:1px}
 .call-result{padding:4px 6px;font-size:9px}
 .list-tools{gap:11px;flex-direction:column;align-items:stretch}
 .search-field,.search-field input{width:100%}.search-field input{height:39px;background:#F0F1F5;border:0;border-radius:11px;font-size:14px}
 .filter-tabs{background:#EDEFF4;padding:4px;border-radius:12px;width:100%}
 .filter-tab{font-size:11px;padding:8px 3px}
 .contacts-grid{display:flex;flex-direction:column;gap:0;padding:0}
 .contact-card{border:0;border-bottom:1px solid #F0F1F5;border-radius:0;padding:13px 1px}
 .contact-details strong{font-size:15px}.contact-details span,.contact-details small{font-size:11px}
 .siren-hero{border-radius:23px;background:radial-gradient(circle at 95% 0,#1d4e9b,transparent 50%),linear-gradient(125deg,#063476,#001b44)}
 .siren-hero h2{font-size:23px}.siren-detail-grid{display:block}.detail-panel{margin-top:16px}
 .settings-grid{display:block}.settings-grid>.panel{margin-top:15px}.settings-grid .page-panel{padding:21px}
 .line-settings-list{margin-top:10px}
 .account-panel{padding:27px 22px}
 .call-overlay{padding:0;align-items:stretch;justify-content:stretch}
 .call-screen{border:0;border-radius:0;min-height:100svh;max-height:none;width:100vw;max-width:none;margin:0;padding-top:env(safe-area-inset-top);padding-bottom:calc(18px + env(safe-area-inset-bottom));box-shadow:none}
 .call-head{padding:16px 16px}
 .call-head img{max-width:110px}
 .call-center{flex:1;justify-content:center}
 .call-bottom{padding-bottom:14px}
 .toast{bottom:calc(88px + env(safe-area-inset-bottom));z-index:95;background:rgba(0,35,90,.92);border-radius:14px;font-size:13px}
}
@media(max-width:360px){.main{padding-left:17px;padding-right:17px}.key{width:62px;height:62px;min-width:62px}.keypad{column-gap:12px;row-gap:9px}.page-intro h1{font-size:32px}.preview-note{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ===== V4 premium polish ===== */
:root{
  --ios-bg:#F3F5F9;
  --ios-card:#FFFFFF;
  --ios-hairline:rgba(15,33,62,.08);
  --ios-shadow:0 14px 40px rgba(6,31,79,.08),0 2px 10px rgba(6,31,79,.04);
  --ios-shadow-soft:0 10px 30px rgba(6,31,79,.05);
}
body{background:radial-gradient(circle at top right,rgba(245,130,32,.08),transparent 24%),linear-gradient(180deg,#f8f9fc 0%,#f2f5f9 100%)}
.topbar{border-bottom:1px solid rgba(16,40,80,.04)}
.preview-status{background:#fff;border-color:#edf0f6;color:#566981;box-shadow:0 4px 14px rgba(5,25,56,.04)}
.panel,.stat-card,.page-panel,.account-panel,.contact-card{box-shadow:var(--ios-shadow)}
.siren-promo,.siren-hero{box-shadow:0 18px 44px rgba(0,27,77,.18)}
@media(max-width:740px){
  body,html,.app{background:linear-gradient(180deg,#f8f9fc 0%,#f2f4f8 100%)}
  .topbar{
    height:calc(62px + env(safe-area-inset-top));
    padding:calc(env(safe-area-inset-top) + 2px) 18px 0;
    background:rgba(248,249,252,.82);
    box-shadow:0 1px 0 rgba(18,39,73,.03);
  }
  .top-brand img{width:102px}
  .top-brand strong{font-size:10px;letter-spacing:2.1px;color:var(--navy)}
  .preview-status{display:none}
  .avatar-btn{background:rgba(255,255,255,.86);border:1px solid rgba(0,35,90,.08);box-shadow:0 8px 20px rgba(10,28,61,.06)}

  .main{padding:14px 18px calc(116px + env(safe-area-inset-bottom));max-width:640px}
  .page-intro{margin:6px 2px 10px}
  .page-intro h1{font-size:36px;letter-spacing:-1.5px;font-weight:780;margin:0}
  .page-intro p{font-size:13px;color:#6f7f96;margin-top:6px}
  .preview-note{font-size:11px;color:#7a889c;margin:8px 4px 10px}
  .preview-note strong{color:#22395f}

  #page-dialer .dialer-panel{
    background:linear-gradient(180deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.88) 100%);
    border:1px solid rgba(255,255,255,.8);
    border-radius:30px;
    box-shadow:0 18px 50px rgba(8,31,74,.08),0 4px 16px rgba(8,31,74,.05);
    padding:18px 18px 20px;
    position:relative;
    overflow:hidden;
  }
  #page-dialer .dialer-panel::before{
    content:"";
    position:absolute;
    inset:-40px auto auto -20px;
    width:180px;height:180px;border-radius:50%;
    background:radial-gradient(circle,rgba(245,130,32,.12),rgba(245,130,32,0) 66%);
    pointer-events:none;
  }
  #page-dialer .dialer-panel::after{
    content:"";
    position:absolute;
    top:-40px;right:-20px;
    width:190px;height:190px;border-radius:50%;
    background:radial-gradient(circle,rgba(0,35,90,.08),rgba(0,35,90,0) 68%);
    pointer-events:none;
  }
  .line-select-wrap{max-width:100%;margin:2px auto 0;position:relative;z-index:1}
  .line-picker{
    height:58px;
    border-radius:18px;
    background:rgba(245,247,250,.9);
    border:1px solid rgba(18,39,73,.05);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  }
  .line-picker-icon{background:#fff;box-shadow:0 8px 20px rgba(0,35,90,.08)}

  .number-field{
    max-width:100%;
    margin:18px auto 8px;
    padding:0 8px;
    min-height:78px;
    border-bottom:none;
    position:relative;
    z-index:1;
  }
  .number-field input{
    height:72px;
    font-size:34px;
    font-weight:460;
    letter-spacing:1.2px;
    color:#082a63;
  }
  .number-field input::placeholder{font-size:25px;color:#9ca8ba}
  .erase{
    width:34px;height:34px;border-radius:50%;background:#f1f4f8;
    border:1px solid rgba(11,33,69,.05);margin-left:-44px;
  }

  .keypad{max-width:310px;column-gap:18px;row-gap:16px;margin:10px auto 14px;position:relative;z-index:1}
  .key{
    width:72px;height:72px;min-width:72px;
    background:linear-gradient(180deg,#ffffff 0%,#f0f3f8 100%);
    border:1px solid rgba(17,42,80,.05);
    box-shadow:0 14px 24px rgba(12,31,67,.08), inset 0 1px 0 rgba(255,255,255,.9);
  }
  .key:hover{background:linear-gradient(180deg,#fff 0%,#edf2f7 100%)}
  .key:active{transform:scale(.95);background:linear-gradient(180deg,#eef3fa 0%,#e2e8f1 100%)}
  .key strong{font-weight:450;color:#0f2d5b}
  .key small{color:#6a7a91}

  .dial-actions{margin-top:14px;position:relative;z-index:1}
  .dial-button#start-call{
    width:74px;height:74px;min-height:74px;
    background:linear-gradient(180deg,#ff9c44 0%,#f58220 72%);
    border:1px solid rgba(235,113,23,.4);
    box-shadow:0 16px 28px rgba(245,130,32,.28), inset 0 1px 0 rgba(255,255,255,.35);
  }
  .call-action-hint{font-size:12px;font-weight:700;letter-spacing:.02em;color:#5f6f86;margin-top:10px}
  .dialer-foot{font-size:10px;color:#8f9aac;margin-top:12px}

  .page-panel,.account-panel,.contact-card{
    border-radius:24px;
    box-shadow:var(--ios-shadow-soft);
    border:1px solid rgba(255,255,255,.75);
    background:rgba(255,255,255,.96);
  }
  .search-field input{
    height:42px;background:#f4f6fa;border:1px solid rgba(19,39,77,.05);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
  }
  .filter-tabs{
    background:#eef2f7;border:1px solid rgba(17,42,80,.05);padding:4px;border-radius:14px;
  }
  .filter-tab{
    border-radius:11px;font-weight:650;color:#6d7c91;
  }
  .filter-tab.current{
    background:#fff;color:#0a2c64;box-shadow:0 6px 14px rgba(11,32,66,.08);
  }
  .activity-row,.contact-card{position:relative}
  .activity-row::after,.contact-card::after{
    content:"";position:absolute;left:56px;right:0;bottom:0;height:1px;background:rgba(20,40,80,.05)
  }
  .records-list .activity-row:last-child::after,.contacts-grid .contact-card:last-child::after{display:none}
  .contact-card{padding:14px 2px;border-radius:0;border:none;box-shadow:none;background:transparent}
  .contacts-grid{background:#fff;border-radius:24px;padding:2px 14px;box-shadow:var(--ios-shadow-soft);border:1px solid rgba(255,255,255,.75)}
  .activity-avatar,.contact-avatar{box-shadow:0 8px 18px rgba(4,26,61,.10)}

  .siren-hero{
    border-radius:28px;
    padding:24px 22px;
    background:radial-gradient(circle at 88% 8%,rgba(255,255,255,.14),transparent 26%),radial-gradient(circle at 0% 100%,rgba(245,130,32,.20),transparent 28%),linear-gradient(135deg,#0b3e84 0%,#00245b 62%,#001b48 100%);
  }
  .siren-hero h2{font-size:26px;line-height:1.08;letter-spacing:-1px}
  .siren-promo{border-radius:30px}

  .mobile-nav{
    left:12px;right:12px;height:72px;padding:8px 8px 9px;
    border-radius:28px;
    background:rgba(255,255,255,.82);
    border:1px solid rgba(255,255,255,.9);
    box-shadow:0 18px 34px rgba(7,30,71,.14),0 4px 12px rgba(7,30,71,.06);
    -webkit-backdrop-filter:blur(28px) saturate(160%);
    backdrop-filter:blur(28px) saturate(160%);
  }
  .mobile-nav button{font-size:9px;font-weight:650;color:#8792a4;border-radius:20px}
  .mobile-nav button .icon{height:20px;width:20px}
  .mobile-nav button.mobile-selected{
    color:var(--navy);
    background:linear-gradient(180deg,rgba(0,35,90,.08) 0%,rgba(0,35,90,.04) 100%);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.5);
  }
  .mobile-nav button.mobile-selected::after{top:3px;width:18px;height:3px}

  .call-overlay{background:rgba(0,15,40,.58);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
  .call-screen{
    background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.10),transparent 26%),radial-gradient(circle at 12% 100%,rgba(245,130,32,.22),transparent 28%),linear-gradient(180deg,#0d397b 0%,#04295d 48%,#011a44 100%);
  }
  .call-avatar-large{box-shadow:0 24px 50px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.28)}
  .call-head span{background:rgba(255,255,255,.12);padding:7px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.12);font-weight:700;letter-spacing:.08em}
  .call-buttons button span{box-shadow:0 10px 22px rgba(0,0,0,.12)}
  .end-call{box-shadow:0 18px 34px rgba(194,42,42,.22), inset 0 1px 0 rgba(255,255,255,.22)}
}