:root {
  --ink: #12203a;
  --muted: #6a7485;
  --line: #e6e9ef;
  --canvas: #fbfcff;
  --surface: #ffffff;
  --green: #4C1D95;
  --green-dark: #210849;
  --green-pale: #f3edff;
  --green-faint: #faf8ff;
  --blue: #7C3AED;
  --blue-pale: #F5F3FF;
  --amber: #C4B5FD;
  --amber-pale: #fff8d8;
  --purple: #7C3AED;
  --purple-pale: #F5F3FF;
  --aurora: #4C1D95;
  --aurora-soft: #F5F3FF;
  --shadow: 0 10px 35px rgba(25, 36, 58, .07);
  --soft-shadow: 0 3px 12px rgba(30, 45, 68, .06);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 320px; background: var(--canvas); }
button, input { font: inherit; }
button { border: 0; cursor: pointer; color: inherit; background: none; }
svg { display: block; width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; }
.sprite { width: 0; height: 0; position: absolute; overflow: hidden; }

.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 278px; flex: 0 0 278px; background: #fff; border-right: 1px solid var(--line); display: flex; flex-direction: column; padding: 29px 15px 17px; position: relative; z-index: 3; }
.brand-lockup { padding: 0 20px 28px; display: flex; align-items: center; gap: 11px; color: var(--green); font-size: 27px; letter-spacing: -.9px; font-weight: 760; }
.brand-lockup > span > span { font-weight: 860; }
.brand-lockup em { font-style: normal; font-size: 17px; letter-spacing: -.5px; font-weight: 650; }
.brand-mark { height: 43px; width: 43px; color: #fff; background: var(--green); display: grid; place-items: center; border-radius: 15px 15px 5px 15px; transform: rotate(-4deg); box-shadow: 0 7px 16px rgba(7, 133, 73, .2); }
.brand-mark svg { width: 27px; height: 27px; transform: rotate(4deg); }

.main-nav { display: flex; flex-direction: column; gap: 10px; min-height: 0; }.nav-section { display: grid; gap: 4px; }.nav-section:not(.nav-section-dashboard) .nav-item { min-height: 42px; }.nav-section-title { margin: 7px 0 3px; padding: 0 19px; color: #98a3b1; font-size: 9px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }.nav-section-subtitle { margin: 9px 0 0; padding: 0 19px; color: #7d8998; font-size: 8px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.nav-section-dashboard + .nav-section { padding-top: 8px; border-top: 1px solid #edf0f2; }
.nav-item { width: 100%; min-height: 48px; display: flex; align-items: center; gap: 15px; padding: 0 19px; border-radius: 10px; color: #28334a; font-size: 15.5px; font-weight: 550; text-align: left; position: relative; transition: .18s ease; }
.nav-item svg { width: 21px; height: 21px; color: #435067; }
.nav-item:hover { background: #f6faf8; color: var(--green); }
.nav-item:hover svg { color: var(--green); }
.nav-item.is-active { background: linear-gradient(90deg, #e9f8ef, #f2fbf6); color: #087943; font-weight: 700; }
.nav-item.is-active svg { color: #07864a; stroke-width: 2.2; }
.nav-item b { margin-left: auto; min-width: 22px; padding: 3px 6px; border-radius: 8px; color: #087743; background: #dff4e8; font-size: 10px; text-align: center; }
.nav-item i { margin-left: auto; font-size: 9px; color: #4d3aab; background: #eeeaff; padding: 4px 6px; border-radius: 5px; font-style: normal; font-weight: 750; }
.sidebar-footer { margin-top: auto; border-top: 1px solid var(--line); padding: 16px 5px 0; }
.help-card { display: flex; align-items: center; gap: 10px; padding: 11px 10px; margin-bottom: 11px; border-radius: 11px; color: #354156; }
.help-card:hover { background: #f7faf8; }
.help-icon { background: #ebf8f0; color: var(--green); height: 32px; width: 32px; border-radius: 9px; display: grid; place-items: center; }
.help-icon svg { width: 18px; height: 18px; }
.help-card div:nth-child(2) { display: grid; gap: 2px; flex: 1; font-size: 12px; }
.help-card strong { color: var(--ink); }
.help-card span { color: var(--muted); font-size: 10.5px; }
.help-card > svg { width: 16px; height: 16px; color: #8490a0; }
.account-card { width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 9px; border-radius: 12px; text-align: left; }
.account-card:hover { background: #f6faf8; }
.account-card > div:nth-child(2) { flex: 1; display: grid; gap: 2px; font-size: 12px; }
.account-card strong { font-size: 13px; }
.account-card span { color: var(--green); font-size: 11px; font-weight: 700; }
.account-card > svg { height: 16px; width: 16px; color: #6c7687; }

.workspace { min-width: 0; flex: 1; }
.topbar { height: 93px; padding: 0 44px 0 39px; display: flex; align-items: center; justify-content: space-between; background: rgba(255,255,255,.82); border-bottom: 1px solid var(--line); backdrop-filter: blur(12px); position: sticky; top: 0; z-index: 2; }
.brand-switcher-wrap { position: relative; }
.brand-switcher { min-width: min(378px, calc(100vw - 32px)); max-width: 100%; height: 50px; padding: 0 13px; border: 1px solid #e0e5e8; box-shadow: 0 1px 2px rgba(14,30,53,.02); border-radius: 10px; display: flex; align-items: center; gap: 11px; background: #fff; text-align: left; }
.brand-switcher:hover { border-color: #9bd6b4; }
.brand-switcher-copy { display: grid; min-width: 0; flex: 1; gap: 2px; }
.brand-switcher strong, .brand-switcher small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brand-switcher strong { font-size: 14px; }
.brand-switcher small { color: #718094; font-size: 11px; }
.brand-switcher > svg { width: 17px; color: #627084; }
.workspace-icon { height: 28px; width: 28px; position: relative; border: 1.8px solid #33425a; border-radius: 3px; display: flex; align-items: end; justify-content: center; gap: 2px; padding-bottom: 4px; }
.workspace-icon:before { content:""; width: 11px; height: 11px; border-top: 1.7px solid #33425a; border-left: 1.7px solid #33425a; position: absolute; transform: rotate(45deg); top: -6px; left: 7px; background: #fff; }
.workspace-icon span { position: relative; width: 3px; height: 8px; background: #33425a; border-radius: 1px; }
.workspace-icon span:nth-child(2) { height: 13px; }.workspace-icon span:nth-child(3) { height: 6px; }
.brand-menu { position: absolute; top: 57px; left: 0; width: 320px; padding: 9px; background: #fff; border: 1px solid var(--line); box-shadow: 0 16px 38px rgba(30, 45, 68, .14); border-radius: 13px; z-index: 10; }
.brand-menu p { margin: 6px 9px 5px; font-size: 11px; color: #8490a0; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.brand-option { width: 100%; display: flex; align-items: center; gap: 10px; padding: 9px; text-align: left; border-radius: 9px; }
.brand-option:hover, .brand-option.is-selected { background: #f1faf5; }
.brand-option > span:nth-child(2) { flex: 1; display: grid; gap: 2px; }
.brand-option strong { font-size: 13px; }.brand-option small { font-size: 11px; color: var(--muted); }.brand-option > svg { width: 17px; color: var(--green); }
.option-logo { height: 31px; width: 31px; border-radius: 9px; display: grid; place-items: center; font-size: 10px; font-weight: 800; }.sd { color: #fff; background: var(--green); }.ou { color: #fff; background: #3178c5; }.ny { color: #4b2b94; background: #e9dcff; }
.new-brand { margin: 4px 2px 1px; padding: 10px 8px; color: var(--green); display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; }.new-brand svg { width: 16px; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.icon-button { height: 40px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 10px; color: #344055; position: relative; }
.icon-button:hover { background: #f7faf8; border-color: #ebefed; }.search-button { gap: 7px; padding: 0 8px 0 11px; color: #7a8696; font-size: 12px; }.search-button svg { width: 19px; }.search-button kbd { border: 1px solid #e2e6ea; background: #fff; border-radius: 4px; padding: 1px 4px; font: 10px inherit; color: #9da6b2; }.notification-button { width: 41px; }.notification-button b { position: absolute; top: 8px; right: 9px; background: var(--green); border: 2px solid #fff; height: 8px; width: 8px; border-radius: 50%; }.top-avatar { height: 42px; width: 42px; border: 0; font-size: 12px; }
.avatar { border-radius: 50%; display: inline-grid; place-items: center; flex: 0 0 auto; color: #fff; font-weight: 750; letter-spacing: -.2px; }.avatar-owner { height: 39px; width: 39px; font-size: 12px; background: linear-gradient(135deg, #09905a, #086c54); }
.mobile-menu { display: none; }

/* Mobile app shell: this is limited to the authenticated /app route. Browser
   chrome is owned by the browser; standalone presentation comes from the web
   app manifest while this navigation preserves a useful in-app hierarchy. */
.app-mobile-bottom-nav { display: none; }
body[data-production-page="app"] .app-shell { min-height: 100dvh; }

/* Keep the desktop workspace inside the viewport: only its navigation and
   content panes scroll, while the sidebar chrome remains anchored. */
@media (min-width: 721px) {
  body[data-production-page="app"] .app-shell { height: 100dvh; min-height: 100dvh; overflow: hidden; }
  body[data-production-page="app"] .sidebar { height: 100%; min-height: 0; overflow: hidden; }
  body[data-production-page="app"] .brand-lockup,
  body[data-production-page="app"] .sidebar-footer { flex: 0 0 auto; }
  body[data-production-page="app"] .main-nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(196,181,253,.35) transparent; }
  body[data-production-page="app"] .workspace { display: flex; height: 100%; min-height: 0; flex-direction: column; overflow: hidden; }
  body[data-production-page="app"] .topbar { flex: 0 0 auto; }
  body[data-production-page="app"] .content { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
}

.content { max-width: 1530px; margin: 0 auto; padding: 33px 39px 42px; }
.page-heading { display: flex; justify-content: space-between; align-items: end; gap: 25px; margin-bottom: 22px; }.eyebrow { margin: 0 0 5px; color: #8792a2; font-size: 11px; font-weight: 650; letter-spacing: .02em; }.page-heading h1 { margin: 0; font-size: clamp(26px,2.4vw,34px); line-height: 1.12; letter-spacing: -1.3px; }.page-heading h1 span { color: var(--green); }.page-heading > div > p:last-child { margin: 7px 0 0; color: var(--muted); font-size: 13.5px; }.heading-actions { display: flex; gap: 10px; }.button { min-height: 39px; border-radius: 9px; padding: 0 14px; display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; transition: .18s ease; }.button svg { width: 16px; }.button-primary { background: var(--green); color: #fff; box-shadow: 0 6px 12px rgba(5, 126, 69, .17); }.button-primary:hover { background: var(--green-dark); transform: translateY(-1px); }.button-secondary { color: #445064; border: 1px solid #dde3e5; background: #fff; }.button-secondary:hover { color: var(--green); border-color: #aadabf; }
.quick-strip { min-height: 45px; padding: 0 13px 0 15px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border: 1px solid #cdebd9; border-radius: 10px; background: linear-gradient(100deg, #f0fcf5, #f8fdf9); margin-bottom: 19px; }.health-copy { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: #637083; }.health-copy strong { color: #177144; }.pulse { height: 8px; width: 8px; border-radius: 50%; background: #0b9955; box-shadow: 0 0 0 4px rgba(13,156,85,.13); }.quick-strip button { display: flex; align-items: center; gap: 2px; font-weight: 700; color: #087a42; font-size: 11.5px; white-space: nowrap; }.quick-strip button svg { width: 16px; }

.metric-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; margin-bottom: 20px; }.metric-card { min-height: 178px; overflow: hidden; padding: 20px 21px 17px; border-radius: 13px; background: #fff; border: 1px solid #e7eaed; box-shadow: 0 2px 7px rgba(26,39,57,.025); position: relative; }.metric-icon { height: 38px; width: 38px; border-radius: 12px; display: grid; place-items: center; margin-bottom: 16px; }.metric-icon svg { width: 21px; }.metric-icon.green { color: #048148; background: #e2f6e9; }.metric-icon.blue { color: #1a78cf; background: #e8f3ff; }.metric-icon.amber { color: #c97916; background: #fff2dc; }.metric-icon.purple { color: #7355c6; background: #f0ebff; font-weight: 850; font-size: 13px; }.metric-title { color: #657186; font-size: 12px; font-weight: 600; }.metric-title button { margin-left: 3px; height: 13px; width: 13px; color: #98a1ae; border: 1px solid #b6bec8; border-radius: 50%; font-size: 8px; line-height: 11px; padding: 0; }.metric-value { margin-top: 5px; font-size: 27px; line-height: 1; letter-spacing: -.9px; font-weight: 790; }.metric-value.currency { font-size: 25px; }.metric-change, .metric-note { margin-top: 11px; display: flex; gap: 4px; align-items: center; color: #078148; font-size: 11px; font-weight: 750; }.metric-change svg { width: 14px; height: 14px; }.metric-change span { margin-left: 3px; color: #8993a1; font-weight: 500; }.metric-note { color: #a66217; font-weight: 600; }.orange-dot { width: 6px; height: 6px; border-radius: 50%; background: #ee9a27; }.metric-spark { height: 35px; position: absolute; bottom: 0; right: 0; width: 116px; display: flex; align-items: end; gap: 4px; opacity: .88; }.metric-spark i { display: block; flex: 1; border-radius: 3px 3px 0 0; background: #c5edcf; }.spark-contacts i:nth-child(1){height:21%}.spark-contacts i:nth-child(2){height:35%}.spark-contacts i:nth-child(3){height:29%}.spark-contacts i:nth-child(4){height:50%}.spark-contacts i:nth-child(5){height:43%}.spark-contacts i:nth-child(6){height:70%}.spark-contacts i:nth-child(7){height:92%}.spark-messages i{background:#cbe5ff}.spark-messages i:nth-child(1){height:18%}.spark-messages i:nth-child(2){height:39%}.spark-messages i:nth-child(3){height:31%}.spark-messages i:nth-child(4){height:53%}.spark-messages i:nth-child(5){height:47%}.spark-messages i:nth-child(6){height:67%}.spark-messages i:nth-child(7){height:88%}.spark-inbox i{background:#ffe0a9}.spark-inbox i:nth-child(1){height:58%}.spark-inbox i:nth-child(2){height:31%}.spark-inbox i:nth-child(3){height:65%}.spark-inbox i:nth-child(4){height:50%}.spark-inbox i:nth-child(5){height:76%}.spark-inbox i:nth-child(6){height:55%}.spark-inbox i:nth-child(7){height:85%}.spark-revenue i{background:#dcd0ff}.spark-revenue i:nth-child(1){height:27%}.spark-revenue i:nth-child(2){height:29%}.spark-revenue i:nth-child(3){height:51%}.spark-revenue i:nth-child(4){height:48%}.spark-revenue i:nth-child(5){height:70%}.spark-revenue i:nth-child(6){height:66%}.spark-revenue i:nth-child(7){height:95%}

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.78fr) minmax(315px, .82fr); gap: 20px; }.dashboard-main, .dashboard-side { min-width: 0; display: grid; gap: 20px; align-content: start; }.panel { border: 1px solid #e5e9ed; border-radius: 13px; background: #fff; box-shadow: 0 3px 10px rgba(34,45,70,.025); overflow: hidden; }.panel-heading { min-height: 83px; padding: 18px 19px 14px; display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }.panel-heading h2 { font-size: 15px; letter-spacing: -.3px; margin: 0; }.panel-heading p { margin: 4px 0 0; color: #8a95a5; font-size: 10.5px; }.text-button { margin-top: 0; padding: 8px 9px 8px 10px; display: flex; gap: 1px; align-items: center; border: 1px solid #e2e6e9; color: #495469; background: #fff; border-radius: 7px; font-size: 10.5px; font-weight: 650; }.text-button:hover { color: var(--green); border-color: #b9dfc9; }.text-button svg { height: 14px; width: 14px; }
.campaign-table { width: 100%; }.campaign-row { min-height: 64px; border-top: 1px solid #edf0f2; display: grid; grid-template-columns: minmax(220px,2.1fr) minmax(75px,.75fr) minmax(135px,1.2fr) minmax(138px,1.2fr) minmax(72px,.65fr); align-items: center; gap: 12px; padding: 8px 20px; }.campaign-row.table-head { min-height: 34px; padding-top: 7px; padding-bottom: 4px; color: #8490a0; border-top: 0; font-size: 10px; font-weight: 650; }.campaign-name { display: flex; align-items: center; min-width: 0; gap: 10px; }.campaign-icon { height: 31px; width: 31px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; }.campaign-icon svg { width: 15px; }.campaign-icon.lime { color: #087d46; background: #e2f7e9; }.campaign-icon.sky { color: #1d7bcf; background: #eaf5ff; }.campaign-icon.gray { color: #637083; background: #f0f2f5; }.campaign-name > div { min-width: 0; display: grid; gap: 3px; }.campaign-name strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; letter-spacing: -.08px; }.campaign-name small { color: #8691a1; font-size: 9.5px; }.status { width: max-content; display: inline-flex; align-items: center; gap: 5px; padding: 5px 7px; border-radius: 9px; font-size: 9.5px; font-weight: 700; }.status i { height: 6px; width: 6px; border-radius: 50%; }.status.running { color: #087c44; background: #e9f8ef; }.status.running i { background: #079251; }.status.scheduled { color: #2678c2; background: #e9f4ff; }.status.scheduled i { background: #1684df; }.status.completed { color: #647184; background: #f0f2f4; }.status.completed i { background: #838e9d; }.progress-cell { display: grid; grid-template-columns: max-content minmax(43px,1fr) max-content; align-items: center; gap: 7px; color: #7e8999; font-size: 9.5px; }.progress-cell strong { color: #344056; font-size: 10px; font-weight: 600; }.progress { height: 5px; min-width: 45px; border-radius: 5px; overflow: hidden; background: #e9edf0; }.progress i { display: block; height: 100%; border-radius: inherit; background: #079252; }.progress.response i { background: #0da566; }.progress.blue-progress i { background: #2687df; }.progress.neutral i { background: #8a94a2; }.cost { font-size: 10px; color: #657186; text-align: right; }
.conversations-panel .panel-heading { min-height: 76px; }.conversation-list { border-top: 1px solid #edf0f2; }.conversation-row { width: 100%; min-height: 67px; padding: 9px 19px; display: flex; align-items: center; gap: 12px; text-align: left; border-bottom: 1px solid #edf0f2; transition: .16s ease; }.conversation-row:hover { background: #f7fcf9; }.conversation-row .avatar { height: 37px; width: 37px; font-size: 11px; }.avatar-af { background: linear-gradient(135deg,#1aae69,#097e43); }.avatar-sr { background: linear-gradient(135deg,#6b64d5,#4b3da5); }.avatar-ds { background: linear-gradient(135deg,#e4a437,#b97514); }.conversation-copy { min-width: 0; flex: 1; display: grid; gap: 5px; }.conversation-copy strong { display: flex; align-items: center; gap: 7px; font-size: 11.5px; }.conversation-copy em { color: #9a6514; background: #fff3de; border-radius: 5px; padding: 2px 5px; font-size: 8.5px; letter-spacing: 0; font-style: normal; }.conversation-copy small { overflow: hidden; color: #6f798b; text-overflow: ellipsis; white-space: nowrap; font-size: 10.7px; }.conversation-meta { align-self: stretch; min-width: 47px; display: flex; flex-direction: column; align-items: end; justify-content: space-around; color: #697487; font-size: 10px; }.conversation-meta i { height: 7px; width: 7px; background: #0b9552; border-radius: 50%; }.panel-footer-action { width: 100%; min-height: 45px; display: flex; align-items: center; justify-content: center; gap: 2px; color: var(--green); font-size: 10.5px; font-weight: 750; }.panel-footer-action:hover { background: #f5fcf8; }.panel-footer-action svg { height: 15px; width: 15px; }

.copilot-card { padding: 16px; background: radial-gradient(circle at 85% 4%, #e7f9ef 0, transparent 32%), linear-gradient(145deg,#fff 0,#f5fdf8 100%); border: 1px solid #dceee3; border-radius: 13px; box-shadow: 0 4px 14px rgba(35,75,55,.04); }.copilot-head { display: flex; align-items: flex-start; justify-content: space-between; }.copilot-head > div { display: flex; align-items: center; gap: 9px; }.copilot-logo { height: 31px; width: 31px; border-radius: 9px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg,#0c9a57,#04753f); }.copilot-logo svg { width: 18px; }.copilot-head h2 { margin: 0; font-size: 14px; }.copilot-head p { margin: 1px 0 0; color: #5f9276; font-size: 10px; font-weight: 650; }.copilot-head > button { height: 29px; width: 29px; display: grid; place-items: center; color: #607080; border: 1px solid #e1e8e4; background: rgba(255,255,255,.8); border-radius: 7px; }.copilot-head > button svg { height: 15px; width: 15px; }.copilot-intro { padding: 22px 10px 16px; text-align: center; }.copilot-orb { height: 53px; width: 53px; margin: 0 auto 12px; background: rgba(255,255,255,.9); color: #07874b; border: 1px solid #dcebe2; border-radius: 50%; display: grid; place-items: center; box-shadow: 0 5px 15px rgba(22,104,65,.08); }.copilot-orb svg { width: 27px; height: 27px; }.copilot-intro h3 { margin: 0; font-size: 14px; letter-spacing: -.25px; }.copilot-intro p { margin: 7px auto 0; color: #728083; max-width: 240px; line-height: 1.55; font-size: 11px; }.copilot-actions { display: grid; gap: 8px; }.copilot-actions button { min-height: 56px; padding: 8px 10px; display: flex; align-items: center; gap: 9px; border: 1px solid #e2ebe5; border-radius: 9px; background: rgba(255,255,255,.86); text-align: left; transition: .18s ease; }.copilot-actions button:hover { border-color: #98d2b2; background: #fff; transform: translateY(-1px); box-shadow: 0 5px 12px rgba(27,95,59,.06); }.copilot-actions button > span { height: 29px; width: 29px; display: grid; place-items: center; border-radius: 8px; color: #058447; background: #e9f8ef; }.copilot-actions button > span svg { width: 17px; }.copilot-actions button > div { flex: 1; display: grid; gap: 3px; }.copilot-actions strong { font-size: 11px; }.copilot-actions small { color: #7a8790; font-size: 9.5px; }.copilot-actions button > svg { height: 15px; width: 15px; color: #718079; }.copilot-response { margin-top: 9px; padding: 10px; display: flex; gap: 8px; border: 1px solid #cfeadb; background: #effaf3; border-radius: 9px; color: #246243; }.copilot-response > span { color: #068449; }.copilot-response > span svg { width: 17px; }.copilot-response p { flex: 1; margin: 0; line-height: 1.45; font-size: 10px; }.copilot-response button { align-self: start; color: #6e8275; }.copilot-response button svg { height: 13px; width: 13px; }.copilot-insight { margin-top: 13px; padding: 12px 10px; min-height: 70px; display: flex; align-items: center; gap: 9px; background: linear-gradient(110deg, #eaf8ef, #f4fcf7); border: 1px solid #cfeadb; border-radius: 9px; }.insight-icon { height: 34px; width: 34px; display: grid; place-items: center; color: #078649; border-radius: 8px; background: #fff; }.insight-icon svg { height: 21px; width: 21px; }.copilot-insight > div:nth-child(2) { flex: 1; }.copilot-insight strong { font-size: 12px; }.copilot-insight p { margin: 3px 0 0; color: #5d6d68; font-size: 9.5px; }.trend { align-self: flex-start; color: #078449; padding: 4px 6px; border-radius: 5px; background: #d8f3e3; font-size: 9.5px; font-weight: 750; white-space: nowrap; }.ai-disclaimer { margin: 9px 0 1px; text-align: center; color: #89958f; font-size: 9px; }
.channel-panel .panel-heading { min-height: 67px; }.panel-heading.compact { padding-bottom: 9px; }.panel-heading.compact > button { color: #7a8698; }.panel-heading.compact > button svg { height: 17px; width: 17px; }.channel-row { min-height: 58px; border-top: 1px solid #edf0ef; padding: 8px 14px 8px 17px; display: flex; align-items: center; gap: 9px; }.channel-symbol { height: 28px; width: 28px; display: grid; place-items: center; border-radius: 8px; font-size: 19px; font-weight: 750; }.channel-symbol.wa { color: #06884a; background: #e4f7eb; }.channel-symbol.device { color: #5c6c7d; background: #f1f3f5; }.channel-row > div { flex: 1; display: grid; gap: 3px; }.channel-row strong { font-size: 10.5px; }.channel-row small { color: #8590a0; font-size: 9.5px; }.channel-status { padding: 4px 5px; border-radius: 5px; font-size: 8.5px; font-weight: 750; }.channel-status.success { color: #087d43; background: #dff4e7; }.channel-status.muted { color: #677486; background: #edf0f2; }

.toast { position: fixed; z-index: 30; left: 50%; bottom: 22px; transform: translate(-50%, 25px); opacity: 0; pointer-events: none; min-width: 250px; max-width: calc(100vw - 30px); padding: 11px 13px; display: flex; align-items: center; gap: 9px; background: #17302a; color: #fff; box-shadow: 0 15px 30px rgba(10,30,22,.21); border-radius: 10px; transition: .2s ease; }.toast.is-visible { opacity: 1; transform: translate(-50%,0); }.toast span { height: 22px; width: 22px; display: grid; place-items: center; border-radius: 50%; color: #105f38; background: #9ce1bb; }.toast span svg { height: 14px; width: 14px; }.toast p { margin: 0; font-size: 11.5px; }.notification-popover { position: fixed; z-index: 20; right: 78px; top: 69px; width: 317px; overflow: hidden; padding: 5px; border: 1px solid var(--line); background: #fff; box-shadow: 0 16px 38px rgba(30,45,68,.16); border-radius: 12px; }.notification-popover > div { padding: 10px 9px; display: flex; align-items: center; justify-content: space-between; }.notification-popover > div strong { font-size: 13px; }.notification-popover > div button { color: var(--green); font-size: 9.5px; font-weight: 700; }.notification-popover > button { width: 100%; padding: 9px; display: flex; text-align: left; gap: 9px; border-radius: 8px; }.notification-popover > button:hover { background: #f5fbf7; }.notification-popover p { margin: 0; display: grid; gap: 3px; }.notification-popover strong { font-size: 10.5px; }.notification-popover small { color: #758093; font-size: 9.5px; line-height: 1.4; }.notification-dot { width: 8px; height: 8px; margin-top: 4px; flex: 0 0 auto; border-radius: 50%; }.notification-dot.warning { background: #e79a23; }.notification-dot.green-dot { background: #079150; }.modal-backdrop { position: fixed; z-index: 40; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(16,30,44,.35); backdrop-filter: blur(3px); }.modal { width: min(430px,100%); padding: 24px; position: relative; border-radius: 16px; background: #fff; box-shadow: 0 20px 45px rgba(12,26,42,.2); }.modal-close { height: 30px; width: 30px; display: grid; place-items: center; border-radius: 8px; color: #697687; position: absolute; top: 15px; right: 15px; }.modal-close:hover { background: #f1f4f5; }.modal-close svg { height: 16px; width: 16px; }.modal-icon { height: 43px; width: 43px; display: grid; place-items: center; border-radius: 12px; color: #087e45; background: #e5f7eb; }.modal-icon svg { height: 23px; width: 23px; }.modal h2 { margin: 3px 0 8px; font-size: 22px; letter-spacing: -.6px; }.modal > p:not(.eyebrow) { margin: 0 0 17px; color: #697589; line-height: 1.55; font-size: 12px; }.modal label { display: grid; gap: 6px; color: #536074; font-size: 11px; font-weight: 700; }.modal input { height: 40px; padding: 0 10px; color: var(--ink); border: 1px solid #dce2e5; border-radius: 8px; outline: none; }.modal input:focus { border-color: #58b882; box-shadow: 0 0 0 3px rgba(23,156,83,.12); }.modal-actions { display: flex; justify-content: end; gap: 9px; margin-top: 19px; }

@media (max-width: 1240px) { .sidebar { width: 235px; flex-basis: 235px; }.brand-lockup { padding-left: 14px; font-size: 24px; }.nav-item { padding: 0 15px; }.content { padding: 27px 27px 37px; }.topbar { padding: 0 30px; }.brand-switcher { min-width: 340px; }.metric-grid { gap: 12px; }.metric-card { padding: 17px; }.campaign-row { padding: 8px 14px; grid-template-columns: minmax(185px,2fr) minmax(64px,.75fr) minmax(108px,1.1fr) minmax(108px,1.1fr) 56px; gap: 8px; }.cost { font-size: 9px; }.dashboard-grid { grid-template-columns: minmax(0,1.58fr) minmax(290px,.82fr); gap: 15px; } }
@media (max-width: 1010px) { .sidebar { width: 72px; flex-basis: 72px; padding: 22px 9px 12px; }.brand-lockup { padding: 0 6px 24px; }.brand-lockup > span, .nav-item span, .nav-item b, .nav-item i, .nav-section-title, .help-card, .account-card > div:nth-child(2), .account-card > svg { display: none; }.main-nav { gap: 4px; }.nav-section { gap: 3px; }.nav-section-dashboard + .nav-section { padding-top: 0; border-top: 0; }.brand-mark { height: 38px; width: 38px; }.nav-item { height: 46px; padding: 0; justify-content: center; }.sidebar-footer { padding: 10px 0 0; }.account-card { padding: 4px; justify-content: center; }.dashboard-grid { grid-template-columns: 1fr; }.dashboard-side { grid-template-columns: 1fr 1fr; }.copilot-card { grid-row: 1; }.content { padding: 25px 25px 35px; }.topbar { padding: 0 25px; }.metric-grid { grid-template-columns: repeat(2,1fr); }.brand-switcher { min-width: 330px; } }
@media (max-width: 720px) { .sidebar { position: fixed; transform: translateX(-100%); transition: .22s ease; width: 268px; padding: 22px 14px 15px; height: 100vh; box-shadow: 10px 0 30px rgba(26,38,57,.12); }.sidebar.is-open { transform: translateX(0); }.brand-lockup { padding: 0 17px 24px; }.brand-lockup > span, .nav-item span, .nav-item b, .nav-item i, .help-card, .account-card > div:nth-child(2), .account-card > svg { display: initial; }.nav-item { padding: 0 17px; justify-content: flex-start; }.sidebar-footer { padding: 14px 4px 0; }.account-card { padding: 8px 9px; justify-content: flex-start; }.mobile-menu { display: grid; place-items: center; height: 38px; width: 38px; margin-right: 7px; border-radius: 9px; color: #334156; }.mobile-menu:hover { background: #f0f4f1; }.mobile-menu svg { height: 21px; width: 21px; }.topbar { height: 70px; padding: 0 14px; justify-content: initial; }.brand-switcher { min-width: 0; height: 42px; padding: 0 8px; gap: 7px; }.brand-switcher small { display: none; }.brand-switcher strong { font-size: 12px; }.workspace-icon { transform: scale(.75); margin: -3px; }.brand-switcher > svg { width: 14px; }.topbar-actions { margin-left: auto; gap: 4px; }.search-button { display: none; }.icon-button { height: 38px; width: 38px; }.top-avatar { height: 35px; width: 35px; font-size: 10px; }.content { padding: 22px 15px 30px; }.page-heading { align-items: flex-start; margin-bottom: 18px; }.page-heading h1 { font-size: 25px; letter-spacing: -.8px; }.page-heading > div > p:last-child { font-size: 12px; }.heading-actions { display: none; }.quick-strip { padding: 8px 12px; align-items: flex-start; }.health-copy { align-items: flex-start; line-height: 1.4; flex-wrap: wrap; column-gap: 7px; }.health-copy span:last-child { flex-basis: calc(100% - 18px); margin-left: 16px; }.quick-strip button { margin-top: 8px; }.metric-grid { grid-template-columns: 1fr 1fr; gap: 10px; }.metric-card { min-height: 159px; padding: 15px; }.metric-icon { height: 33px; width: 33px; margin-bottom: 13px; }.metric-icon svg { width: 18px; }.metric-title { font-size: 10.5px; }.metric-value { font-size: 23px; }.metric-value.currency { font-size: 20px; }.metric-change, .metric-note { margin-top: 8px; font-size: 9.5px; }.metric-spark { width: 75px; height: 23px; }.dashboard-side { grid-template-columns: 1fr; gap: 15px; }.dashboard-main { gap: 15px; }.campaign-panel { overflow: auto; }.campaign-table { min-width: 690px; }.campaign-row { grid-template-columns: 260px 80px 135px 138px 70px; }.panel-heading { padding: 16px 15px 12px; }.conversation-row { padding: 9px 14px; }.conversation-copy em { display: none; }.copilot-card { padding: 14px; }.notification-popover { top: 57px; right: 10px; width: min(317px,calc(100vw - 20px)); }.brand-menu { left: -52px; width: min(320px, calc(100vw - 30px)); }.modal { padding: 20px; }
body[data-production-page="app"] .sidebar { height: 100dvh; padding-top: calc(22px + env(safe-area-inset-top)); padding-bottom: calc(15px + env(safe-area-inset-bottom)); }
body[data-production-page="app"] .topbar { height: auto; min-height: calc(70px + env(safe-area-inset-top)); padding-top: env(safe-area-inset-top); }
body[data-production-page="app"] .content { padding-bottom: calc(92px + env(safe-area-inset-bottom)); }
body[data-production-page="app"] .app-mobile-bottom-nav { position: fixed; z-index: 45; right: 9px; bottom: max(8px, env(safe-area-inset-bottom)); left: 9px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; padding: 7px 5px; border: 1px solid rgba(33, 23, 54, .11); border-radius: 17px; background: rgba(255, 255, 255, .96); box-shadow: 0 13px 34px rgba(32, 21, 55, .16); backdrop-filter: blur(16px); }
body[data-production-page="app"] .app-mobile-bottom-nav button { display: grid; min-width: 0; min-height: 46px; place-items: center; gap: 3px; padding: 4px 2px; border: 0; border-radius: 11px; background: transparent; color: #697487; font: inherit; font-size: 9px; font-weight: 750; }
body[data-production-page="app"] .app-mobile-bottom-nav svg { width: 19px; height: 19px; }
body[data-production-page="app"] .app-mobile-bottom-nav button.is-active { background: #f0ebff; color: #6538c8; }
body[data-production-page="app"] .app-mobile-bottom-nav button:focus-visible { outline: 3px solid rgba(109, 40, 217, .3); outline-offset: 2px; }
}

/* Electric blue + orange brand system, on a white-first interface. */
body { background: var(--canvas); }
.brand-lockup { color: #7C3AED; }
.brand-lockup > span { background: var(--aurora); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand-mark,
.button-primary,
.copilot-logo,
.avatar-owner,
.sd { background: var(--aurora); }
.brand-mark,
.button-primary { box-shadow: 0 8px 18px rgba(20, 121, 255, .22); }
.button-primary:hover { background: #5B21B6; }
.nav-item:hover { background: #f3f8ff; color: #7C3AED; }
.nav-item:hover svg { color: #7C3AED; }
.nav-item.is-active { background: var(--aurora-soft); color: #6D28D9; box-shadow: inset 3px 0 0 #7C3AED; }
.nav-item.is-active svg { color: #7C3AED; }
.nav-item b { color: #6D28D9; background: #e8f2ff; }
.brand-switcher:hover,
.button-secondary:hover { border-color: #99c8ff; }
.button-secondary:hover,
.text-button:hover { color: #6D28D9; }
.help-icon { color: #7C3AED; background: #edf5ff; }
.account-card span,
.new-brand,
.page-heading h1 span,
.panel-footer-action { color: #7C3AED; }
.notification-button b { background: #ff861d; }
.quick-strip { border-color: #cfe4ff; background: var(--aurora-soft); }
.health-copy strong,
.quick-strip button { color: #6D28D9; }
.pulse { background: #7C3AED; box-shadow: 0 0 0 4px rgba(20, 121, 255, .13); }
.metric-icon.green { color: #7C3AED; background: #eaf4ff; }
.metric-change { color: #7C3AED; }
.metric-spark i { background: #cfe4ff; }
.campaign-icon.lime { color: #7C3AED; background: #eaf4ff; }
.status.running { color: #6D28D9; background: #eaf4ff; }
.status.running i,
.progress i,
.progress.response i,
.conversation-meta i,
.notification-dot.green-dot { background: #7C3AED; }
.conversation-row:hover { background: #f7fbff; }
.copilot-card { border-color: #d6e7ff; background: #f7fbff; }
.copilot-head p { color: #4a78ad; }
.copilot-orb { color: #7C3AED; border-color: #d6e7ff; box-shadow: 0 5px 15px rgba(20, 121, 255, .1); }
.copilot-actions button:hover { border-color: #9ecbff; box-shadow: 0 5px 12px rgba(20, 121, 255, .08); }
.copilot-actions button > span { color: #7C3AED; background: #edf5ff; }
.copilot-response { color: #315d91; border-color: #d5e7ff; background: #f3f8ff; }
.copilot-response > span,
.insight-icon,
.trend { color: #7C3AED; }
.copilot-insight { border-color: #d5e7ff; background: #f1f7ff; }
.trend { color: #c8630b; background: #fff0df; }
.channel-symbol.wa,
.channel-status.success,
.modal-icon { color: #7C3AED; background: #eaf4ff; }
.modal input:focus { border-color: #75b2ff; box-shadow: 0 0 0 3px rgba(20, 121, 255, .13); }
.avatar-af { background: #7C3AED; }
.avatar-sr { background: #5a8fff; }
.avatar-ds { background: #f58220; }

/* Sellios palette: Deep Violet #4C1D95, Hot Magenta #7C3AED, Electric Yellow #C4B5FD. */
body { background: #fff; }
.brand-lockup,
.account-card span,
.new-brand,
.page-heading h1 span,
.panel-footer-action,
.button-secondary:hover,
.text-button:hover { color: #4C1D95; }
.brand-mark,
.avatar-owner,
.sd { background: #4C1D95; }
.brand-mark { box-shadow: 0 8px 18px rgba(46, 16, 101, .22); }
.button-primary { color: #4C1D95; background: #C4B5FD; box-shadow: 0 8px 18px rgba(250, 204, 21, .28); }
.button-primary:hover { color: #4C1D95; background: #eab308; }
.nav-item:hover { color: #7C3AED; background: #FAF9FF; }
.nav-item:hover svg { color: #7C3AED; }
.nav-item.is-active { color: #4C1D95; background: #F5F3FF; box-shadow: inset 3px 0 0 #7C3AED; }
.nav-item.is-active svg { color: #7C3AED; }
.nav-item b { color: #5B21B6; background: #F5F3FF; }
.help-icon { color: #7C3AED; background: #F5F3FF; }
.notification-button b { background: #7C3AED; }
.quick-strip { border-color: #E7E1F2; background: #FAF9FF; }
.health-copy strong,
.quick-strip button { color: #4C1D95; }
.pulse { background: #7C3AED; box-shadow: 0 0 0 4px rgba(214, 0, 143, .13); }
.metric-icon.green { color: #4C1D95; background: #f1eaff; }
.metric-icon.blue { color: #7C3AED; background: #F5F3FF; }
.metric-icon.purple { color: #5B21B6; background: #F5F3FF; }
.metric-icon.amber { color: #7a5700; background: #fff8d8; }
.metric-change { color: #4C1D95; }
.campaign-icon.lime { color: #7C3AED; background: #F5F3FF; }
.status.running { color: #5B21B6; background: #F5F3FF; }
.status.running i,
.progress i,
.progress.response i,
.conversation-meta i,
.notification-dot.green-dot { background: #7C3AED; }
.conversation-row:hover { background: #FAF9FF; }
.copilot-card { border-color: #E7E1F2; background: #FAF9FF; }
.copilot-head p { color: #6b509b; }
.copilot-logo { background: #4C1D95; }
.copilot-orb { color: #7C3AED; border-color: #E7E1F2; box-shadow: 0 5px 15px rgba(46, 16, 101, .1); }
.copilot-actions button:hover { border-color: #C4B5FD; box-shadow: 0 5px 12px rgba(214, 0, 143, .08); }
.copilot-actions button > span { color: #7C3AED; background: #F5F3FF; }
.copilot-response { color: #4b2b76; border-color: #E7E1F2; background: #FAF9FF; }
.copilot-response > span,
.insight-icon { color: #7C3AED; }
.copilot-insight { border-color: #E7E1F2; background: #FAF9FF; }
.trend { color: #715500; background: #fff8d8; }
.channel-symbol.wa,
.channel-status.success,
.modal-icon { color: #7C3AED; background: #F5F3FF; }
.modal input:focus { border-color: #7C3AED; box-shadow: 0 0 0 3px rgba(214, 0, 143, .13); }
.avatar-af { background: #4C1D95; }
.avatar-sr { background: #7c3aed; }
.avatar-ds { background: #7C3AED; }

/* Deep Violet sidebar variant. */
.sidebar { background: #4C1D95; border-right-color: #5B21B6; }
.brand-lockup { color: #fff; }
.brand-lockup > span { background: none; -webkit-background-clip: initial; background-clip: initial; color: #fff; }
.brand-lockup em { color: #C4B5FD; }
.brand-mark { color: #4C1D95; background: #C4B5FD; box-shadow: 0 8px 18px rgba(13, 2, 40, .3); }
.nav-section-title { color: #fff; opacity: .72; }
.nav-section-dashboard + .nav-section,
.sidebar-footer { border-color: rgba(255,255,255,.15); }
.nav-item { color: #fff; font-weight: 600; }
.nav-item svg { color: #fff; opacity: .82; }
.nav-item:hover { color: #fff; background: #5B21B6; }
.nav-item:hover svg { color: #fff; opacity: 1; }
.nav-item.is-active { color: #fff; background: #7C3AED; box-shadow: inset 3px 0 0 #C4B5FD; font-weight: 700; }
.nav-item.is-active svg { color: #fff; opacity: 1; }
.nav-item b { color: #fff; background: #7C3AED; }
.help-card { color: #f8f5ff; }
.help-card:hover,
.account-card:hover { background: #5B21B6; }
.help-icon { color: #4C1D95; background: #C4B5FD; }
.help-card strong { color: #fff; }
.help-card span,
.help-card > svg,
.account-card > svg { color: #C4B5FD; }
.account-card strong { color: #fff; }
.account-card span { color: #C4B5FD; }

/* Trial workspaces begin with a small, truthful setup path instead of demo metrics. */
.trial-setup-dashboard{display:grid;gap:22px}.trial-welcome-panel{padding:28px;display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:28px;align-items:center;background:linear-gradient(135deg,#fff 0%,#faf7ff 100%)}.trial-welcome-copy h2{margin:6px 0 9px;font-size:30px;letter-spacing:-1.4px}.trial-welcome-copy>p:not(.eyebrow){max-width:680px;margin:0;color:var(--muted);line-height:1.65}.trial-welcome-badges{margin-top:17px;display:flex;flex-wrap:wrap;gap:7px}.trial-progress{padding:19px;border:1px solid var(--line);border-radius:16px;background:#fff;text-align:center}.trial-progress strong{display:block;color:#34204e;font-size:34px;letter-spacing:-1.5px}.trial-progress span{display:block;margin-top:2px;color:var(--muted);font-size:11px;font-weight:700}.trial-progress div{height:7px;margin-top:13px;overflow:hidden;border-radius:999px;background:#eeeaf3}.trial-progress i{display:block;height:100%;border-radius:inherit;background:#7C3AED}.trial-setup-steps{display:grid;gap:12px}.trial-setup-step{padding:18px 20px;display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:14px;align-items:center;border:1px solid var(--line);border-radius:18px;background:#fff}.trial-step-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;color:#7058a2;background:#f3effb}.trial-step-icon svg{width:18px;height:18px}.trial-setup-step.is-ready{border-color:#bde7d0;background:#f8fffb}.trial-setup-step.is-ready .trial-step-icon{color:#227c4e;background:#dcf6e7}.trial-setup-step strong{display:block;color:var(--ink);font-size:15px}.trial-setup-step p{margin:3px 0 0;color:var(--muted);font-size:12px;line-height:1.55}.trial-setup-step .button{justify-content:center;min-width:138px}.trial-guidance-grid{grid-template-columns:minmax(0,1fr) 300px}.trial-guidance-side p{margin:0}.trial-guidance-side h2{margin:7px 0 8px;font-size:20px;letter-spacing:-.8px}.trial-guidance-side>p:not(.eyebrow){margin:0;color:var(--muted);font-size:12px;line-height:1.6}.trial-guidance-side .text-button{margin-top:16px}
@media(max-width:860px){.trial-welcome-panel{grid-template-columns:1fr}.trial-progress{max-width:240px;text-align:left}.trial-guidance-grid{grid-template-columns:1fr}.trial-setup-step{grid-template-columns:38px minmax(0,1fr)}.trial-setup-step .button{grid-column:2;justify-self:start}}@media(max-width:560px){.trial-welcome-panel{padding:21px}.trial-welcome-copy h2{font-size:25px}.trial-setup-step{padding:15px}.trial-setup-step .button{width:100%}}

/* Commerce logistics: readable delivery status without turning the order page into a dashboard. */
.commerce-dashboard{display:grid;gap:22px}.commerce-dashboard-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;padding:28px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,#fff 0%,#faf7ff 58%,#f1ebff 100%)}.commerce-kicker{display:block;color:#6d28d9;font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.commerce-dashboard-hero h1{margin:8px 0 8px;color:var(--ink);font-size:34px;letter-spacing:-1.6px}.commerce-dashboard-hero p{max-width:650px;margin:0;color:var(--muted);line-height:1.6}.commerce-hero-actions{display:flex;flex-wrap:wrap;gap:10px}.commerce-module-panel{padding-bottom:22px}.commerce-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.commerce-module-card{display:grid;grid-template-columns:36px minmax(0,1fr) auto;grid-template-rows:auto auto;gap:4px 12px;align-items:center;padding:16px;text-align:left;border:1px solid var(--line);border-radius:16px;background:#fff;color:inherit;cursor:pointer;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.commerce-module-card:hover{transform:translateY(-2px);border-color:#c4b5fd;box-shadow:0 12px 26px rgba(79,42,130,.1)}.commerce-module-card>span{grid-row:1 / span 2;display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:#f1ebff;color:#6d28d9;font-size:12px;font-weight:800}.commerce-module-card strong{font-size:14px}.commerce-module-card small{color:var(--muted);font-size:11px;line-height:1.45}.commerce-module-card b{grid-column:2 / span 2;color:#6d28d9;font-size:11px}.commerce-module-card b svg{width:13px;height:13px;vertical-align:middle}.commerce-dashboard .conversations-panel{min-height:240px}.commerce-dashboard .copilot-card{height:auto}.commerce-dashboard .channel-panel{margin-top:16px}@media(max-width:900px){.commerce-dashboard-hero{align-items:flex-start;flex-direction:column}.commerce-hero-actions{width:100%}.commerce-hero-actions>*{flex:1}}@media(max-width:620px){.commerce-dashboard-hero{padding:21px}.commerce-dashboard-hero h1{font-size:27px}.commerce-module-grid{grid-template-columns:1fr}.commerce-hero-actions{display:grid;grid-template-columns:1fr}.commerce-module-card{grid-template-columns:32px minmax(0,1fr)}.commerce-module-card>span{width:32px;height:32px}.commerce-module-card b{grid-column:2}}
.order-shipment-card .shipment-meta{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:18px 0}.shipment-meta>div{padding:12px;border:1px solid var(--line);border-radius:14px;background:#faf8fd}.shipment-meta small{display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.06em}.shipment-meta strong{display:block;margin-top:6px;color:var(--ink);font-size:13px}.shipment-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}@media(max-width:950px){.order-shipment-card .shipment-meta{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.order-shipment-card .shipment-meta{grid-template-columns:1fr}.shipment-actions>*{width:100%}}

/* Analytics is a full-width operational view; secondary values remain legible
   without presenting decorative trends as business facts. */
.analytics-workspace{width:100%;min-width:0}.analytics-workspace .analytics-period-controls{display:flex;flex-wrap:wrap;gap:8px}.analytics-workspace .analytics-custom-range{display:flex;flex-wrap:wrap;align-items:end;gap:8px}.analytics-workspace .analytics-custom-range label{display:grid;gap:5px;color:var(--muted);font-size:11px;font-weight:750}.analytics-workspace .analytics-custom-range input{min-height:36px;padding:0 9px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font:inherit}.analytics-workspace .analytics-bars span{display:grid;gap:2px}.analytics-workspace .analytics-bars span small{color:var(--muted);font-size:10px;font-weight:500}.analytics-workspace .panel-heading>div:last-child{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.analytics-workspace .empty-state{padding:0 19px 20px;text-align:left}.analytics-workspace .empty-state strong{display:block}.analytics-workspace .empty-state p{margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.5}@media(max-width:720px){.analytics-workspace .panel-heading:has(.analytics-period-controls){gap:12px;flex-direction:column}.analytics-workspace .analytics-custom-range{width:100%;align-items:stretch}.analytics-workspace .analytics-custom-range label{flex:1;min-width:120px}.analytics-workspace .analytics-custom-range button{width:100%;justify-content:center}.analytics-workspace .analytics-bars>div{grid-template-columns:minmax(0,1fr) auto minmax(56px,.7fr);gap:8px}.analytics-workspace .panel-heading>div:last-child{justify-content:flex-start}}

/* Campaign preparation is operational before delivery is enabled. */
.campaign-workspace{display:grid;gap:18px}.campaign-workspace-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.campaign-workspace-heading p{margin:0;color:var(--muted)}.campaign-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.campaign-kpis .advanced-kpi{min-height:118px}.campaign-kpis .advanced-kpi span{color:var(--muted);font-size:12px;font-weight:750}.campaign-kpis .advanced-kpi strong{display:block;margin-top:12px;color:var(--ink);font-size:29px;letter-spacing:-1px}.campaign-kpis .advanced-kpi small{display:block;margin-top:4px;color:#6d28d9;font-size:11px;font-weight:700}.campaign-readiness-note{display:flex;gap:10px;align-items:center;padding:14px 16px;border:1px solid #ded4ff;border-radius:15px;background:#faf7ff;color:#4c1d95}.campaign-readiness-note svg{width:18px;height:18px}.campaign-readiness-note p{margin:0;font-size:13px;line-height:1.45}.campaign-preparation-form,.campaign-preparation-panel,.campaign-preparation-detail{padding:21px;border:1px solid var(--line);border-radius:19px;background:#fff;box-shadow:0 10px 28px rgba(40,20,70,.04)}.campaign-preparation-heading{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.campaign-preparation-heading h2{margin:0;color:var(--ink);font-size:19px;letter-spacing:-.5px}.campaign-preparation-heading p{margin:6px 0 0;color:var(--muted);font-size:12px}.campaign-preparation-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:18px;align-items:start}.campaign-preparation-list{display:grid;margin-top:18px;border-top:1px solid var(--line)}.campaign-preparation-row{display:grid;grid-template-columns:minmax(0,1fr) auto 115px;gap:14px;align-items:center;padding:15px 0;border:0;border-bottom:1px solid var(--line);background:transparent;color:inherit;text-align:left;cursor:pointer}.campaign-preparation-row:last-child{border-bottom:0}.campaign-preparation-row:hover,.campaign-preparation-row.is-selected{margin-inline:-10px;padding-inline:10px;border-radius:12px;background:#faf7ff}.campaign-preparation-row strong,.campaign-preparation-row small{display:block}.campaign-preparation-row strong{font-size:14px;color:var(--ink)}.campaign-preparation-row small,.campaign-preparation-row time{margin-top:4px;color:var(--muted);font-size:11px}.campaign-preparation-row time{text-align:right}.campaign-preparation-detail{display:grid;gap:18px}.campaign-preparation-detail h2{margin:5px 0 10px;color:var(--ink);font-size:20px;letter-spacing:-.7px}.campaign-preparation-detail dl{display:grid;gap:10px;margin:0}.campaign-preparation-detail dl div{display:flex;justify-content:space-between;gap:12px;padding-bottom:9px;border-bottom:1px solid var(--line)}.campaign-preparation-detail dt{color:var(--muted);font-size:11px}.campaign-preparation-detail dd{margin:0;color:var(--ink);font-size:12px;font-weight:700;text-align:right}.campaign-preparation-detail>p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}.campaign-detail-actions{display:flex;flex-wrap:wrap;gap:8px}.campaign-detail-actions .button{width:100%;justify-content:center}@media(max-width:980px){.campaign-preparation-grid{grid-template-columns:1fr}.campaign-preparation-detail{grid-template-columns:1fr 1fr}.campaign-preparation-detail>div:first-child,.campaign-preparation-detail>p,.campaign-detail-actions{grid-column:1 / -1}}@media(max-width:640px){.campaign-workspace-heading{align-items:flex-start;flex-direction:column}.campaign-workspace-heading .button{width:100%;justify-content:center}.campaign-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.campaign-preparation-row{grid-template-columns:1fr auto}.campaign-preparation-row time{display:none}.campaign-preparation-detail{grid-template-columns:1fr}}

/* Campaign Core: a shared, channel-adaptive planning workspace. */
.campaign-workspace{gap:20px}.campaign-workspace-heading{padding:2px 0}.campaign-workspace-heading p{max-width:720px;font-size:14px;line-height:1.6}.campaign-kpis{display:grid;gap:14px}.campaign-kpi{display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;align-items:center;min-height:122px;padding:19px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(40,20,70,.04)}.campaign-kpi>span{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#f1ebff;color:#6d28d9}.campaign-kpi svg{width:19px;height:19px}.campaign-kpi small,.campaign-kpi p{display:block;margin:0;color:var(--muted);font-size:11px}.campaign-kpi strong{display:block;margin:4px 0;color:var(--ink);font-size:27px;letter-spacing:-1px}.campaign-readiness-note{border-left:4px solid #8b5cf6}.campaign-workspace-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}.campaign-list-panel,.campaign-detail-panel,.campaign-builder{padding:22px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 10px 28px rgba(40,20,70,.04)}.campaign-list-panel>header,.campaign-detail-panel>header,.campaign-builder-top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.campaign-list-panel h2,.campaign-detail-panel h2,.campaign-builder h2{margin:0;color:var(--ink);font-size:20px;letter-spacing:-.65px}.campaign-list-panel header p,.campaign-detail-panel>p,.campaign-builder-top p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.55}.campaign-list-panel>header>span{padding:5px 9px;border-radius:999px;background:#f5f1ff;color:#6d28d9;font-size:11px;font-weight:800;white-space:nowrap}.campaign-record-table{display:grid;margin-top:18px;border:1px solid var(--line);border-radius:15px;overflow:hidden}.campaign-record-head,.campaign-record-row{display:grid;grid-template-columns:minmax(165px,1.3fr) minmax(120px,.8fr) minmax(150px,1fr) minmax(130px,.8fr) minmax(150px,.95fr) minmax(104px,.65fr);gap:12px;align-items:center;padding:13px 16px}.campaign-record-head{background:#faf8fd;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}.campaign-record-row{border-top:1px solid var(--line);color:inherit;text-align:left;background:#fff;cursor:pointer}.campaign-record-row:hover,.campaign-record-row.is-selected{background:#faf7ff;box-shadow:inset 3px 0 #7c3aed}.campaign-record-row strong,.campaign-record-row small{display:block}.campaign-record-row strong{color:var(--ink);font-size:13px}.campaign-record-row small{margin-top:4px;color:var(--muted);font-size:11px;line-height:1.4}.campaign-record-row b{font-size:12px;color:#4c1d95}.campaign-status{display:inline-flex;width:max-content;padding:5px 8px;border-radius:999px;background:#f0eaff;color:#6d28d9;font-size:10px;font-weight:800}.campaign-status.approved{background:#e8f8ee;color:#16834b}.campaign-status.scheduled{background:#e8f2ff;color:#2563aa}.campaign-status.draft{background:#f3f4f6;color:#596174}.campaign-readiness{font-style:normal;font-size:10px;font-weight:800}.campaign-readiness.ready{color:#16834b}.campaign-readiness.warning{color:#a16207}.campaign-detail-panel{position:sticky;top:18px;display:grid;gap:17px}.campaign-detail-panel .eyebrow{margin:0;color:#6d28d9;font-size:10px;font-weight:800;letter-spacing:.1em}.campaign-detail-panel dl,.campaign-builder-summary dl{display:grid;gap:0;margin:0}.campaign-detail-panel dl div,.campaign-builder-summary dl div{display:grid;grid-template-columns:108px minmax(0,1fr);gap:10px;padding:10px 0;border-top:1px solid var(--line)}.campaign-detail-panel dt,.campaign-builder-summary dt{color:var(--muted);font-size:11px}.campaign-detail-panel dd,.campaign-builder-summary dd{margin:0;color:var(--ink);font-size:12px;font-weight:700;line-height:1.45}.campaign-content-preview{padding:14px;border-radius:15px;background:#faf8fd}.campaign-content-preview span{display:block;color:#776f86;font-size:10px;font-weight:800;letter-spacing:.08em}.campaign-content-preview strong{display:block;margin-top:8px;color:var(--ink);font-size:13px}.campaign-content-preview small,.campaign-content-preview p{display:block;margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.55;white-space:pre-wrap}.campaign-detail-actions{display:grid}.campaign-builder{display:block}.campaign-builder-top{margin-bottom:20px}.campaign-builder-layout{display:grid;grid-template-columns:minmax(0,1fr) 272px;gap:18px;align-items:start}.campaign-builder-stack{display:grid;gap:14px}.campaign-builder-section{padding:18px;border:1px solid var(--line);border-radius:16px}.campaign-builder-section header{display:grid;grid-template-columns:29px minmax(0,1fr);gap:10px;align-items:start;margin-bottom:15px}.campaign-builder-section header>span{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#f1ebff;color:#6d28d9;font-size:10px;font-weight:900}.campaign-builder-section h3{margin:0;color:var(--ink);font-size:14px}.campaign-builder-section header p{margin:3px 0 0;color:var(--muted);font-size:11px;line-height:1.5}.campaign-builder-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.campaign-builder-fields label{display:grid;gap:6px;color:#5e5870;font-size:11px;font-weight:750}.campaign-builder-fields input,.campaign-builder-fields textarea,.campaign-builder-fields select{width:100%;box-sizing:border-box;padding:10px 11px;border:1px solid #ddd7e8;border-radius:10px;background:#fff;color:var(--ink);font:inherit;font-size:13px}.campaign-builder-fields textarea{min-height:92px;resize:vertical}.campaign-builder-full{grid-column:1 / -1}.campaign-builder-check{align-content:end;grid-auto-flow:column;justify-content:start;gap:8px}.campaign-builder-check input{width:auto}.campaign-channel-options{display:grid;gap:9px}.campaign-channel-option{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:12px;cursor:pointer}.campaign-channel-option.is-selected{border-color:#a78bfa;background:#faf7ff}.campaign-channel-option input{accent-color:#6d28d9}.campaign-channel-option strong,.campaign-channel-option small{display:block}.campaign-channel-option strong{color:var(--ink);font-size:13px}.campaign-channel-option small{margin-top:2px;color:var(--muted);font-size:11px}.campaign-builder-field-note{grid-column:1 / -1;padding:10px;border-radius:10px;background:#faf8fd;color:var(--muted);font-size:11px;line-height:1.5}.campaign-audience-preview{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:13px;padding:13px;border-radius:13px;background:#faf8fd}.campaign-audience-preview span{display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.07em}.campaign-audience-preview strong{display:block;margin-top:3px;color:var(--ink);font-size:16px}.campaign-audience-preview p{margin:4px 0 0;color:var(--muted);font-size:11px}.campaign-audience-people{display:grid;gap:0;margin-top:10px;border:1px solid var(--line);border-radius:12px;overflow:hidden}.campaign-audience-people article{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:9px;align-items:center;padding:9px 11px;border-top:1px solid var(--line)}.campaign-audience-people article:first-child{border-top:0}.campaign-audience-people b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#eee7ff;color:#6d28d9;font-size:10px}.campaign-audience-people strong,.campaign-audience-people small{display:block}.campaign-audience-people strong{font-size:12px}.campaign-audience-people small,.campaign-audience-people article>span{color:var(--muted);font-size:10px}.campaign-builder-summary{position:sticky;top:18px;padding:16px;border:1px solid #e6ddff;border-radius:15px;background:#faf8ff}.campaign-builder-summary>span{color:#6d28d9;font-size:10px;font-weight:850;letter-spacing:.1em}.campaign-builder-summary h3{margin:9px 0 14px;color:var(--ink);font-size:16px}.campaign-builder-summary dd small{display:block;margin-top:2px;color:var(--muted);font-weight:500}.campaign-builder-actions{display:flex;justify-content:space-between;gap:14px;align-items:center}.campaign-builder-actions small{max-width:330px;color:var(--muted);font-size:11px;line-height:1.45}.campaign-builder-actions>div{display:flex;gap:8px;flex-wrap:wrap}@media(max-width:1120px){.campaign-workspace-grid,.campaign-builder-layout{grid-template-columns:1fr}.campaign-detail-panel,.campaign-builder-summary{position:static}.campaign-detail-panel{grid-template-columns:1fr 1fr}.campaign-detail-panel>header,.campaign-detail-panel>p,.campaign-detail-panel .campaign-content-preview,.campaign-detail-actions{grid-column:1 / -1}.campaign-record-head,.campaign-record-row{grid-template-columns:minmax(145px,1.2fr) minmax(120px,.9fr) minmax(140px,1fr) minmax(120px,.8fr)}}@media(max-width:760px){.campaign-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.campaign-record-head{display:none}.campaign-record-row{grid-template-columns:1fr 1fr;padding:14px}.campaign-record-row>*:nth-child(4),.campaign-record-row>*:nth-child(6){display:none}.campaign-builder-fields{grid-template-columns:1fr}.campaign-builder-full{grid-column:auto}.campaign-detail-panel{grid-template-columns:1fr}.campaign-builder-actions,.campaign-audience-preview{align-items:flex-start;flex-direction:column}}@media(max-width:520px){.campaign-kpis{grid-template-columns:1fr}.campaign-workspace-heading .button,.campaign-audience-preview .button{width:100%;justify-content:center}.campaign-record-row{grid-template-columns:1fr}.campaign-record-row>*:nth-child(3),.campaign-record-row>*:nth-child(5){display:none}.campaign-builder{padding:16px}.campaign-builder-actions>div{width:100%}.campaign-builder-actions .button{flex:1;justify-content:center}}
/* Analytics period controls share one compact, responsive toolbar. */
.analytics-workspace .analytics-period-panel{padding:0;overflow:hidden}
.analytics-workspace .analytics-period-heading{padding:18px 20px 0}
.analytics-workspace .analytics-period-heading h2{margin:0}
.analytics-workspace .analytics-period-heading p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.5}
.analytics-workspace .analytics-period-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 20px 20px}
.analytics-workspace .analytics-preset-group{display:flex;flex-wrap:wrap;gap:6px}
.analytics-workspace .analytics-preset-group .button{min-height:40px;padding:0 13px;border-radius:10px}
.analytics-workspace .analytics-preset-group .button[aria-pressed="true"]{border-color:#7c3aed;background:#f1ebff;color:#5b21b6}
.analytics-workspace .analytics-custom-range{display:grid;grid-template-columns:auto minmax(150px,1fr) auto minmax(150px,1fr) auto;align-items:end;gap:8px;width:auto}
.analytics-workspace .analytics-custom-label{grid-column:1/-1;color:var(--muted);font-size:11px;font-weight:750}
.analytics-workspace .analytics-custom-range label{min-width:0}
.analytics-workspace .analytics-custom-range input{box-sizing:border-box;min-height:40px;width:100%;border-radius:10px}
.analytics-workspace .analytics-range-separator{padding-bottom:11px;color:var(--muted);font-size:13px}
.analytics-workspace .analytics-custom-range button{min-height:40px;padding-inline:14px;border-radius:10px;white-space:nowrap}
@media(max-width:960px){.analytics-workspace .analytics-period-toolbar{align-items:stretch;flex-direction:column;gap:12px}.analytics-workspace .analytics-custom-range{width:100%;max-width:650px}}
@media(max-width:720px){.analytics-workspace .analytics-period-heading{padding:16px 15px 0}.analytics-workspace .analytics-period-toolbar{padding:13px 15px 16px}.analytics-workspace .analytics-preset-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.analytics-workspace .analytics-preset-group .button{width:100%;padding-inline:8px}.analytics-workspace .analytics-custom-range{grid-template-columns:1fr;gap:7px;max-width:none}.analytics-workspace .analytics-custom-label{grid-column:auto}.analytics-workspace .analytics-range-separator{display:none}.analytics-workspace .analytics-custom-range button{width:100%;justify-content:center}}