:root { --sidebar: 252px; }
[hidden] { display: none !important; }
.demo-disclosure { grid-column:1/-1; min-height:46px; display:flex; align-items:center; justify-content:center; gap:24px; padding:9px 24px; color:#dff3ff; background:#073f5d; font-size:11px; line-height:1.45; text-align:center; }
.demo-disclosure p { margin:0; }
.demo-disclosure div { display:flex; align-items:center; gap:12px; white-space:nowrap; }
.demo-disclosure button,.demo-disclosure a { border:0; color:#fff; background:transparent; font:inherit; font-weight:800; text-decoration:underline; cursor:pointer; }
.product-body { min-height: 100vh; background: #f5f8fd; }
.product-topbar { height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 32px; border-bottom: 1px solid #dce4ee; background: rgba(255,255,255,.92); position: sticky; top: 0; z-index: 30; backdrop-filter: blur(16px); }
.setup-status { display: flex; gap: 9px; align-items: center; font-size: 12px; color: var(--outline-strong); }
.setup-status strong { color: var(--primary); }
.quiet-button,.icon-button,.text-button { border: 0; background: transparent; color: var(--primary); font: inherit; cursor: pointer; }
.quiet-button { font-size: 13px; font-weight: 750; }
.onboarding-shell { min-height: calc(100vh - 72px); display: grid; grid-template-columns: 360px minmax(0,1fr); }
.setup-sidebar { padding: 64px 48px; color: white; background: linear-gradient(155deg,#003b59,#0d618c 55%,#217da7); position: relative; overflow: hidden; }
.setup-sidebar::after { content:""; position:absolute; width:320px; height:320px; border-radius:50%; right:-170px; bottom:-120px; background:rgba(124,194,242,.18); }
.setup-kicker { margin:0 0 12px; color:#9bd6fa; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.setup-sidebar h1 { margin:0 0 18px; font-size:40px; line-height:1.05; }
.setup-sidebar > p:not(.setup-kicker) { color:#d6ecf8; font-size:14px; line-height:1.7; }
.setup-steps { margin:44px 0 0; padding:0; display:grid; gap:7px; list-style:none; position:relative; z-index:1; }
.setup-steps li { display:flex; gap:13px; align-items:center; padding:12px; border-radius:12px; color:#bbd5e5; opacity:.68; }
.setup-steps li.active,.setup-steps li.complete { opacity:1; }
.setup-steps li.active { background:rgba(255,255,255,.11); }
.setup-steps li > span { width:31px; height:31px; display:grid; place-items:center; flex:0 0 auto; border:1px solid rgba(255,255,255,.3); border-radius:50%; font-size:11px; font-weight:800; }
.setup-steps li.complete > span { background:#fff; color:var(--primary); }
.setup-steps strong,.setup-steps small { display:block; }
.setup-steps strong { color:#fff; font-size:13px; }
.setup-steps small { margin-top:2px; font-size:10px; }
.setup-trust { margin-top:42px; display:flex; gap:10px; color:#d6ecf8; font-size:11px; line-height:1.5; position:relative; z-index:1; }
.setup-trust .material-symbols-outlined { font-size:18px; }
.setup-workspace { padding:52px clamp(24px,6vw,86px); }
.progress-track { max-width:820px; height:4px; margin:0 auto 22px; overflow:hidden; border-radius:99px; background:#dfe8f1; }
.progress-track span { display:block; width:20%; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--primary),var(--primary-soft-strong)); transition:width .3s ease; }
.setup-card,.deployment-card { max-width:820px; margin:auto; padding:clamp(26px,5vw,52px); border:1px solid #dce4ee; border-radius:24px; background:#fff; box-shadow:0 20px 55px rgba(26,63,91,.09); }
.form-step { display:none; }
.form-step.active { display:block; animation:step-in .25s ease; }
@keyframes step-in { from { opacity:0; transform:translateX(10px); } }
.step-heading { display:flex; gap:18px; margin-bottom:34px; }
.step-number { width:42px; height:42px; flex:0 0 auto; display:grid; place-items:center; border-radius:12px; color:var(--primary); background:var(--surface-low); font-size:12px; font-weight:800; }
.step-heading p { margin:0 0 4px; color:var(--primary); font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.step-heading h2 { margin:0 0 8px; font-size:30px; }
.step-heading div > span { color:var(--on-surface-variant); font-size:13px; }
.form-grid { display:grid; gap:18px; }.two-col { grid-template-columns:repeat(2,minmax(0,1fr)); }.three-col { grid-template-columns:repeat(3,minmax(0,1fr)); }.wide { grid-column:1/-1; }
.app-field { display:grid; gap:7px; color:#344655; font-size:12px; font-weight:750; }
.app-field input,.app-field select,.app-field textarea,.filter-bar input,.filter-bar select { width:100%; min-height:48px; padding:11px 13px; border:1px solid #c7d3de; border-radius:10px; background:#fbfdff; color:var(--on-surface); font:inherit; }
.app-field textarea { min-height:105px; resize:vertical; }
.app-field input:focus,.app-field select:focus,.app-field textarea:focus,.filter-bar input:focus { outline:3px solid rgba(124,194,242,.26); border-color:var(--primary-container); }
.app-field legend { margin-bottom:10px; }.optional { color:#8a98a4; font-weight:500; }
fieldset.app-field { margin:0 0 22px; padding:0; border:0; }
.choice-grid { display:grid; gap:10px; }.services-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.choice-card,.tone-card { position:relative; min-height:98px; padding:14px; border:1px solid #d3dde6; border-radius:12px; background:#fff; cursor:pointer; }
.choice-card input,.tone-card input { position:absolute; opacity:0; }
.choice-card:has(input:checked),.tone-card:has(input:checked) { border-color:var(--primary-container); background:#f0f8ff; box-shadow:inset 0 0 0 1px var(--primary-container); }
.choice-card .material-symbols-outlined { display:block; margin-bottom:8px; color:var(--primary); font-size:24px; }.choice-card strong { font-size:11px; }
.hours-row,.agent-name-row { display:flex; gap:16px; align-items:end; }.grow { flex:1; }
.tone-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.tone-card { min-height:86px; }.tone-card strong,.tone-card span { display:block; }.tone-card strong { font-size:13px; }.tone-card span { margin-top:5px; color:#6a7883; font-size:10px; line-height:1.4; }
.agent-avatar { width:54px; height:54px; flex:0 0 auto; display:grid; place-items:center; border-radius:15px; color:#fff; background:linear-gradient(145deg,var(--primary),#419bc7); font-size:20px; font-weight:800; }
.switch-row { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:20px 0; padding:16px; border:1px solid #dce4ee; border-radius:12px; cursor:pointer; }
.switch-row span strong,.switch-row span small { display:block; }.switch-row span small { margin-top:3px; color:#6d7b86; font-size:11px; }.switch-row input { position:absolute; opacity:0; }.switch-row i { width:42px; height:24px; padding:3px; border-radius:99px; background:#c5d0d9; transition:.2s; }.switch-row i::after { content:""; display:block; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 2px 5px #8794a0; transition:.2s; }.switch-row input:checked + i { background:var(--primary-container); }.switch-row input:checked + i::after { transform:translateX(18px); }
.integration-note,.review-box { display:flex; gap:13px; margin-top:22px; padding:16px; border-radius:12px; color:#254456; background:#eef7fd; }.integration-note strong,.review-box strong { font-size:13px; }.integration-note p,.review-box p { margin:3px 0 0; font-size:11px; color:#5f7280; }.integration-note .material-symbols-outlined,.review-box .material-symbols-outlined { color:var(--primary); }
.setup-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:34px; padding-top:22px; border-top:1px solid #e3e9ef; }.setup-actions > span { color:#84919b; font-size:10px; }.setup-actions button:disabled { opacity:.38; cursor:not-allowed; }.form-error { margin:18px 0 -15px; color:#b42318; font-size:12px; font-weight:650; }
.deployment-card { text-align:center; }.deploy-orbit { width:106px; height:106px; display:grid; place-items:center; margin:8px auto 28px; border-radius:50%; background:#eaf5fc; position:relative; }.deploy-orbit img { width:55px; border-radius:14px; }.deploy-orbit span { position:absolute; inset:-8px; border:1px solid #8ec9e9; border-radius:50%; animation:orbit 2s linear infinite; }.deploy-orbit span:nth-child(2) { inset:-18px; animation-delay:-.6s; opacity:.65; }.deploy-orbit span:nth-child(3) { inset:-28px; animation-delay:-1.2s; opacity:.3; }@keyframes orbit { 50% { transform:scale(1.04); opacity:.3; } }
.deployment-card h2 { font-size:30px; }.deployment-card > p:not(.setup-kicker) { color:#667783; }.deploy-progress { height:7px; margin:28px 0; overflow:hidden; border-radius:99px; background:#e4ebf1; }.deploy-progress span { display:block; width:5%; height:100%; border-radius:inherit; background:var(--primary-container); transition:width .6s; }.deployment-card ul { max-width:310px; margin:auto; padding:0; display:grid; gap:10px; text-align:left; list-style:none; }.deployment-card li { color:#8b98a2; font-size:12px; }.deployment-card li::before { content:"○"; display:inline-block; width:24px; color:#9aabb7; }.deployment-card li.active { color:var(--primary); font-weight:750; }.deployment-card li.active::before { content:"●"; }

/* Dashboard */
.dashboard-body { display:grid; grid-template-columns:var(--sidebar) minmax(0,1fr); }
.app-sidebar { height:100vh; position:sticky; top:0; padding:24px 18px 16px; display:flex; flex-direction:column; border-right:1px solid #dce4ee; background:#fff; z-index:50; }.sidebar-top { display:flex; align-items:center; justify-content:space-between; padding:0 7px 22px; }.close-sidebar,.menu-button { display:none; }.workspace-pill { display:grid; grid-template-columns:38px 1fr 18px; align-items:center; gap:10px; padding:10px; border:1px solid #dce4ee; border-radius:12px; background:#f8fbfe; }.workspace-logo { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; color:#fff; background:var(--primary-container); font-weight:800; }.workspace-pill strong,.workspace-pill small,.user-card strong,.user-card small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.workspace-pill strong { font-size:11px; }.workspace-pill small { color:#7d8a94; font-size:9px; }.workspace-pill > .material-symbols-outlined { color:#8996a0; font-size:17px; }
.app-nav { display:grid; gap:5px; margin-top:24px; }.app-nav button { width:100%; display:flex; align-items:center; gap:11px; padding:11px 12px; border:0; border-radius:10px; color:#5c6b76; background:transparent; font:inherit; font-size:12px; font-weight:700; text-align:left; cursor:pointer; }.app-nav button:hover,.app-nav button.active { color:var(--primary); background:#edf6fc; }.app-nav .material-symbols-outlined { font-size:20px; }.nav-count { margin-left:auto; padding:2px 7px; border-radius:99px; background:#dbeaf5; font-size:9px; }
.sidebar-support { margin-top:auto; display:flex; gap:10px; padding:13px; border-radius:11px; background:#f1f7fb; }.sidebar-support .material-symbols-outlined { color:var(--primary); }.sidebar-support strong,.sidebar-support a { display:block; font-size:10px; }.sidebar-support a { margin-top:2px; color:var(--primary-container); }
.user-card { display:grid; grid-template-columns:34px minmax(0,1fr) 30px; align-items:center; gap:9px; margin-top:14px; padding:10px 4px 0; border-top:1px solid #e2e8ed; }.user-avatar { width:32px; height:32px; display:grid; place-items:center; border-radius:50%; color:var(--primary); background:#e5f2fb; font-size:9px; font-weight:800; }.user-card strong { font-size:10px; }.user-card small { color:#7c8992; font-size:8px; }.icon-button { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; }.icon-button:hover { background:#edf3f7; }.icon-button .material-symbols-outlined { font-size:19px; }
.app-main { min-width:0; }.app-header { height:82px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 34px; border-bottom:1px solid #dce4ee; background:rgba(255,255,255,.9); position:sticky; top:0; z-index:20; backdrop-filter:blur(14px); }.app-header p,.view-heading p,.panel-heading p,.usage-heading p { margin:0 0 3px; color:#7a8994; font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.app-header h1 { margin:0; font-size:20px; }.header-actions { display:flex; align-items:center; gap:10px; }.prototype-badge { padding:6px 9px; border-radius:99px; color:#75550b; background:#fff1c8; font-size:9px; font-weight:800; }.agent-state { display:flex; align-items:center; gap:8px; min-height:38px; padding:8px 10px; border:1px solid #d3dce4; border-radius:10px; background:#fff; color:#41525e; font:inherit; font-size:10px; font-weight:750; cursor:pointer; }.agent-state i { width:8px; height:8px; border-radius:50%; background:#16a06a; box-shadow:0 0 0 4px #daf5e9; }.agent-state:not(.active) i { background:#d97706; box-shadow:0 0 0 4px #ffefd4; }.agent-state .material-symbols-outlined { font-size:15px; }
.app-content { max-width:1440px; margin:auto; padding:30px 34px 60px; }.app-view { display:none; }.app-view.active { display:block; animation:view-in .22s ease; }@keyframes view-in { from { opacity:.3; transform:translateY(4px); } }
.welcome-banner { min-height:230px; display:grid; grid-template-columns:1.5fr .7fr; gap:28px; align-items:center; padding:34px 40px; overflow:hidden; border-radius:20px; color:#fff; background:linear-gradient(130deg,#003d5d,#0c638e 58%,#258ab6); position:relative; box-shadow:0 18px 45px rgba(0,72,107,.18); }.welcome-banner::after { content:""; position:absolute; width:300px; height:300px; right:-80px; top:-120px; border-radius:50%; background:rgba(144,214,250,.13); }.banner-label { color:#b9e2f7; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.welcome-banner h2 { max-width:650px; margin:9px 0 10px; font-size:30px; }.welcome-banner p { max-width:580px; margin:0; color:#d7edf7; font-size:12px; }.banner-actions { display:flex; gap:10px; margin-top:22px; }.button.light { background:#fff; color:var(--primary); }.button.glass { border-color:rgba(255,255,255,.35); color:#fff; background:rgba(255,255,255,.08); }.agent-visual { display:grid; justify-items:center; gap:13px; position:relative; z-index:1; }.voice-ring { width:112px; height:112px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.12); position:relative; }.voice-ring img { width:56px; border-radius:15px; }.voice-ring i { position:absolute; inset:-10px; border:1px solid rgba(255,255,255,.25); border-radius:50%; }.voice-ring i:nth-child(2){inset:-20px;opacity:.55}.voice-ring i:nth-child(3){inset:-30px;opacity:.25}.agent-visual > span { color:#d6edf8; font-size:10px; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:18px 0; }.stat-card,.dashboard-panel,.table-card { border:1px solid #dce4eb; border-radius:15px; background:#fff; box-shadow:0 5px 18px rgba(29,64,89,.045); }.stat-card { padding:18px; }.stat-icon { width:34px; height:34px; display:grid; place-items:center; margin-bottom:14px; border-radius:9px; }.stat-icon .material-symbols-outlined { font-size:18px; }.stat-icon.blue{color:#126e9d;background:#e2f3fc}.stat-icon.green{color:#078659;background:#ddf7ec}.stat-icon.violet{color:#7656b1;background:#eee9fa}.stat-icon.amber{color:#a96005;background:#fff0d9}.stat-card > span { display:block; color:#6d7b85; font-size:10px; }.stat-card > strong { display:block; margin:4px 0; font-size:24px; }.stat-card small { color:#83909a; font-size:9px; }.stat-card small.positive { color:#078659; }
.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.55fr); gap:18px; }.dashboard-panel { padding:22px; }.panel-heading,.usage-heading,.view-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }.panel-heading h3,.usage-heading h3 { margin:0; font-size:16px; }.text-button { display:flex; align-items:center; gap:4px; font-size:10px; font-weight:750; }.text-button .material-symbols-outlined { font-size:15px; }
.recent-call { display:grid; grid-template-columns:38px minmax(0,1fr) auto 66px 34px; gap:10px; align-items:center; padding:14px 0; border-bottom:1px solid #edf0f3; }.recent-call:last-child { border:0; padding-bottom:0; }.call-avatar { width:36px; height:36px; display:grid; place-items:center; border-radius:50%; color:var(--primary); background:#e9f3f9; font-size:9px; font-weight:800; }.recent-call strong,.recent-call small { display:block; }.recent-call strong { font-size:11px; }.recent-call small { margin-top:3px; color:#7a8994; font-size:9px; }.recent-call time { color:#75838d; font-size:9px; text-align:right; }.outcome { display:inline-flex; padding:5px 8px; border-radius:99px; font-style:normal; font-size:8px; font-weight:800; }.outcome.booked{color:#08754f;background:#ddf7ec}.outcome.interested{color:#1b6390;background:#e2f3fc}.outcome.resolved{color:#61508e;background:#eee9fa}.outcome.escalated{color:#a44b40;background:#ffe8e4}
.status-dot { padding:5px 8px; border-radius:99px; color:#08754f; background:#ddf7ec; font-size:8px; font-weight:800; }.agent-profile { display:grid; justify-items:center; margin:23px 0; }.large-agent-avatar { width:70px; height:70px; display:grid; place-items:center; margin-bottom:10px; border-radius:20px; color:#fff; background:linear-gradient(145deg,#075579,#49a3cd); font-size:24px; font-weight:800; position:relative; }.large-agent-avatar span { position:absolute; right:-2px; bottom:-2px; width:15px; height:15px; border:3px solid #fff; border-radius:50%; background:#18a56e; }.agent-profile strong { font-size:15px; }.agent-profile small { color:#788690; font-size:9px; }.agent-details { margin:0; }.agent-details div { display:flex; justify-content:space-between; gap:14px; padding:10px 0; border-top:1px solid #edf0f3; font-size:9px; }.agent-details dt { color:#7b8993; }.agent-details dd { margin:0; font-weight:700; text-align:right; }.full-button { width:100%; margin-top:14px; }
.usage-panel { margin-top:18px; }.usage-heading strong { color:var(--primary); font-size:16px; }.usage-track { height:7px; margin:16px 0 8px; overflow:hidden; border-radius:99px; background:#e8edf1; }.usage-track span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--primary),#5eafd5); }.usage-labels { display:flex; justify-content:space-between; color:#81909a; font-size:9px; }
.view-heading { margin-bottom:22px; }.view-heading h2 { margin:0 0 5px; font-size:28px; }.view-heading div > span { color:#71808b; font-size:11px; }.filter-bar { display:flex; gap:10px; margin-bottom:14px; }.table-search { flex:1; position:relative; }.table-search .material-symbols-outlined { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:#81909a; font-size:18px; }.filter-bar input { padding-left:38px; }.filter-bar select { width:170px; }.filter-chip { padding:0 14px; border:1px solid #ccd6df; border-radius:10px; color:#445560; background:#fff; font:inherit; font-size:10px; font-weight:700; }.filter-chip.active { color:var(--primary); background:#edf6fc; }
.table-card { overflow:hidden; }.call-table-header,.call-table-row { display:grid; grid-template-columns:1.2fr .85fr .55fr .65fr .9fr 36px; gap:14px; align-items:center; padding:13px 18px; }.call-table-header { color:#71808a; background:#f6f9fb; font-size:8px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }.call-table-row { border-top:1px solid #e7edf1; color:#596974; font-size:9px; }.call-table-row > span:first-child b,.call-table-row > span:first-child small { display:block; }.call-table-row b { color:#1c2c38; font-size:10px; }.call-table-row small { margin-top:3px; color:#84919a; }.call-table-row.filtered { display:none; }
.settings-layout { display:grid; grid-template-columns:190px minmax(0,720px); gap:24px; align-items:start; }.settings-nav { display:grid; gap:4px; padding:8px; border:1px solid #dce4eb; border-radius:13px; background:#fff; }.settings-nav button { padding:10px 11px; border:0; border-radius:8px; color:#64747f; background:transparent; font:inherit; font-size:10px; font-weight:700; text-align:left; cursor:pointer; }.settings-nav button.active { color:var(--primary); background:#edf6fc; }.settings-content { border:1px solid #dce4eb; border-radius:15px; background:#fff; }.settings-section { display:none; padding:28px; }.settings-section.active { display:grid; gap:20px; }.settings-heading { padding-bottom:20px; border-bottom:1px solid #e5ebf0; }.settings-heading h3 { margin:0 0 5px; font-size:18px; }.settings-heading p { margin:0; color:#74828c; font-size:10px; }.voice-preview,.integration-row,.control-row { display:flex; align-items:center; gap:14px; padding:15px; border:1px solid #dce4eb; border-radius:12px; }.play-button { width:38px; height:38px; display:grid; place-items:center; border:0; border-radius:50%; color:#fff; background:var(--primary); }.voice-preview div { flex:1; }.voice-preview strong,.voice-preview small { display:block; }.voice-preview strong { font-size:11px; }.voice-preview small { color:#75838e; font-size:9px; }.voice-preview > span { color:#8c98a1; font-size:8px; }.integration-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; color:var(--primary); background:#e8f4fb; font-size:8px; font-weight:900; }.integration-row > div { flex:1; }.integration-row strong,.integration-row small { display:block; }.integration-row strong { font-size:11px; }.integration-row small { color:#7e8b95; font-size:9px; }.integration-state { color:#8b650a; font-size:8px; font-weight:800; }.integration-state.muted { color:#8a969f; }.control-row { justify-content:space-between; }.control-row strong { font-size:11px; }.control-row p { margin:3px 0 0; color:#7c8993; font-size:9px; }.control-row.danger { border-color:#f0cdc8; }.danger-button { color:#a13b30; background:#fff0ee; }.danger-button:disabled { opacity:.65; }
.billing-grid { display:grid; grid-template-columns:minmax(280px,.55fr) minmax(0,1fr); gap:18px; }.plan-card h3 { margin:18px 0 0; font-size:22px; }.billing-price { margin:8px 0 12px; color:var(--primary); font-size:34px; font-weight:850; }.billing-price small { margin-left:5px; color:#72818b; font-size:10px; }.plan-card p { color:#71808a; font-size:10px; }.billing-breakdown { margin-top:20px; }.billing-breakdown div { display:flex; justify-content:space-between; padding:11px 0; border-top:1px solid #e8edf1; color:#6f7e88; font-size:10px; }.billing-breakdown strong { color:#253541; }.usage-track.large { height:10px; }.invoice-panel { margin-top:18px; }.empty-state { padding:35px; text-align:center; }.empty-state .material-symbols-outlined { color:#8bbbd5; font-size:34px; }.empty-state h3 { margin:10px 0 5px; font-size:15px; }.empty-state p { margin:0; color:#7a8993; font-size:10px; }
.modal-backdrop { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:18px; background:rgba(8,24,35,.55); backdrop-filter:blur(4px); }.transcript-modal { width:min(620px,100%); max-height:90vh; overflow:auto; padding:25px; border-radius:18px; background:#fff; box-shadow:0 30px 90px rgba(0,30,48,.3); }.transcript-modal header,.transcript-modal footer { display:flex; align-items:center; justify-content:space-between; gap:20px; }.transcript-modal header p { margin:0 0 3px; color:#76858f; font-size:9px; text-transform:uppercase; }.transcript-modal h2 { margin:0; font-size:21px; }.modal-call-meta { display:flex; gap:10px; align-items:center; margin:18px 0; }.modal-call-meta > span { display:flex; align-items:center; gap:5px; color:#687883; font-size:9px; }.modal-call-meta .material-symbols-outlined { font-size:15px; }.summary-box,.transcript-box { margin-top:12px; padding:16px; border-radius:12px; background:#f2f7fa; }.summary-box strong,.transcript-box strong { font-size:10px; }.summary-box p,.transcript-box p { margin:8px 0 0; color:#546570; font-size:10px; line-height:1.65; }.transcript-box { background:#fafbfd; }.transcript-modal footer { margin-top:20px; padding-top:16px; border-top:1px solid #e4e9ed; color:#82909a; font-size:9px; }.toast { position:fixed; right:24px; bottom:24px; z-index:120; padding:12px 16px; border-radius:10px; color:#fff; background:#173b50; font-size:10px; font-weight:700; opacity:0; transform:translateY(12px); pointer-events:none; transition:.2s; }.toast.show { opacity:1; transform:none; }.sidebar-scrim { display:none; }

.modal-backdrop[hidden] { display:none; }
.icon-button.close-sidebar,.icon-button.menu-button { display:none; }
@media(max-width:1100px){.services-grid{grid-template-columns:repeat(2,1fr)}.stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.agent-panel{display:none}.pricing-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.onboarding-shell{grid-template-columns:1fr}.setup-sidebar{padding:30px 24px}.setup-sidebar h1{font-size:28px}.setup-sidebar>p:not(.setup-kicker),.setup-trust{display:none}.setup-steps{grid-template-columns:repeat(5,1fr);margin-top:22px}.setup-steps li{justify-content:center;padding:5px}.setup-steps li div{display:none}.setup-workspace{padding:24px 14px}.dashboard-body{display:block}.app-sidebar{position:fixed;left:0;top:0;width:var(--sidebar);transform:translateX(-102%);transition:.22s}.app-sidebar.open{transform:none}.sidebar-scrim.open{display:block;position:fixed;inset:0;z-index:40;background:rgba(9,26,37,.48)}.icon-button.close-sidebar,.icon-button.menu-button{display:grid}.app-header{padding:0 18px}.app-header>div:first-of-type{margin-right:auto}.app-content{padding:22px 16px 45px}.settings-layout{grid-template-columns:1fr}.settings-nav{display:flex;overflow:auto}.settings-nav button{white-space:nowrap}.billing-grid{grid-template-columns:1fr}.call-table-header{display:none}.call-table-row{grid-template-columns:1.2fr .8fr auto}.call-table-row>span:nth-child(3),.call-table-row>span:nth-child(5){display:none}}
@media(max-width:600px){.demo-disclosure{align-items:flex-start;flex-direction:column;gap:5px;padding:9px 16px;text-align:left}.product-topbar{padding:0 16px}.setup-status{display:none}.setup-card{padding:24px 18px;border-radius:18px}.two-col,.three-col,.tone-grid{grid-template-columns:1fr}.hours-row{align-items:stretch;flex-direction:column}.services-grid{grid-template-columns:repeat(2,1fr)}.setup-actions>span{display:none}.setup-actions{justify-content:space-between}.welcome-banner{grid-template-columns:1fr;padding:28px 22px}.welcome-banner h2{font-size:25px}.agent-visual{display:none}.stats-grid{grid-template-columns:1fr 1fr}.stat-card{padding:14px}.recent-call{grid-template-columns:36px minmax(0,1fr) auto 30px}.recent-call time{display:none}.recent-call .outcome{font-size:0;width:8px;height:8px;padding:0}.view-heading{align-items:flex-start}.filter-bar{flex-wrap:wrap}.table-search{flex-basis:100%}.call-table-row{grid-template-columns:1fr auto 30px}.call-table-row>span:nth-child(2){display:none}.header-actions .prototype-badge{display:none}.app-header h1{font-size:17px}.settings-section{padding:20px}.voice-preview>span{display:none}.integration-row{flex-wrap:wrap}.integration-row .button{width:100%}.modal-call-meta{flex-wrap:wrap}}
@media(min-width:821px){.icon-button.close-sidebar,.icon-button.menu-button{display:none!important}}