/* styles.css */

:root{--bg:#f5f7f8;--card:#fff;--text:#24383d;--muted:#7b8b8e;--line:#e7edee;--teal:#13796c;--teal-dark:#0e5f56;--teal-light:#e9f5f1;--lime:#d5efa6;--sidebar:#142c31;--danger:#c75b61;--shadow:0 4px 20px #173b3d05;--blue:#427fc1;--amber:#b7832b;--purple:#8561b1}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,sans-serif;font-size:13px;line-height:1.5}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}a{color:var(--teal);text-decoration:none}button,input,select,textarea,a{outline-offset:3px}button:focus-visible,a:focus-visible{outline:3px solid #64b8a7}input:focus,select:focus,textarea:focus{outline:2px solid #8ac4b7;outline-offset:0;border-color:var(--teal)}svg{width:18px;height:18px;flex-shrink:0;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{font-family:Arial,sans-serif}h1{font-size:28px;font-weight:800;letter-spacing:-1px;line-height:1.3}h2{font-size:16px;font-weight:750;letter-spacing:-.3px}h3{font-size:14px;font-weight:750}small{font-size:11px}.muted{color:var(--muted)}.tiny{font-size:11px}.strong{font-weight:650}.eyebrow{color:var(--muted);font-size:10px;letter-spacing:1.6px;font-weight:700;text-transform:uppercase;margin-bottom:8px}.flex{display:flex;align-items:center;gap:12px}.between{display:flex;align-items:center;justify-content:space-between;gap:14px}.stack{display:flex;flex-direction:column;gap:5px}.nowrap{white-space:nowrap}.spacer{flex:1}.mono{font-variant-numeric:tabular-nums}.accent{color:var(--teal)}.danger-text{color:var(--danger)}.hidden{display:none!important}.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:224px;background:var(--sidebar);color:#aabfc2;display:flex;flex-direction:column;padding:29px 16px 17px;z-index:40}.brand{display:flex;align-items:center;gap:10px;padding:0 11px 25px;color:white}.brand-mark{display:grid;place-items:center;width:35px;height:35px;background:var(--lime);border-radius:11px;color:#193e36;font-family:Arial,sans-serif;font-weight:800;font-size:24px;transform:rotate(-4deg)}.brand-name{font-size:23px;font-weight:750;font-family:Arial,sans-serif;letter-spacing:-1.3px;line-height:1.1}.brand-name span{font-size:11px;font-weight:500;letter-spacing:.3px;margin-left:4px;color:#9eb9b9}.workspace{margin:0 6px 23px;padding:11px;background:#ffffff06;border:1px solid #ffffff0d;border-radius:9px;display:flex;align-items:center;gap:10px;font-size:11px}.workspace-icon{width:28px;height:28px;display:grid;place-items:center;border:1px solid #ffffff1a;border-radius:7px}.workspace strong{display:block;color:#dfe9e9;font-size:12px}.sidebar nav{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#39535a transparent;flex:1}.nav-label{font-size:9px;letter-spacing:1.4px;color:#6f9297;padding:19px 14px 8px;font-weight:650}.nav-label:first-child{padding-top:0}.nav-link{border:0;background:none;color:#a9bec2;display:flex;align-items:center;gap:11px;width:100%;text-align:left;padding:11px 13px;border-radius:7px;font-size:12px;margin:2px 0;transition:background .15s}.nav-link:hover{background:#ffffff08;color:white}.nav-link.active{background:#254d4c;color:#dcf2cf}.nav-link.active svg{color:var(--lime)}.nav-link .nav-count{margin-left:auto;background:#ffffff0c;border-radius:5px;padding:0px 6px;font-size:10px;color:#c7d8d8}.nav-link.active .nav-count{background:#d5efa624;color:var(--lime)}.side-footer{border-top:1px solid #ffffff0b;margin-top:16px;padding:15px 8px 0;display:flex;flex-direction:column;gap:12px}.side-footer button{background:none;border:0;color:#a9bec2;text-align:left;padding:2px;font-size:11px;display:flex;align-items:center;gap:10px}.demo-indicator{font-size:10px;display:flex;align-items:center;gap:7px;color:#7e9d9f}.dot{display:inline-block;width:6px;height:6px;background:#82bd97;border-radius:50%;flex-shrink:0}.side-user{display:flex;align-items:center;gap:9px}.side-user small{color:#7e9d9f;font-size:10px}.avatar{width:34px;height:34px;border-radius:50%;background:#e2efeb;color:#397565;display:inline-flex;justify-content:center;align-items:center;flex-shrink:0;font-weight:650;font-size:11px;border:2px solid var(--card)}.avatar.blue{background:#e8eff9;color:#567aa2}.avatar.purple{background:#eee9f7;color:#8b6caf}.avatar.orange{background:#faf0e2;color:#af8b51}.avatar.large{width:55px;height:55px;font-size:17px}.avatar.small{width:28px;height:28px;font-size:9px}.sidebar .avatar{border-color:#28464b;background:#375b59;color:#d5efa6}
.shell{margin-left:224px;min-height:100vh}.topbar{height:77px;background:var(--card);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:22px;padding:0 36px;position:sticky;top:0;z-index:30}.breadcrumbs{font-size:11px;color:var(--muted);white-space:nowrap;display:flex;align-items:center;gap:12px}.breadcrumbs svg{width:12px;height:12px;color:#a7b2b4}.breadcrumbs strong{font-weight:500;color:var(--text)}.global-search{position:relative;margin-left:auto;width:260px}.search-wrap{position:relative;display:flex;align-items:center}.search-wrap>svg{position:absolute;left:11px;color:#98a7a8;width:16px}.search-wrap input{width:100%;padding:10px 12px 10px 35px;border:1px solid var(--line);border-radius:7px;background:var(--bg);font-size:11px;color:var(--text)}.key-hint{position:absolute;right:10px;color:#98a7a8;border:1px solid var(--line);border-radius:4px;padding:0 5px;font-size:10px}.search-results{position:absolute;top:45px;right:0;width:340px;background:var(--card);box-shadow:0 16px 50px #18373825;border:1px solid var(--line);border-radius:10px;padding:8px;max-height:400px;overflow:auto}.search-results button{display:flex;gap:10px;align-items:center;text-align:left;width:100%;padding:10px;border:0;background:none;color:var(--text);border-radius:6px}.search-results button:hover{background:var(--bg)}.role-selector{display:flex;align-items:center;gap:8px;padding-left:22px;border-left:1px solid var(--line)}.role-selector small{font-size:9px;color:var(--muted);display:block;line-height:1.2}.role-selector select{border:none;background:none;color:var(--text);font-weight:650;font-size:11px;padding:0 18px 0 0;max-width:122px}.icon-btn{display:inline-flex;align-items:center;justify-content:center;background:none;border:1px solid var(--line);border-radius:7px;width:33px;height:33px;color:var(--muted);position:relative}.icon-btn:hover{background:var(--bg);color:var(--teal)}.icon-btn.borderless{border:0}.notification-dot{position:absolute;right:7px;top:5px;width:5px;height:5px;border-radius:50%;background:#d5a054;border:1px solid white}.mobile-menu{display:none}.main{padding:32px 36px 40px;max-width:1700px;margin:auto}.page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:25px}.page-head p{color:var(--muted);font-size:12px;margin-top:7px}.page-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.btn{border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 14px;font-size:11px;font-weight:600;min-height:36px;white-space:nowrap;transition:background .15s,transform .15s}.btn svg{width:15px;height:15px}.btn:hover{background:var(--bg);border-color:#cfdbd9}.btn.primary{background:var(--teal);border-color:var(--teal);color:white;box-shadow:0 3px 7px #11796c12}.btn.primary:hover{background:var(--teal-dark)}.btn.soft{background:var(--teal-light);border-color:transparent;color:var(--teal)}.btn.danger{background:#faeded;color:var(--danger);border-color:#f3d9db}.btn.small{padding:6px 10px;min-height:29px;font-size:10px}.btn.link{border:none;background:none;color:var(--teal);padding:4px;min-height:24px}.btn.full{width:100%}.btn.lime{background:var(--lime);border-color:var(--lime);color:#2c4f38}.date-control{position:relative;display:flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--card);padding:8px 12px;border-radius:7px;color:var(--text);font-size:11px}.date-control svg{width:14px;height:14px;color:var(--muted)}.date-control input{border:0;background:none;color:var(--text);font-size:11px;width:106px}.date-control select{border:0;background:none;color:var(--text);font-size:11px}.card{background:var(--card);border:1px solid var(--line);border-radius:11px;box-shadow:var(--shadow);overflow:hidden}.card-pad{padding:22px}.card-head{padding:20px 22px 16px;display:flex;align-items:center;justify-content:space-between;gap:15px}.card-head p{font-size:11px;color:var(--muted);margin-top:3px}.card-body{padding:0 22px 22px}.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.kpi{padding:20px 21px;position:relative}.kpi-top{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:11px}.kpi-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;color:var(--teal);background:var(--teal-light);position:absolute;right:19px;top:18px}.kpi-icon.blue{background:#edf3fc;color:var(--blue)}.kpi-icon.orange{background:#fcf4e8;color:var(--amber)}.kpi-icon.purple{background:#f3eefa;color:var(--purple)}.kpi-value{font-size:31px;letter-spacing:-1px;line-height:1.2;margin-top:15px;font-weight:750;font-family:Arial,sans-serif}.kpi-bottom{margin-top:10px;display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted)}.metric-tag{font-size:9px;padding:2px 5px;border-radius:4px;background:var(--teal-light);color:var(--teal);font-weight:600}.metric-tag.orange{background:#fbf3e5;color:var(--amber)}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr);gap:22px;margin-bottom:22px}.dashboard-bottom{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:22px;margin-bottom:22px}.segmented{display:flex;gap:3px;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:3px;width:max-content}.segmented button{border:0;border-radius:4px;background:none;color:var(--muted);font-size:10px;padding:5px 10px;white-space:nowrap}.segmented button.active{background:var(--card);color:var(--text);box-shadow:0 1px 4px #203c3e0d}.bar-chart{height:190px;display:flex;gap:15px;padding:20px 4px 0;position:relative}.chart-y{width:23px;display:flex;flex-direction:column;justify-content:space-between;font-size:9px;color:var(--muted);padding-bottom:25px}.chart-plot{display:flex;align-items:flex-end;flex:1;justify-content:space-around;background:repeating-linear-gradient(to top,transparent 0,transparent calc(25% - 1px),var(--line) calc(25% - 1px),var(--line) 25%);margin-bottom:25px;border-bottom:1px solid var(--line)}.chart-group{height:100%;width:10%;display:flex;align-items:flex-end;justify-content:center;gap:4px;position:relative}.bar{width:16px;max-width:38%;background:#bddfd4;border-radius:4px 4px 0 0;transition:height .4s;min-height:2px}.bar.dark{background:var(--teal)}.chart-group.current .bar.dark{background:#1a8472}.chart-x{position:absolute;bottom:-25px;font-size:9px;color:var(--muted);white-space:nowrap}.chart-group.current .chart-x{color:var(--teal);font-weight:650}.chart-legend{display:flex;align-items:center;gap:16px;font-size:10px;color:var(--muted)}.legend-dot{display:inline-block;width:7px;height:7px;background:var(--teal);border-radius:2px;margin-right:5px}.legend-dot.light{background:#bddfd4}.target-card{padding:22px;background:linear-gradient(150deg,#fff 50%,#f4faf4);display:flex;flex-direction:column}.target-card .target-heading{display:flex;align-items:center;justify-content:space-between}.target-card .target-heading svg{color:var(--teal)}.target-main{display:flex;align-items:center;gap:20px;padding:20px 0}.donut{position:relative;width:112px;height:112px;flex-shrink:0}.donut svg{width:112px;height:112px;transform:rotate(-90deg);stroke-linecap:round}.donut-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;font-weight:750;font-size:23px;font-family:Arial,sans-serif}.donut-label small{color:var(--muted);font-size:9px;font-family:Arial,sans-serif;font-weight:400}.target-main strong{font-size:24px;letter-spacing:-.6px;font-family:Arial,sans-serif}.target-main p{font-size:11px;color:var(--muted);margin:3px 0 8px}.target-bottom{border-top:1px solid var(--line);display:flex;gap:18px;padding-top:15px;margin-top:auto;font-size:10px;color:var(--muted)}.target-bottom strong{font-size:16px;color:var(--text);display:block;font-family:Arial,sans-serif}.list-item{display:flex;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid var(--line)}.list-item:last-child{border-bottom:0;padding-bottom:0}.list-item:first-child{padding-top:0}.list-item .name{font-weight:600;font-size:12px}.list-item .sub{color:var(--muted);font-size:10px;margin-top:2px}.time-block{width:48px;border-right:1px solid var(--line);padding-right:10px;flex-shrink:0;font-size:13px;font-weight:650}.time-block small{font-size:9px;font-weight:400;display:block;color:var(--muted)}.activity-icon{width:30px;height:30px;background:var(--teal-light);color:var(--teal);display:grid;place-items:center;border-radius:50%;flex-shrink:0}.activity-icon svg{width:14px;height:14px}.activity-icon.orange{background:#fbf3e5;color:var(--amber)}.activity-item{position:relative;display:flex;gap:11px;padding-bottom:19px}.activity-item:not(:last-child):before{content:'';position:absolute;top:29px;bottom:0;left:14px;border-left:1px solid var(--line)}.activity-item:last-child{padding-bottom:0}.activity-item p{font-size:11px;margin-top:2px}.activity-item small{font-size:10px;color:var(--muted)}.chip{display:inline-flex;align-items:center;gap:5px;border-radius:5px;padding:4px 7px;font-size:9px;font-weight:550;white-space:nowrap;line-height:1.3;background:#eef2f3;color:#6e858a}.chip .dot{width:4px;height:4px;background:currentColor}.chip.green{background:#eaf5ed;color:#448b60}.chip.teal{background:#e8f4f0;color:#287b68}.chip.orange{background:#fcf3e3;color:#b18a3d}.chip.blue{background:#edf3fc;color:#5b80b9}.chip.red{background:#faeded;color:#bf7375}.chip.purple{background:#f1edfa;color:#8b70ae}.chip.gray{background:#f0f2f4;color:#819095}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left;font-size:11px}th{font-size:9px;letter-spacing:.4px;font-weight:550;color:var(--muted);padding:12px 19px;background:#fafbfc;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}td{padding:13px 19px;border-bottom:1px solid var(--line)}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#f5f9f840}.person-cell{display:flex;align-items:center;gap:10px}.person-cell strong{font-size:11px;font-weight:600;display:block}.person-cell small{font-size:9px;color:var(--muted);display:block;margin-top:2px}.table-link{background:none;border:0;color:var(--text);font:inherit;text-align:left;padding:0}.table-link:hover{color:var(--teal)}.table-footer{display:flex;align-items:center;justify-content:space-between;padding:13px 20px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}.pagination{display:flex;gap:5px;align-items:center}.pagination button{border:1px solid var(--line);background:var(--card);color:var(--muted);width:25px;height:25px;border-radius:4px;font-size:10px}.pagination button.active{color:var(--teal);background:var(--teal-light);border-color:#d1e8df}.toolbar{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}.toolbar .search-wrap{min-width:210px;flex:1;max-width:310px}.toolbar select,.filter-select{border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--text);padding:9px 26px 9px 10px;font-size:10px;min-height:34px;max-width:180px}.tabs{display:flex;gap:23px;border-bottom:1px solid var(--line);margin-bottom:22px}.tabs button{border:none;border-bottom:2px solid transparent;padding:12px 0;background:none;color:var(--muted);font-size:11px;white-space:nowrap}.tabs button.active{border-bottom-color:var(--teal);color:var(--teal);font-weight:600}.tabs .tab-count{font-size:9px;background:var(--bg);padding:2px 5px;border-radius:4px;margin-left:4px}.info-banner{display:flex;align-items:flex-start;gap:10px;padding:13px 17px;border:1px solid #dcebe3;background:#f0f8f3;border-radius:8px;color:#547a69;font-size:11px;margin-bottom:20px}.info-banner svg{width:16px;height:16px;margin-top:1px}.info-banner.amber{background:#fffbf0;border-color:#f0e6cc;color:#a18443}.view-switch{margin-left:auto}.empty{padding:44px 20px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;gap:9px;color:var(--muted)}.empty svg{width:30px;height:30px;color:#9ebbb2}.empty strong{color:var(--text);font-size:13px}.empty p{font-size:11px;max-width:330px}.pipeline{display:grid;grid-template-columns:repeat(4,minmax(200px,1fr));gap:15px;overflow-x:auto;padding-bottom:10px}.pipeline-column{padding:12px;background:#eaf0f0;border-radius:9px;min-height:300px}.pipeline-head{padding:3px 2px 14px;display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:650}.pipeline-item{background:var(--card);border:1px solid var(--line);padding:15px;border-radius:8px;margin-bottom:10px;cursor:pointer}.pipeline-item:hover{border-color:#9dc6b9}.pipeline-item p{font-size:11px;font-weight:650}.pipeline-item small{display:block;font-size:10px;color:var(--muted);margin:5px 0 12px}.pipeline-item .between{margin-top:12px}.callback-card{padding:17px 22px;display:flex;align-items:center;gap:17px;margin-bottom:11px}.callback-card .time-block{width:75px;font-size:20px}.callback-card .time-block small{font-size:10px}.callback-card p{font-size:11px;color:var(--muted);margin-top:4px}.callback-card .callback-actions{display:flex;gap:7px;margin-left:auto;flex-wrap:wrap}.day-label{font-size:10px;font-weight:650;color:var(--muted);margin:21px 0 10px;text-transform:uppercase;letter-spacing:1px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:22px}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.field label{display:block;font-size:11px;font-weight:550;margin-bottom:7px}.field input:not([type=checkbox]),.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:6px;padding:10px 12px;color:var(--text);background:var(--card);font-size:12px;min-height:39px}.field input::placeholder,.field textarea::placeholder{color:#a2afb1}.field textarea{resize:vertical;min-height:90px}.field small{display:block;font-size:10px;color:var(--muted);margin-top:6px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.field.span-2{grid-column:1/-1}.check-label{display:flex!important;align-items:center;gap:9px;font-weight:400!important;cursor:pointer}.check-label input{accent-color:var(--teal);width:14px;height:14px}.form-divider{grid-column:1/-1;border-top:1px solid var(--line);padding-top:15px;color:var(--muted);font-size:10px;letter-spacing:.5px}.modal-backdrop,.drawer-backdrop{position:fixed;inset:0;background:#102b3260;z-index:70;backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:24px}.modal{background:var(--card);border-radius:13px;border:1px solid var(--line);box-shadow:0 25px 80px #07232330;max-width:620px;width:100%;max-height:90vh;display:flex;flex-direction:column;animation:appear .15s}.modal.wide{max-width:900px}.modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:24px 26px 18px;border-bottom:1px solid var(--line)}.modal-header h2{font-size:19px}.modal-header p{font-size:11px;color:var(--muted);margin-top:5px}.modal-content{padding:23px 26px;overflow-y:auto}.modal-footer{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--line);padding:16px 26px}.drawer-backdrop{z-index:60;justify-content:flex-end;padding:0;backdrop-filter:none;background:#102b3240}.drawer{width:640px;max-width:100%;height:100%;background:var(--card);box-shadow:-10px 0 45px #102b321f;display:flex;flex-direction:column;animation:slide .2s}.drawer-header{padding:24px 27px;border-bottom:1px solid var(--line)}.drawer-title{display:flex;align-items:center;gap:13px;margin-top:20px}.drawer-title h2{font-size:21px}.drawer-content{padding:0 27px 28px;overflow:auto;flex:1}.drawer .tabs{margin-bottom:20px;gap:23px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0 25px}.detail-grid small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}.detail-grid p{font-size:12px}.detail-section{border-top:1px solid var(--line);padding:22px 0 0;margin-top:22px}.detail-section h3{margin-bottom:14px}.detail-note{padding:14px;background:var(--bg);border:1px solid var(--line);border-radius:7px;font-size:12px;margin-top:10px;white-space:pre-wrap}.detail-note small{display:block;color:var(--muted);font-size:10px;margin-bottom:6px}.toggle{display:inline-flex;width:32px;height:18px;border-radius:12px;background:#dce4e3;padding:2px;border:0;align-items:center;transition:background .15s}.toggle:before{content:'';width:14px;height:14px;background:white;border-radius:50%;box-shadow:0 1px 2px #0002;transition:transform .15s}.toggle.on{background:var(--teal)}.toggle.on:before{transform:translateX(14px)}.setting-row{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line);gap:15px}.setting-row:last-child{border-bottom:0}.setting-row p{font-size:12px;font-weight:500}.setting-row small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.call-panel{position:fixed;bottom:22px;right:24px;width:352px;z-index:80;background:var(--card);border:1px solid var(--line);border-radius:13px;box-shadow:0 10px 60px #133c3f30;overflow:hidden;animation:appear .2s}.call-head{padding:13px 17px;background:var(--sidebar);color:#dfebeb;display:flex;align-items:center;justify-content:space-between;font-size:11px}.call-head small{font-size:8px;letter-spacing:1px;color:var(--lime);background:#d5efa61a;padding:3px 6px;border-radius:4px}.call-head button{border:0;background:none;color:#b0c7c9;padding:2px}.call-head svg{width:15px;height:15px}.call-body{padding:20px}.call-person{text-align:center}.call-person .avatar{margin-bottom:9px}.call-person strong{display:block;font-size:16px;font-family:Arial,sans-serif}.call-person p{color:var(--muted);font-size:12px;margin-top:4px}.call-timer{margin:12px auto;font-variant-numeric:tabular-nums;color:var(--teal);font-size:12px}.call-controls{display:flex;align-items:center;justify-content:center;gap:16px;margin:17px 0}.call-controls button{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--muted)}.call-controls button.end{background:#d76a6d;border-color:#d76a6d;color:white}.call-controls button.selected{background:var(--teal-light);color:var(--teal)}.call-body textarea{border:1px solid var(--line);background:var(--bg);border-radius:7px;padding:11px;width:100%;min-height:75px;font-size:11px;color:var(--text);resize:vertical}.call-label{font-size:10px;color:var(--muted);margin:12px 0 8px;display:block}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:14px}.result-grid button{padding:9px 4px;border:1px solid var(--line);background:var(--bg);font-size:10px;border-radius:5px;color:var(--text)}.result-grid button.selected{background:var(--teal-light);border-color:var(--teal);color:var(--teal)}.call-minimized{padding:14px 17px;display:flex;align-items:center;justify-content:space-between}.call-keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:10px 0}.call-keypad button{border:1px solid var(--line);background:var(--bg);border-radius:4px;padding:7px;color:var(--text)}.inline-fields{display:flex;gap:8px;margin-bottom:10px}.inline-fields input{min-width:0;width:50%;border:1px solid var(--line);border-radius:5px;padding:8px;font-size:11px;background:var(--card);color:var(--text)}.inline-fields select{min-width:0;width:100%;border:1px solid var(--line);border-radius:5px;padding:8px;font-size:11px;background:var(--card);color:var(--text)}#toast-root{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:120;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.toast{padding:12px 18px;border-radius:8px;background:#173b36;color:#f0f7ed;box-shadow:0 5px 25px #102b3225;display:flex;gap:9px;align-items:center;font-size:12px;animation:appear .2s}.toast svg{width:16px}.toast.error{background:#91474c}.notes-layout{display:grid;grid-template-columns:300px 1fr;min-height:570px}.notes-list{border-right:1px solid var(--line)}.notes-list-head{padding:18px;border-bottom:1px solid var(--line)}.note-item{padding:17px 20px;border:0;border-bottom:1px solid var(--line);width:100%;text-align:left;background:none;color:var(--text)}.note-item.active{background:var(--teal-light);box-shadow:inset 3px 0 var(--teal)}.note-item strong{font-size:12px;display:flex;align-items:center;gap:7px}.note-item p{font-size:11px;color:var(--muted);margin:7px 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.note-item small{font-size:9px;color:var(--muted)}.note-editor{padding:26px;display:flex;flex-direction:column}.note-editor textarea{flex:1;min-height:300px;width:100%;border:0;resize:vertical;background:none;color:var(--text);font-size:13px;line-height:1.9;margin-top:22px;outline:none}.note-title{border:0;color:var(--text);background:none;font-family:Arial,sans-serif;font-size:22px;font-weight:750;width:100%;margin:20px 0 8px}.chat-layout{display:grid;grid-template-columns:270px 1fr;min-height:560px}.chat-channels{border-right:1px solid var(--line);padding:18px 12px}.chat-channel{display:flex;align-items:center;gap:11px;width:100%;padding:13px 11px;border:0;border-radius:7px;text-align:left;color:var(--text);background:none;margin-bottom:5px}.chat-channel.active{background:var(--teal-light)}.chat-channel p{font-size:11px;font-weight:600}.chat-channel small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.chat-main{display:flex;flex-direction:column;min-width:0}.chat-top{padding:18px 24px;border-bottom:1px solid var(--line)}.chat-messages{padding:24px;flex:1;max-height:450px;overflow:auto;background:linear-gradient(0deg,var(--bg),var(--card));display:flex;flex-direction:column;gap:21px}.chat-message{display:flex;align-items:flex-start;gap:10px;max-width:85%}.chat-message.mine{align-self:flex-end;flex-direction:row-reverse}.chat-message small{font-size:9px;color:var(--muted);display:block;margin-bottom:5px}.message-bubble{padding:11px 14px;background:var(--card);border:1px solid var(--line);border-radius:0 9px 9px 9px;white-space:pre-wrap;font-size:12px}.mine .message-bubble{background:var(--teal-light);border-color:#d7eae2;border-radius:9px 0 9px 9px}.chat-composer{padding:15px 20px;border-top:1px solid var(--line);display:flex;gap:10px}.chat-composer textarea{width:100%;min-height:39px;max-height:100px;resize:vertical;border:1px solid var(--line);border-radius:6px;padding:10px;font-size:12px;background:var(--bg);color:var(--text)}.team-card{padding:23px}.team-card .team-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:20px 0;border-bottom:1px solid var(--line);margin-bottom:16px}.team-stats small{font-size:9px;color:var(--muted);display:block}.team-stats strong{font-size:21px;font-family:Arial,sans-serif;display:block;margin-top:5px}.progress{height:6px;border-radius:5px;background:var(--line);overflow:hidden;margin-top:9px}.progress span{display:block;height:100%;background:var(--teal);border-radius:5px;max-width:100%}.drop-zone{border:2px dashed #bfd8d0;border-radius:10px;padding:37px 22px;text-align:center;background:#f7fbf8;position:relative;cursor:pointer}.drop-zone:hover,.drop-zone.dragging{background:var(--teal-light);border-color:var(--teal)}.drop-zone>svg{width:36px;height:36px;color:#7bafa0;margin-bottom:12px}.drop-zone h3{font-size:15px}.drop-zone p{font-size:11px;color:var(--muted);margin:7px 0 16px}.drop-zone input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}.step-list{display:flex;flex-direction:column;gap:22px;padding-top:8px}.step{display:flex;gap:13px}.step-num{width:28px;height:28px;background:var(--teal-light);color:var(--teal);display:grid;place-items:center;flex-shrink:0;border-radius:7px;font-size:11px;font-weight:650}.step p{font-size:12px;font-weight:550;margin-bottom:4px}.step small{font-size:11px;color:var(--muted)}.package-card{padding:22px}.package-price{font-family:Arial,sans-serif;font-size:27px;font-weight:750;margin:18px 0 5px}.package-price small{font-family:Arial,sans-serif;color:var(--muted);font-size:10px;font-weight:400}.package-card ul{padding-left:16px;font-size:11px;color:var(--muted);line-height:2}.permission-check{color:var(--teal);font-size:15px}.permission-no{color:#b3bfc0}.report-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:15px}.mini-stat{background:var(--bg);border-radius:8px;padding:15px}.mini-stat small{font-size:10px;color:var(--muted)}.mini-stat strong{font-size:22px;display:block;font-family:Arial,sans-serif;margin-top:6px}.calendar-cell select{font-size:9px;border:0;background:var(--teal-light);color:var(--teal);padding:6px 8px;border-radius:5px}.notification-panel{position:fixed;right:30px;top:70px;width:350px;z-index:50;background:var(--card);border:1px solid var(--line);box-shadow:0 15px 55px #102b3220;border-radius:10px;padding:19px}.notification-panel button{background:none;border:0;text-align:left;color:var(--text);display:flex;gap:10px;padding:14px 0;width:100%;border-bottom:1px solid var(--line)}.notification-panel button:last-child{border-bottom:0}.notification-panel button p{font-size:11px;font-weight:550}.notification-panel button small{font-size:10px;color:var(--muted)}.login-screen{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-art{background:var(--sidebar);padding:60px 70px;display:flex;flex-direction:column;justify-content:center;color:white;position:relative;overflow:hidden}.login-art:after{content:'';width:500px;height:500px;border:1px solid #abc6ad20;border-radius:50%;position:absolute;bottom:-160px;right:-230px;box-shadow:0 0 0 60px #abc6ad05,0 0 0 120px #abc6ad05}.login-art .brand{padding:0;margin-bottom:70px}.login-art h1{font-size:44px;letter-spacing:-1.5px;max-width:430px}.login-art p{margin-top:20px;color:#9fb9b9;font-size:14px;max-width:380px;line-height:1.8}.login-form{display:flex;align-items:center;justify-content:center;padding:40px}.login-inner{max-width:370px;width:100%}.login-inner h2{font-size:25px;margin-bottom:10px}.login-roles{display:flex;flex-direction:column;gap:10px;margin:25px 0}.login-role{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:8px;padding:15px;cursor:pointer;background:var(--card)}.login-role input{accent-color:var(--teal)}.login-role:has(input:checked){border-color:var(--teal);background:var(--teal-light)}.login-role strong{display:block;font-size:12px}.login-role small{color:var(--muted);font-size:10px}.app-footer{display:flex;align-items:center;justify-content:space-between;color:#9aa9ab;font-size:9px;padding-top:27px;gap:12px}.app-footer span{display:flex;align-items:center;gap:6px}.app-footer svg{width:12px;height:12px}.bulk-bar{background:var(--teal-light);border-bottom:1px solid #d7e8e0;display:flex;align-items:center;gap:14px;padding:10px 20px;font-size:11px}.integration-icon{width:60px;height:60px;border-radius:15px;background:var(--teal-light);color:var(--teal);display:grid;place-items:center;margin-bottom:18px}.integration-icon svg{width:29px;height:29px}.month-label{background:var(--teal-light);color:var(--teal);border-radius:5px;padding:3px 7px;font-size:10px}.mobile-shade{display:none}.compact-summary{display:flex;gap:20px;padding:17px 20px;font-size:11px;color:var(--muted);border-bottom:1px solid var(--line);flex-wrap:wrap}.compact-summary strong{color:var(--text);font-size:14px;margin-right:4px}.auth-warning{padding:12px;background:var(--bg);border-radius:7px;font-size:11px;color:var(--muted);line-height:1.7}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.help-item{padding:16px;border:1px solid var(--line);border-radius:8px}.help-item svg{color:var(--teal);margin-bottom:8px}.help-item p{font-size:12px;font-weight:600}.help-item small{font-size:11px;color:var(--muted);display:block;margin-top:6px}.result-count{font-size:11px;color:var(--muted)}
body.dark{--bg:#102229;--card:#192f36;--text:#dce7e8;--muted:#8eaaaf;--line:#2a434b;--teal:#67bca4;--teal-dark:#358e79;--teal-light:#25463f;--sidebar:#0b1b20;--shadow:none}body.dark th{background:#142931}body.dark .target-card{background:linear-gradient(150deg,#192f36,#1f3d39)}body.dark .pipeline-column{background:#142a30}body.dark .drop-zone{background:#17352f}body.dark .chip{filter:brightness(.9)}body.dark .btn.primary{color:#102e27}body.dark .kpi-icon{background:#25463f}body.dark .notification-dot{border-color:var(--card)}body.dark .modal-backdrop{background:#030f15a0}
@keyframes appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes slide{from{transform:translateX(25px);opacity:.5}to{transform:translateX(0);opacity:1}}
@media(min-width:1600px){.main{padding:38px 45px}.topbar{padding:0 45px}.kpi{padding:24px}.bar-chart{height:220px}.dashboard-grid{grid-template-columns:1.9fr 1fr}}
@media(max-width:1250px){.sidebar{width:204px;padding-left:12px;padding-right:12px}.shell{margin-left:204px}.main{padding:26px}.topbar{padding:0 26px;gap:13px}.global-search{width:210px}.role-selector{padding-left:13px}.dashboard-grid{grid-template-columns:1.55fr 1fr}.target-main{gap:12px}.donut,.donut svg{width:95px;height:95px}.target-card{padding:20px}.card-head{padding:18px}.card-body{padding:0 18px 18px}.kpis{gap:12px}.kpi{padding:18px 15px}.kpi-icon{right:13px;width:28px;height:28px}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.breadcrumbs .breadcrumb-parent{display:none}}
@media(max-width:1050px){.dashboard-grid,.dashboard-bottom{gap:16px}.dashboard-grid{grid-template-columns:1.35fr 1fr}.target-main{flex-direction:column;align-items:flex-start;gap:9px;padding:12px 0}.target-main .donut{display:none}.target-bottom{gap:12px}.topbar .global-search{display:none}.role-selector{margin-left:auto}.page-head{align-items:flex-start}.page-actions{justify-content:flex-end}.notes-layout{grid-template-columns:250px 1fr}.chat-layout{grid-template-columns:220px 1fr}.callback-card{flex-wrap:wrap}.callback-card .callback-actions{margin-left:0}.kpi-top{font-size:10px;max-width:75%}.grid-2{gap:16px}.app-footer{align-items:flex-start}}
@media(max-width:800px){.sidebar{transform:translateX(-100%);transition:transform .2s;width:224px;z-index:55}.sidebar.open{transform:translateX(0)}.sidebar.open+.mobile-shade{display:block;position:fixed;inset:0;background:#102b3250;z-index:50}.shell{margin-left:0}.mobile-menu{display:inline-flex}.topbar{height:65px;padding:0 19px;gap:12px}.breadcrumbs{font-size:10px}.main{padding:23px 19px}.page-head h1{font-size:24px}.page-head{margin-bottom:20px}.page-head .eyebrow{font-size:9px}.page-actions .date-control{display:none}.kpis{gap:10px;margin-bottom:17px}.kpi-value{font-size:26px}.kpi-icon{display:none}.kpi-top{max-width:100%}.kpi{padding:16px 12px}.kpi-bottom{font-size:9px;flex-wrap:wrap;gap:3px}.dashboard-grid{grid-template-columns:1.6fr 1fr;gap:14px}.dashboard-bottom{gap:14px}.card-head h2{font-size:14px}.dashboard-grid .segmented button{padding:4px 6px}.app-footer{font-size:9px}.toolbar{padding:14px}.toolbar .search-wrap{max-width:none}.tabs{gap:20px;overflow-x:auto}.form-grid{gap:14px}.login-art{padding:45px 35px}.login-art h1{font-size:33px}.login-art .brand{margin-bottom:40px}.login-form{padding:25px}.chat-channel{padding:12px 7px}.grid-3{gap:14px}.team-card{padding:18px}}
@media(max-width:600px){.page-head{flex-direction:column;gap:16px}.page-actions{justify-content:flex-start;width:100%}.page-actions .btn{flex:1}.role-selector{border-left:0;padding:0}.role-selector>.avatar{display:none}.topbar{gap:9px}.topbar>.avatar{display:none}.breadcrumbs{flex:1;max-width:170px}.breadcrumbs .breadcrumb-parent{display:none}.role-selector select{font-size:10px;max-width:108px}.role-selector small{font-size:8px}.topbar .icon-btn{width:27px;height:29px}.kpis{grid-template-columns:1fr 1fr;gap:10px}.kpi{padding:16px}.kpi-icon{display:grid;width:25px;height:25px;right:13px;top:13px}.kpi-icon svg{width:14px;height:14px}.kpi-value{font-size:29px;margin-top:11px}.kpi-top{font-size:11px}.dashboard-grid,.dashboard-bottom{grid-template-columns:1fr;gap:16px}.target-main{flex-direction:row;align-items:center;gap:20px}.target-main .donut{display:block}.target-bottom{gap:25px}.card-head{padding:17px}.card-body{padding:0 17px 17px}.grid-2,.grid-3{grid-template-columns:1fr}.toolbar{gap:8px}.toolbar .search-wrap{flex-basis:100%;min-width:100%}.toolbar select{max-width:46%;flex:1}.view-switch{margin-left:0}.table-footer{font-size:9px;padding:12px 14px;gap:8px}.card-pad{padding:18px}.notes-layout{grid-template-columns:1fr}.notes-list{border-right:0;border-bottom:1px solid var(--line);max-height:210px;overflow:auto}.note-item{padding:12px 18px}.note-item p{margin:3px 0}.notes-list-head{padding:12px 18px}.note-editor{padding:20px;min-height:400px}.note-title{font-size:19px}.chat-layout{grid-template-columns:1fr}.chat-channels{display:flex;gap:6px;border-right:0;border-bottom:1px solid var(--line);overflow-x:auto;padding:10px}.chat-channel{min-width:150px;width:auto;padding:9px}.chat-channel .avatar{width:25px;height:25px}.chat-channel small{font-size:9px}.chat-messages{padding:17px;max-height:400px;min-height:280px}.chat-message{max-width:95%}.chat-top{padding:15px 18px}.chat-composer{padding:12px}.callback-card{padding:16px;gap:11px}.callback-card .time-block{width:57px;font-size:17px}.callback-card .callback-actions{width:100%;border-top:1px solid var(--line);padding-top:12px;justify-content:flex-end}.callback-card>.avatar{display:none}.modal-backdrop{padding:12px}.modal{max-height:94vh}.modal-header{padding:20px}.modal-content{padding:20px}.modal-footer{padding:15px 20px}.form-grid{grid-template-columns:1fr}.field.span-2{grid-column:auto}.drawer-header{padding:20px}.drawer-content{padding:0 20px 24px}.drawer-title h2{font-size:19px}.call-panel{width:calc(100% - 24px);right:12px;bottom:12px;max-height:85vh;overflow:auto}.notification-panel{right:12px;top:62px;width:calc(100% - 24px)}.app-footer{flex-direction:column;gap:5px}.login-screen{grid-template-columns:1fr}.login-art{padding:30px;min-height:250px}.login-art .brand{margin-bottom:25px}.login-art h1{font-size:29px}.login-art p{font-size:12px;margin-top:12px}.login-form{padding:30px 25px}.help-grid{grid-template-columns:1fr}.report-summary{gap:8px}.mini-stat{padding:12px}.mini-stat strong{font-size:19px}.global-search{display:none}.compact-summary{gap:12px;font-size:10px}.bulk-bar{flex-wrap:wrap}#toast-root{width:90%;bottom:18px}.toast{font-size:11px;width:100%}.target-main strong{font-size:24px}.bar-chart{height:190px}}
.global-search>.key-hint{top:10px}.metric-tag{white-space:nowrap}.kpi-bottom{flex-wrap:wrap}.demo-indicator{white-space:normal;line-height:1.35;font-size:9px}.demo-indicator .dot{flex:none}.modal>form{display:flex;flex-direction:column;min-height:0;overflow:hidden}.modal>form>.modal-content{flex:1;min-height:0}.modal>.modal-content{min-height:0}.modal-backdrop{z-index:100}
@media print{.sidebar,.topbar,.page-actions,.app-footer,#call-root,#toast-root,.toolbar,.tabs,.btn{display:none!important}.shell{margin:0}.main{padding:0}body{background:white;color:black}.card{box-shadow:none;break-inside:avoid}table{font-size:10px}.kpis{gap:10px}th,td{padding:9px}.modal-backdrop,.drawer-backdrop{position:static;background:white;padding:0}.drawer,.modal{width:100%;max-width:100%;height:auto;max-height:none;box-shadow:none}.modal-content,.drawer-content{overflow:visible}}


/* keycall.css */
/* KeyCall visual identity. Logo: public KeyCall website. */
:root{--bg:#f7f6f7;--card:#fff;--text:#2c2c34;--muted:#85858e;--line:#eae7e9;--teal:#b21d28;--teal-dark:#931721;--teal-light:#fbeef0;--lime:#f0a06d;--sidebar:#111217;--danger:#bd5c65;--shadow:0 4px 20px #41101904;--blue:#5b79ae;--amber:#bd7d36;--purple:#866b9c}
button:focus-visible,a:focus-visible{outline-color:#e0a29f}input:focus,select:focus,textarea:focus{outline-color:#e2aaa5}input[type=checkbox]{accent-color:var(--teal)}
.sidebar{background:linear-gradient(165deg,#17171d 0%,#101116 72%);color:#a6a3ad}
.brand.keycall-brand{padding:0 5px 24px;gap:9px;min-height:67px}
.brand.keycall-brand img{display:block;width:138px;height:auto;object-fit:contain}
.brand-crm{font-size:8px;font-weight:650;letter-spacing:1px;color:#d2c7c5;border:1px solid #74615f66;border-radius:4px;padding:3px 4px;white-space:nowrap}
.workspace{border-color:#ffffff09;background:#ffffff04}.workspace strong{color:#f0e8e7}.workspace-icon{border-color:#5a393c;color:#cf7e6e}.workspace{color:#8b8087}
.nav-label{color:#68646f}.nav-link{color:#a4a0ac}.nav-link:hover{color:#fff;background:#ffffff06}.nav-link.active{background:linear-gradient(95deg,#88232955,#5c2b2330);color:#fff;box-shadow:inset 2px 0 #c84a3d}.nav-link.active svg{color:#ee976d}.nav-link .nav-count{background:#ffffff09;color:#b8abb0}.nav-link.active .nav-count{background:#b92c3940;color:#ffc3aa}.side-footer{border-color:#ffffff0c}.side-footer button{color:#a8a1ad}.side-footer .avatar{border-color:#482c34;background:#48252d;color:#f1b49c}.side-user small{color:#837882}.demo-indicator{color:#8f7c80}.demo-indicator .dot{background:#d97953}
.btn.primary{background:linear-gradient(105deg,#aa1b28,#be302e);border-color:#ac2029;color:white;box-shadow:0 3px 8px #a91c2217}.btn.primary:hover{background:linear-gradient(105deg,#941621,#ab2626);border-color:#941621}.btn:hover{border-color:#dacccc}.btn.soft{background:#fbeef0;color:#a8252e}.btn.lime{background:#ef9d66;color:#3c1b15;border-color:#ef9d66}
.avatar{background:#f6e9e9;color:#ad5760}.avatar.blue{background:#e9edf6;color:#6b80a4}.avatar.purple{background:#f0eaf3;color:#95749f}.avatar.orange{background:#fbede1;color:#bc8252}
.kpi-icon{background:#fbeef0;color:#b21d28}.kpi-icon.blue{background:#edf0f8;color:#6e7fa5}.kpi-icon.orange{background:#fbf0e7;color:#c98240}.kpi-icon.purple{background:#f3edf5;color:#93769d}.kpi:first-child{border-top-color:#e4b7ba}.metric-tag{background:#f9e9ec;color:#aa414a}.metric-tag.orange{background:#fcf1e7;color:#bb8648}
.bar{background:#ebc4c7}.bar.dark{background:#b21d28}.chart-group.current .bar.dark{background:#cb4c35}.chart-group.current .chart-x{color:#b21d28}.legend-dot{background:#b21d28}.legend-dot.light{background:#ebc4c7}
.target-card{background:linear-gradient(150deg,#fff 52%,#fff3ed)}.target-bottom{border-color:#f0e3e1}.activity-icon{background:#f9e9ec;color:#b21d28}.activity-icon.orange{background:#fcf0e4;color:#bf7e3b}.info-banner{background:#fcf2f1;border-color:#eedbd8;color:#98675f}.info-banner.amber{background:#fffbf0;border-color:#f0e6cc;color:#a18445}
.segmented button.active{color:#a82a33}.table-link:hover{color:#b21d28}.pipeline-column{background:#eee9ec}.pipeline-item:hover{border-color:#d9a3aa}.chip.teal{background:#eaf5ef;color:#397c5a}.chip.gray{background:#f0edef;color:#8a808b}.chip.orange{background:#fcf0e2;color:#b08143}.chip.red{background:#fae9ec;color:#b9646d}.chip.blue{background:#edf0f8;color:#687fad}
.time-block{border-color:#eadfe0}.call-head{background:linear-gradient(110deg,#1c171e,#381c24);color:#f3e5e6}.call-head small{background:#b3393e40;color:#f3ba9b}.call-head .dot{background:#e69464}.call-head button{color:#c6aeb6}.call-controls button.end{background:#b21d28;border-color:#b21d28}.call-controls button.selected{background:#fbeef0;color:#b21d28}.call-timer{color:#a9454e}.result-grid button.selected{background:#fbeef0;border-color:#c67177;color:#a62a35}.call-body textarea{background:#faf7f8}
.note-item.active{background:#fcf0f1;box-shadow:inset 3px 0 #b21d28}.chat-channel.active{background:#f9edf0}.mine .message-bubble{background:#fbeef0;border-color:#edd8dc}.drop-zone{border-color:#dbb9bd;background:#fcf7f8}.drop-zone:hover,.drop-zone.dragging{background:#fbecf0;border-color:#b21d28}.drop-zone>svg{color:#c18a8f}.step-num{background:#fbeef0;color:#ac2731}.toast{background:#39252b;color:#fff0eb}.toast.error{background:#a92b37}.integration-icon{background:#fbeef0;color:#b21d28}.month-label{background:#fbeef0;color:#aa2b35}.calendar-cell select{background:#f9edf0;color:#a0424c}
.login-art{background:radial-gradient(ellipse at 25% 65%,#681c263d,transparent 55%),radial-gradient(ellipse at 90% 15%,#a5501b20,transparent 45%),#111217}.login-art .brand.keycall-brand{padding:0;margin-bottom:70px;gap:15px}.login-art .brand.keycall-brand img{width:230px}.login-art .brand-crm{font-size:10px;padding:5px 7px}.login-art:after{border-color:#dc6f3933;box-shadow:0 0 0 60px #b21d2808,0 0 0 120px #b21d2805}.login-art .eyebrow{color:#e29168!important}.login-art p{color:#a2939f}.login-art h1{line-height:1.2}.login-role:has(input:checked){border-color:#b21d28;background:#fcf0f1}
body.dark{--bg:#111217;--card:#1c1c24;--text:#eee5e9;--muted:#a596a3;--line:#34303a;--teal:#e17c77;--teal-dark:#bd4d52;--teal-light:#40262e;--sidebar:#0d0e13;--shadow:none}body.dark th{background:#181820}body.dark .target-card{background:linear-gradient(150deg,#1c1c24,#302127)}body.dark .btn.primary{background:linear-gradient(105deg,#a91d2b,#be3c32);border-color:#b82c34;color:white}body.dark .pipeline-column{background:#17151d}body.dark .drop-zone{background:#291c24}body.dark .card-head{border-color:#34303a}body.dark .call-body textarea{background:#17151d}body.dark .note-item.active,body.dark .chat-channel.active{background:#40262e}body.dark .mine .message-bubble{background:#40262e;border-color:#56343f}body.dark .info-banner{background:#342127;border-color:#56333b;color:#c99b9c}
.keycall-visual{background:#f7f5f6}.keycall-visual .visual-top{background:#111217;color:#e7d7d5}.keycall-visual .visual-keycall-logo{display:block;width:164px;height:auto}.keycall-visual .visual-top .brand{gap:12px}.keycall-visual .visual-top .btn{background:#ffffff06;border-color:#ffffff1b;color:#e8dfe0}.keycall-visual .visual-top .btn.lime{background:linear-gradient(110deg,#b21d28,#c1472f);border-color:#bd3730;color:#fff}.keycall-visual .visual-top .brand-crm{color:#d3b8b7}.keycall-visual .visual-intro .eyebrow{color:#b21d28}.keycall-visual .visual-item{color:#8a7b85}.keycall-visual .visual-item:hover{background:#faf1f2;color:#a72b36}.keycall-visual .visual-item.active{background:#faecef;color:#a72b36}.keycall-visual .visual-item.active .visual-number{color:#c4626c}.keycall-visual .visual-group{color:#9e8994}.keycall-visual .visual-number{color:#b29ea8}.keycall-visual .visual-menu-list{scrollbar-color:#ddcbd1 white}.keycall-visual .visual-menu-head{color:#6f4e59}.keycall-visual .stage-image{background:#f0e9ec}.keycall-visual .stage-image img{border-color:#e3d6dc}.keycall-visual .stage-detail svg{color:#bd5a62}.keycall-visual .stage-detail p{color:#8a7a82}.keycall-visual .stage-detail strong{color:#48303a}.keycall-visual .zoom-tag{background:#341b28e8}.keycall-visual .visual-bottom{background:#f9eff0;border-color:#ecd9dd;color:#996b74}.keycall-visual .visual-bottom svg{color:#b65760}.keycall-visual .visual-help{color:#a28793}.keycall-visual .visual-count{border-color:#eadce1;color:#aa899a}.keycall-visual .gallery-dialog-body{background:#efe6ea}
@media(max-width:1250px){.brand.keycall-brand{padding-left:3px;padding-right:3px;gap:8px}.brand.keycall-brand img{width:135px}}
@media(max-width:800px){.login-art .brand.keycall-brand{margin-bottom:40px}.login-art .brand.keycall-brand img{width:190px}}
@media(max-width:600px){.login-art .brand.keycall-brand{margin-bottom:25px}.login-art .brand.keycall-brand img{width:170px}.keycall-visual .visual-keycall-logo{width:122px}.keycall-visual .visual-top .brand{gap:8px}.keycall-visual .visual-top .brand-crm{font-size:7px}.keycall-visual .visual-top .btn{font-size:9px}.sidebar .brand.keycall-brand img{width:145px}}

.sidebar nav{scrollbar-color:#62414e transparent}


/* agent-tools.css */
.range-kpi{padding:0;display:flex;flex-direction:column}.range-kpi-body{padding:20px 21px;position:relative;flex:1}.kpi-date-footer{padding:10px 17px;border-top:1px solid var(--line);margin-top:auto}.kpi-date-button,.range-trigger{display:inline-flex;align-items:center;gap:7px;color:var(--muted);background:var(--card);border:1px solid var(--line);border-radius:6px;padding:7px 9px;font-size:10px;line-height:1.3;white-space:nowrap;min-height:29px}.kpi-date-button{width:100%;justify-content:space-between;font-size:9px;padding:6px 8px}.kpi-date-button>span{flex:1;text-align:left}.kpi-date-button svg,.range-trigger svg{width:13px;height:13px}.kpi-date-button svg:last-child,.range-trigger svg:last-child{width:10px}.kpi-date-button:hover,.range-trigger:hover{background:var(--teal-light);border-color:#dcb6bc;color:var(--teal)}.range-chart-head{align-items:flex-start;flex-wrap:wrap}.chart-head-tools{display:flex;align-items:center;gap:9px;flex-wrap:wrap;justify-content:flex-end}.range-chart-head .range-trigger{font-size:9px;min-height:29px;padding:6px 8px}.range-chart .chart-group .bar{min-height:2px}.range-presets{grid-column:1/-1;display:flex;gap:7px;flex-wrap:wrap;margin-bottom:3px}.range-presets .btn{font-size:10px;padding:6px 10px}.contract-kpi{transition:background .18s,box-shadow .18s,transform .18s;border-color:#eadcdf}.kpi-open{border:none;background:none;color:inherit;font:inherit;text-align:left;width:100%;cursor:pointer;border-radius:10px 10px 0 0;display:block;outline-offset:-4px}.kpi-open .kpi-top{max-width:calc(100% - 30px)}.kpi-open-hint{display:flex;align-items:center;gap:6px;font-size:9px;color:var(--teal);margin-top:11px;font-weight:600}.kpi-open-hint svg{width:12px;height:12px}.contract-kpi:hover,.contract-kpi:focus-within{background:linear-gradient(112deg,#a71b29,#cf542c);border-color:#bb3530;box-shadow:0 6px 19px #b72d2e24;transform:translateY(-2px);color:#fff}.contract-kpi:hover .kpi-top,.contract-kpi:focus-within .kpi-top,.contract-kpi:hover .kpi-bottom,.contract-kpi:focus-within .kpi-bottom,.contract-kpi:hover .kpi-open-hint,.contract-kpi:focus-within .kpi-open-hint{color:#ffebe4}.contract-kpi:hover .kpi-icon,.contract-kpi:focus-within .kpi-icon{background:#ffffff19;color:#fff}.contract-kpi:hover .kpi-date-footer,.contract-kpi:focus-within .kpi-date-footer{border-color:#ffffff26}.contract-kpi:hover .kpi-date-button,.contract-kpi:focus-within .kpi-date-button{background:#ffffff0e;border-color:#ffffff42;color:white}.contract-kpi .kpi-date-button:hover{background:#ffffff26}.contract-kpi .kpi-date-button:focus-visible{outline:2px solid white}.summary-period-note{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);margin-bottom:17px}.summary-period-note svg{color:var(--teal);width:15px;height:15px}.summary-range-form{display:flex;align-items:flex-end;gap:11px;padding:16px;background:var(--bg);border:1px solid var(--line);border-radius:8px;flex-wrap:wrap}.summary-range-form .field{min-width:140px;flex:1}.summary-range-form .field input{font-size:11px;padding:9px 10px;min-height:36px}.summary-range-form .field label{font-size:10px;margin-bottom:6px}.summary-range-form .btn{height:36px;min-height:36px;font-size:10px}.summary-result-bar{display:flex;align-items:center;justify-content:space-between;padding:20px 1px 14px;gap:12px}.summary-result-bar strong{font-size:12px}.summary-table{border:1px solid var(--line);border-radius:7px}.summary-table td,.summary-table th{padding:12px 13px;font-size:10px}.summary-table th{font-size:9px}.summary-table tr:first-child th{border-top:0}.summary-back svg{transform:rotate(180deg)}.manual-form-intro{grid-column:1/-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--bg);border:1px solid var(--line);padding:12px 14px;border-radius:7px;font-size:10px;color:var(--muted)}.manual-form-intro .btn{margin-left:auto;font-size:10px}.manual-section-title{display:flex;align-items:center;gap:8px;color:var(--teal);font-size:10px;font-weight:650;letter-spacing:.6px;margin-top:2px}.manual-section-title svg{width:15px;height:15px}.manual-status-note{grid-column:1/-1;display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);padding:13px 0 0;border-top:1px solid var(--line);flex-wrap:wrap}.manual-status-note svg{width:15px;height:15px;color:var(--teal)}.manual-detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.manual-detail-grid p{overflow-wrap:anywhere;font-size:11px}.manual-detail-grid small{font-size:9px}.contract-summary-content .empty{padding-top:35px;padding-bottom:35px}.range-kpi .kpi-bottom{min-height:18px}.range-kpi .kpi-value{margin-top:15px}
body.dark .contract-kpi:hover,body.dark .contract-kpi:focus-within{background:linear-gradient(112deg,#8b1b2b,#b4472e)}body.dark .manual-form-intro{background:#18151d}body.dark .summary-range-form{background:#17151b}
@media(max-width:1250px){.range-kpi-body{padding:18px 15px}.kpi-date-footer{padding:9px 12px}.kpi-date-button{font-size:8px}.range-chart-head{gap:12px}.chart-head-tools{justify-content:flex-start}.range-trigger{font-size:9px}.manual-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.range-kpi-body{padding:16px 12px}.kpi-date-footer{padding:8px}.kpi-date-button{font-size:8px;gap:5px}.kpi-date-button svg{width:11px}.range-kpi .kpi-top{font-size:10px}.range-chart-head h2{font-size:14px}.chart-head-tools{gap:7px}.range-chart-head .segmented button{font-size:9px;padding:4px 6px}.range-chart-head .range-trigger{font-size:8px}.summary-range-form{padding:13px;gap:9px}}
@media(max-width:600px){.range-kpi-body{padding:16px}.kpi-date-footer{padding:8px 12px}.kpi-date-button{font-size:9px}.range-kpi .kpi-top{font-size:10px}.kpi-open-hint{font-size:8px}.kpi-open-hint svg{width:11px}.chart-head-tools{width:100%;justify-content:space-between;gap:7px}.range-chart-head .range-trigger{font-size:9px}.range-presets{gap:6px}.range-presets .btn{font-size:9px;padding:6px 8px}.summary-range-form .field{min-width:115px}.summary-range-form .btn{flex:1}.manual-form-intro{padding:11px;gap:8px;align-items:flex-start}.manual-form-intro>span:nth-child(2){flex:1;min-width:160px}.manual-form-intro .btn{margin-left:0}.manual-detail-grid{grid-template-columns:1fr 1fr;gap:15px}.manual-status-note .spacer{display:none}.manual-status-note .chip{margin-left:auto}.summary-table td,.summary-table th{padding:11px}.range-chart .chart-x{font-size:8px}.summary-period-note{font-size:10px}.contract-kpi:hover,.contract-kpi:focus-within{transform:none}}
@media(prefers-reduced-motion:reduce){.contract-kpi{transition:none}.contract-kpi:hover,.contract-kpi:focus-within{transform:none}}
@media print{.kpi-date-footer,.range-trigger,.summary-range-form,.kpi-open-hint{display:none!important}.range-kpi-body{padding:16px}.contract-kpi{background:white!important;color:black!important;transform:none!important}}

.modal:has(#contractSummaryRange),.modal:has([data-kind="manual-contract"]),.modal:has([data-kind="metric-range"]){animation:none}


.standalone-module-directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.standalone-module-group h3{font-size:11px;letter-spacing:1px;color:var(--muted);margin-bottom:12px}
.standalone-module-links{display:flex;flex-direction:column;gap:9px}
.standalone-module-links .btn{justify-content:flex-start;white-space:normal;text-align:left}
@media(max-width:700px){.standalone-module-directory{grid-template-columns:1fr}}

/* Phase 03: real sign-in, field errors, signed-in user in the top bar */
.login-fields{margin:25px 0}
.login-fields .field.span-2{grid-column:1/-1}
.login-links{display:flex;justify-content:center;margin-top:14px}
.login-error,.login-notice{grid-column:1/-1;display:flex;align-items:flex-start;gap:9px;padding:12px;border-radius:7px;font-size:11px;line-height:1.6}
.login-error{background:#fae9ec;color:#b9646d}
.login-notice{background:var(--teal-light);color:var(--teal-dark)}
.login-error svg,.login-notice svg{width:15px;height:15px;flex:none;margin-top:1px}
body.dark .login-error{background:#40262e;color:#e3a3a6}
body.dark .login-notice{color:var(--teal)}
.field small.field-error{color:var(--danger)}
.field.has-error input:not([type=checkbox]),.field.has-error select,.field.has-error textarea{border-color:var(--danger)}
.role-selector .role-user{display:block;font-size:11px;font-weight:650;color:var(--text);max-width:122px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:600px){.role-selector .role-user{font-size:10px;max-width:108px}}
.pagination-gap{color:var(--muted);font-size:10px;min-width:12px;text-align:center}

/* Phase 04a: server-sorted client columns, loading state of reloading lists */
.th-sort{display:inline-flex;align-items:center;gap:4px;background:none;border:0;padding:0;font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer}
.th-sort:hover,.th-sort.active{color:var(--text)}
.th-sort svg{width:10px;height:10px;stroke:currentColor;fill:none;stroke-width:2.4}
.card[aria-busy="true"] .table-wrap,.card[aria-busy="true"] .pipeline{opacity:.55;transition:opacity .15s}

/* Phase 05: import wizard step indicator (the "How importing works" steps in a row), upload in progress */
.step-list.wizard-steps{flex-direction:row;gap:22px;padding:0;margin:0;list-style:none}
.wizard-steps .step{flex:1;min-width:0;align-items:center}
.wizard-steps .step>div{min-width:0}
.wizard-steps .step p{margin-bottom:2px}
.wizard-steps .step small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wizard-steps .step:not(.active):not(.done){opacity:.55}
.wizard-steps .step.active .step-num{background:var(--teal);color:#fff}
.wizard-steps .step-num svg{width:14px;height:14px;stroke-width:2.4}
.drop-zone[aria-busy="true"]{cursor:progress;opacity:.75}
@media(max-width:800px){.step-list.wizard-steps{flex-direction:column;gap:14px;align-items:stretch}}
@media(max-width:800px){.card-head.import-head{flex-wrap:wrap}.import-head .flex{flex-wrap:wrap}}
@media(max-width:600px){.import-toolbar .field{flex:1 1 100%}.import-toolbar select{max-width:none}}

/* stats.css — phase 06a: loading dim, period toolbar, heatmap, wallboard */
.kpis[aria-busy="true"] .kpi-value,.card[aria-busy="true"] .card-body,.grid-3[aria-busy="true"] .team-card,.bar-chart[aria-busy="true"],.target-card[aria-busy="true"] .target-main{opacity:.55;transition:opacity .15s}
.delta-chip{cursor:default}
.toolbar .date-control{padding:7px 10px;min-height:34px}
.report-insights{margin-top:22px}
.heatmap{display:grid;gap:3px;align-items:center}
.heat-hour{font-size:8px;color:var(--muted);text-align:center;font-variant-numeric:tabular-nums}
.heat-day{font-size:9px;color:var(--muted)}
.heat-cell{display:block;height:22px;border-radius:4px;background:color-mix(in srgb,var(--teal) var(--heat,0%),var(--card));border:1px solid var(--line)}
.heat-cell.none{background:var(--bg)}
.heat-legend{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap}
.heat-legend .heat-cell{display:inline-block;width:12px;height:12px;vertical-align:-2px;margin-right:3px}
.heat-scale{display:inline-block;width:90px;height:8px;border-radius:4px;background:linear-gradient(90deg,color-mix(in srgb,var(--teal) 18%,var(--card)),var(--teal))}
.wall-kpis .kpi-value{font-size:46px;margin-top:18px}
.wall-kpis .kpi-top{font-size:13px}
.wall-kpis .kpi-bottom{font-size:11px}
.wall-availability{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-bottom:22px}
.wall-status{padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.wall-status .chip{font-size:11px}
.wall-status strong{font-size:30px;font-family:Arial,sans-serif;font-weight:750}
.wall-grid{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1fr);gap:22px;align-items:start}
.wall-agents{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.wall-agent{border:1px solid var(--line);border-radius:10px;padding:16px;background:var(--card)}
.wall-agent .avatar{margin-bottom:0}
.wall-agent strong{font-size:13px}
.wall-agent .team-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px 0;margin-bottom:12px;border-bottom:1px solid var(--line)}
.wall-agent .between>.flex{min-width:0}
.wall-agent .stack strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wall-agent.offline{opacity:.6}
.wall-since{margin-top:10px}
.wall-rank-value{font-size:22px;font-family:Arial,sans-serif}
:root:fullscreen .sidebar,:root:fullscreen .topbar,:root:fullscreen .app-footer,:root:fullscreen .mobile-shade{display:none}
:root:fullscreen .shell{margin-left:0}
@media(max-width:1250px){.wall-grid{grid-template-columns:1fr}.wall-kpis .kpi-value{font-size:38px}}
@media(max-width:800px){.wall-availability{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.wall-kpis .kpi-value{font-size:30px}.heat-cell{height:16px}.heat-hour{font-size:7px}}
@media(max-width:600px){.wall-availability{grid-template-columns:1fr 1fr}.heatmap{gap:2px}}
/* Dark theme: KPI icon tiles and tags used the old green tile / light tags of the base theme */
body.dark .kpi-icon{background:var(--teal-light);color:var(--teal)}
body.dark .kpi-icon.blue{background:#26304a;color:#9fb4dc}
body.dark .kpi-icon.orange{background:#3d3020;color:#e0aa6a}
body.dark .kpi-icon.purple{background:#342b40;color:#bba3d4}
body.dark .metric-tag{background:var(--teal-light);color:var(--teal)}
body.dark .metric-tag.orange{background:#3d3020;color:#e0aa6a}

/* Phase 06b: attendance day cells — the status menu takes the colour of its status chip (as the read-only cells); one colour for every status made late / absent indistinguishable from present */
.calendar-cell select.att-present{background:#eaf5ed;color:#448b60}
.calendar-cell select.att-late{background:#fcf0e2;color:#b08143}
.calendar-cell select.att-absent{background:#fae9ec;color:#b9646d}
.calendar-cell select.att-leave{background:#edf0f8;color:#687fad}
.calendar-cell select.att-sick{background:#f1edfa;color:#8b70ae}
.calendar-cell select.att-none{background:var(--bg);color:var(--muted)}
.calendar-cell select:disabled{opacity:.6;cursor:progress}
.attendance-table .calendar-cell select{width:104px}
@media(max-width:800px){.card-head.hr-head{flex-wrap:wrap}.hr-head>.flex{flex-wrap:wrap}}

/* Phase 07: live Messages and notifications (same components as the prototype: chat-channel, chip, search-results, notification-panel, toast) */
.chat-channels{overflow-y:auto;max-height:640px}
.chat-channel-text{min-width:0;flex:1}
.chat-channel-text p,.chat-channel-text small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-unread{margin-left:auto;flex-shrink:0}
.chat-older{align-self:center}
.chat-top h3{overflow-wrap:anywhere}
.message-bubble{overflow-wrap:anywhere}
.chat-composer{position:relative}
.chat-mention{position:absolute;left:20px;bottom:calc(100% - 6px);z-index:20;width:300px;max-width:calc(100% - 40px)}
.chat-mention .search-results{position:static;width:auto}
.chat-mention .search-results button.active{background:var(--bg)}
.notification-actions{display:flex;align-items:center;gap:6px}
.notification-panel .notification-actions .btn,.notification-panel .notification-more .btn{width:auto;padding:4px;border-bottom:0;display:inline-flex}
.notification-list{max-height:min(460px,calc(100vh - 150px));overflow-y:auto;margin-top:6px}
.notification-panel .notification-list>button{align-items:flex-start}
.notification-text{min-width:0;flex:1}
.notification-text small{display:block;margin-top:2px;overflow-wrap:anywhere}
.notification-text .notification-when{margin-top:4px;font-size:9px}
.notification-panel button.unread p{font-weight:700}
.notification-panel .notification-list>button>.dot{margin-top:6px}
.notification-more{text-align:center;padding-top:8px}
.toast.notify-toast{pointer-events:auto;align-items:flex-start;max-width:440px}
.notify-toast .stack{min-width:0;flex:1}
.notify-toast small{display:block;font-size:11px;opacity:.85;margin-top:2px;overflow-wrap:anywhere}
.notify-toast .btn{flex-shrink:0}
.notify-close{background:none;border:0;color:inherit;opacity:.7;padding:2px;display:inline-flex}
.notify-close:hover{opacity:1}
.notify-close svg{width:14px}
@media(max-width:600px){.chat-channels{max-height:none}.chat-channel{flex-shrink:0}.chat-channel-text{max-width:170px}.chat-mention{left:12px}}
/* Phase 07: own availability switch in the top bar (status chip + menu in the search-results look) */
.availability-switch{position:relative;display:flex;align-items:center}
.availability-chip{border:0;cursor:pointer;font-family:inherit}
.availability-chip:disabled{cursor:default;opacity:1}
.availability-chip:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.availability-caret{width:10px;height:10px;transform:rotate(90deg);margin-left:1px}
.availability-menu{top:30px;right:0;width:170px;z-index:40;padding:6px}
.availability-menu button{justify-content:space-between;padding:8px}
.availability-menu button.active{background:var(--bg)}
.availability-check{width:13px;height:13px;color:var(--teal)}
@media(max-width:600px){.availability-label,.availability-caret{display:none}.availability-chip{padding:6px}.availability-chip .dot{width:7px;height:7px}.availability-menu{right:-60px}}
/* Phase 08: calling session in the call window (lead facts, call script, last calls) */
@media(min-width:601px){.call-panel{max-height:calc(100vh - 44px);overflow:auto}}
.lead-strip{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}
.lead-strip .chip{margin-left:0}
.lead-strip .tiny{display:inline-flex;align-items:center;gap:4px;text-align:right}
.lead-strip svg{width:12px;height:12px;flex-shrink:0}
.call-person .tiny{margin-top:2px}
.lead-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 12px;margin:16px 0 0;font-size:11px}
.lead-facts dt{color:var(--muted)}
.lead-facts dd{margin:0;text-align:right;overflow-wrap:anywhere}
.call-script{max-height:220px;overflow:auto;padding:11px 13px;background:var(--bg);border:1px solid var(--line);border-radius:7px;font-size:11px;line-height:1.6;overflow-wrap:anywhere}
.md h3,.md h4,.md h5,.md h6{font-size:12px;font-weight:750;margin:10px 0 4px}
.md h3{font-size:13px}
.md p,.md ul,.md ol{margin:0 0 8px}
.md ul,.md ol{padding-left:18px}
.md li{margin:2px 0}
.md>:first-child{margin-top:0}
.md>:last-child{margin-bottom:0}
.md a{color:var(--teal);text-decoration:underline}
.md code{font-family:ui-monospace,Consolas,monospace;font-size:10px;background:var(--card);border:1px solid var(--line);border-radius:4px;padding:0 4px}
.lead-calls{border:1px solid var(--line);border-radius:7px;padding:0 11px}
.lead-call{display:flex;align-items:center;flex-wrap:wrap;gap:4px 6px;padding:8px 0;font-size:10px}
.lead-call+.lead-call{border-top:1px solid var(--line)}
.lead-call .chip{margin-left:0}
.lead-call-agent{margin-left:auto}
.lead-call-note{flex-basis:100%;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.session-actions{display:flex;gap:8px;margin-top:14px}
.session-actions .btn{flex:1;min-width:0}
.session-foot{margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}
.session-foot .session-actions{margin-top:8px}
.lead-lock{margin-top:10px;display:flex;align-items:center;flex-wrap:wrap;gap:2px 6px}
.session-panel .empty{padding:14px 4px 4px}
.lead-times{font-size:11px;text-align:center;color:var(--muted);margin-top:8px}
.skip-form{margin-top:4px}
/* Phase 08: Quality page */
.qa-score{display:flex;align-items:baseline;gap:6px}
.qa-score strong{font-size:26px;font-family:Arial,sans-serif}
.qa-comment{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qa-recording span{line-height:1.5}
/* Phase 09: telephony — phone chip in the top bar, incoming-call pop-up, transfer and client link in the call window, recording player, My SIP account, Team registrations, Settings → Telephony (existing chip, call-panel, lead-facts, search-results, detail-grid, toggle and table components) */
.phone-switch{position:relative;display:flex;align-items:center}
.sip-chip{border:0;cursor:pointer;font-family:inherit}
.sip-chip:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.sip-chip .sip-icon{width:10px;height:10px;stroke-width:2}
.incoming-panel{z-index:85}
.call-controls button:disabled{opacity:.45;cursor:default}
.inbound-results{position:static;width:auto;box-shadow:none;max-height:190px;margin-bottom:10px;padding:4px}
.inbound-link{padding:9px 11px;border:1px solid var(--line);border-radius:7px;margin-bottom:10px;gap:8px}
.recording-player{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.team-sip{margin-top:14px;gap:8px}
.team-sip:empty{display:none}
.team-sip-device{display:inline-flex;color:var(--teal)}
.team-sip-device svg{width:13px;height:13px}
.sip-grid{margin:14px 0 18px}
.sip-value{flex-wrap:wrap}
.sip-value .mono{overflow-wrap:anywhere;word-break:break-all}
.sip-account+.sip-account{border-top:1px solid var(--line);padding-top:14px;margin-top:4px}
.sip-qr{display:flex;align-items:center;gap:16px;padding:14px;border:1px solid var(--line);border-radius:8px;background:var(--bg);margin-bottom:6px}
.sip-qr-code{width:148px;height:148px;flex-shrink:0;border-radius:4px}
.sip-qr p{font-size:12px;font-weight:500;margin-bottom:4px}
.tel-message{display:block;margin-top:4px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tel-accounts tr.selected td{background:var(--bg)}
.intl-choices{flex-wrap:wrap;gap:8px 18px;padding:4px 0}
.tel-blocked{align-items:center}
.did-table td{vertical-align:top}
.did-table .field input{min-width:150px}
.did-table .filter-select{min-width:120px}
.did-table .toggle{margin-top:10px}
.did-table .icon-btn{margin-top:3px}
.did-table td.mono{padding-top:24px}
@media(max-width:600px){.sip-label{display:none}.sip-chip{padding:6px}.sip-qr{flex-direction:column;align-items:flex-start}.sip-grid{grid-template-columns:1fr}}
#telephonyDetail tr.selected td{background:var(--bg)}
/* Phase 09b: Telephony card head with "Add provider" + "New account" wraps on small screens (like the import head);
   the provider console panel sits below the connection grid. */
@media(max-width:800px){.card-head.tel-head{flex-wrap:wrap}.tel-head .flex{flex-wrap:wrap}}
.tel-console-title{margin:6px 0 0}
.tel-provider-picker{max-height:none;margin-bottom:14px}
/* Phase 11.6 accessibility: text contrast >= 4.5:1 (same hues, darker), visible focus, skip link.
   Every change is listed in tasks/STATUS.md "UI changes". */
:root{--muted:#6c6c74;--danger:#ab4a54}
body.dark{--danger:#dc7a82}
body.dark .btn.danger{color:#ab4a54}
.info-banner{color:#8a5d56}
body.dark .chart-group.current .chart-x{color:var(--teal)}
.key-hint{color:var(--muted)}
.app-footer{color:var(--muted)}
.chip{color:#586a6f}.chip.green{color:#397450}.chip.teal{color:#367555}.chip.orange{color:#856132}.chip.blue{color:#55688d}.chip.red{color:#945057}.chip.purple{color:#725c8e}.chip.gray{color:#6a626b}
.avatar{color:#a05059}.avatar.blue{color:#596b89}.avatar.purple{color:#7a5f82}.avatar.orange{color:#8e623e}
.metric-tag.orange{color:#8d6536}
.nav-label{color:#8a8592}
.side-user small{color:#8f8590}
body.dark .segmented button.active{color:var(--teal)}
body.dark tbody tr:hover{background:#ffffff08}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible,summary:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.note-editor textarea:focus-visible{outline:2px solid #e2aaa5;outline-offset:6px;border-radius:4px}
.main:focus{outline:none}
.skip-link{position:fixed;left:12px;top:-80px;z-index:300;background:var(--card);color:var(--teal);border:1px solid var(--line);border-radius:7px;padding:9px 14px;font-size:11px;font-weight:600;box-shadow:0 4px 20px #0000001a}
.skip-link:focus{top:12px}
/* Phase 11.7 responsive: the closed mobile menu is out of the tab order; touch targets >= 40 px
   (fields and buttons grow to 40 px; small inline controls get an invisible 40 px hit area). */
@media(max-width:800px){.sidebar{visibility:hidden;transition:transform .2s,visibility .2s}.sidebar.open{visibility:visible}
.btn,.btn.small,.toolbar select,.filter-select,.field input:not([type=checkbox]):not([type=radio]),.field select,.search-wrap input,.kpi-date-button,.range-trigger,.tabs button,.skip-link,.date-control,.toolbar .date-control,.note-title,.result-grid button{min-height:40px}
.call-controls button{width:40px;height:40px}
.tabs button{min-width:40px}
.icon-btn,.topbar .icon-btn{min-width:40px;min-height:40px}
.pagination button,.toggle,.th-sort,.table-link,.segmented button,.availability-chip,.sip-chip,.call-head button,.side-footer button,.btn.link,.range-trigger{position:relative}
.pagination button:after,.toggle:after,.th-sort:after,.table-link:after,.segmented button:after,.availability-chip:after,.sip-chip:after,.call-head button:after,.side-footer button:after,.btn.link:after,.range-trigger:after{content:'';position:absolute;left:50%;top:50%;width:max(100%,40px);height:max(100%,40px);transform:translate(-50%,-50%)}
input[type=checkbox],input[type=radio]{width:18px;height:18px}}
/* 11.4 global search: group titles inside the results (the day-label look, tighter) */
.search-results .day-label{margin:8px 10px 4px}