:root{
  --bg:#07090d;--bg2:#0c0f15;--panel:rgba(17,20,28,.86);--panel-strong:#12161f;--line:#2a303d;--line-soft:#1d222d;
  --text:#f2f4f8;--muted:#9da5b4;--gold:#ffd400;--gold2:#f4b900;--green:#4bd58b;--red:#ff6678;--blue:#6da8ff;--orange:#ffb658;
  --shadow:0 18px 60px rgba(0,0,0,.35);--r:22px;--rs:15px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)
}
*{box-sizing:border-box}html{background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}body{margin:0;min-height:100dvh;background:
radial-gradient(circle at 12% -10%,rgba(255,212,0,.16),transparent 32rem),radial-gradient(circle at 105% 15%,rgba(85,125,255,.09),transparent 28rem),linear-gradient(180deg,#080a0f,#06080c 60%,#080a0f);overflow-x:hidden}
button,input,select,textarea{font:inherit}.glass{background:linear-gradient(180deg,rgba(25,29,38,.88),rgba(14,17,24,.86));backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%);border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow)}
.muted{color:var(--muted)}.eyebrow{display:block;color:var(--gold);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:11px}.brand-mark{display:flex;align-items:center;gap:6px;font-size:33px;font-weight:950;letter-spacing:-.07em}.brand-mark.small{font-size:25px}.brand-fl{color:#fff}.brand-gold{color:var(--gold)}
.login-shell{min-height:100dvh;display:grid;place-items:center;padding:calc(20px + var(--safe-top)) 20px calc(20px + var(--safe-bottom))}.login-card{width:min(460px,100%);border-radius:30px;padding:clamp(24px,6vw,42px)}.login-card h1{margin:0 0 8px;font-size:clamp(35px,9vw,54px);letter-spacing:-.05em}.login-card>.brand-mark{margin-bottom:8px}.login-card p{line-height:1.55}.form-stack{display:grid;gap:16px;margin-top:28px}.form-stack label,.field{display:grid;gap:7px;font-weight:750;color:#e7e9ee}.form-stack input,.field input,.field select,.field textarea{width:100%;min-height:50px;padding:12px 14px;border-radius:14px;border:1px solid #333a48;background:#0b0e14;color:#fff;outline:0}.form-stack input:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(255,212,0,.12)}.form-error{margin:0;color:#ff9da9;background:#391920;border:1px solid #6b2b36;padding:12px 14px;border-radius:13px}.login-meta{display:flex;gap:8px;justify-content:center;align-items:center;margin-top:24px;color:#7f8797;font-size:12px;flex-wrap:wrap}
.btn{border:0;border-radius:14px;min-height:46px;padding:0 17px;font-weight:850;cursor:pointer;transition:.18s transform,.18s filter,.18s border-color}.btn:active{transform:translateY(1px) scale(.995)}.btn-primary{background:linear-gradient(180deg,#ffe23e,var(--gold));color:#151515;box-shadow:0 10px 32px rgba(255,212,0,.13)}.btn-secondary{background:#181d27;border:1px solid #303747;color:#eef}.btn-danger{background:#34171d;border:1px solid #6a2935;color:#ffbac3}.btn-ghost{background:transparent;border:1px solid #303644;color:#dce0e8}.btn-row{display:flex;gap:10px;flex-wrap:wrap}.btn-sm{min-height:38px;padding:0 13px;border-radius:11px;font-size:13px}.btn:disabled{opacity:.48;cursor:not-allowed}.icon-btn{width:42px;height:42px;border-radius:13px;border:1px solid #303644;background:#11151d;color:#fff;font-size:19px;display:grid;place-items:center;cursor:pointer}
.app-shell{min-height:100dvh}.sidebar{position:fixed;left:18px;top:18px;bottom:18px;width:236px;border-radius:26px;padding:20px 14px;display:flex;flex-direction:column;z-index:40}.side-brand{display:flex;align-items:baseline;gap:9px;padding:4px 8px 22px}.side-sub{color:#8992a2;font-weight:750}.side-nav{display:grid;gap:6px}.nav-btn{border:0;background:transparent;color:#9fa7b6;min-height:48px;border-radius:14px;padding:0 13px;display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer}.nav-btn span{font-size:19px;width:22px;text-align:center}.nav-btn b{font-size:14px}.nav-btn:hover{background:#ffffff08;color:#e8eaf0}.nav-btn.active{background:linear-gradient(90deg,rgba(255,212,0,.15),rgba(255,212,0,.045));color:var(--gold);box-shadow:inset 0 0 0 1px rgba(255,212,0,.12)}.side-user{margin-top:auto;border-top:1px solid var(--line-soft);padding:16px 7px 3px;display:flex;gap:10px;align-items:center}.side-user strong,.side-user small{display:block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side-user strong{font-size:13px}.side-user small{font-size:11px;color:#7e8798;margin-top:3px}.avatar{width:38px;height:38px;border-radius:13px;background:linear-gradient(145deg,var(--gold),#a88300);color:#17140a;font-weight:950;display:grid;place-items:center}
.main-column{min-height:100dvh;margin-left:272px;padding:18px 18px 44px}.topbar{position:sticky;top:18px;z-index:30;min-height:82px;border-radius:22px;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px}.topbar h1{font-size:clamp(22px,3vw,30px);margin:2px 0 0;letter-spacing:-.035em}.top-actions{display:flex;gap:8px;align-items:center}.status-pill{min-height:38px;padding:0 12px;border-radius:999px;border:1px solid #313745;background:#10141c;color:#c6cbd5;font-size:12px;font-weight:750;display:flex;align-items:center;gap:8px;max-width:min(44vw,390px)}.status-pill span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-pill i{width:8px;height:8px;border-radius:50%;background:#7f8796;flex:0 0 auto}.status-pill.online i{background:var(--green);box-shadow:0 0 10px #4bd58b88}.status-pill.offline i{background:var(--red)}.status-pill.warn i{background:var(--orange)}
.content{max-width:1400px;margin:18px auto 0;outline:0}.grid{display:grid;gap:16px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.card{border:1px solid rgba(255,255,255,.075);background:linear-gradient(180deg,rgba(18,22,30,.93),rgba(11,14,20,.91));border-radius:var(--r);padding:18px;box-shadow:0 16px 45px rgba(0,0,0,.2)}.card h2,.card h3{margin:0;letter-spacing:-.025em}.card h2{font-size:20px}.card h3{font-size:16px}.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:15px}.card-head p{margin:5px 0 0;color:var(--muted);font-size:13px;line-height:1.45}.metric{min-height:124px}.metric-value{font-weight:950;font-size:clamp(26px,5vw,43px);letter-spacing:-.055em;margin-top:14px}.metric-label{font-size:12px;color:#929aaa;font-weight:750}.metric small{color:#788293}.status-dot{display:inline-flex;width:10px;height:10px;border-radius:50%;background:#777}.status-dot.ok{background:var(--green)}.status-dot.bad{background:var(--red)}.status-dot.warn{background:var(--orange)}
.call-hero{position:relative;overflow:hidden;border-color:rgba(255,212,0,.23);background:radial-gradient(circle at 95% 0,rgba(255,212,0,.13),transparent 20rem),linear-gradient(180deg,#15191f,#0e1117)}.call-hero::after{content:"";position:absolute;inset:auto -40px -80px auto;width:220px;height:220px;border-radius:50%;border:1px solid rgba(255,212,0,.09)}.ring-label{color:var(--gold);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.13em}.caller-name{font-size:clamp(28px,6vw,54px);font-weight:950;letter-spacing:-.055em;margin:6px 0 3px}.caller-number{font-size:clamp(18px,3.2vw,28px);color:#cfd3dc;font-variant-numeric:tabular-nums}.call-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.chip{display:inline-flex;align-items:center;min-height:32px;padding:0 10px;border-radius:999px;background:#191e27;border:1px solid #303745;color:#bcc3cf;font-size:12px;font-weight:750}.chip.gold{background:#2b260b;border-color:#5f5107;color:#ffe04c}.chip.green{background:#112b20;border-color:#225c40;color:#8de7b7}.chip.red{background:#32171c;border-color:#622c36;color:#ff9dac}
.list{display:grid;gap:9px}.list-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) auto;gap:12px;align-items:center;padding:12px 13px;border:1px solid var(--line-soft);border-radius:15px;background:#0c1016}.list-row:hover{border-color:#343c4b}.primary{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.secondary{color:#8f98a8;font-size:12px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.time{color:#7d8797;font-size:12px;font-variant-numeric:tabular-nums;text-align:right}.state{font-size:11px;font-weight:850;padding:5px 8px;border-radius:999px;background:#1a1f28;color:#abb3c1}.state.ring{color:#ffe575;background:#2a250b}.state.connected{color:#80e7af;background:#102a1e}.state.end{color:#a2a9b5;background:#181b22}
.section-title{font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:#858e9e;font-weight:850;margin:22px 2px 10px}.empty{border:1px dashed #333a48;border-radius:18px;padding:28px;text-align:center;color:#8f98a8}.empty strong{color:#d8dce4;display:block;margin-bottom:5px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px;flex-wrap:wrap}.select{min-height:42px;background:#10141b;border:1px solid #323846;color:#fff;border-radius:12px;padding:0 12px;max-width:100%}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field span.help{color:#7f899a;font-size:12px;font-weight:500;line-height:1.45}.toggle-line{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 0;border-bottom:1px solid var(--line-soft)}.toggle-line:last-child{border-bottom:0}.toggle-line strong{font-size:14px}.toggle-line small{display:block;color:#87909f;margin-top:3px;line-height:1.4}.switch{position:relative;width:50px;height:29px;flex:0 0 50px}.switch input{position:absolute;opacity:0}.switch i{position:absolute;inset:0;border-radius:999px;background:#303643;transition:.2s}.switch i::after{content:"";position:absolute;width:23px;height:23px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s}.switch input:checked+i{background:#806b00;box-shadow:inset 0 0 0 1px #aa9000}.switch input:checked+i::after{transform:translateX(21px);background:var(--gold)}
.pbx-tabs{display:flex;gap:7px;overflow:auto;padding-bottom:3px;scrollbar-width:none}.pbx-tabs::-webkit-scrollbar{display:none}.tab-btn{white-space:nowrap;border:1px solid #303746;background:#10141b;color:#a5adba;border-radius:12px;min-height:39px;padding:0 12px;font-weight:800;cursor:pointer}.tab-btn.active{background:#2c2609;color:#ffdc32;border-color:#5b4d08}.quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.quick-action{border:1px solid #303746;background:#0f131a;border-radius:16px;padding:14px;min-height:108px;cursor:pointer;text-align:left;color:#fff}.quick-action b{display:block;margin:8px 0 4px}.quick-action small{color:#828c9c;line-height:1.35}.quick-action:hover{border-color:#5a4f1a}.warning-box{border:1px solid #634f15;background:#272109;border-radius:15px;padding:13px;color:#f3dc7e;font-size:13px;line-height:1.45}.info-box{border:1px solid #283d57;background:#0e1b29;border-radius:15px;padding:13px;color:#a9c8e9;font-size:13px;line-height:1.45}
.code-box{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:clamp(19px,5vw,32px);letter-spacing:.08em;background:#080a0e;border:1px dashed #554b19;border-radius:16px;padding:16px;color:#ffe058;text-align:center;word-break:break-all}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.device-card{display:grid;gap:13px}.device-icon{width:58px;height:58px;border-radius:18px;background:linear-gradient(145deg,#272d38,#12161e);border:1px solid #38404e;display:grid;place-items:center;font-size:27px}.kv{display:grid;grid-template-columns:minmax(130px,.7fr) 1.3fr;gap:7px 14px;font-size:13px}.kv dt{color:#7f8999}.kv dd{margin:0;color:#dce0e7;overflow-wrap:anywhere}.table-wrap{overflow:auto;border:1px solid var(--line-soft);border-radius:16px}.table{width:100%;border-collapse:collapse;min-width:660px}.table th,.table td{text-align:left;padding:11px 12px;border-bottom:1px solid #1c222d;font-size:13px}.table th{color:#858e9d;font-size:11px;text-transform:uppercase;letter-spacing:.05em}.table tr:last-child td{border-bottom:0}.table td{color:#dce0e7}.role{display:inline-flex;padding:4px 8px;border-radius:999px;background:#181e27;color:#aeb7c5;font-size:11px;font-weight:800}.toast-root{position:fixed;right:18px;top:18px;z-index:999;display:grid;gap:9px;width:min(390px,calc(100vw - 36px))}.toast{padding:13px 15px;border-radius:14px;background:#171c25;border:1px solid #384150;box-shadow:0 18px 45px #0008;color:#eef;animation:toastIn .2s ease}.toast.good{border-color:#286346}.toast.bad{border-color:#71303a}.toast.warn{border-color:#6e5b1a}@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}}
.skeleton{background:linear-gradient(90deg,#151922 25%,#202631 37%,#151922 63%);background-size:400% 100%;animation:shimmer 1.3s infinite;border-radius:10px;min-height:18px}@keyframes shimmer{0%{background-position:100% 0}100%{background-position:0 0}}.bottom-nav{display:none}
@media(max-width:1050px){.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.sidebar{width:210px}.main-column{margin-left:246px}}
@media(max-width:820px){body{padding-bottom:calc(74px + var(--safe-bottom))}.sidebar{display:none}.main-column{margin-left:0;padding:calc(10px + var(--safe-top)) 10px 22px}.topbar{top:calc(8px + var(--safe-top));min-height:70px;border-radius:19px;padding:11px 12px}.topbar .eyebrow{display:none}.topbar h1{font-size:22px}.status-pill{max-width:44vw;padding:0 9px}.status-pill span{font-size:0}.status-pill span::after{content:"CTI";font-size:11px}.content{margin-top:11px}.bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:8px;right:8px;bottom:calc(8px + var(--safe-bottom));z-index:80;border-radius:20px;padding:5px}.bottom-nav .nav-btn{min-height:54px;display:grid;place-items:center;gap:1px;padding:3px;color:#8e97a6}.bottom-nav .nav-btn span{font-size:19px;line-height:20px}.bottom-nav .nav-btn b{font-size:9px}.bottom-nav .nav-btn.active{color:var(--gold)}.grid-2,.grid-3{grid-template-columns:1fr}.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.card{border-radius:19px;padding:15px}.caller-name{font-size:36px}.quick-actions{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}}
@media(max-width:520px){.main-column{padding-left:7px;padding-right:7px}.topbar{border-radius:17px}.top-actions{gap:5px}.icon-btn{width:39px;height:39px;border-radius:12px}.grid-4{grid-template-columns:1fr 1fr;gap:9px}.metric{min-height:105px;padding:13px}.metric-value{font-size:29px}.card{padding:14px}.list-row{grid-template-columns:minmax(0,1fr) auto}.list-row>:nth-child(2){display:none}.caller-name{font-size:32px}.caller-number{font-size:19px}.kv{grid-template-columns:1fr}.kv dt{margin-top:7px}.table{min-width:610px}.btn{width:100%}.btn-row .btn{width:auto;flex:1}.status-pill{max-width:56px}.topbar h1{max-width:48vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
@media(max-width:380px){.grid-4{grid-template-columns:1fr}.topbar h1{font-size:20px}.bottom-nav .nav-btn b{font-size:8px}.login-shell{padding-left:12px;padding-right:12px}.login-card{padding:22px 18px}}
@media(display-mode:standalone){body{user-select:none}.field input,.field textarea{user-select:text}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
