/*
 * Vchat Core 0.63.3-alpha — Contacts CRM unified layout
 * Visual/interaction hardening only. Existing canonical buttons, data attributes,
 * API routes and contact actions remain untouched.
 */

/* ---------- Contacts design tokens ---------- */
.vchat-frontend-app [data-vchat-panel="contacts"]{
  --vc-contact-ink:#19172f;
  --vc-contact-text:#302d45;
  --vc-contact-muted:#77738a;
  --vc-contact-soft:#9692a4;
  --vc-contact-line:#e8e4f1;
  --vc-contact-surface:#ffffff;
  --vc-contact-subtle:#f8f7fb;
  --vc-contact-accent:#6352c5;
  --vc-contact-accent-soft:#f0edff;
  --vc-contact-danger:#bf4561;
  max-width:1540px!important;
  margin-inline:auto!important;
  color:var(--vc-contact-text)!important;
}
.vchat-frontend-app [data-vchat-panel="contacts"] *,
.vchat-frontend-app #vchat-modal.is-contact-quick *,
.vchat-frontend-app #vchat-modal .vchat-contact-360 *{box-sizing:border-box!important}

/* ---------- Page rhythm ---------- */
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-page-heading h1{font-size:28px!important;line-height:1.08!important;letter-spacing:-.035em!important;color:var(--vc-contact-ink)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-page-heading p{font-size:13px!important;line-height:1.55!important;color:var(--vc-contact-muted)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-eyebrow{font-size:11px!important;line-height:1.2!important;font-weight:800!important;letter-spacing:.08em!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-heading-actions button{min-height:40px!important;padding:0 15px!important;border-radius:12px!important;font-size:12px!important;font-weight:750!important}

/* ---------- Overview ---------- */
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-overview{gap:12px!important;margin-bottom:14px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-overview>button{min-height:102px!important;padding:16px 18px!important;border-radius:18px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-overview small{font-size:11px!important;line-height:1.2!important;font-weight:750!important;color:var(--vc-contact-muted)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-overview strong{font-size:24px!important;line-height:1!important;font-weight:800!important;color:var(--vc-contact-ink)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-overview span{font-size:11px!important;line-height:1.35!important;color:var(--vc-contact-soft)!important}

/* ---------- Search / filters / chips ---------- */
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar{grid-template-columns:minmax(320px,1fr) minmax(520px,auto)!important;gap:10px!important;padding:10px!important;border-color:var(--vc-contact-line)!important;border-radius:16px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar .vchat-search{min-height:42px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar .vchat-search input{height:42px!important;font-size:13px!important;font-weight:550!important;color:var(--vc-contact-text)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar-actions{gap:8px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar-actions select{min-width:170px!important;height:42px!important;padding:0 34px 0 12px!important;border-color:var(--vc-contact-line)!important;border-radius:12px!important;background:#fff!important;color:var(--vc-contact-text)!important;font-size:12px!important;font-weight:650!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-segments,
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-category-strip{gap:7px!important;padding:10px 1px 2px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-segments button,
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-category-strip button{min-height:32px!important;padding:0 12px!important;border-radius:999px!important;font-size:11px!important;line-height:1!important;font-weight:700!important}

/* ---------- Full-width workspace ---------- */
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-workspace{display:block!important;width:100%!important;margin-top:12px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-preview{display:none!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-shell{width:100%!important;border:1px solid var(--vc-contact-line)!important;border-radius:18px!important;background:#fff!important;box-shadow:0 10px 30px rgba(39,31,72,.045)!important;overflow:hidden!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-head{min-height:48px!important;padding:0 18px!important;border-bottom:1px solid var(--vc-contact-line)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-head span{font-size:13px!important;line-height:1.2!important;font-weight:800!important;color:var(--vc-contact-ink)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-head small{font-size:11px!important;line-height:1.2!important;font-weight:550!important;color:var(--vc-contact-soft)!important}

/* Desktop column guide matches each row exactly. */
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-column-head,
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-item{
  grid-template-columns:minmax(300px,2.15fr) minmax(100px,.68fr) minmax(145px,.92fr) minmax(100px,.66fr) minmax(140px,.9fr) 146px!important;
  column-gap:18px!important;
}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-column-head{display:grid!important;align-items:center!important;min-height:38px!important;padding:0 18px!important;border-bottom:1px solid var(--vc-contact-line)!important;background:#fbfafd!important;color:var(--vc-contact-muted)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-column-head span{min-width:0!important;font-size:10.5px!important;line-height:1!important;font-weight:800!important;letter-spacing:.055em!important;text-transform:uppercase!important;white-space:nowrap!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-column-head span:last-child{text-align:right!important}

/* ---------- Contact rows ---------- */
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list{display:block!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-item{position:relative!important;display:grid!important;align-items:center!important;min-height:94px!important;padding:15px 18px!important;border-bottom:1px solid var(--vc-contact-line)!important;background:#fff!important;cursor:pointer!important;outline:none!important;transition:background .15s ease,box-shadow .15s ease!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-item:last-of-type{border-bottom:0!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-item:hover,
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-item:focus-visible{background:#fbfaff!important;box-shadow:inset 3px 0 0 var(--vc-contact-accent)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-item.is-selected:before{display:none!important}

.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-primary{display:flex!important;align-items:center!important;gap:12px!important;min-width:0!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-primary>div{min-width:0!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-mini-avatar{flex:0 0 42px!important;width:42px!important;height:42px!important;border-radius:14px!important;font-size:12px!important;font-weight:850!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-primary strong{display:block!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:var(--vc-contact-ink)!important;font-size:14px!important;line-height:1.25!important;font-weight:800!important;letter-spacing:-.01em!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-primary small{display:block!important;margin-top:3px!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:var(--vc-contact-muted)!important;font-size:12px!important;line-height:1.3!important;font-weight:550!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-badges{display:flex!important;gap:5px!important;flex-wrap:wrap!important;margin-top:7px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-badges i,
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-categories i{display:inline-flex!important;align-items:center!important;min-height:22px!important;padding:0 8px!important;border-radius:999px!important;background:var(--vc-contact-accent-soft)!important;color:#5a4ba8!important;font-size:10px!important;line-height:1!important;font-weight:750!important;font-style:normal!important;white-space:nowrap!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-badges i.is-channel{background:#f2f4f7!important;color:#626878!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-categories i.is-muted{background:#f5f4f7!important;color:#8d8998!important}

.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric{display:grid!important;align-content:center!important;gap:5px!important;min-width:0!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric small{display:none!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric b{display:block!important;min-width:0!important;margin:0!important;overflow:visible!important;text-overflow:clip!important;white-space:normal!important;color:var(--vc-contact-text)!important;font-size:13px!important;line-height:1.3!important;font-weight:750!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric.is-stage b{display:inline-flex!important;align-items:center!important;justify-self:start!important;min-height:28px!important;max-width:100%!important;padding:0 10px!important;border-radius:999px!important;background:#f4f2f8!important;color:#3f3a51!important;font-size:11px!important;font-weight:750!important;white-space:nowrap!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-categories{display:flex!important;align-items:center!important;gap:5px!important;flex-wrap:wrap!important;min-width:0!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:7px!important;min-width:0!important;width:auto!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-icon-action{display:inline-grid!important;place-items:center!important;flex:0 0 36px!important;width:36px!important;height:36px!important;min-width:36px!important;padding:0!important;border:1px solid #ded9eb!important;border-radius:11px!important;background:#fff!important;color:#6251b8!important;box-shadow:none!important;font-size:13px!important;line-height:1!important;font-weight:800!important;cursor:pointer!important;pointer-events:auto!important;touch-action:manipulation!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-icon-action.is-profile{flex-basis:auto!important;width:auto!important;min-width:48px!important;padding:0 9px!important;font-size:11px!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-icon-action.is-danger{border-color:#f0ccd5!important;color:var(--vc-contact-danger)!important}

/* ---------- Pagination ---------- */
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-pagination{min-height:52px!important;padding:9px 16px!important;background:#fbfafd!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-pagination>span{font-size:11px!important;color:var(--vc-contact-muted)!important}
.vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-pagination button{min-width:32px!important;height:32px!important;border-radius:10px!important;font-size:11px!important}

/* ============================================================
   Quick contact modal — replaces the former fixed right preview.
   ============================================================ */
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-modal-dialog{width:min(680px,calc(100vw - 40px))!important;max-width:680px!important;max-height:min(88dvh,760px)!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;border-radius:22px!important;background:#fff!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-modal-head{flex:0 0 auto!important;min-height:62px!important;padding:15px 18px!important;border-bottom:1px solid var(--vc-contact-line,#e8e4f1)!important;background:#fff!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-modal-head strong{font-size:17px!important;line-height:1.2!important;font-weight:800!important;color:#19172f!important;letter-spacing:-.02em!important}
.vchat-frontend-app #vchat-modal.is-contact-quick #vchat-modal-body{flex:1 1 auto!important;min-height:0!important;overflow:auto!important;padding:0!important;background:#fff!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal{display:block!important;width:100%!important;color:#302d45!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal>header{display:grid!important;grid-template-columns:54px minmax(0,1fr)!important;align-items:center!important;gap:13px!important;padding:18px!important;border-bottom:1px solid #ece8f2!important;background:#fbfaff!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-avatar{display:grid!important;place-items:center!important;width:54px!important;height:54px!important;border-radius:17px!important;background:#eeeafd!important;color:#5f4fba!important;font-size:15px!important;font-weight:850!important;overflow:hidden!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-avatar img{width:100%!important;height:100%!important;object-fit:cover!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal header small{display:block!important;margin:0 0 3px!important;font-size:11px!important;line-height:1.2!important;font-weight:750!important;color:#716b84!important;text-transform:none!important;letter-spacing:0!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal header h2{margin:0!important;color:#19172f!important;font-size:18px!important;line-height:1.2!important;font-weight:800!important;letter-spacing:-.02em!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal header p{margin:4px 0 0!important;color:#77738a!important;font-size:12px!important;line-height:1.4!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-actions{display:flex!important;align-items:center!important;gap:7px!important;flex-wrap:wrap!important;padding:12px 18px!important;border-bottom:1px solid #ece8f2!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-actions button,
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-actions a{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-height:36px!important;padding:0 11px!important;border:1px solid #ddd8ea!important;border-radius:11px!important;background:#fff!important;color:#5d4dab!important;font-size:11px!important;line-height:1!important;font-weight:750!important;text-decoration:none!important;pointer-events:auto!important;touch-action:manipulation!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-actions .is-primary{border-color:#6352c5!important;background:#6352c5!important;color:#fff!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-actions .is-danger{border-color:#efccd5!important;color:#b9415c!important;background:#fff!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-actions em{font-style:normal!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal>section{padding:16px 18px!important;border-bottom:1px solid #ece8f2!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal>section>strong,
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-section-head>strong{display:block!important;margin:0 0 10px!important;color:#252139!important;font-size:13px!important;line-height:1.25!important;font-weight:800!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal dl{margin:0!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal dl>div{display:grid!important;grid-template-columns:120px minmax(0,1fr)!important;gap:14px!important;align-items:start!important;padding:7px 0!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal dt,
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal dd{margin:0!important;font-size:12px!important;line-height:1.4!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal dt{color:#8b8698!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal dd{color:#39354a!important;text-align:right!important;font-weight:650!important;overflow-wrap:anywhere!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-chips{display:flex!important;gap:6px!important;flex-wrap:wrap!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-chips i{display:inline-flex!important;align-items:center!important;min-height:24px!important;padding:0 9px!important;border-radius:999px!important;background:#f0edff!important;color:#5a4ba8!important;font-size:10px!important;line-height:1!important;font-weight:750!important;font-style:normal!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-section-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:0 0 10px!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-section-head>strong{margin:0!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-section-head button{min-height:32px!important;padding:0 10px!important;border:1px solid #ddd8ea!important;border-radius:10px!important;background:#fff!important;color:#5e4daf!important;font-size:11px!important;font-weight:750!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-commercial>div:not(.vchat-contact-preview-section-head){display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-commercial span{display:grid!important;align-content:start!important;min-height:68px!important;padding:10px!important;border-radius:12px!important;background:#f8f7fb!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-commercial small{font-size:10px!important;line-height:1.2!important;color:#8d8999!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-commercial b{margin-top:6px!important;font-size:12px!important;line-height:1.3!important;color:#312d43!important;font-weight:750!important;overflow-wrap:anywhere!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-commercial-note{margin:10px 0 0!important;padding-top:10px!important;border-top:1px solid #ece8f2!important;color:#858092!important;font-size:11px!important;line-height:1.45!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-footer{position:sticky!important;bottom:0!important;display:flex!important;justify-content:flex-end!important;gap:8px!important;padding:13px 18px!important;border-top:1px solid #e8e4ef!important;background:rgba(255,255,255,.97)!important;backdrop-filter:blur(10px)!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-footer button{min-height:38px!important;padding:0 14px!important;border:1px solid #ddd8ea!important;border-radius:11px!important;background:#fff!important;color:#5d4dab!important;font-size:11px!important;font-weight:750!important}
.vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-footer button.primary{border-color:#6352c5!important;background:#6352c5!important;color:#fff!important}

/* ============================================================
   Contacto 360 typography normalization.
   Keeps the existing 360 interaction model, but uses one scale.
   ============================================================ */
.vchat-frontend-app #vchat-modal .vchat-contact-360{font-size:13px!important;color:#302d45!important}
.vchat-frontend-app #vchat-modal.is-wide .vchat-modal-dialog:has(> .vchat-modal-body > .vchat-contact-360) > .vchat-modal-head strong{font-size:18px!important;font-weight:800!important;letter-spacing:-.02em!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-hero small{font-size:11px!important;letter-spacing:.06em!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-hero h2{font-size:24px!important;line-height:1.1!important;font-weight:800!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-hero p{font-size:12px!important;line-height:1.45!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-category-chips i{font-size:10px!important;min-height:23px!important;padding:0 8px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-hero-edit{min-height:38px!important;font-size:11px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-stats small{font-size:11px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-stats strong{font-size:20px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-stats span{font-size:10px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-card>header strong{font-size:13px!important;font-weight:800!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-card>header button{font-size:11px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-card dt,
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-card dd,
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-card>p{font-size:11.5px!important;line-height:1.45!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-list b{font-size:11.5px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-list small,
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-list em,
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-list>article>strong{font-size:10.5px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-empty{font-size:11.5px!important}
.vchat-frontend-app #vchat-modal .vchat-contact-360 .vchat-profile-actions button{font-size:11px!important}

/* ---------- Tablet: information first, actions remain intact ---------- */
@media(max-width:1120px){
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar{grid-template-columns:1fr!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar-actions select{width:100%!important;min-width:0!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-column-head{display:none!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-item{grid-template-columns:minmax(260px,1.5fr) repeat(3,minmax(90px,.55fr)) 140px!important;grid-template-areas:"primary activity stage value actions" "primary categories categories categories actions"!important;row-gap:8px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-primary{grid-area:primary!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric small{display:block!important;font-size:10px!important;line-height:1.1!important;font-weight:750!important;color:var(--vc-contact-muted)!important;text-transform:none!important;letter-spacing:0!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric.is-activity{grid-area:activity!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric.is-stage{grid-area:stage!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric.is-value{grid-area:value!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-categories{grid-area:categories!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-actions{grid-area:actions!important;align-self:center!important}
}

/* ---------- Mobile cards ---------- */
@media(max-width:760px){
  .vchat-frontend-app [data-vchat-panel="contacts"]{padding-inline:12px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-page-heading h1{font-size:24px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-overview{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-overview>button{min-height:92px!important;padding:13px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-overview strong{font-size:21px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-toolbar-actions{grid-template-columns:1fr!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-shell{border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-head{min-height:44px!important;padding:0 2px!important;border:0!important;background:transparent!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list{display:grid!important;gap:9px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-item{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"primary actions" "activity stage" "value categories"!important;column-gap:10px!important;row-gap:10px!important;min-height:0!important;padding:14px!important;border:1px solid var(--vc-contact-line)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 6px 18px rgba(39,31,72,.035)!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-primary{grid-area:primary!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric{padding:9px 10px!important;border-radius:11px!important;background:#f8f7fb!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric small{display:block!important;font-size:10px!important;line-height:1.1!important;font-weight:700!important;color:var(--vc-contact-muted)!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric b{margin-top:4px!important;font-size:12px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric.is-activity{grid-area:activity!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric.is-stage{grid-area:stage!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-metric.is-value{grid-area:value!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-categories{grid-area:categories!important;align-content:center!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-list-actions{grid-area:actions!important;align-self:start!important;gap:5px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-icon-action{width:34px!important;height:34px!important;min-width:34px!important;flex-basis:34px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-icon-action.is-profile{width:40px!important;min-width:40px!important;padding:0 6px!important;font-size:10px!important}
  .vchat-frontend-app [data-vchat-panel="contacts"] .vchat-contact-pagination{margin-top:8px!important;border:1px solid var(--vc-contact-line)!important;border-radius:14px!important}

  .vchat-frontend-app #vchat-modal.is-contact-quick .vchat-modal-dialog{width:100vw!important;max-width:none!important;max-height:88dvh!important;margin:0!important;border-radius:22px 22px 0 0!important;align-self:flex-end!important}
  .vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-commercial>div:not(.vchat-contact-preview-section-head){grid-template-columns:1fr!important}
  .vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-commercial span{min-height:56px!important}
  .vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-modal dl>div{grid-template-columns:96px minmax(0,1fr)!important}
  .vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-actions em{display:none!important}
  .vchat-frontend-app #vchat-modal.is-contact-quick .vchat-contact-preview-footer{padding-bottom:max(13px,env(safe-area-inset-bottom))!important}
}