:root{
    --brand:#00a884;
    --brand-strong:#087b67;
    --brand-deep:#064e43;
    --brand-soft:#e8f8f4;
    --brand-softer:#f2fbf8;
    --navy:#101828;
    --navy-2:#1d2939;
    --text:#182230;
    --muted:#667085;
    --muted-2:#98a2b3;
    --line:#e4e7ec;
    --line-soft:#eef1f4;
    --canvas:#f6f7f9;
    --surface:#ffffff;
    --surface-2:#f9fafb;
    --danger:#d92d20;
    --danger-soft:#fef3f2;
    --warning:#dc6803;
    --warning-soft:#fffaeb;
    --success:#079455;
    --success-soft:#ecfdf3;
    --info:#175cd3;
    --info-soft:#eff8ff;
    --shadow-xs:0 1px 2px rgba(16,24,40,.05);
    --shadow-sm:0 2px 8px rgba(16,24,40,.06);
    --shadow-md:0 12px 28px rgba(16,24,40,.08);
    --radius-sm:8px;
    --radius:12px;
    --radius-lg:16px;
    --sidebar:272px;
    --sidebar-collapsed:82px;
    --topbar:72px;
}
*{box-sizing:border-box}
html{font-family:"Segoe UI",Tahoma,Arial,sans-serif;background:var(--canvas);color:var(--text);scroll-behavior:smooth}
body{margin:0;direction:rtl;font-size:14px;line-height:1.5;background:var(--canvas);color:var(--text)}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{color:inherit}
img,svg{display:block}
h1,h2,h3,h4,p{margin-top:0}
h1{font-size:26px;line-height:1.25;letter-spacing:-.3px;margin-bottom:6px}
h2{font-size:18px;line-height:1.35;margin-bottom:8px}
h3{font-size:15px;margin-bottom:6px}
code,kbd{font-family:Consolas,Monaco,monospace}
code{background:#f2f4f7;border:1px solid var(--line);border-radius:6px;padding:2px 6px;font-size:12px;direction:ltr;display:inline-block}
.ui-icon{flex:0 0 auto}
.muted{color:var(--muted)}
.text-danger{color:var(--danger)}
.text-success{color:var(--success)}
.text-brand{color:var(--brand-strong)}
.text-sm{font-size:12px}
.text-xs{font-size:11px}
.ltr{direction:ltr;text-align:left}
.hidden{display:none!important}

/* Shell */
.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);transition:grid-template-columns .25s ease}
.app-sidebar{position:sticky;top:0;height:100vh;background:#fff;border-left:1px solid var(--line);padding:14px 12px;display:flex;flex-direction:column;z-index:40;overflow:hidden;transition:width .25s ease,transform .25s ease}
.sidebar-brand-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:3px 4px 14px}
.sidebar-brand{display:flex;align-items:center;gap:11px;min-width:0}
.brand-symbol{width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,var(--brand),var(--brand-strong));box-shadow:0 8px 18px rgba(0,168,132,.18);display:grid;place-items:center;flex:0 0 auto}
.brand-symbol span{font-size:24px;line-height:1;font-weight:900;color:#fff;font-style:italic}
.brand-copy{display:grid;min-width:0}
.brand-copy strong{font-size:17px;color:var(--navy);white-space:nowrap}
.brand-copy small{color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.icon-btn{width:38px;height:38px;border:1px solid transparent;background:transparent;border-radius:10px;display:inline-grid;place-items:center;cursor:pointer;transition:.18s ease}
.icon-btn:hover{background:#f2f4f7;border-color:var(--line)}
.sidebar-collapse{width:32px;height:32px;color:var(--muted)}
.workspace-card{margin:2px 1px 14px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);display:flex;align-items:center;gap:10px;min-width:0}
.workspace-avatar{width:34px;height:34px;border-radius:9px;background:var(--brand-soft);color:var(--brand-strong);font-weight:800;display:grid;place-items:center;flex:0 0 auto}
.workspace-copy{display:grid;min-width:0;flex:1}
.workspace-copy strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.workspace-copy small{font-size:11px;color:var(--muted)}
.workspace-arrow{color:var(--muted-2)}
.sidebar-nav{display:flex;flex-direction:column;gap:3px;overflow:auto;padding:0 2px 12px;scrollbar-width:thin;flex:1}
.nav-label{font-size:10px;font-weight:800;letter-spacing:.7px;color:var(--muted-2);padding:14px 11px 5px;text-transform:uppercase;white-space:nowrap}
.nav-link{position:relative;min-height:43px;border-radius:10px;padding:0 11px;display:flex;align-items:center;gap:11px;color:#475467;font-weight:600;transition:.16s ease;white-space:nowrap}
.nav-link:hover{background:#f5f7f8;color:var(--navy)}
.nav-link.active{background:var(--brand-soft);color:var(--brand-strong)}
.nav-link.active:before{content:"";position:absolute;right:-2px;width:3px;height:24px;border-radius:4px;background:var(--brand)}
.nav-link span{overflow:hidden;text-overflow:ellipsis}
.nav-link em{font-size:9px;font-style:normal;color:var(--muted);background:#f2f4f7;border-radius:999px;padding:2px 6px;margin-right:auto}
.nav-link.disabled{opacity:.6;cursor:not-allowed}
.nav-count{min-width:20px;height:20px;border-radius:999px;background:var(--brand);color:#fff;font-size:10px;display:grid;place-items:center;padding:0 5px;margin-right:auto}
.sidebar-footer{border-top:1px solid var(--line-soft);padding:12px 5px 2px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.sidebar-help{display:flex;align-items:center;gap:9px;min-width:0}
.help-icon{width:30px;height:30px;border-radius:9px;background:#f2f4f7;color:var(--muted);display:grid;place-items:center;font-weight:800}
.sidebar-help div{display:grid}
.sidebar-help strong{font-size:11px}
.sidebar-help small{font-size:9px;color:var(--muted)}
.version-chip{font-size:9px;color:var(--muted-2);white-space:nowrap}

.app-main{min-width:0;min-height:100vh}
.app-topbar{height:var(--topbar);background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;display:grid;grid-template-columns:minmax(160px,1fr) minmax(260px,520px) minmax(250px,1fr);align-items:center;gap:20px;padding:0 24px}
.topbar-start,.topbar-actions{display:flex;align-items:center;gap:12px}
.topbar-actions{justify-content:flex-start}
.topbar-page{display:grid}
.topbar-page small{font-size:10px;color:var(--muted-2)}
.topbar-page strong{font-size:14px}
.mobile-menu-btn{display:none}
.global-search{height:40px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);display:flex;align-items:center;gap:9px;padding:0 11px;color:var(--muted);transition:.18s ease}
.global-search:focus-within{border-color:#84e1cc;box-shadow:0 0 0 3px rgba(0,168,132,.09);background:#fff}
.global-search input{border:0;outline:0;background:transparent;min-width:0;flex:1;color:var(--text)}
.global-search kbd{font-size:10px;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:2px 5px;background:#fff;color:var(--muted-2)}
.connection-pill,.role-pill{height:31px;padding:0 10px;border-radius:999px;background:var(--warning-soft);color:var(--warning);display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;white-space:nowrap}
.connection-pill i{width:7px;height:7px;border-radius:50%;background:currentColor}
.connection-pill.connected{background:var(--success-soft);color:var(--success)}
.role-pill{background:#f4f3ff;color:#6938ef}
.notification-btn{position:relative;color:var(--muted)}
.notification-dot{position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:50%;background:#f04438;border:2px solid #fff}
.profile-menu{position:relative}
.profile-trigger{border:0;background:transparent;display:flex;align-items:center;gap:9px;border-radius:10px;padding:5px 7px;cursor:pointer;text-align:right}
.profile-trigger:hover{background:#f5f7f8}
.profile-avatar{width:35px;height:35px;border-radius:50%;background:linear-gradient(135deg,#d9f7ef,#b7eadf);color:var(--brand-strong);font-weight:800;display:grid;place-items:center;flex:0 0 auto}
.profile-copy{display:grid;min-width:0;max-width:140px}
.profile-copy strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.profile-copy small{font-size:9px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dropdown-menu{position:absolute;top:calc(100% + 8px);left:0;min-width:210px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-md);border-radius:12px;padding:6px;display:none;z-index:60}
.dropdown-menu.open{display:grid}
.dropdown-menu a,.dropdown-menu button{width:100%;border:0;background:transparent;display:flex;align-items:center;gap:9px;padding:10px;border-radius:8px;cursor:pointer;text-align:right;color:#475467}
.dropdown-menu a:hover,.dropdown-menu button:hover{background:#f5f7f8;color:var(--navy)}

.app-content{padding:24px;max-width:1680px;margin:0 auto}
.support-mode-bar{height:46px;background:#7a2e0e;color:#fff;display:flex;align-items:center;justify-content:center;gap:24px;position:sticky;top:0;z-index:100;padding:0 18px}
.support-mode-bar>div{display:flex;align-items:center;gap:8px}
.has-support-bar .app-sidebar{top:46px;height:calc(100vh - 46px)}
.has-support-bar .app-topbar{top:46px}
.sidebar-overlay{display:none}

/* Page structure */
.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px}
.page-header-copy{min-width:0}
.page-header-copy p{color:var(--muted);margin:0;max-width:760px}
.page-header-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.page-kicker{display:flex;align-items:center;gap:6px;color:var(--brand-strong);font-size:11px;font-weight:800;margin-bottom:6px}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px}
.page-head p{margin:0;color:var(--muted)}
.content-stack{display:grid;gap:18px}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
.section-title h2{margin:0}
.section-title p{margin:3px 0 0;color:var(--muted);font-size:12px}
.section-actions{display:flex;gap:8px;align-items:center}

/* Cards and grids */
.grid{display:grid;gap:16px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(320px,.85fr);gap:16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-xs);padding:18px}
.card.flush{padding:0;overflow:hidden}
.card.soft{background:var(--surface-2);box-shadow:none}
.card.brand-card{background:linear-gradient(145deg,#093f36,#087b67);color:#fff;border:0;box-shadow:0 16px 30px rgba(8,123,103,.16)}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.card-head h2,.card-head h3{margin:0}
.card-head-copy p{margin:3px 0 0;color:var(--muted);font-size:12px}
.card.brand-card .muted,.card.brand-card p{color:rgba(255,255,255,.72)}
.stat-card{padding:16px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.stat-copy{display:grid;gap:5px}
.stat-copy small{color:var(--muted);font-size:11px;font-weight:600}
.stat-copy strong{font-size:25px;letter-spacing:-.5px}
.stat-copy span{color:var(--muted);font-size:10px}
.stat-icon{width:39px;height:39px;border-radius:11px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand-strong)}
.stat-icon.blue{background:var(--info-soft);color:var(--info)}
.stat-icon.orange{background:var(--warning-soft);color:var(--warning)}
.stat-icon.purple{background:#f4f3ff;color:#6938ef}
.stat-trend{display:inline-flex;align-items:center;gap:3px;font-size:10px;color:var(--success);font-weight:700}
.metric-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.mini-metric{border:1px solid var(--line-soft);border-radius:10px;padding:12px;background:#fff}
.mini-metric span{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}
.mini-metric strong{font-size:18px}

/* Buttons */
.btn{min-height:38px;border:1px solid transparent;border-radius:9px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700;font-size:12px;cursor:pointer;transition:.16s ease;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 3px 8px rgba(0,168,132,.16)}
.btn-primary:hover{background:#079676}
.btn-dark{background:var(--navy);color:#fff}
.btn-outline{background:#fff;border-color:var(--line);color:#344054}
.btn-outline:hover,.btn-light:hover{border-color:#cfd4dc;background:#f9fafb}
.btn-light{background:#f2f4f7;border-color:#f2f4f7;color:#344054}
.btn-danger{background:var(--danger-soft);color:var(--danger);border-color:#fecdca}
.btn-white{background:#fff;color:var(--navy)}
.btn-ghost{background:transparent;color:var(--muted)}
.btn-sm{min-height:31px;padding:0 10px;font-size:11px;border-radius:8px}
.btn-lg{min-height:44px;padding:0 18px;font-size:13px}
.btn-block{width:100%}
.btn-icon{width:38px;padding:0}
.action-menu{display:flex;align-items:center;gap:6px}

/* Forms */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.form-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.field{display:grid;gap:7px;align-content:start}
.field.full{grid-column:1/-1}
.field label{font-size:12px;font-weight:700;color:#344054}
.field-hint{font-size:10px;color:var(--muted);margin-top:-2px}
.input{width:100%;min-height:40px;border:1px solid #d0d5dd;background:#fff;border-radius:9px;padding:9px 11px;color:var(--text);outline:0;transition:.16s ease}
.input::placeholder{color:#98a2b3}
.input:focus{border-color:#6ce2c7;box-shadow:0 0 0 3px rgba(0,168,132,.1)}
textarea.input{min-height:105px;resize:vertical}
select.input{cursor:pointer}
.input-with-icon{position:relative}
.input-with-icon .ui-icon{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:var(--muted)}
.input-with-icon .input{padding-right:38px}
.form-actions{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;gap:9px;padding-top:5px}
.switch-row{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line-soft)}
.switch-row:last-child{border-bottom:0}
.switch-copy{display:grid;gap:3px}
.switch-copy strong{font-size:12px}
.switch-copy small{font-size:10px;color:var(--muted)}
.switch{position:relative;width:42px;height:24px;flex:0 0 auto}
.switch input{opacity:0;width:0;height:0}
.switch-slider{position:absolute;inset:0;background:#d0d5dd;border-radius:999px;cursor:pointer;transition:.2s}
.switch-slider:after{content:"";position:absolute;width:18px;height:18px;top:3px;right:3px;background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(16,24,40,.2);transition:.2s}
.switch input:checked + .switch-slider{background:var(--brand)}
.switch input:checked + .switch-slider:after{transform:translateX(-18px)}
.checkbox-list{display:grid;gap:9px}
.checkbox-item{display:flex;align-items:flex-start;gap:9px;border:1px solid var(--line);border-radius:9px;padding:10px;cursor:pointer}
.checkbox-item input{margin-top:3px;accent-color:var(--brand)}
.checkbox-copy{display:grid}
.checkbox-copy strong{font-size:11px}
.checkbox-copy small{font-size:9px;color:var(--muted)}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:0 8px;border-radius:999px;font-size:10px;font-weight:700;white-space:nowrap}
.badge:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8}
.badge-success{background:var(--success-soft);color:var(--success)}
.badge-warning{background:var(--warning-soft);color:var(--warning)}
.badge-danger{background:var(--danger-soft);color:var(--danger)}
.badge-info{background:var(--info-soft);color:var(--info)}
.badge-muted{background:#f2f4f7;color:#667085}
.badge-brand{background:var(--brand-soft);color:var(--brand-strong)}
.badge.no-dot:before{display:none}

/* Tables */
.table-card{padding:0;overflow:hidden}
.table-toolbar{min-height:64px;padding:12px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}
.table-toolbar-start,.table-toolbar-end{display:flex;align-items:center;gap:9px}
.table-search{min-width:260px}
.table-wrap{overflow:auto}
.table{width:100%;border-collapse:separate;border-spacing:0}
.table th,.table td{padding:12px 15px;text-align:right;border-bottom:1px solid var(--line-soft);vertical-align:middle;white-space:nowrap}
.table th{background:#fcfcfd;color:#667085;font-size:10px;font-weight:700;letter-spacing:.1px}
.table td{font-size:12px;color:#344054}
.table tbody tr:hover td{background:#fbfdfc}
.table tbody tr:last-child td{border-bottom:0}
.table-link{font-weight:700;color:var(--navy)}
.table-link:hover{color:var(--brand-strong)}
.table-sub{display:block;color:var(--muted);font-size:9px;margin-top:3px}
.table-avatar-cell{display:flex;align-items:center;gap:10px}
.table-avatar{width:34px;height:34px;border-radius:10px;background:var(--brand-soft);color:var(--brand-strong);display:grid;place-items:center;font-weight:800;flex:0 0 auto}
.empty-row td{text-align:center;padding:44px;color:var(--muted)}
.pagination{padding:14px 16px;border-top:1px solid var(--line-soft)}

/* Tabs/settings */
.settings-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;align-items:start}
.settings-nav{position:sticky;top:calc(var(--topbar) + 20px);padding:8px}
.settings-nav button,.settings-nav a{width:100%;border:0;background:transparent;border-radius:8px;padding:10px 11px;display:flex;align-items:center;gap:9px;text-align:right;color:#475467;cursor:pointer;font-weight:600;font-size:12px}
.settings-nav button:hover,.settings-nav a:hover{background:#f5f7f8}
.settings-nav button.active,.settings-nav a.active{background:var(--brand-soft);color:var(--brand-strong)}
.settings-nav .settings-group{font-size:9px;font-weight:800;color:var(--muted-2);padding:14px 10px 5px;text-transform:uppercase}
.settings-content{display:grid;gap:16px}
.settings-panel[hidden]{display:none!important}
.settings-section{padding:20px}
.settings-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:15px;border-bottom:1px solid var(--line-soft);margin-bottom:17px}
.settings-section-head p{margin:3px 0 0;color:var(--muted);font-size:11px}
.tabs{display:flex;gap:3px;overflow:auto;border-bottom:1px solid var(--line);margin-bottom:16px}
.tabs button{border:0;background:transparent;padding:11px 13px;cursor:pointer;color:var(--muted);font-size:11px;font-weight:700;border-bottom:2px solid transparent;white-space:nowrap}
.tabs button.active{color:var(--brand-strong);border-color:var(--brand)}
[data-tab-panel][hidden]{display:none!important}

/* Dashboard */
.welcome-card{position:relative;overflow:hidden;padding:22px}
.welcome-card:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.06);left:-70px;top:-100px}
.welcome-card-content{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:20px}
.welcome-card h1{font-size:24px;margin-bottom:7px}
.welcome-actions{display:flex;gap:8px;flex-wrap:wrap}
.onboarding-list{display:grid;gap:4px}
.onboarding-item{display:flex;align-items:center;gap:11px;padding:11px;border-radius:9px}
.onboarding-item:hover{background:#f9fafb}
.onboarding-status{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--muted-2);flex:0 0 auto}
.onboarding-item.done .onboarding-status{background:var(--success-soft);border-color:#abefc6;color:var(--success)}
.onboarding-copy{display:grid;min-width:0;flex:1}
.onboarding-copy strong{font-size:11px}
.onboarding-copy small{font-size:9px;color:var(--muted)}
.onboarding-item>.ui-icon{color:var(--muted-2)}
.usage-box{display:grid;gap:15px}
.usage-row{display:grid;gap:7px}
.usage-label{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:var(--muted)}
.progress{height:7px;background:#eef1f4;border-radius:999px;overflow:hidden}
.progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--brand),#55d6bb);border-radius:inherit;max-width:100%}
.quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.quick-action{border:1px solid var(--line);border-radius:10px;padding:11px;display:flex;align-items:center;gap:10px;transition:.16s}
.quick-action:hover{border-color:#9ee7d6;background:var(--brand-softer)}
.quick-action-icon{width:34px;height:34px;border-radius:9px;background:var(--brand-soft);color:var(--brand-strong);display:grid;place-items:center}
.quick-action-copy{display:grid}
.quick-action-copy strong{font-size:10px}
.quick-action-copy small{font-size:9px;color:var(--muted)}

/* Inbox */
.inbox-shell{height:calc(100vh - var(--topbar) - 48px);min-height:650px;display:grid;grid-template-columns:330px minmax(420px,1fr) 280px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-xs);overflow:hidden}
.inbox-list-column{border-left:1px solid var(--line);min-width:0;display:flex;flex-direction:column}
.inbox-list-head{padding:14px;border-bottom:1px solid var(--line);display:grid;gap:11px}
.inbox-title-row{display:flex;align-items:center;justify-content:space-between}
.inbox-title-row h2{font-size:16px;margin:0}
.inbox-filter-tabs{display:flex;gap:5px;overflow:auto}
.inbox-filter-tabs a{padding:6px 9px;border-radius:7px;color:var(--muted);font-size:10px;font-weight:700;white-space:nowrap}
.inbox-filter-tabs a.active,.inbox-filter-tabs a:hover{background:var(--brand-soft);color:var(--brand-strong)}
.thread-list{overflow:auto;flex:1}
.thread-item{display:flex;gap:10px;padding:13px 14px;border-bottom:1px solid var(--line-soft);transition:.15s;position:relative}
.thread-item:hover{background:#f8fbfa}
.thread-item.active{background:var(--brand-softer)}
.thread-item.active:before{content:"";position:absolute;right:0;top:0;bottom:0;width:3px;background:var(--brand)}
.thread-avatar{width:42px;height:42px;border-radius:50%;background:#e9f7f3;color:var(--brand-strong);font-weight:800;display:grid;place-items:center;flex:0 0 auto;position:relative}
.channel-dot{position:absolute;bottom:-1px;left:-1px;width:15px;height:15px;border-radius:50%;background:#20c997;color:#fff;border:2px solid #fff;display:grid;place-items:center}
.thread-content{min-width:0;flex:1;display:grid;gap:4px}
.thread-top,.thread-bottom{display:flex;align-items:center;justify-content:space-between;gap:8px}
.thread-top strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thread-time{font-size:8px;color:var(--muted-2);white-space:nowrap}
.thread-preview{font-size:9px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unread-bubble{min-width:19px;height:19px;border-radius:999px;background:var(--brand);color:#fff;font-size:9px;display:grid;place-items:center;padding:0 5px}
.empty-state{min-height:240px;display:grid;place-items:center;text-align:center;padding:28px;color:var(--muted)}
.empty-state-icon{width:58px;height:58px;border-radius:18px;background:var(--brand-soft);color:var(--brand-strong);display:grid;place-items:center;margin:0 auto 12px}
.empty-state h3{color:var(--text);margin-bottom:5px}
.empty-state p{font-size:11px;max-width:280px;margin:0 auto}
.chat-column{display:flex;flex-direction:column;min-width:0;background:#f5f7f8}
.chat-header{height:66px;padding:0 16px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}
.chat-contact{display:flex;align-items:center;gap:10px;min-width:0}
.chat-contact-copy{display:grid;min-width:0}
.chat-contact-copy strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-contact-copy small{font-size:9px;color:var(--muted)}
.chat-actions{display:flex;align-items:center;gap:6px}
.messages{flex:1;overflow:auto;padding:20px 28px;display:flex;flex-direction:column;gap:9px;background-color:#f2f5f4;background-image:radial-gradient(circle at 1px 1px,rgba(16,24,40,.035) 1px,transparent 0);background-size:19px 19px}
.date-divider{align-self:center;background:rgba(255,255,255,.9);box-shadow:var(--shadow-xs);border-radius:999px;padding:5px 10px;font-size:9px;color:var(--muted);margin:4px 0}
.message-row{display:flex;gap:7px;max-width:78%}
.message-row.in{align-self:flex-start}
.message-row.out{align-self:flex-end;flex-direction:row-reverse}
.bubble{border-radius:12px;padding:9px 11px;box-shadow:0 1px 2px rgba(16,24,40,.06);font-size:11px;line-height:1.65;min-width:90px}
.bubble.in{background:#fff;border-top-right-radius:3px}
.bubble.out{background:#d9fdd3;border-top-left-radius:3px}
.bubble-meta{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:4px;color:#667085;font-size:8px}
.composer{padding:11px 13px;background:#fff;border-top:1px solid var(--line);display:flex;align-items:flex-end;gap:7px}
.composer-tools{display:flex;gap:3px}
.composer .input{min-height:42px;max-height:120px;flex:1;border-radius:11px;background:#f9fafb}
.send-btn{width:42px;height:42px;border-radius:50%;padding:0}
.contact-panel{border-right:1px solid var(--line);background:#fff;overflow:auto}
.contact-panel-head{padding:18px;text-align:center;border-bottom:1px solid var(--line-soft)}
.contact-large-avatar{width:62px;height:62px;border-radius:50%;background:var(--brand-soft);color:var(--brand-strong);display:grid;place-items:center;font-size:22px;font-weight:800;margin:0 auto 10px}
.contact-panel-head h3{margin-bottom:2px}
.contact-panel-head p{font-size:10px;color:var(--muted);margin:0}
.contact-panel-section{padding:15px 17px;border-bottom:1px solid var(--line-soft)}
.contact-panel-section h4{font-size:10px;text-transform:uppercase;color:var(--muted-2);letter-spacing:.5px;margin-bottom:11px}
.info-list{display:grid;gap:11px}
.info-item{display:flex;align-items:flex-start;gap:9px;color:#475467}
.info-item>.ui-icon{color:var(--muted-2);margin-top:1px}
.info-copy{display:grid;min-width:0}
.info-copy small{font-size:8px;color:var(--muted-2)}
.info-copy span{font-size:10px;word-break:break-word}
.tag-list{display:flex;gap:6px;flex-wrap:wrap}
.tag{background:#f2f4f7;color:#475467;border-radius:6px;padding:4px 7px;font-size:9px}

/* Integrations */
.integration-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.integration-card{border:1px solid var(--line);border-radius:11px;padding:14px;display:grid;gap:12px;background:#fff}
.integration-head{display:flex;align-items:center;gap:10px}
.integration-logo{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand-strong)}
.integration-logo.stripe{background:#f4f3ff;color:#635bff}
.integration-logo.paypal{background:#eff8ff;color:#003087}
.integration-copy{display:grid;min-width:0;flex:1}
.integration-copy strong{font-size:11px}
.integration-copy small{font-size:9px;color:var(--muted)}
.status-dot{width:8px;height:8px;border-radius:50%;background:#d0d5dd}
.status-dot.on{background:var(--success);box-shadow:0 0 0 3px var(--success-soft)}
.connection-card{border:1px solid var(--line);border-radius:11px;padding:13px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.connection-info{display:flex;align-items:center;gap:10px}
.connection-icon{width:38px;height:38px;border-radius:50%;background:#e7f8f1;color:#00a884;display:grid;place-items:center}
.connection-copy{display:grid}
.connection-copy strong{font-size:11px}
.connection-copy small{font-size:9px;color:var(--muted)}
.code-box{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#f9fafb;border-radius:9px;padding:7px}
.code-box code,.code-box input{border:0;background:transparent;flex:1;min-width:0;direction:ltr;text-align:left;color:#475467;outline:0}

/* Plans */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.plan{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;display:flex;flex-direction:column;min-height:420px}
.plan.featured{border:2px solid var(--brand);box-shadow:0 12px 28px rgba(0,168,132,.1)}
.plan-ribbon{position:absolute;top:12px;left:12px;background:var(--brand);color:#fff;font-size:9px;font-weight:800;border-radius:999px;padding:4px 8px}
.plan-price{font-size:31px;font-weight:800;letter-spacing:-1px;margin:12px 0 2px}
.plan-price small{font-size:10px;font-weight:500;color:var(--muted)}
.features{list-style:none;padding:0;margin:16px 0;display:grid;gap:10px;flex:1}
.features li{display:flex;align-items:flex-start;gap:7px;font-size:10px;color:#475467}
.feature-check{width:18px;height:18px;border-radius:50%;background:var(--brand-soft);color:var(--brand-strong);display:grid;place-items:center;flex:0 0 auto}
.plans-admin{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.plan-admin-card{position:relative}
.plan-usage{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0}
.plan-usage span{background:#f2f4f7;border-radius:7px;padding:5px 7px;font-size:9px;color:#475467}
.admin-price{font-size:24px;color:var(--brand-strong)}
.collapsible{display:none}
.collapsible.open{display:block}
.collapsible.nested{border-top:1px solid var(--line);margin-top:16px;padding-top:16px}

/* Alerts/toast */
.alert{border-radius:11px;padding:13px 15px;display:flex;gap:11px;margin-bottom:16px;border:1px solid}
.alert-danger{background:var(--danger-soft);border-color:#fecdca;color:#b42318}
.alert-warning{background:var(--warning-soft);border-color:#fedf89;color:#b54708}
.alert-info{background:var(--info-soft);border-color:#b2ddff;color:#175cd3}
.alert-icon{width:25px;height:25px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;font-weight:800;flex:0 0 auto}
.alert p{margin:3px 0 0;font-size:10px}
.toast{position:fixed;left:24px;bottom:24px;z-index:100;min-width:290px;max-width:430px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-md);border-radius:11px;padding:12px 13px;display:flex;align-items:center;gap:9px}
.toast-success>.ui-icon{color:var(--success)}
.toast span{flex:1}
.toast button{border:0;background:transparent;cursor:pointer;color:var(--muted)}
.update-notice{background:var(--warning-soft);border:1px solid #fedf89;border-radius:12px;padding:14px 16px;margin-bottom:16px;display:flex;align-items:center;justify-content:space-between;gap:15px}
.update-notice p{margin:3px 0 0;color:#7a2e0e;font-size:10px}

/* Admin */
.admin-chip{background:#f4f3ff;color:#6938ef;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:800}
.admin-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.admin-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px}
.admin-hero-copy p{margin:5px 0 0;color:var(--muted)}
.admin-hero-actions{display:flex;gap:8px}
.health-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.health-item{border:1px solid var(--line-soft);border-radius:9px;padding:10px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.health-item span{font-size:9px;color:var(--muted)}
.health-item strong{font-size:10px}
.chart-shell{height:250px;padding-top:10px;display:flex;align-items:flex-end;gap:12px;border-bottom:1px solid var(--line)}
.chart-column{height:100%;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px}
.bar-stack{height:190px;display:flex;align-items:flex-end;gap:4px}
.bar{width:17px;border-radius:5px 5px 0 0;min-height:2px}
.bar-messages{background:var(--brand)}
.bar-companies{background:#b7eadf}
.chart-column small{font-size:8px;color:var(--muted);text-align:center}
.chart-legend{display:flex;gap:15px;margin-top:12px;color:var(--muted);font-size:9px}
.chart-legend i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-left:5px}
.legend-message{background:var(--brand)}
.legend-company{background:#b7eadf}
.activity-feed{display:grid}
.activity-item{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.activity-item:last-child{border-bottom:0}
.activity-dot{width:30px;height:30px;border-radius:9px;background:var(--brand-soft);color:var(--brand-strong);display:grid;place-items:center}
.activity-copy p{margin:2px 0;color:var(--muted);font-size:9px}
.activity-copy small{color:var(--muted-2);font-size:8px}
.breadcrumb{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:10px;margin-bottom:7px}
.breadcrumb a:hover{color:var(--brand-strong)}
.filter-bar{display:grid;grid-template-columns:minmax(240px,2fr) repeat(3,minmax(130px,1fr)) auto;gap:9px;align-items:end}
.subscription-hero{border:1px solid #abe9dc;background:var(--brand-softer);border-radius:12px;padding:16px;display:grid;gap:4px}
.subscription-hero strong{font-size:21px;color:var(--brand-strong)}
.compact-list{display:grid}
.compact-list>div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.compact-list>div:last-child{border-bottom:0}
.compact-list small{font-size:9px;color:var(--muted)}
.inline-form{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.input-small{min-height:32px;padding:5px 8px;font-size:10px;min-width:110px}
.check-list{display:grid;gap:10px;padding-right:18px}
.check-list li{color:#475467;font-size:11px}
.check-list li::marker{color:var(--brand)}

/* Auth/public */
.auth-page{min-height:100vh;background:#f4f7f6;display:grid;grid-template-columns:minmax(360px,.9fr) minmax(460px,1.1fr)}
.auth-aside{position:relative;overflow:hidden;background:linear-gradient(145deg,#073f35,#086f5e);padding:56px;color:#fff;display:flex;flex-direction:column;justify-content:space-between}
.auth-aside:before,.auth-aside:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.06)}
.auth-aside:before{width:380px;height:380px;top:-170px;left:-120px}
.auth-aside:after{width:240px;height:240px;bottom:-80px;right:-80px}
.auth-aside-content{position:relative;z-index:1}
.auth-brand{display:flex;align-items:center;gap:10px;margin-bottom:80px}
.auth-brand .brand-symbol{background:#fff}
.auth-brand .brand-symbol span{color:var(--brand-strong)}
.auth-brand strong{font-size:20px}
.auth-aside h1{font-size:37px;line-height:1.35;margin-bottom:15px;max-width:520px}
.auth-aside p{font-size:15px;color:rgba(255,255,255,.74);line-height:1.9;max-width:520px}
.auth-points{display:grid;gap:13px;margin-top:30px}
.auth-point{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.9)}
.auth-point span{width:27px;height:27px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center}
.auth-aside-footer{position:relative;z-index:1;font-size:10px;color:rgba(255,255,255,.55)}
.auth-main{display:grid;place-items:center;padding:30px}
.auth-card{width:min(520px,100%);background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-sm);padding:28px}
.auth-card-head{margin-bottom:22px}
.auth-card-head h1{font-size:24px}
.auth-card-head p{margin:5px 0 0;color:var(--muted)}
.auth-footer{text-align:center;margin:17px 0 0;color:var(--muted);font-size:11px}
.auth-footer a{color:var(--brand-strong);font-weight:700}
.hero{min-height:92vh;background:radial-gradient(circle at top right,#dff7f1,transparent 43%),#f8fafc}
.public-nav{max-width:1180px;margin:auto;padding:22px;display:flex;justify-content:space-between;align-items:center}
.hero-inner{max-width:1180px;margin:auto;padding:80px 22px;display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
.hero h1{font-size:50px;line-height:1.25}
.hero p{font-size:18px;line-height:1.9}
.hero-card{background:#083f35;color:#fff;border-radius:22px;padding:28px;box-shadow:var(--shadow-md)}
.pricing{max-width:1180px;margin:auto;padding:70px 22px}

/* Responsive */
@media(max-width:1280px){
    :root{--sidebar:245px}
    .app-topbar{grid-template-columns:minmax(150px,.8fr) minmax(220px,420px) minmax(250px,1fr);padding:0 18px}
    .inbox-shell{grid-template-columns:300px minmax(390px,1fr) 250px}
    .admin-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
    .grid-5{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1060px){
    .app-shell{grid-template-columns:var(--sidebar-collapsed) minmax(0,1fr)}
    .app-sidebar{width:var(--sidebar-collapsed);padding:14px 9px}
    .brand-copy,.workspace-copy,.workspace-arrow,.nav-label,.nav-link span,.nav-link em,.sidebar-help div,.version-chip,.sidebar-collapse{display:none}
    .sidebar-brand-row{justify-content:center}
    .sidebar-brand{justify-content:center}
    .workspace-card{justify-content:center;padding:8px}
    .nav-link{justify-content:center;padding:0}
    .nav-link.active:before{right:-9px}
    .sidebar-footer{justify-content:center}
    .app-topbar{grid-template-columns:auto minmax(220px,1fr) auto}
    .profile-copy,.connection-pill{display:none}
    .dashboard-grid{grid-template-columns:1fr}
    .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
    .inbox-shell{grid-template-columns:290px minmax(380px,1fr)}
    .contact-panel{display:none}
    .settings-layout{grid-template-columns:190px minmax(0,1fr)}
    .integration-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:820px){
    .app-shell{display:block}
    .app-sidebar{position:fixed;right:0;top:0;width:280px;height:100vh;transform:translateX(100%);padding:14px 12px;box-shadow:var(--shadow-md)}
    .app-shell.sidebar-open .app-sidebar{transform:translateX(0)}
    .app-shell.sidebar-open .sidebar-overlay{display:block;position:fixed;inset:0;background:rgba(16,24,40,.4);z-index:35}
    .brand-copy,.workspace-copy,.workspace-arrow,.nav-label,.nav-link span,.nav-link em,.sidebar-help div,.version-chip,.sidebar-collapse{display:initial}
    .sidebar-brand-row{justify-content:space-between}
    .sidebar-brand{justify-content:flex-start}
    .workspace-card{justify-content:flex-start;padding:10px}
    .nav-link{justify-content:flex-start;padding:0 11px}
    .nav-link.active:before{right:-2px}
    .sidebar-footer{justify-content:space-between}
    .mobile-menu-btn{display:inline-grid}
    .app-topbar{grid-template-columns:minmax(150px,1fr) auto;height:64px;padding:0 14px}
    .topbar-center{display:none}
    .app-content{padding:16px}
    .profile-copy,.connection-pill{display:none}
    .grid-3,.grid-4,.grid-5{grid-template-columns:repeat(2,minmax(0,1fr))}
    .inbox-shell{height:calc(100vh - 96px);grid-template-columns:270px minmax(350px,1fr)}
    .settings-layout{grid-template-columns:1fr}
    .settings-nav{position:static;display:flex;overflow:auto;gap:4px}
    .settings-nav .settings-group{display:none}
    .settings-nav button,.settings-nav a{width:auto;white-space:nowrap}
    .plans,.plans-admin{grid-template-columns:1fr}
    .filter-bar{grid-template-columns:1fr 1fr}
    .auth-page{grid-template-columns:1fr}
    .auth-aside{display:none}
    .auth-main{min-height:100vh}
}
@media(max-width:620px){
    .app-content{padding:12px}
    .page-header,.page-head{display:grid}
    .page-header-actions,.page-head>div:last-child{justify-content:flex-start}
    .grid-2,.grid-3,.grid-4,.grid-5,.form-grid,.form-grid-3,.metric-row,.admin-stats,.integration-grid{grid-template-columns:1fr}
    .welcome-card-content{display:grid}
    .quick-actions{grid-template-columns:1fr}
    .inbox-shell{display:block;height:auto;min-height:0}
    .inbox-list-column{height:280px;border-left:0;border-bottom:1px solid var(--line)}
    .chat-column{height:calc(100vh - 390px);min-height:480px}
    .message-row{max-width:90%}
    .messages{padding:16px}
    .chat-actions .btn span{display:none}
    .table-toolbar{display:grid}
    .table-toolbar-start,.table-toolbar-end{flex-wrap:wrap}
    .table-search{min-width:100%;width:100%}
    .filter-bar{grid-template-columns:1fr}
    .toast{left:12px;right:12px;bottom:12px;min-width:0}
    .support-mode-bar{height:auto;padding:8px;flex-wrap:wrap;text-align:center}
    .form-actions{justify-content:stretch}
    .form-actions .btn{flex:1}
    .topbar-page small{display:none}
    .notification-btn{display:none}
    .profile-trigger>.ui-icon{display:none}
    .auth-main{padding:16px}
    .auth-card{padding:21px}
    .hero-inner{grid-template-columns:1fr;padding-top:40px}
    .hero h1{font-size:34px}
}
.price{font-size:31px;font-weight:800;letter-spacing:-.7px;margin:12px 0}
.full{grid-column:1/-1}
.row-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.divider{border:0;border-top:1px solid var(--line);margin:18px 0}
.health-list{display:grid}.health-list>div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line-soft)}.health-list>div:last-child{border-bottom:0}
.sidebar-manual-collapsed .app-shell{grid-template-columns:var(--sidebar-collapsed) minmax(0,1fr)}
.sidebar-manual-collapsed .app-sidebar{width:var(--sidebar-collapsed);padding:14px 9px}
.sidebar-manual-collapsed .brand-copy,.sidebar-manual-collapsed .workspace-copy,.sidebar-manual-collapsed .workspace-arrow,.sidebar-manual-collapsed .nav-label,.sidebar-manual-collapsed .nav-link span,.sidebar-manual-collapsed .nav-link em,.sidebar-manual-collapsed .sidebar-help div,.sidebar-manual-collapsed .version-chip{display:none}
.sidebar-manual-collapsed .sidebar-brand-row,.sidebar-manual-collapsed .sidebar-brand,.sidebar-manual-collapsed .workspace-card,.sidebar-manual-collapsed .nav-link,.sidebar-manual-collapsed .sidebar-footer{justify-content:center}
.sidebar-manual-collapsed .nav-link{padding:0}

/* v1.3 Integration Suite */
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.inline-fields{display:grid;grid-template-columns:.9fr 1fr 1.2fr;gap:8px}.code-area{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;min-height:110px;direction:auto}.code-area.tall{min-height:180px}.code-area.extra-tall{min-height:340px}.sticky-actions{position:sticky;bottom:12px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);padding:12px;border:1px solid var(--line);border-radius:12px;z-index:5}.automation-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.automation-card{display:flex;flex-direction:column;gap:12px}.automation-card-top,.campaign-head,.payment-provider-head,.crm-profile-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.automation-trigger{display:inline-flex;align-items:center;gap:7px;color:var(--brand-strong);font-size:11px;font-weight:800}.automation-card h3,.campaign-card h3,.channel-provider h3,.payment-provider h3{margin:0;font-size:15px}.automation-card p,.campaign-card p,.channel-provider p,.payment-provider p{margin:0;color:var(--muted);font-size:10px}.automation-flow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.automation-flow span{background:#f2f4f7;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:10px;font-weight:700}.automation-flow i{font-style:normal;color:var(--brand)}.card-footer-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;border-top:1px solid var(--line-soft);padding-top:12px}.channel-catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.channel-provider{display:flex;gap:14px;align-items:flex-start}.channel-logo{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;flex:0 0 auto}.channel-logo.whatsapp{background:#e8faf3;color:#079455}.channel-logo.instagram{background:#fff0f6;color:#c11574}.channel-logo.livechat{background:#eef4ff;color:#3538cd}.channel-logo .ui-icon{width:25px;height:25px}.campaign-list{display:grid;gap:15px}.campaign-card{display:grid;gap:15px}.campaign-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.campaign-metrics div{background:#f8fafb;border:1px solid var(--line-soft);border-radius:9px;padding:11px;text-align:center}.campaign-metrics strong{display:block;font-size:17px}.campaign-metrics span{font-size:9px;color:var(--muted)}.payment-provider{display:flex;flex-direction:column}.payment-mark{width:42px;height:42px;border-radius:10px;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:800}.filter-bar{display:flex;align-items:end;gap:12px}.filter-bar .field{max-width:220px}.bar-report{display:grid;gap:9px}.bar-report-row{display:grid;grid-template-columns:85px 1fr 40px;align-items:center;gap:9px;font-size:9px}.bar-track{height:8px;background:#eef1f4;border-radius:999px;overflow:hidden}.bar-track i{display:block;height:100%;background:var(--brand);border-radius:999px}.rank-list{display:grid;gap:10px}.rank-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;padding:9px;border-bottom:1px solid var(--line-soft)}.rank-item div{display:grid}.rank-item small{color:var(--muted);font-size:9px}.crm-layout{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:15px;align-items:start}.crm-profile{position:sticky;top:88px;display:grid;gap:16px}.profile-avatar.large{width:48px;height:48px;font-size:18px}.crm-profile-head>div{flex:1}.crm-profile-head h2{margin:2px 0;font-size:15px}.crm-profile-head p{margin:0;color:var(--muted);font-size:10px}.crm-section{border-top:1px solid var(--line);padding-top:14px;display:grid;gap:10px}.crm-section h3{margin:0;font-size:12px}.checkbox-list.compact{max-height:160px;overflow:auto}.label-cloud,.mini-labels{display:flex;gap:6px;flex-wrap:wrap}.label-chip,.mini-labels span{border:1px solid color-mix(in srgb,var(--label-color) 35%, white);background:color-mix(in srgb,var(--label-color) 10%, white);color:var(--label-color);border-radius:999px;padding:5px 8px;font-size:9px;font-weight:700;display:inline-flex;align-items:center;gap:5px}.label-chip form{display:inline}.label-chip button{border:0;background:transparent;color:inherit;cursor:pointer}.timeline{display:grid;gap:8px}.timeline-item{border-right:2px solid var(--brand);padding:7px 10px;background:#f9fbfb;border-radius:7px;display:grid;gap:3px}.timeline-item strong{font-size:10px}.timeline-item small{font-size:8px;color:var(--muted)}.mini-labels span{padding:3px 6px}.table-avatar-cell{text-decoration:none;color:inherit}.integration-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
@media(max-width:1100px){.grid-4,.campaign-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.automation-board,.channel-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.crm-layout{grid-template-columns:1fr}.crm-profile{position:static}}
@media(max-width:720px){.grid-4,.automation-board,.channel-catalog,.campaign-metrics,.integration-grid{grid-template-columns:1fr}.inline-fields{grid-template-columns:1fr}.filter-bar{align-items:stretch;flex-direction:column}.filter-bar .field{max-width:none}.campaign-head,.payment-provider-head,.crm-profile-head{flex-wrap:wrap}}

/* Vona Chat 1.3 payment integrations */
.payment-grid{align-items:start}.payment-provider{height:100%;display:flex;flex-direction:column;gap:14px}.payment-provider form{flex:1}.provider-endpoints{margin-top:12px;padding:12px;border:1px dashed var(--border,#dfe5e2);border-radius:12px;background:var(--surface-soft,#f7faf8)}.provider-endpoints label{display:block;font-size:12px;font-weight:700;margin-bottom:7px}.provider-endpoints small{display:block;margin-top:7px;color:var(--muted,#69756f)}.code-sample{margin:0;padding:18px;border-radius:14px;background:#101815;color:#dcfce7;overflow:auto;font-size:13px;line-height:1.75;direction:ltr;text-align:left}.payment-provider .code-box input{min-width:0}.payment-provider .payment-provider-head{align-items:flex-start}

/* v1.5 Meta Embedded Signup Wizard */
.wa-onboarding-shell{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;align-items:start}.wa-wizard-card{padding:0;overflow:hidden}.wa-stepper{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:18px 22px;border-bottom:1px solid var(--line);background:#fbfcfc}.wa-step{display:flex;align-items:center;gap:9px;position:relative;color:var(--muted)}.wa-step:not(:last-child):after{content:"";position:absolute;left:-8px;right:calc(100% - 38px);top:17px;height:2px;background:#e7ebe9}.wa-step>span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);background:white;font-size:11px;font-weight:800;z-index:1}.wa-step>div{display:grid;gap:2px}.wa-step strong{font-size:11px;color:#344054}.wa-step small{font-size:8px}.wa-step.active>span{background:var(--brand);color:white;border-color:var(--brand);box-shadow:0 0 0 5px rgba(13,148,91,.1)}.wa-step.active strong,.wa-step.done strong{color:var(--brand-strong)}.wa-step.done>span{background:#e8faf3;color:#079455;border-color:#a9e7cd}.wa-step.done:not(:last-child):after{background:#79d5ae}.wa-wizard-body{padding:24px}.wa-panel{display:none;animation:waFade .18s ease}.wa-panel.active{display:block}@keyframes waFade{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}.wa-panel-head{display:flex;gap:13px;align-items:flex-start;margin-bottom:22px}.wa-panel-head h2{margin:0 0 5px;font-size:21px}.wa-panel-head p{margin:0;color:var(--muted);font-size:11px;line-height:1.8}.wa-panel-icon{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:#e9faf3;color:#079455;flex:0 0 auto}.wa-panel-icon.meta{background:#eaf2ff;color:#1877f2}.wa-mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.wa-mode-card{border:1px solid var(--line);background:#fff;border-radius:15px;padding:18px;text-align:right;display:grid;gap:9px;position:relative;cursor:pointer;font:inherit;color:inherit;transition:.18s ease}.wa-mode-card:hover{border-color:#9bd9bd;box-shadow:0 8px 25px rgba(16,24,40,.06);transform:translateY(-1px)}.wa-mode-card.selected{border:2px solid var(--brand);background:#fbfffd;padding:17px}.wa-mode-card.disabled{opacity:.52;cursor:not-allowed;transform:none}.wa-mode-check{position:absolute;left:13px;top:13px;width:23px;height:23px;border-radius:50%;display:none;place-items:center;background:var(--brand);color:#fff}.wa-mode-card.selected .wa-mode-check{display:grid}.wa-mode-icon{width:43px;height:43px;border-radius:12px;display:grid;place-items:center}.wa-mode-icon.green{background:#e8faf3;color:#079455}.wa-mode-icon.blue{background:#eaf2ff;color:#1877f2}.wa-mode-card strong{font-size:14px}.wa-mode-card small{font-size:10px;color:var(--muted);line-height:1.7}.wa-mode-card em{font-style:normal;font-size:9px;color:var(--brand-strong);font-weight:700}.wa-info-strip{display:flex;gap:11px;align-items:center;margin-top:16px;padding:13px;border:1px solid #ccebdd;background:#f2fcf7;border-radius:12px;color:#146c4b}.wa-info-strip div{display:grid;gap:2px}.wa-info-strip strong{font-size:11px}.wa-info-strip small{font-size:9px;color:#4f7566}.wa-actions{display:flex;justify-content:space-between;align-items:center;margin-top:23px;padding-top:18px;border-top:1px solid var(--line-soft)}.wa-meta-preview{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;border:1px solid #d8e4fa;background:#f7faff;padding:14px;border-radius:13px}.wa-meta-logo{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#1877f2;color:#fff;font:bold 25px Arial}.wa-meta-preview>div:nth-child(2){display:grid;gap:3px}.wa-meta-preview strong{font-size:12px}.wa-meta-preview small{font-size:9px;color:var(--muted)}.wa-meta-steps{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.wa-meta-steps li{display:flex;gap:9px;border:1px solid var(--line-soft);background:#fbfcfc;border-radius:11px;padding:12px}.wa-meta-steps li>span{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#edf7f2;color:var(--brand);font-size:9px;font-weight:800;flex:0 0 auto}.wa-meta-steps li div{display:grid;gap:3px}.wa-meta-steps strong{font-size:10px}.wa-meta-steps small{font-size:8px;color:var(--muted);line-height:1.6}.btn-facebook{background:#1877f2;color:white;border:1px solid #1877f2}.btn-facebook:hover{background:#1269d3}.wa-error-box{margin-top:15px;border:1px solid #fecdca;background:#fff5f4;border-radius:11px;padding:13px;color:#b42318}.wa-error-box strong{font-size:11px}.wa-error-box p{font-size:9px;line-height:1.7;margin:5px 0 9px}.wa-side-column{display:grid;gap:15px}.wa-checklist-card,.wa-existing-card,.wa-help-card{padding:17px}.wa-readiness-list{display:grid;gap:4px}.wa-readiness-list>div{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line-soft)}.wa-readiness-list>div:last-child{border-bottom:0}.wa-readiness-list>div>span{width:25px;height:25px;border-radius:50%;display:grid;place-items:center}.wa-readiness-list .done>span{background:#e8faf3;color:#079455}.wa-readiness-list .missing>span{background:#fff1f0;color:#d92d20}.wa-readiness-list>div>div{display:grid;gap:2px}.wa-readiness-list strong{font-size:10px}.wa-readiness-list small{font-size:8px;color:var(--muted)}.wa-existing-list{display:grid;gap:9px}.wa-existing-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;padding:10px;border:1px solid var(--line-soft);border-radius:10px}.wa-existing-item>div{display:grid;gap:2px;min-width:0}.wa-existing-item strong{font-size:10px}.wa-existing-item small{font-size:8px;color:var(--muted);overflow:hidden;text-overflow:ellipsis}.wa-help-card{display:flex;gap:11px;background:#fffcf5;border-color:#f9e4b7}.wa-help-card>svg{color:#b7791f;flex:0 0 auto}.wa-help-card strong{font-size:10px}.wa-help-card p{margin:4px 0 0;color:#7a5b20;font-size:8px;line-height:1.7}.wa-success-state{text-align:center;display:grid;justify-items:center;padding:18px 0}.wa-success-icon{width:78px;height:78px;border-radius:50%;display:grid;place-items:center;background:#e8faf3;color:#079455;box-shadow:0 0 0 12px #f4fcf8}.wa-success-state h2{margin:25px 0 7px;font-size:23px}.wa-success-state>p{margin:0;color:var(--muted);font-size:11px;max-width:570px;line-height:1.8}.wa-connected-summary{width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:22px}.wa-connected-summary>div{border:1px solid var(--line-soft);background:#fbfcfc;border-radius:11px;padding:13px;display:grid;gap:5px}.wa-connected-summary span{font-size:8px;color:var(--muted)}.wa-connected-summary strong{font-size:11px}.wa-success-warning{width:100%;margin-top:13px;border:1px solid #fedf89;background:#fffaeb;color:#93370d;border-radius:10px;padding:11px;font-size:9px}.wa-success-actions{display:flex;gap:10px;margin-top:20px}.wa-connecting-overlay{position:fixed;inset:0;background:rgba(15,23,42,.55);backdrop-filter:blur(5px);z-index:1000;display:grid;place-items:center;padding:20px}.wa-connecting-overlay[hidden]{display:none}.wa-connecting-box{width:min(430px,100%);background:#fff;border-radius:18px;padding:28px;text-align:center;box-shadow:0 25px 70px rgba(15,23,42,.25)}.wa-spinner{width:46px;height:46px;border-radius:50%;border:4px solid #dff3e9;border-top-color:var(--brand);display:inline-block;animation:waSpin .8s linear infinite}@keyframes waSpin{to{transform:rotate(360deg)}}.wa-connecting-box h3{margin:15px 0 6px}.wa-connecting-box p{margin:0;color:var(--muted);font-size:10px}.wa-connecting-box small{font-size:8px;color:var(--muted)}.wa-progress-line{height:7px;background:#edf1ef;border-radius:999px;overflow:hidden;margin:18px 0 10px}.wa-progress-line i{display:block;width:45%;height:100%;background:var(--brand);border-radius:999px;animation:waProgress 1.6s ease-in-out infinite}@keyframes waProgress{0%{transform:translateX(120%)}100%{transform:translateX(-240%)}}.onboarding-platform-warning{margin-bottom:16px}
@media(max-width:1050px){.wa-onboarding-shell{grid-template-columns:1fr}.wa-side-column{grid-template-columns:repeat(2,minmax(0,1fr))}.wa-help-card{grid-column:1/-1}}
@media(max-width:720px){.wa-stepper{grid-template-columns:repeat(4,1fr);padding:13px 9px}.wa-step{display:grid;justify-items:center;text-align:center}.wa-step>div small{display:none}.wa-step strong{font-size:8px}.wa-step:not(:last-child):after{top:17px;right:55%;left:-55%}.wa-wizard-body{padding:16px}.wa-mode-grid,.wa-meta-steps,.wa-connected-summary,.wa-side-column{grid-template-columns:1fr}.wa-success-actions{display:grid;width:100%}.wa-actions{gap:8px}.wa-actions .btn{flex:1}.wa-meta-preview{grid-template-columns:auto 1fr}.wa-meta-preview .badge{grid-column:1/-1;justify-self:start}}

/* Vona v1.7 protocol, reports and ads */
.protocol-list{display:flex;flex-direction:column;gap:10px}.protocol-item{border:1px solid var(--border);border-radius:14px;padding:14px;background:var(--surface-soft)}.protocol-main,.protocol-status{display:flex;align-items:center;justify-content:space-between;gap:12px}.protocol-main{justify-content:flex-start}.protocol-main small,.table-sub{display:block;color:var(--muted);font-size:12px;margin-top:3px}.protocol-status{margin-top:10px}.protocol-reason{color:#9a6500;font-size:12px;margin:10px 0 0}.call-console audio{width:100%;margin-top:10px}.call-status{padding:10px 12px;border-radius:10px;margin-top:12px;background:var(--surface-soft);font-size:13px}.call-status.success{background:#eafaf1;color:#16794a}.call-status.warning{background:#fff7df;color:#8b6500}.call-status.danger{background:#fff0f0;color:#b42318}.inline-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.input-sm{min-height:36px;padding:7px 10px}.report-filter{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;align-items:end}.mini-kpi{padding:16px}.mini-kpi small,.mini-kpi span{display:block;color:var(--muted);font-size:12px}.mini-kpi strong{display:block;font-size:25px;margin:7px 0}.schedule-item{align-items:center}.schedule-item .table-actions{margin-inline-start:auto}.compact-steps{gap:12px}.compact-steps li{padding:12px;border:1px solid var(--border);border-radius:12px}.campaign-rate-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}.campaign-rate-grid span{border:1px solid var(--border);border-radius:10px;padding:8px;font-size:12px;color:var(--muted)}.campaign-rate-grid b{display:block;color:var(--text);margin-top:3px}.badge-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}.check-field label{display:flex;align-items:flex-start;gap:8px;line-height:1.6}.channel-mark.whatsapp{background:#e8fbf1;color:#128c62}
@media(max-width:900px){.report-filter{grid-template-columns:1fr 1fr}.campaign-rate-grid{grid-template-columns:1fr 1fr}.protocol-main,.protocol-status{align-items:flex-start}.protocol-status{flex-direction:column}}
@media(max-width:560px){.report-filter{grid-template-columns:1fr}.campaign-rate-grid{grid-template-columns:1fr 1fr}.inline-filters{width:100%}.inline-filters .input{flex:1}}


@media print {
    .sidebar, .topbar, .mobile-topbar, .page-header-actions, .report-filter, .form-actions, .table-actions, .pagination { display: none !important; }
    .app-main, .main-content, .content-wrap { margin: 0 !important; padding: 0 !important; width: 100% !important; }
    body { background: #fff !important; }
    .card { break-inside: avoid; box-shadow: none !important; border: 1px solid #d9dee8 !important; }
    .grid { display: grid !important; }
}