:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#132035;background:#eef4fb}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}.loginPage,.appPage{min-height:100vh;background:radial-gradient(circle at top left,rgba(43,105,255,.22),transparent 30%),radial-gradient(circle at bottom right,rgba(0,190,160,.18),transparent 32%),linear-gradient(135deg,#f7fbff,#edf3fb)}.loginPage{display:grid;place-items:center;padding:24px}.loginCard{width:min(440px,100%);padding:34px;border-radius:34px;background:#ffffffd1;box-shadow:0 34px 100px #1c315429;border:1px solid rgba(255,255,255,.8);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.brandMark,.brandMini{display:grid;place-items:center;color:#fff;font-weight:950;background:linear-gradient(135deg,#2f65ff,#11c7a8);box-shadow:0 14px 30px #2f65ff40}.brandMark{width:70px;height:70px;border-radius:24px;font-size:34px;margin-bottom:18px}.brandMini{width:46px;height:46px;border-radius:16px;flex:0 0 auto}.loginCard h1{margin:0;font-size:46px;letter-spacing:-.06em}.loginCard p{color:#607188;line-height:1.55}.loginInput{width:100%;padding:18px;border:1px solid #d8e4f3;border-radius:20px;outline:none;background:#fff;margin:10px 0;font-size:18px}.loginInput:focus,.messageComposer input:focus{border-color:#4a79ff;box-shadow:0 0 0 5px #4a79ff1f}.loginError{margin:8px 0 12px;color:#c0392b;font-weight:800}.allowedBox{margin-top:18px;padding:16px;border-radius:20px;background:#f0f5fb;display:grid;gap:5px}.allowedBox span{color:#607188}.appPage{display:grid;grid-template-columns:310px 1fr}.sidebar{min-height:100vh;padding:20px;background:#ffffffb8;border-right:1px solid rgba(255,255,255,.85);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.sidebarHeader{display:flex;align-items:center;gap:13px;margin-bottom:22px}.sidebarHeader h1{margin:0;font-size:26px;letter-spacing:-.05em}.sidebarHeader p{margin:3px 0 0;color:#607188}.contacts{margin-top:16px;display:grid;gap:10px}.contact{width:100%;display:flex;gap:11px;align-items:center;padding:14px;border:1px solid transparent;border-radius:22px;background:#f5f8fdd1;cursor:pointer;text-align:left;color:#132035}.contact.selected{border-color:#2f65ff42;background:#fff;box-shadow:0 14px 30px #1c315414}.contactText{min-width:0;flex:1}.contact strong,.contact small{display:block}.contact small{color:#6b7b91;margin-top:3px}.contact em{min-width:24px;height:24px;border-radius:999px;background:#2f65ff;color:#fff;display:grid;place-items:center;font-size:12px;font-style:normal;font-weight:900}.presence{width:12px;height:12px;border-radius:999px;background:#9aa8ba;box-shadow:0 0 0 5px #9aa8ba1f;flex:0 0 auto}.presence.online{background:#00a884;box-shadow:0 0 0 5px #00a88421}.presence.offline{background:#d63031;box-shadow:0 0 0 5px #d630311f}.presence.checking{background:#f39c12;box-shadow:0 0 0 5px #f39c1221}.logout{width:100%;margin-top:22px;border:0;background:transparent;color:#d63031;font-weight:900;cursor:pointer}.mainPanel{padding:26px}.topBar{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:20px}.eyebrow{margin:0 0 8px;color:#2f65ff;text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:900}.topBar h2{margin:0;font-size:42px;letter-spacing:-.06em}.topBar span{color:#607188}.statusPill{display:flex;align-items:center;gap:10px;padding:13px 16px;border-radius:999px;background:#ffffffc7;font-weight:900}.statusDot,.bigDot{border-radius:999px;background:#d63031}.statusDot{width:12px;height:12px}.statusDot.warn{background:#f39c12}.statusDot.ok{background:#00a884}.contentGrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:18px}.card{border:1px solid rgba(255,255,255,.8);border-radius:30px;background:#ffffffc7;box-shadow:0 28px 80px #1c31541a;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.callCard,.chatCard,.logsCard{padding:22px}.callState{display:flex;align-items:center;gap:14px;margin-bottom:18px}.bigDot{width:52px;height:52px;background:#9aa8ba;box-shadow:0 0 0 10px #9aa8ba1a}.bigDot.ok{background:#00a884;box-shadow:0 0 0 10px #00a8841f}.bigDot.ring{background:#f39c12;box-shadow:0 0 0 10px #f39c121f}.callState h3,.chatHeader h3,.logsCard h3{margin:0;font-size:24px;letter-spacing:-.04em}.callState p{margin:3px 0 0;color:#607188}.incoming{margin-bottom:16px;padding:16px;border-radius:22px;background:#fff5e2e6;border:1px solid rgba(243,156,18,.22)}.incoming span{color:#9a5e00;font-weight:900}.incoming strong{display:block;margin:5px 0 12px;word-break:break-word}.row{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:13px}.btn,.control{border:0;border-radius:18px;padding:13px 16px;font-weight:950;cursor:pointer;transition:transform .16s,opacity .16s}.btn:hover:not(:disabled),.control:hover:not(:disabled),.keypad button:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled,.control:disabled,.keypad button:disabled{cursor:not-allowed;opacity:.45}.full{width:100%}.primary{color:#fff;background:linear-gradient(135deg,#2f65ff,#6d8cff);box-shadow:0 14px 26px #2f65ff38}.success{color:#fff;background:linear-gradient(135deg,#00a884,#18d0ad)}.danger{color:#fff;background:linear-gradient(135deg,#e04444,#ff7070)}.ghost{color:#26364b;background:#edf3fb}.control{flex:1;color:#26364b;background:#edf3fb}.control.active{color:#007d65;background:#00a8841f}.volume{display:flex;align-items:center;gap:12px;padding:13px;border-radius:18px;background:#f0f5fb;margin-bottom:13px}.volume span{font-weight:900;color:#526176}.volume input{width:100%}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.keypad button{height:56px;border:0;border-radius:18px;background:#f7faff;color:#132035;font-size:22px;font-weight:950;cursor:pointer}.chatCard{display:grid;grid-template-rows:auto 1fr auto;min-height:520px}.chatHeader{display:flex;justify-content:space-between;gap:10px;align-items:baseline;margin-bottom:12px}.chatHeader small{color:#607188}.chatBox{overflow:auto;padding:12px;border-radius:22px;background:#f3f7fc;min-height:330px}.empty{color:#718196}.bubble{max-width:78%;padding:12px 14px;border-radius:18px;margin:0 0 10px;background:#fff;box-shadow:0 8px 20px #1c31540d}.bubble.out{margin-left:auto;background:#2f65ff;color:#fff}.bubble p{margin:0 0 6px;white-space:pre-wrap}.bubble small{opacity:.75}.messageComposer{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:12px}.messageComposer input{border:1px solid #d8e4f3;border-radius:18px;outline:none;padding:13px 15px}.logsCard{margin-top:18px}.logs{max-height:220px;overflow:auto}.log{display:grid;grid-template-columns:76px 1fr;gap:10px;padding:9px 0;border-bottom:1px solid rgba(19,32,53,.07)}.log span{color:#8190a4;font-size:12px}.log p{margin:0;color:#304057}.log.ok p{color:#007d65}.log.warn p{color:#9a5e00}.log.error p{color:#c0392b}@media(max-width:980px){.appPage{grid-template-columns:1fr}.sidebar{min-height:auto;border-right:0;border-bottom:1px solid rgba(255,255,255,.85)}.contentGrid{grid-template-columns:1fr}}@media(max-width:600px){.mainPanel,.sidebar{padding:14px}.topBar{flex-direction:column;align-items:flex-start}.topBar h2{font-size:34px}.messageComposer{grid-template-columns:1fr}.btn,.control{width:100%}}.topBar>div:first-child>span{display:none}.dialBox{margin:12px 0 16px;padding:14px;border-radius:22px;background:#f3f7fc;border:1px solid rgba(216,228,243,.9)}.dialBox label{display:block;margin:0 0 8px;color:#526176;font-weight:900;font-size:13px;text-transform:uppercase;letter-spacing:.05em}.dialInputRow{display:grid;grid-template-columns:1fr 44px 44px;gap:8px;margin-bottom:10px}.dialInputRow input{min-width:0;border:1px solid #d8e4f3;border-radius:16px;outline:none;padding:11px 13px;background:#fff;font-size:16px}.dialInputRow input:focus{border-color:#4a79ff;box-shadow:0 0 0 4px #4a79ff1a}.smallBtn{border:0;border-radius:14px;background:#fff;color:#26364b;font-weight:950;cursor:pointer;box-shadow:inset 0 0 0 1px #d8e4f3e6}.keypad.compact{grid-template-columns:repeat(3,minmax(42px,1fr));gap:7px;max-width:230px;margin:0 auto}.keypad.compact button{height:42px;border-radius:14px;font-size:18px;background:#fff}.callCard .row .btn{min-width:118px}@media(max-width:600px){.dialInputRow{grid-template-columns:1fr 42px 42px}.keypad.compact{max-width:100%}.keypad.compact button{height:44px}}.dialHint{display:block;margin:-3px 0 9px;color:#718196;font-size:12px;font-weight:700;text-transform:none;letter-spacing:0}.callCard .btn.primary:disabled{opacity:.45}.control.active{color:#9a5e00;background:#f39c1224}
