:root{--ink:#17221d;--muted:#69736e;--line:#e3e7e4;--canvas:#f4f5f2;--paper:#fff;--green:#23634a;--green-soft:#e7f0eb;--sand:#f3eadb;--blue:#e5edf2;--lavender:#ece9f3;--shadow:0 8px 30px rgba(23,34,29,.06);font-family:"DM Sans",sans-serif;color:var(--ink);background:var(--canvas)}
*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit}button{color:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:260px 1fr}.sidebar{height:100vh;position:sticky;top:0;background:#17221d;color:#fff;padding:24px 18px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none;padding:0 9px 24px;border-bottom:1px solid #334039}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border:1px solid #769081;border-radius:10px;font-family:Manrope;font-weight:700}.brand strong,.brand small{display:block}.brand strong{font:700 17px Manrope;letter-spacing:.12em}.brand small{font-size:11px;color:#9fb0a7}.client-switcher{margin:22px 0;display:grid;grid-template-columns:38px 1fr 28px;gap:10px;align-items:center;padding:11px;background:#23312a;border:1px solid #35443d;border-radius:14px}.client-avatar{width:38px;height:38px;display:grid;place-items:center;background:#dce8e1;color:#285440;border-radius:10px;font-size:12px;font-weight:700}.client-switcher strong,.client-switcher small,.user-card strong,.user-card small{display:block}.client-switcher strong{font-size:13px}.client-switcher small,.user-card small{font-size:11px;color:#9fb0a7;margin-top:3px}.icon-button,.menu-button,.notification-button,.more-button,.close-button{border:0;background:transparent;cursor:pointer}.icon-button{color:#9fb0a7}.primary-nav{display:flex;flex-direction:column;gap:5px}.nav-item{display:flex;align-items:center;gap:12px;color:#aebdb5;text-decoration:none;padding:11px 13px;border-radius:10px;font-size:13px;font-weight:500}.nav-item span{width:21px;text-align:center;font-size:17px}.nav-item:hover,.nav-item.active{background:#2b3a32;color:#fff}.sidebar-footer{margin-top:auto}.support-card,.user-card{width:100%;display:grid;grid-template-columns:36px 1fr 24px;align-items:center;gap:9px;text-align:left}.support-card{border:1px solid #3c4b43;background:#213029;color:#fff;border-radius:13px;padding:12px;cursor:pointer;margin-bottom:15px}.support-card span strong,.support-card span small{display:block}.support-card small{color:#9fb0a7;margin-top:2px}.support-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#f2e8d5;color:#5d5038}.user-card{border-top:1px solid #334039;padding:17px 7px 0}.user-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#f0e6d6;color:#5d5038;font-size:11px;font-weight:700}.topbar{height:72px;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 38px;position:sticky;top:0;z-index:10}.menu-button{display:none;font-size:20px}.breadcrumb{display:flex;gap:9px;font-size:13px}.breadcrumb span,.breadcrumb b{color:#89928e;font-weight:400}.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.demo-pill,.status-pill{border-radius:99px;font-size:11px;font-weight:600}.demo-pill{padding:7px 10px;background:#f2eadb;color:#7c673f}.status-pill{padding:8px 12px;border:1px solid var(--line);background:#fff}.status-pill i,.online-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#3d9167;margin-right:7px}.notification-button{position:relative;font-size:21px}.notification-button b{position:absolute;top:-2px;right:-2px;background:#b35346;color:#fff;border:2px solid #fff;width:16px;height:16px;border-radius:50%;font-size:9px;display:grid;place-items:center}.view{display:none;padding:42px;max-width:1500px;margin:auto}.view.active{display:block}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:28px}.page-heading.compact{align-items:center}.eyebrow{font-size:10px;letter-spacing:.14em;font-weight:700;color:#78827d;margin:0 0 8px}.page-heading h1{font:700 32px/1.2 Manrope;margin:0}.page-heading>div>p:last-child{margin:8px 0 0;color:var(--muted);font-size:14px}.primary-button,.secondary-button,.filter-button,.text-button{border-radius:9px;padding:10px 15px;font-weight:600;font-size:12px;cursor:pointer}.primary-button{background:var(--green);color:#fff;border:1px solid var(--green)}.primary-button:hover{background:#194d39}.secondary-button,.filter-button{background:#fff;border:1px solid #d7ddd9}.text-button{border:0;background:transparent;color:var(--green)}.full{width:100%}.notice{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:13px;border:1px solid #cddfd4;background:#edf5f0;border-radius:13px;padding:14px 18px;margin-bottom:22px}.notice>span{display:grid;place-items:center;background:var(--green);color:#fff;width:30px;height:30px;border-radius:50%}.notice strong,.notice p{font-size:12px;margin:0}.notice p{color:#627069;margin-top:3px}.notice button{background:none;border:0;color:var(--green);font-weight:600;cursor:pointer}.metrics-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:20px}.metrics-grid.slim{grid-template-columns:repeat(3,1fr)}.metric-card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;gap:14px;align-items:center;box-shadow:0 1px 0 rgba(0,0,0,.01)}.metric-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;font-size:18px;flex:none}.sage{background:var(--green-soft);color:var(--green)}.sand{background:var(--sand);color:#8a6730}.blue{background:var(--blue);color:#3c6278}.lavender{background:var(--lavender);color:#665a7d}.metric-card small,.metric-card strong,.metric-card p{display:block;margin:0}.metric-card small{font-size:11px;color:var(--muted)}.metric-card strong{font:700 25px Manrope;margin:4px 0}.metric-card strong em{font-size:13px;color:#87908c;font-style:normal}.metric-card p{font-size:10px;color:#8a928e}.metric-card p b{color:#3b875f}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:20px}.panel{background:var(--paper);border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow)}.calls-panel,.schedule-panel,.flow-builder,.programming-side>.panel{padding:22px}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.panel-heading h2,.panel-heading p{margin:0}.panel-heading h2{font:700 16px Manrope}.panel-heading p{font-size:11px;color:var(--muted);margin-top:4px}.call-list{display:flex;flex-direction:column}.call-row{display:grid;grid-template-columns:38px minmax(150px,1fr) 100px 90px 28px;gap:10px;align-items:center;padding:13px 0;border-top:1px solid #edf0ee}.call-row:first-child{border-top:0}.call-direction{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#edf4f0;color:var(--green)}.call-direction.missed{background:#f8e9e6;color:#a24d41}.call-row strong,.call-row small{display:block}.call-row strong{font-size:12px}.call-row small{font-size:10px;color:var(--muted);margin-top:3px}.call-row time,.call-duration{font-size:11px;color:#707975}.call-row button{border:0;background:transparent;cursor:pointer}.more-button{letter-spacing:2px}.mode-card{border:1px solid #dfe5e1;border-radius:13px;padding:15px;margin-bottom:12px}.mode-top{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center}.mode-top small,.next-change small{font-size:8px;letter-spacing:.12em;color:var(--muted)}.mode-top strong{display:block;font-size:12px;margin-top:3px}.mode-top b{font-size:9px;background:var(--green-soft);color:var(--green);padding:5px 8px;border-radius:99px}.mode-card>p{font-size:11px;line-height:1.5;color:#65706a;border-top:1px solid #edf0ee;padding-top:12px}.time-row{display:flex;justify-content:space-between;font-size:11px;background:#f5f7f5;padding:9px 11px;border-radius:8px}.next-change{display:flex;gap:10px;padding:15px 4px 0;color:#65706a}.next-change p,.next-change strong{margin:0}.next-change strong{display:block;font-size:10px;margin-top:2px;color:#4d5852}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-top:20px}.quick-grid button{display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;text-align:left;column-gap:11px;padding:15px;border:1px solid var(--line);border-radius:13px;background:#fff;cursor:pointer}.quick-grid button>span{grid-row:1/3;width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#f0f3f1;color:var(--green);font-size:18px}.quick-grid strong{font-size:11px}.quick-grid small{font-size:9px;color:var(--muted);margin-top:3px}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:20px}.two-column .panel{padding:22px}.details-list{margin:0}.details-list div{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid #edf0ee;font-size:12px}.details-list dt{color:var(--muted)}.details-list dd{font-weight:600;margin:0}.toolbar{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--line);gap:14px}.search-field{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:9px;padding:8px 11px;min-width:280px}.search-field input{border:0;outline:0;width:100%;font-size:11px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:11px}th{text-align:left;color:#7d8782;font-size:9px;letter-spacing:.08em;text-transform:uppercase;background:#fafbfa}th,td{padding:14px 18px;border-bottom:1px solid #edf0ee}.person-cell{display:flex;align-items:center;gap:10px}.person-cell span{width:33px;height:33px;border-radius:9px;background:var(--green-soft);display:grid;place-items:center;color:var(--green);font-weight:700}.status-badge{padding:5px 8px;border-radius:99px;background:var(--green-soft);color:var(--green);font-weight:600;font-size:9px}.segmented{display:flex;background:#f1f3f1;border-radius:9px;padding:3px}.segmented button{border:0;background:transparent;padding:7px 10px;font-size:10px;border-radius:7px;cursor:pointer}.segmented button.active{background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.08)}.expanded{padding:0 20px}.programming-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr);gap:20px}.programming-side{display:flex;flex-direction:column;gap:20px}.flow{max-width:650px;margin:auto}.flow-node{display:grid;grid-template-columns:34px 1fr auto;gap:13px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff}.flow-node>span{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#edf4f0;color:var(--green);font-weight:700}.flow-node small{font-size:8px;letter-spacing:.12em;color:#7a8580}.flow-node strong,.flow-node p{display:block;margin:0}.flow-node strong{font-size:12px;margin:2px 0}.flow-node p{font-size:10px;color:var(--muted)}.flow-node button{border:0;background:#f4f6f4;border-radius:7px;font-size:10px;padding:7px 9px;cursor:pointer}.flow>i{display:block;width:1px;height:18px;background:#cad3ce;margin:auto}.add-step{display:block;margin:16px auto 0;border:1px dashed #b8c5be;background:#f7faf8;color:var(--green);padding:10px 18px;border-radius:9px;cursor:pointer}.special-mode{width:100%;display:grid;grid-template-columns:36px 1fr auto;gap:10px;text-align:left;align-items:center;border:0;border-top:1px solid #edf0ee;background:#fff;padding:13px 0;cursor:pointer}.special-mode>span{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:#f0f3f1}.special-mode p,.special-mode strong,.special-mode small{margin:0;display:block}.special-mode strong{font-size:11px}.special-mode small{font-size:9px;color:var(--muted);margin-top:2px}.special-mode b{font-size:9px;color:var(--green)}.preview-card ol{list-style:none;padding:0;margin:0 0 16px}.preview-card li{display:flex;align-items:center;gap:9px;font-size:10px;padding:8px 0}.preview-card li span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#edf4f0;color:var(--green);font-weight:700}.toast{position:fixed;right:30px;bottom:30px;display:flex;align-items:center;gap:10px;background:#17221d;color:#fff;padding:13px 18px;border-radius:12px;box-shadow:0 12px 35px rgba(0,0,0,.2);transform:translateY(120px);opacity:0;transition:.25s;z-index:50}.toast.show{transform:none;opacity:1}.toast>span{color:#7dcca2}.toast p,.toast strong,.toast small{display:block;margin:0}.toast strong{font-size:11px}.toast small{font-size:9px;color:#aebdb5;margin-top:2px}dialog{border:0;border-radius:16px;padding:0;width:min(520px,calc(100% - 30px));box-shadow:0 30px 80px rgba(0,0,0,.25)}dialog::backdrop{background:rgba(16,25,21,.55);backdrop-filter:blur(3px)}.modal-card{padding:24px}.modal-heading{display:flex;justify-content:space-between;margin-bottom:20px}.modal-heading h2,.modal-heading p{margin:0}.modal-heading h2{font:700 22px Manrope}.modal-heading>div>p:last-child{font-size:11px;color:var(--muted);margin-top:5px}.close-button{font-size:24px}.modal-card label{display:block;font-size:10px;font-weight:600;margin:13px 0}.modal-card input:not([type=checkbox]){width:100%;display:block;border:1px solid var(--line);border-radius:9px;padding:11px;margin-top:6px;outline:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.switch-row{display:flex!important;justify-content:space-between;align-items:center;background:#f5f7f5;padding:12px;border-radius:10px}.switch-row strong,.switch-row small{display:block}.switch-row small{font-size:9px;color:var(--muted);margin-top:3px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:22px}
@media(max-width:1050px){.app-shell{grid-template-columns:220px 1fr}.metrics-grid{grid-template-columns:repeat(2,1fr)}.quick-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.programming-layout{grid-template-columns:1fr}.view{padding:30px}.sidebar{padding-inline:12px}}
@media(max-width:760px){.app-shell{display:block}.sidebar{position:fixed;left:-270px;width:260px;transition:.25s}.sidebar.open{left:0;box-shadow:20px 0 60px rgba(0,0,0,.25)}.menu-button{display:block;margin-right:13px}.topbar{padding:0 18px}.demo-pill,.breadcrumb span,.breadcrumb b{display:none}.view{padding:24px 16px}.page-heading{align-items:flex-start;gap:18px}.page-heading h1{font-size:25px}.dashboard-grid,.two-column{grid-template-columns:1fr}.metrics-grid,.metrics-grid.slim{grid-template-columns:1fr 1fr}.call-row{grid-template-columns:38px 1fr 65px 22px}.call-duration{display:none}.quick-grid{grid-template-columns:1fr}.toolbar{align-items:stretch;flex-direction:column}.search-field{min-width:0}.segmented{overflow:auto}.programming-layout{display:block}.programming-side{margin-top:20px}.topbar-actions{gap:5px}.status-pill{font-size:0}.status-pill i{margin:0}.notice{grid-template-columns:32px 1fr}.notice button{display:none}}
@media(max-width:450px){.metrics-grid,.metrics-grid.slim{grid-template-columns:1fr}.page-heading{display:block}.page-heading>button{margin-top:16px}.form-grid{grid-template-columns:1fr}}