:root{--white: #ffffff;--ink: #0e0e0e;--ink-type: #121212;--gold: #e9a93d;--gold-on-light: #8a6516;--gold-pressed: #d2942f;--gold-light: #f3d198;--muted-light: #5a5a5a;--hairline-light: #e4e4e4;--surface-raised-light: #f7f7f7;--surface-dark: #1a1a1a;--raised-dark: #222222;--hairline-dark: #2a2a2a;--muted-dark: #8a8a8a;--text-secondary-dark: #bfbfbf;--success: #2e7d5b;--warning: #e9a93d;--error: #c0392b;--info: #2d6cb2;--radius: 10px;--radius-lg: 14px;--font-display: "Oswald", "Arial Narrow", sans-serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--sidebar-w: 232px;--rail-w: 372px;color-scheme:light;--bg: var(--white);--surface: var(--surface-raised-light);--raised: #ffffff;--text: var(--ink-type);--text-muted: var(--muted-light);--hairline: var(--hairline-light);--accent-text: var(--gold-on-light);--key-bg: var(--surface-raised-light)}:root[data-theme=dark]{color-scheme:dark;--bg: var(--ink);--surface: var(--surface-dark);--raised: var(--raised-dark);--text: #f2f2f2;--text-muted: var(--text-secondary-dark);--hairline: var(--hairline-dark);--accent-text: var(--gold);--key-bg: var(--raised-dark)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;overflow:hidden}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}button:disabled{cursor:not-allowed;opacity:.4}input,select{font-family:inherit}.shell{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr) var(--rail-w);height:100%}@media(max-width:1180px){.shell{grid-template-columns:var(--sidebar-w) minmax(0,1fr)}.rail{display:none}.rail.open{display:flex;position:fixed;top:0;right:0;bottom:0;width:var(--rail-w);z-index:40;box-shadow:-14px 0 40px #00000059}.rail-toggle{display:inline-flex}}@media(max-width:820px){.shell{grid-template-columns:64px minmax(0,1fr)}.sidebar .nav-label,.sidebar .brand-word,.sidebar .who{display:none}.sidebar{align-items:center}.nav-item{justify-content:center}}.rail-toggle{display:none}.sidebar{display:flex;flex-direction:column;gap:2px;padding:18px 12px;border-right:1px solid var(--hairline);background:var(--surface);min-width:0}.brand{display:flex;align-items:baseline;gap:1px;font-family:var(--font-display);font-weight:600;font-size:21px;letter-spacing:.07em;text-transform:uppercase;padding:0 10px 4px;white-space:nowrap}.brand .mark{color:var(--accent-text)}.sidebar-status{padding:8px 10px 14px}.nav-item{display:flex;align-items:center;gap:11px;padding:10px 11px;border-radius:var(--radius);font-size:13.5px;font-weight:500;color:var(--text-muted);text-align:left;white-space:nowrap}.nav-item:hover{background:var(--raised);color:var(--text)}.nav-item.active{background:var(--raised);color:var(--text);font-weight:600;box-shadow:inset 3px 0 0 var(--gold)}.nav-icon{width:18px;text-align:center;font-size:15px;flex:none}.nav-count{margin-left:auto;font-size:11px;font-weight:700;color:var(--text-muted);font-variant-numeric:tabular-nums}.sidebar-spacer{flex:1}.sidebar-foot{border-top:1px solid var(--hairline);padding-top:12px;display:flex;flex-direction:column;gap:2px}.who{padding:4px 11px 10px;min-width:0}.who-name{font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.who-line{font-size:11.5px;color:var(--text-muted);font-variant-numeric:tabular-nums;margin-top:1px}.pill{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;font-size:11.5px;font-weight:600;letter-spacing:.02em;background:var(--raised);color:var(--text-muted);white-space:nowrap;border:1px solid var(--hairline)}.pill .dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}.pill.ready{color:var(--success)}.pill.busy{color:var(--warning)}.pill.dnd{color:var(--error)}.pill.offline{color:var(--text-muted)}.main{display:flex;flex-direction:column;min-width:0;overflow:hidden}.main-head{display:flex;align-items:center;gap:14px;padding:18px 24px 14px;border-bottom:1px solid var(--hairline);flex:none}.main-title{font-family:var(--font-display);font-size:21px;font-weight:500;letter-spacing:.03em;text-transform:uppercase}.main-sub{font-size:12px;color:var(--text-muted)}.head-spacer{flex:1}.search{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius);padding:0 11px;min-width:240px}.search input{border:none;background:transparent;color:var(--text);font-size:13px;padding:9px 0;width:100%;outline:none}.search input::placeholder{color:var(--text-muted)}.main-body{flex:1;overflow-y:auto;min-height:0}.icon-btn{width:34px;height:34px;border-radius:var(--radius);display:grid;place-items:center;font-size:14px;color:var(--text-muted);flex:none}.icon-btn:hover{background:var(--surface);color:var(--text)}.table{width:100%;border-collapse:collapse;font-size:13px}.table thead th{position:sticky;top:0;background:var(--bg);text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted);padding:11px 14px;border-bottom:1px solid var(--hairline);white-space:nowrap;z-index:1}.table tbody tr{border-bottom:1px solid var(--hairline)}.table tbody tr:hover{background:var(--surface)}.table td{padding:12px 14px;vertical-align:middle}.table td:first-child,.table th:first-child{padding-left:24px}.table td:last-child,.table th:last-child{padding-right:24px;text-align:right;white-space:nowrap}.cell-primary{font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}.cell-secondary{color:var(--text-muted);font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:320px}.num{font-variant-numeric:tabular-nums;color:var(--text-muted);white-space:nowrap}.tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--hairline);color:var(--text-muted)}.tag.missed{color:var(--error);border-color:#c0392b59}.tag.voicemail{color:var(--accent-text);border-color:#e9a93d66}.btn-mini{padding:6px 13px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--hairline);font-size:12px;font-weight:600;color:var(--text)}.btn-mini:hover:not(:disabled){background:var(--gold);border-color:var(--gold);color:var(--ink)}.empty{text-align:center;padding:64px 24px;color:var(--text-muted);font-size:13px;line-height:1.6}.empty-title{font-family:var(--font-display);font-size:17px;letter-spacing:.04em;text-transform:uppercase;color:var(--text);margin-bottom:6px}.rail{display:flex;flex-direction:column;border-left:1px solid var(--hairline);background:var(--surface);min-width:0;overflow-y:auto}.rail-head{display:flex;align-items:center;gap:10px;padding:16px 20px 10px;flex:none}.rail-label{font-family:var(--font-display);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}.rail-body{padding:0 20px 20px;display:flex;flex-direction:column;flex:1;min-height:0}.number-display{width:100%;border:none;background:transparent;color:var(--text);font-family:var(--font-display);font-size:31px;font-weight:500;letter-spacing:.02em;text-align:center;padding:6px 0 2px;outline:none}.number-display::placeholder{color:var(--text-muted);opacity:.45;font-size:20px}.caller-match{text-align:center;min-height:18px;font-size:12.5px;color:var(--accent-text);font-weight:600;margin-bottom:4px}.caller-from{display:flex;align-items:center;gap:8px;margin:6px 0 12px;font-size:11.5px;color:var(--text-muted)}.caller-from select{flex:1;min-width:0;padding:7px 9px;border-radius:var(--radius);border:1px solid var(--hairline);background:var(--raised);color:var(--text);font-size:12.5px}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.key{aspect-ratio:1.6;border-radius:var(--radius-lg);background:var(--key-bg);border:1px solid var(--hairline);font-family:var(--font-display);font-size:21px;font-weight:500;color:var(--text);transition:background 90ms ease,transform 60ms ease}.key:hover{background:var(--gold-light)}:root[data-theme=dark] .key:hover{background:#33291a;border-color:var(--gold-pressed)}.key:active{transform:scale(.97);background:var(--gold-pressed);color:var(--ink)}.key .sub{display:block;font-family:var(--font-body);font-size:8.5px;letter-spacing:.13em;color:var(--text-muted);margin-top:-2px}.actions{display:flex;gap:9px;align-items:center;margin-top:14px}.btn-call{flex:1;height:50px;border-radius:var(--radius-lg);background:var(--success);color:var(--white);font-size:15px;font-weight:700;letter-spacing:.03em}.btn-call:hover:not(:disabled){filter:brightness(1.1)}.btn-secondary{height:50px;min-width:50px;padding:0 14px;border-radius:var(--radius-lg);background:var(--raised);border:1px solid var(--hairline);color:var(--text);font-size:12.5px;font-weight:600}.btn-secondary:hover:not(:disabled){border-color:var(--gold)}.btn-secondary.on{background:var(--error);border-color:var(--error);color:var(--white)}.call-card{display:flex;flex-direction:column;align-items:center;gap:5px;padding:26px 16px 20px;background:var(--raised);border:1px solid var(--hairline);border-radius:var(--radius-lg);text-align:center}.call-state{font-size:11px;color:var(--text-muted);letter-spacing:.13em;text-transform:uppercase;font-weight:700}.call-peer{font-family:var(--font-display);font-size:26px;font-weight:500;word-break:break-all}.call-name{font-size:13.5px;color:var(--accent-text);font-weight:600}.call-timer{font-family:var(--font-display);font-size:19px;color:var(--text-muted);font-variant-numeric:tabular-nums;margin-top:2px}.call-controls{display:flex;gap:10px;margin-top:18px;justify-content:center;flex-wrap:wrap}.round{width:58px;height:58px;border-radius:50%;background:var(--surface);border:1px solid var(--hairline);display:grid;place-items:center;font-size:10.5px;font-weight:700;letter-spacing:.03em;color:var(--text)}.round:hover:not(:disabled){border-color:var(--gold)}.round.on{background:var(--gold);border-color:var(--gold);color:var(--ink)}.round.answer{background:var(--success);border-color:var(--success);color:var(--white)}.round.decline{background:var(--error);border-color:var(--error);color:var(--white)}.banner{margin:12px 20px 0;padding:10px 13px;border-radius:var(--radius);font-size:12.5px;line-height:1.5}.banner.error{background:#c0392b1a;color:var(--error);border:1px solid rgba(192,57,43,.28)}.banner.info{background:#2d6cb21a;color:var(--info);border:1px solid rgba(45,108,178,.24);cursor:pointer}.banner.warn{background:#e9a93d1f;color:var(--accent-text);border:1px solid rgba(233,169,61,.32)}.topbar{display:flex;align-items:center;gap:16px;padding:11px 24px;border-bottom:1px solid var(--hairline);flex:none;min-width:0}.kpis{display:flex;align-items:center;gap:20px;padding-left:4px;min-width:0;overflow:hidden}@media(max-width:1000px){.kpis{display:none}}.kpi{display:flex;flex-direction:column;gap:1px;white-space:nowrap}.kpi-label{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.kpi-value{font-family:var(--font-display);font-size:15px;font-weight:500;font-variant-numeric:tabular-nums}.nav{display:flex;flex-direction:column;gap:2px}.nav-count.live{color:var(--success);font-size:13px}.toast-stack{position:fixed;bottom:18px;right:18px;z-index:60;display:flex;flex-direction:column;gap:8px;max-width:380px}.toast{display:flex;align-items:flex-start;gap:10px;padding:11px 13px;border-radius:var(--radius);font-size:12.5px;line-height:1.45;background:var(--raised);border:1px solid var(--hairline);box-shadow:0 8px 24px #0000002e}.toast.success{border-color:#2e7d5b73;color:var(--success)}.toast.warn{border-color:#e9a93d73;color:var(--accent-text)}.toast.error{border-color:#c0392b73;color:var(--error)}.toast-x{margin-left:auto;opacity:.6;font-size:11px;flex:none}.toast-x:hover{opacity:1}.rec-flag{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--error)}.rec-flag .dot{width:7px;height:7px;border-radius:50%;background:currentColor}.incall-keypad{margin-top:16px;padding-top:14px;border-top:1px solid var(--hairline)}.incall-hint{font-size:11px;color:var(--text-muted);text-align:center;margin-bottom:9px}.wrapup{margin:18px 24px;padding:16px 18px;background:var(--surface);border:1px solid var(--hairline);border-left:3px solid var(--gold);border-radius:var(--radius-lg)}.wrapup-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.wrapup-title{font-family:var(--font-display);font-size:16px;letter-spacing:.04em;text-transform:uppercase}.field{margin-bottom:12px}.field label{display:block;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted);margin-bottom:5px}.field select,.field input,.field textarea{width:100%;padding:9px 11px;border-radius:var(--radius);border:1px solid var(--hairline);background:var(--raised);color:var(--text);font-size:13px;outline:none;resize:vertical}.field select:focus,.field input:focus,.field textarea:focus{border-color:var(--gold)}.wrapup-actions{display:flex;gap:9px;justify-content:flex-end;margin-top:4px}.btn-primary.small{padding:8px 18px;font-size:12.5px;border-radius:var(--radius)}.modal-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;background:#00000073;display:grid;place-items:center;padding:24px}.modal{width:100%;max-width:400px;background:var(--bg);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:18px 20px 16px;box-shadow:0 20px 60px #0006}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.modal-title{font-family:var(--font-display);font-size:16px;letter-spacing:.04em;text-transform:uppercase}.modal-note{font-size:11.5px;color:var(--text-muted);line-height:1.55;margin:0 0 14px}.login{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:32px;text-align:center}.login .brand{font-size:34px;padding-bottom:6px}.login p{color:var(--text-muted);font-size:14px;max-width:320px;line-height:1.6;margin:4px 0 22px}.btn-primary{padding:14px 30px;border-radius:var(--radius-lg);background:var(--ink);color:var(--white);font-size:14px;font-weight:700;letter-spacing:.04em}:root[data-theme=dark] .btn-primary{background:var(--gold);color:var(--ink)}.btn-primary:hover{filter:brightness(1.15)}.spinner{width:24px;height:24px;border:3px solid var(--hairline);border-top-color:var(--gold);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.ringing{animation:pulse 1.1s ease-in-out infinite}.rail.alert{box-shadow:inset 0 0 0 2px var(--gold)}
