/* CoAgent reference theme. Keep this last: older styles supply feature layouts.
   Contract, component recipes and accessibility rules: ../design-system.md. */
.coagent-dashboard {
  --brand-primary: #1565ed;
  --brand-cyan: #10d7ef;
  --brand-navy: #030b1b;
  --brand-royal: #1254bd;
  --brand-ice: #eaf7ff;
  --brand-silver: #c8d8e8;
  --brand-success: #16a34a;
  --brand-warning: #f59e0b;
  --brand-error: #ef4444;
  --brand-info: #0ea5e9;
  --font-ui: Inter, 'Noto Sans Bengali', 'Segoe UI', Arial, sans-serif;
  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-lg: 18px;
  --text-xl: 20px;
  --text-section: 24px;
  --text-page: 32px;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-control: 12px;
  --radius-card: 22px;
  --radius-feature: 26px;
  --radius-round: 999px;
  --duration-fast: 160ms;
  --duration-normal: 220ms;
  --ease-ui: cubic-bezier(.2,.7,.2,1);
  --glass-blur: 18px;
}
.coagent-dashboard, .coagent-dashboard[data-theme] {
  --outer-canvas: #dce6f1;
  --canvas: #eff5fb;
  --surface-solid: #ffffff;
  --surface-soft: #eaf2fb;
  --surface-selected: #dceaff;
  --text-primary: #12213b;
  --text-secondary: #52647b;
  --border-subtle: #dce6f2;
  --border-control: #798aa2;
  --action: #1254bd;
  --action-hover: #0e4497;
  --on-action: #ffffff;
  --focus-ring: #1254bd;
  --disabled-bg: #e5edf6;
  --disabled-ink: #52647b;
  --glass-surface: rgba(255,255,255,.78);
  --glass-highlight: rgba(255,255,255,.98);
  --glass-edge: rgba(255,255,255,.85);
  --ambient-glow: rgba(21,101,237,.075);
  --shadow-card: 0 3px 14px rgba(3,11,27,.025);
  --shadow-float: 0 8px 30px rgba(3,30,75,.055), inset 0 1px 0 var(--glass-highlight);
  --shadow-dialog: 0 24px 80px rgba(3,11,27,.2);
  --success-bg: #edf9f1;
  --success-ink: #147538;
  --warning-bg: #fff6e4;
  --warning-ink: #7a4300;
  --error-bg: #fff1f0;
  --error-ink: #b42318;
  --info-bg: #eaf7ff;
  --info-ink: #075985;
  /* Compatibility aliases for the existing customer modules; no API changes. */
  --sans: var(--font-ui);
  --serif: var(--font-ui);
  --bg: var(--canvas);
  --surface: var(--surface-solid);
  --ink: var(--text-primary);
  --muted: var(--text-secondary);
  --border: var(--border-subtle);
  --dark: var(--text-primary);
  --green: var(--action);
  --lime: var(--brand-primary);
  --accent: var(--focus-ring);
  --dashboard-accent: var(--action);
  --dashboard-soft: var(--surface-soft);
  --dashboard-selected: var(--surface-selected);
  --dashboard-button: var(--action);
  --dashboard-on-button: var(--on-action);
  --dashboard-shadow: var(--shadow-card);
  background: var(--outer-canvas);
  color: var(--text-primary);
  font-family: var(--font-ui);
  line-height: 1.5;
  color-scheme: light;
}
.coagent-dashboard[data-theme="dark"] {
  --outer-canvas: #141414;
  --canvas: #1c1c1c;
  --surface-solid: #242424;
  --surface-soft: #303030;
  --surface-selected: #383838;
  --text-primary: #e4e6eb;
  --text-secondary: #b0b3b8;
  --border-subtle: #414141;
  --border-control: #85888e;
  --action: #72c8ff;
  --action-hover: #9bdfff;
  --on-action: #041328;
  --focus-ring: #72c8ff;
  --disabled-bg: #343434;
  --disabled-ink: #b0b3b8;
  --glass-surface: rgba(28,28,28,.94);
  --glass-highlight: rgba(255,255,255,.08);
  --glass-edge: rgba(255,255,255,.09);
  --ambient-glow: transparent;
  --shadow-card: 0 4px 20px rgba(0,0,0,.08);
  --shadow-float: 0 8px 32px rgba(0,0,0,.18), inset 0 1px 0 var(--glass-highlight);
  --shadow-dialog: 0 24px 80px rgba(0,0,0,.45);
  --success-bg: #0d3525;
  --success-ink: #80e1a5;
  --warning-bg: #3b2b17;
  --warning-ink: #ffd38a;
  --error-bg: #3f202a;
  --error-ink: #ffb4b4;
  --info-bg: #12334b;
  --info-ink: #8bddff;
  color-scheme: dark;
}

/* Flat content surfaces; blur is restricted to navigation, never nested cards. */
.coagent-dashboard .app-shell {margin: 16px; min-height: calc(100vh - 32px); border: 1px solid var(--glass-edge); border-radius: 30px; background: radial-gradient(ellipse at 100% 0, var(--ambient-glow), transparent 38%), radial-gradient(ellipse at 100% 80%, rgba(16,215,239,.035), transparent 35%), var(--canvas);}
.coagent-dashboard .sidebar {inset: 28px auto 28px 28px; width: 216px; padding: 25px 14px 14px; border: 1px solid var(--glass-edge); border-radius: 22px; background: var(--surface-solid) !important; box-shadow: var(--shadow-float);}
.coagent-dashboard .sidebar-heading {display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 16px; flex-shrink: 0;}
.coagent-dashboard .sidebar-heading .brand {margin: 0; padding: 0; min-width: 0; gap: 0;}
.coagent-dashboard .sidebar-heading .coagent-wordmark {font-size: 28px; letter-spacing: -1.4px;}
.coagent-dashboard .sidebar-heading .sidebar-close {min-width: 32px; min-height: 40px; padding: 4px; border: 0; background: transparent; flex-shrink: 0;}
.coagent-dashboard .sidebar-backdrop {display: none;}
.coagent-dashboard .breadcrumbs .mobile-menu {display: inline-flex; border: 0; background: transparent; padding: 8px; flex-shrink: 0;}
.coagent-dashboard .breadcrumbs {min-width: 0;}
.coagent-dashboard .breadcrumbs strong {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.coagent-dashboard .main-shell {margin-left: 228px; width: calc(100% - 228px);}
.coagent-dashboard .topbar {height: 64px; margin: 12px 16px 0 12px; padding: 0 18px; background: var(--surface-solid); border: 1px solid var(--glass-edge); border-radius: 18px;}
.coagent-dashboard .cg-glass {background: var(--surface-solid); border: 1px solid var(--glass-edge); border-radius: var(--radius-feature); box-shadow: var(--shadow-float);}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .coagent-dashboard .sidebar, .coagent-dashboard .topbar, .coagent-dashboard .cg-glass {
    background: var(--glass-surface) !important;
    -webkit-backdrop-filter: blur(var(--glass-blur));
    backdrop-filter: blur(var(--glass-blur));
  }
}
.coagent-dashboard .coagent-wordmark {font-family: var(--font-ui); font-weight: 600; font-size: 30px; letter-spacing: -1.6px; color: var(--text-primary);}
.coagent-dashboard .brand-period {color: var(--brand-primary);}
.coagent-dashboard .workspace {background: var(--surface-soft); border-radius: var(--radius-control);}
.coagent-dashboard .workspace-avatar, .coagent-dashboard .login-robot {filter: none;}
.coagent-dashboard .nav-item {border-radius: var(--radius-control); transition: background-color var(--duration-fast) var(--ease-ui), color var(--duration-fast) var(--ease-ui);}
.coagent-dashboard[data-theme] .nav-item.active, .coagent-dashboard[data-theme] .nav-item.active:hover {background: linear-gradient(115deg,var(--brand-royal),var(--brand-primary)); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 4px 14px rgba(21,101,237,.16);}
/* Neutral dark navigation follows the supplied reference; blue still identifies actions. */
.coagent-dashboard[data-theme="dark"] .app-shell {background: var(--canvas);}
.coagent-dashboard[data-theme="dark"] .nav-item {color: var(--text-primary); font-weight: 500;}
.coagent-dashboard[data-theme="dark"] .nav-item:hover {background: var(--surface-soft);}
.coagent-dashboard[data-theme="dark"] .nav-item.active,
.coagent-dashboard[data-theme="dark"] .nav-item.active:hover {background: var(--surface-selected); color: var(--text-primary); box-shadow: none;}
.coagent-dashboard .nav-item small {border-radius: var(--radius-round); font-family: var(--font-ui); font-size: 10px;}
.coagent-dashboard .assistant-note {border-radius: var(--radius-card);}
.coagent-dashboard .profile-avatar {color: var(--action); background: var(--surface-selected);}
.coagent-dashboard .theme-toggle, .coagent-dashboard .language-button, .coagent-dashboard .app-token-wallet {border-radius: var(--radius-control);}
.coagent-dashboard .topbar .icon {width: 18px; height: 18px;}
/* Match the other compact topbar controls; the server still owns the switch state. */
.coagent-dashboard .agent-mode {position: relative; display: inline-flex; align-items: center; width: 148px; height: 40px; flex-shrink: 0; padding: 3px; border: 1px solid var(--border-subtle); border-radius: var(--radius-control); background: var(--surface-soft); box-shadow: none; cursor: pointer;}
.coagent-dashboard .agent-mode-options {position:absolute;inset:3px;display:grid;grid-template-columns:1fr 1fr;align-items:center;text-align:center;color:var(--text-secondary);font:500 12px var(--font-ui);pointer-events:none;}
.coagent-dashboard .agent-mode-thumb {position: absolute; z-index:1; left:3px; top:3px; bottom:3px; width:calc(50% - 3px); display: flex; align-items: center; justify-content: center; border-radius: calc(var(--radius-control) - 3px); background: var(--surface-solid); color: var(--text-primary); border: 1px solid var(--border-subtle); box-shadow:0 1px 3px #00000014; transform: translateX(0); transition: transform 180ms var(--ease-ui);}
.coagent-dashboard .agent-mode-label {font: 600 12px/1 var(--font-ui); white-space: nowrap;}
.coagent-dashboard .agent-mode[data-state="live"] {background: var(--surface-soft); border-color: var(--border-subtle);}
.coagent-dashboard .agent-mode[data-state="live"] .agent-mode-thumb {transform: translateX(100%); background: var(--action); color: var(--on-action); border-color: var(--action);}
.coagent-dashboard .agent-mode:is([data-state="loading"],[data-state="unknown"]) .agent-mode-thumb {width:calc(100% - 6px);transform:none;}
.coagent-dashboard .agent-mode[data-state="unknown"] {border-style: dashed;}
.coagent-dashboard .agent-mode:disabled {opacity: 1; cursor: wait;}
.coagent-dashboard .agent-mode[data-state="unknown"]:disabled {cursor: not-allowed;}
.coagent-dashboard .agent-mode:focus-visible {outline: 2px solid var(--focus-ring); outline-offset: 3px;}
.coagent-dashboard .agent-mode-help {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;}
.coagent-dashboard .app-token-wallet>.icon {color: var(--action);}
.coagent-dashboard .workspace-chevron .icon {width: 14px; height: 14px;}
.coagent-dashboard .profile>.icon {width: 16px; height: 16px;}
.coagent-dashboard h1, .coagent-dashboard h2, .coagent-dashboard h3 {font-family: var(--font-ui); font-feature-settings: normal;}
.coagent-dashboard .page-heading h1, .coagent-dashboard .dashboard-heading h1 {font-size: clamp(24px,2.5vw,var(--text-page)); font-weight: var(--weight-semibold); letter-spacing: -.8px; line-height: 1.25;}
.coagent-dashboard .panel-header h2, .coagent-dashboard .dashboard-card-heading h3 {font-size: var(--text-xl); font-weight: var(--weight-semibold); line-height: 1.35;}
.coagent-dashboard .dashboard-section-heading h2 {font-size: var(--text-section); font-weight: var(--weight-semibold); line-height: 1.3;}
.coagent-dashboard .dashboard-hero {border: 1px solid var(--border-subtle); border-radius: var(--radius-feature); background: linear-gradient(115deg,var(--surface-solid),var(--surface-soft));}
.coagent-dashboard .dashboard-hero-media {background: var(--brand-navy); border-radius: var(--radius-card);}
.coagent-dashboard .dashboard-hero-media img {filter: none; opacity: 1; mix-blend-mode: normal;}
.coagent-dashboard .dashboard-hero h2 {font-family: var(--font-ui); font-size: clamp(30px,3vw,48px); line-height: 1.2; letter-spacing: -1.4px; font-weight: 600;}
.coagent-dashboard .dashboard-hero-caption {font-family: var(--font-ui);}
.coagent-dashboard .panel, .coagent-dashboard .product-card, .coagent-dashboard .inbox-layout,
.coagent-dashboard .dashboard-bento>.panel, .coagent-dashboard .dashboard-flow-step,
.coagent-dashboard .dashboard-setup {border-radius: var(--radius-card); border-color: var(--border-subtle); box-shadow: var(--shadow-card);}
.coagent-dashboard .dashboard-care-card {background: var(--surface-soft);}
.coagent-dashboard .dashboard-bar {fill: var(--brand-primary);}
.coagent-dashboard .dashboard-key, .coagent-dashboard .dashboard-care-fill {background: var(--brand-primary); fill: var(--brand-primary);}
.coagent-dashboard .dashboard-key.human {background: var(--text-secondary);}
.coagent-dashboard .dashboard-next {border-radius: var(--radius-feature); background: var(--brand-navy); color: #fff;}
.coagent-dashboard .dashboard-next .primary {background: #fff; color: var(--brand-navy); border-color: #fff;}
.coagent-dashboard[data-theme="dark"] .dashboard-next {background: var(--surface-soft); color: var(--text-primary);}

/* Theme changes keep content opaque. Animate paint colors, never blur or layout. */
.coagent-dashboard, .coagent-dashboard :is(.app-shell,.sidebar,.topbar,.workspace,.panel,.product-card,.dashboard-stat-strip article,.dashboard-flow-step,.dashboard-hero,.dashboard-next,.bottom-nav) {
  transition: background-color var(--duration-normal) var(--ease-ui), color var(--duration-normal) var(--ease-ui), border-color var(--duration-normal) var(--ease-ui);
}

/* Reference composition: cool canvas, solid work cards and a quiet glass frame.
   Presentation only: controls, route actions and verified API data remain intact. */
.coagent-dashboard #content {padding: 28px 28px 20px; max-width: 1600px;}
.coagent-dashboard .sidebar .brand {padding-inline: 10px;}
.coagent-dashboard .workspace {margin: 8px 0 16px; background: var(--surface-soft); border: 1px solid var(--border-subtle);}
.coagent-dashboard .workspace>div {min-width: 0;}
.coagent-dashboard .workspace strong, .coagent-dashboard .workspace small {display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.coagent-dashboard .nav-section {padding-top: 18px; letter-spacing: 1.1px;}
.coagent-dashboard .nav-item {font-size: 13px; gap: 11px; padding-inline: 12px;}
.coagent-dashboard .nav-item .icon {stroke-width: 1.6;}
/* Compact menu groups keep every existing route reachable without a long flat list. */
.coagent-dashboard #navigation {padding: 2px; overscroll-behavior: contain; scrollbar-gutter: stable;}
.coagent-dashboard #navigation .nav-item {width: 100%;}
.coagent-dashboard .nav-primary {padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid var(--border-subtle);}
.coagent-dashboard .nav-group {margin: 0 0 4px;}
.coagent-dashboard .nav-group>summary {display: flex; align-items: center; gap: 11px; min-height: 44px; padding: 10px 12px; border-radius: var(--radius-control); color: var(--text-secondary); font: 500 13px/1.5 var(--font-ui); list-style: none; cursor: pointer; transition: background-color var(--duration-fast) var(--ease-ui), color var(--duration-fast) var(--ease-ui);}
.coagent-dashboard .nav-group>summary::-webkit-details-marker {display: none;}
.coagent-dashboard .nav-group>summary>.icon {width: 18px; height: 18px; flex-shrink: 0; stroke-width: 1.6;}
.coagent-dashboard .nav-group>summary:hover {background: var(--surface-soft); color: var(--text-primary);}
.coagent-dashboard .nav-group.has-active>summary {color: var(--action);}
.coagent-dashboard[data-theme="dark"] .nav-group.has-active>summary {color: var(--text-primary);}
.coagent-dashboard .nav-group>summary:focus-visible {outline: 2px solid var(--focus-ring); outline-offset: -2px;}
.coagent-dashboard .nav-chevron {margin-left: auto; display: flex; flex-shrink: 0; transition: transform 180ms var(--ease-ui);}
.coagent-dashboard .nav-chevron .icon {width: 14px; height: 14px;}
.coagent-dashboard .nav-group[open]>summary .nav-chevron {transform: rotate(90deg);}
.coagent-dashboard .nav-group-items {margin: 2px 0 8px 20px; padding-left: 8px; border-left: 1px solid var(--border-subtle);}
.coagent-dashboard .nav-group-items .nav-item {padding: 10px 8px; gap: 9px; margin-bottom: 2px; min-height: 44px;}
.coagent-dashboard .nav-group-items .nav-item>span {min-width: 0; overflow-wrap: anywhere; line-height: 1.5;}
.coagent-dashboard .nav-group-items .nav-item>.icon {width: 16px; height: 16px; flex-shrink: 0;}
.coagent-dashboard .nav-group-items .nav-item[data-view="playground"] {display: grid; grid-template-columns: 16px minmax(0,1fr); gap: 2px 9px;}
.coagent-dashboard .nav-group-items .nav-item[data-view="playground"]>.icon {grid-row: 1 / 3;}
.coagent-dashboard .nav-group-items .nav-item[data-view="playground"] small {grid-column: 2; justify-self: start; margin-left: 0;}
.coagent-dashboard[data-theme] .nav-group-items .nav-item.active {padding: 10px 8px;}
.coagent-dashboard .nav-group[open]>.nav-group-items {animation: nav-group-enter 180ms var(--ease-ui);}
@keyframes nav-group-enter {from {transform: translateY(-3px);} to {transform: translateY(0);}}
@media (prefers-reduced-motion: reduce) {
  .coagent-dashboard .nav-chevron {transition: none;}
  .coagent-dashboard .nav-group[open]>.nav-group-items {animation: none;}
}
.coagent-dashboard .sidebar-bottom {padding-top: 10px;}
.coagent-dashboard .assistant-note {background: linear-gradient(120deg,var(--surface-solid),var(--surface-selected)); border: 1px solid var(--glass-edge);}
.coagent-dashboard .profile {padding-inline: 5px;}
.coagent-dashboard .breadcrumbs .mobile-menu {display: inline-flex;}
.coagent-dashboard .topbar-right {gap: 8px;}
.coagent-dashboard .app-token-wallet {padding: 9px 12px; background: var(--surface-soft); border: 1px solid var(--border-subtle);}
.coagent-dashboard .app-token-wallet>.icon {color: var(--brand-primary);}
.coagent-dashboard .theme-toggle, .coagent-dashboard .language-button {background: var(--surface-solid); border-color: var(--border-subtle);}
.coagent-dashboard .theme-toggle button.active {background: var(--surface-soft);}
.coagent-dashboard .dashboard-heading {margin-bottom: 24px; align-items: flex-end;}
.coagent-dashboard .dashboard-heading h1 {font-size: clamp(25px,2.4vw,32px); font-weight: 500; letter-spacing: -1px;}
.coagent-dashboard .dashboard-date {font-size: 12px; margin-bottom: 8px;}
.coagent-dashboard .dashboard-heading-actions {gap: 8px;}
.coagent-dashboard .dashboard-worker {font-size: 11px; margin-right: 8px;}
.coagent-dashboard .dashboard-stat-strip {gap: 14px; margin: 0 0 28px; padding: 0; border: 0;}
.coagent-dashboard .dashboard-stat-strip article, .coagent-dashboard .dashboard-stat-strip article:first-child {padding: 20px; border: 1px solid var(--glass-edge); border-radius: 20px; background: var(--surface-solid); box-shadow: var(--shadow-card);}
.coagent-dashboard .dashboard-stat-label {gap: 8px; margin-bottom: 17px; color: var(--text-secondary);}
.coagent-dashboard .dashboard-stat-label .icon {color: var(--text-secondary);}
.coagent-dashboard .dashboard-stat-strip strong {font-size: 31px; font-weight: 500; letter-spacing: -1.2px;}
.coagent-dashboard .dashboard-stat-strip small {font-size: 11px; margin-top: 10px;}
.coagent-dashboard .dashboard-section-heading {margin-bottom: 18px; align-items: center;}
.coagent-dashboard .dashboard-section-heading h2 {font-size: 25px; font-weight: 400; letter-spacing: -.8px; margin-bottom: 6px;}
.coagent-dashboard .dashboard-bento {grid-template-columns: minmax(0,1.65fr) minmax(0,1fr); gap: 18px; grid-auto-flow: dense;}
.coagent-dashboard .dashboard-bento>.panel {padding: 24px; border: 1px solid var(--glass-edge); border-radius: 24px; background: var(--surface-solid);}
.coagent-dashboard .dashboard-card-heading h3 {font-size: 19px; font-weight: 500; letter-spacing: -.5px;}
.coagent-dashboard .dashboard-card-icon, .coagent-dashboard .dashboard-carousel-controls .icon-button {border-color: var(--border-subtle); background: var(--surface-soft); border-radius: 10px;}
.coagent-dashboard .dashboard-chart-total {margin-top: 23px;}
.coagent-dashboard .dashboard-chart-total strong {font-weight: 500; font-size: 39px;}
.coagent-dashboard .dashboard-order-chart {height: 155px; margin-block: 20px 12px;}
.coagent-dashboard .dashboard-bar-track {fill: var(--surface-soft);}
.coagent-dashboard .dashboard-order-chart g:hover .dashboard-bar {fill: var(--brand-royal);}
.coagent-dashboard .dashboard-card-foot {padding-top: 12px;}
.coagent-dashboard .dashboard-care-number {margin: 24px 0 18px;}
.coagent-dashboard .dashboard-care-number strong {font-size: 52px; font-weight: 400;}
.coagent-dashboard .dashboard-care-number p {max-width: 250px;}
.coagent-dashboard .dashboard-care-split {padding: 20px 0; gap: 10px;}
.coagent-dashboard .dashboard-care-card>.button {background: var(--surface-soft); border: 1px solid var(--border-subtle);}
.coagent-dashboard .dashboard-stage-accordion {flex-direction: column; gap: 7px; margin: 20px 0 12px; min-height: 0;}
.coagent-dashboard .dashboard-stage-accordion details {padding: 11px 14px; border: 1px solid var(--border-subtle); border-radius: 13px; background: var(--surface-solid); transition: background-color var(--duration-normal) var(--ease-ui), border-color var(--duration-normal) var(--ease-ui);}
.coagent-dashboard .dashboard-stage-accordion details[open] {background: var(--surface-soft); border-color: var(--border-subtle);}
.coagent-dashboard .dashboard-stage-accordion summary {flex-direction: row; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; min-height: 24px; color: var(--text-primary);}
.coagent-dashboard .dashboard-stage-accordion summary strong {font-size: 13px; padding: 4px 9px; min-width: 28px; text-align: center; border-radius: 7px; background: var(--surface-soft);}
.coagent-dashboard .dashboard-stage-accordion details[open] summary strong {background: var(--surface-solid);}
.coagent-dashboard .dashboard-stage-accordion details p {margin: 7px 0 0;}
.coagent-dashboard .dashboard-stage-accordion details>div {display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;}
.coagent-dashboard .dashboard-activity-track {margin-block: 16px; min-height: 190px;}
.coagent-dashboard .dashboard-activity-slide {background: var(--surface-soft); border-radius: 14px; padding: 17px; align-self: flex-start;}
.coagent-dashboard .dashboard-activity-empty {padding: 20px; width: 100%; border: 1px dashed var(--border-subtle); border-radius: 16px; align-self: stretch;}
.coagent-dashboard .dashboard-activity-empty>.icon {color: var(--text-secondary);}
.coagent-dashboard .dashboard-hero {grid-template-columns: minmax(0,1fr) 165px; min-height: 0; padding: 22px 24px; margin-top: 20px; border: 1px solid var(--glass-edge); background: linear-gradient(110deg,var(--surface-solid),var(--surface-selected)); border-radius: 24px;}
.coagent-dashboard .dashboard-hero-content {padding: 0; max-width: 920px;}
.coagent-dashboard .dashboard-hero h2 {font-size: 26px; letter-spacing: -.8px; font-weight: 500; line-height: 1.25;}
.coagent-dashboard .dashboard-home[lang="bn"] .dashboard-hero h2 {font-size: 26px; line-height: 1.4; letter-spacing: -.4px;}
.coagent-dashboard .dashboard-hero p {margin: 10px 0 16px; max-width: 520px; font-size: 13px;}
.coagent-dashboard .dashboard-hero-actions {gap: 8px;}
.coagent-dashboard .dashboard-hero-media {margin: 0 0 0 18px; height: 140px; align-self: center; border-radius: 18px;}
.coagent-dashboard .dashboard-hero-caption {display: none;}
.coagent-dashboard .dashboard-flow {padding: 36px 0; gap: 28px; grid-template-columns: minmax(0,1fr) minmax(0,1.6fr);}
.coagent-dashboard .dashboard-flow-intro h2 {font-size: 29px; font-weight: 400;}
.coagent-dashboard .dashboard-flow-step {padding: 20px; gap: 14px; background: var(--surface-solid); border-color: var(--glass-edge);}
.coagent-dashboard .dashboard-flow-step:hover {background: var(--surface-soft); border-color: var(--border-control);}
.coagent-dashboard .dashboard-flow-step h3 {font-size: 16px; font-weight: 500;}
.coagent-dashboard .dashboard-setup {margin-block: 0 20px;}
.coagent-dashboard .dashboard-next {padding: 28px; margin-bottom: 12px;}
.coagent-dashboard .dashboard-next h2 {font-size: 25px; font-weight: 500; letter-spacing: -.5px;}
.coagent-dashboard .main-footer {padding: 12px 28px 20px;}

/* State recipes work with current markup and optional cg-* primitives. */
.coagent-dashboard .button, .coagent-dashboard .cg-button {display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 500 var(--text-sm)/1.45 var(--font-ui); border-radius: var(--radius-control); min-height: 44px; padding: 11px 17px; transition: background-color var(--duration-fast) var(--ease-ui), color var(--duration-fast) var(--ease-ui), border-color var(--duration-fast) var(--ease-ui), transform var(--duration-fast) var(--ease-ui);}
.coagent-dashboard .primary, .coagent-dashboard #pc-form button[type="submit"], .coagent-dashboard .cg-button--primary {background: var(--action); border: 1px solid var(--action); color: var(--on-action);}
.coagent-dashboard .primary:hover, .coagent-dashboard #pc-form button[type="submit"]:hover, .coagent-dashboard .cg-button--primary:hover {background: var(--action-hover); border-color: var(--action-hover); color: var(--on-action);}
.coagent-dashboard .secondary, .coagent-dashboard .cg-button--secondary {background: var(--surface-solid); border: 1px solid var(--border-control); color: var(--text-primary);}
.coagent-dashboard .secondary:hover, .coagent-dashboard .cg-button--secondary:hover {background: var(--surface-soft); border-color: var(--action);}
.coagent-dashboard .button:active, .coagent-dashboard .cg-button:active {transform: translateY(1px);}
.coagent-dashboard .button:disabled, .coagent-dashboard .cg-button:disabled {background: var(--disabled-bg); border-color: var(--border-subtle); color: var(--disabled-ink); opacity: 1; transform: none; cursor: not-allowed;}
.coagent-dashboard button[aria-busy="true"] {cursor: progress;}
.coagent-dashboard .icon-button, .coagent-dashboard .cg-icon-button {display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px; border-radius: var(--radius-control); color: var(--text-secondary);}
.coagent-dashboard .theme-toggle button {display: grid; place-items: center;}
.coagent-dashboard .icon-button:hover {background: var(--surface-soft); color: var(--action);}
.coagent-dashboard :is(button,a,summary):focus-visible {outline: 2px solid var(--focus-ring); outline-offset: 3px;}
.coagent-dashboard :is(input,textarea,select), .coagent-dashboard .cg-field {background: var(--surface-solid); color: var(--text-primary); border: 1px solid var(--border-control); border-radius: var(--radius-control); font-family: var(--font-ui); font-size: var(--text-sm); line-height: 1.5;}
.coagent-dashboard :is(input,textarea)::placeholder {color: var(--text-secondary); opacity: 1;}
.coagent-dashboard :is(input,textarea,select):focus-visible {outline: 2px solid var(--focus-ring); outline-offset: 2px; border-color: var(--action);}
.coagent-dashboard :is(input,textarea,select):disabled {background: var(--disabled-bg); color: var(--disabled-ink); cursor: not-allowed;}
.coagent-dashboard [aria-invalid="true"], .coagent-dashboard input.is-invalid, .coagent-dashboard textarea.is-invalid {border-color: var(--error-ink);}
.coagent-dashboard .form-error {color: var(--error-ink); font-size: var(--text-xs);}
.coagent-dashboard .field>label, .coagent-dashboard .cg-label {font-size: var(--text-sm); font-weight: 500; color: var(--text-primary);}
.coagent-dashboard .segment-control, .coagent-dashboard .range-control {background: var(--surface-soft); border-radius: var(--radius-control);}
.coagent-dashboard .segment-control button, .coagent-dashboard .range-control button, .coagent-dashboard .setup-tab {border-radius: 10px;}
.coagent-dashboard[data-theme] .segment-control button.active, .coagent-dashboard[data-theme] .segment-control.lime button.active, .coagent-dashboard[data-theme] .range-control button.active, .coagent-dashboard[data-theme] .setup-tab.active {background: var(--action); color: var(--on-action); box-shadow: none;}
.coagent-dashboard dialog {border: 1px solid var(--border-subtle); border-radius: var(--radius-feature); box-shadow: var(--shadow-dialog); background: var(--surface-solid); color: var(--text-primary);}
.coagent-dashboard dialog::backdrop {background: rgba(6,21,46,.48);}
.coagent-dashboard .data-table {font-size: var(--text-sm); color: var(--text-primary);}
.coagent-dashboard .data-table th {font-size: var(--text-xs); font-weight: 600; color: var(--text-secondary); background: var(--surface-soft);}
.coagent-dashboard .data-table td, .coagent-dashboard .data-table th {border-color: var(--border-subtle);}
.coagent-dashboard .data-table tbody tr:hover {background: var(--surface-soft);}
.coagent-dashboard .toast {background: var(--surface-solid); color: var(--text-primary); border: 1px solid var(--border-control); border-radius: var(--radius-control); box-shadow: var(--shadow-float); font-size: var(--text-sm);}
.coagent-dashboard .pill, .coagent-dashboard .cg-badge {font: 500 var(--text-xs)/1.5 var(--font-ui); padding: 4px 9px; border-radius: var(--radius-round);}
/* The old green badge has an !important color; scope this compatibility override. */
.coagent-dashboard .pill.green {background: var(--success-bg); color: var(--success-ink) !important;}
.coagent-dashboard .pill.orange, .coagent-dashboard .cg-badge[data-tone="warning"] {background: var(--warning-bg); color: var(--warning-ink);}
.coagent-dashboard .pill.red, .coagent-dashboard .cg-badge[data-tone="error"] {background: var(--error-bg); color: var(--error-ink);}
.coagent-dashboard .cg-badge[data-tone="success"] {background: var(--success-bg); color: var(--success-ink);}
.coagent-dashboard .cg-badge[data-tone="info"] {background: var(--info-bg); color: var(--info-ink);}
.coagent-dashboard[data-theme] .info-note {background: var(--info-bg); color: var(--info-ink); border-color: var(--border-subtle); border-radius: var(--radius-control);}
.coagent-dashboard[data-theme] .message.assistant .message-bubble {background: var(--surface-selected); color: var(--text-primary); border-color: var(--border-subtle); border-radius: 16px 16px 4px 16px;}
.coagent-dashboard[data-theme] .message.admin .message-bubble {background: var(--surface-soft); color: var(--text-primary); border-color: var(--border-subtle); border-radius: 16px 16px 4px 16px;}
.coagent-dashboard .message-bubble {background: var(--surface-solid); border-color: var(--border-subtle); border-radius: 16px 16px 16px 4px; font-size: var(--text-sm); line-height: 1.6;}
.coagent-dashboard .message-label {font-size: var(--text-xs); color: var(--text-secondary);}
.coagent-dashboard .empty-state, .coagent-dashboard .loading-state {color: var(--text-secondary); font-size: var(--text-sm);}
.coagent-dashboard .empty-state h3 {color: var(--text-primary); font-size: var(--text-lg);}
.coagent-dashboard .cg-tooltip {background: var(--brand-navy); color: #fff; border-radius: 8px; padding: 8px 12px; font: 400 var(--text-xs)/1.5 var(--font-ui); max-width: 280px;}
.coagent-dashboard .cg-skeleton {border-radius: var(--radius-control); background: linear-gradient(90deg,var(--border-subtle),var(--surface-soft),var(--border-subtle)); background-size: 200% 100%; animation: cg-shimmer 1.8s ease-in-out infinite;}
@keyframes cg-shimmer {to {background-position: -200% 0;}}
.coagent-dashboard .cg-channel--facebook {--channel-color: #0866ff;}
.coagent-dashboard .cg-channel--messenger {--channel-color: #006aff;}
.coagent-dashboard .cg-channel--instagram {--channel-color: #c13584;}
.coagent-dashboard .cg-channel--whatsapp {--channel-color: #128c7e;}
.coagent-dashboard .cg-channel-mark {color: var(--channel-color,var(--action)); width: 24px; height: 24px; flex-shrink: 0;}

/* Preserve existing breakpoints and navigation behavior. No new routing/state. */
@media (min-width: 921px) {
  /* Only the shell resizes during an explicit collapse; feature content never fades. */
  .coagent-dashboard .main-shell {transition: margin-left 240ms var(--ease-ui), width 240ms var(--ease-ui);}
  .coagent-dashboard[data-theme] .sidebar {transition: transform 240ms var(--ease-ui), visibility 240ms, background-color var(--duration-normal) var(--ease-ui);}
  .coagent-dashboard .sidebar-hidden .sidebar {transform: translateX(-120%); visibility: hidden;}
  .coagent-dashboard .sidebar-hidden .main-shell {margin-left: 0; width: 100%;}
}
@media (max-width: 1190px) and (min-width: 921px) {
  .coagent-dashboard .sidebar {width: 196px; left: 28px;}
  .coagent-dashboard .main-shell {margin-left: 208px; width: calc(100% - 208px);}
  .coagent-dashboard #content {padding-inline: 22px;}
  .coagent-dashboard .dashboard-stat-strip article {padding: 17px;}
  .coagent-dashboard .nav-item small {display: none;}
}
@media (max-width: 920px) {
  .coagent-dashboard .app-shell {margin: 0; border: 0; border-radius: 0; min-height: 100vh;}
  .coagent-dashboard .sidebar {inset: 12px auto 12px 12px; width: 248px;}
  .coagent-dashboard[data-theme] .sidebar {transition: transform 240ms var(--ease-ui), visibility 240ms, background-color var(--duration-normal) var(--ease-ui);}
  .coagent-dashboard .main-shell {margin-left: 0; width: 100%;}
  .coagent-dashboard .sidebar {transform: translateX(-110%); visibility: hidden; z-index: 100;}
  .coagent-dashboard .sidebar.open {transform: translateX(0); visibility: visible;}
  .coagent-dashboard .sidebar-open>.sidebar-backdrop {display: block; position: fixed; inset: 0; z-index: 99; border: 0; border-radius: 0; background: rgba(0,0,0,.42); cursor: default;}
  .coagent-dashboard .breadcrumbs .mobile-menu {display: inline-flex;}
  .coagent-dashboard .topbar {margin: 12px 16px 0;}
  .coagent-dashboard .dashboard-bento {grid-template-columns: minmax(0,1.25fr) minmax(0,1fr);}
  .coagent-dashboard .bottom-nav {background: var(--surface-solid); border-color: var(--border-subtle);}
  .coagent-dashboard .bottom-nav-item.active {color: var(--action);}
  .coagent-dashboard .bottom-nav-item.active>span {background: var(--surface-selected);}
}
@media (max-width: 650px) {
  .coagent-dashboard .topbar {margin: 8px 8px 0; padding-inline: 8px; height: 58px; border-radius: 16px;}
  .coagent-dashboard #content {padding: 24px 14px 12px;}
  .coagent-dashboard .app-token-wallet {padding: 8px; font-size: 10px;}
  .coagent-dashboard .dashboard-heading {align-items: center; margin-bottom: 20px;}
  .coagent-dashboard .dashboard-heading-actions>.primary {display: none;}
  .coagent-dashboard .dashboard-stat-strip {grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-bottom: 26px;}
  .coagent-dashboard .dashboard-stat-strip article, .coagent-dashboard .dashboard-stat-strip article:first-child {padding: 16px 14px; border: 1px solid var(--glass-edge); border-radius: 18px;}
  .coagent-dashboard .dashboard-stat-strip strong {font-size: 28px;}
  .coagent-dashboard .dashboard-stat-label {margin-bottom: 13px; font-size: 11px;}
  .coagent-dashboard .dashboard-stat-strip small {font-size: 11px;}
  .coagent-dashboard .dashboard-section-heading {gap: 12px; flex-wrap: wrap;}
  .coagent-dashboard .dashboard-section-heading h2 {font-size: 23px;}
  .coagent-dashboard .dashboard-bento {grid-template-columns: minmax(0,1fr); gap: 14px;}
  .coagent-dashboard .dashboard-bento>.panel {padding: 20px; border-radius: 22px;}
  .coagent-dashboard .dashboard-hero {grid-template-columns: minmax(0,1fr); padding: 24px;}
  .coagent-dashboard .dashboard-hero-media {display: none;}
  .coagent-dashboard .dashboard-flow {grid-template-columns: minmax(0,1fr); padding-block: 30px;}
  .coagent-dashboard .dashboard-next {padding: 24px;}
  .coagent-dashboard .dashboard-next h2 {font-size: 23px;}
  .coagent-dashboard .main-footer {padding-bottom: 90px;}
  .coagent-dashboard .dashboard-hero h2 {font-size: clamp(26px,7vw,34px); letter-spacing: -1px;}
  .coagent-dashboard .dashboard-home[lang="bn"] .dashboard-hero h2 {font-size: 28px; letter-spacing: -.5px; line-height: 1.4;}
  .coagent-dashboard .icon-button, .coagent-dashboard .cg-icon-button {min-width: 44px; min-height: 44px;}
  .coagent-dashboard .theme-toggle button {width: 28px; height: 44px;}
  .coagent-dashboard .language-button {font-size: 10px; padding-inline: 7px;}
  .coagent-dashboard .breadcrumbs {gap: 6px;}
  .coagent-dashboard .breadcrumbs strong {font-size: 12px;}
  .coagent-dashboard .topbar-right {gap: 4px;}
  .coagent-dashboard .dashboard-heading h1 {font-size: 22px;}
  .coagent-dashboard .dashboard-heading-actions>.button {font-size: 0; width: 44px; min-width: 44px; padding: 10px;}
  /* Two calm rows keep wallet, mode, theme and language controls reachable. */
  .coagent-dashboard:not(.coagent-master) .topbar {height: auto; min-height: 104px; padding: 8px 10px; flex-wrap: wrap; row-gap: 4px;}
  .coagent-dashboard:not(.coagent-master) .breadcrumbs {width: 100%;}
  .coagent-dashboard:not(.coagent-master) .topbar-right {width: 100%; justify-content: space-between; gap: 4px;}
  .coagent-dashboard .agent-mode {width: 148px; height: 40px;}
}
@media (prefers-reduced-motion: reduce) {
  .coagent-dashboard .cg-skeleton {animation: none; background: var(--border-subtle);}
}
@media (max-width: 360px) {
  .coagent-dashboard:not(.coagent-master) .topbar-right {display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px;}
  .coagent-dashboard:not(.coagent-master) .agent-mode, .coagent-dashboard:not(.coagent-master) .language-button {justify-self: end;}
  .coagent-dashboard:not(.coagent-master) .theme-toggle {justify-self: start;}
}
/* Workspace identity and compact controls; Master keeps its own header. */
.coagent-dashboard:not(.coagent-master) .topbar {gap: 20px;}
.coagent-dashboard:not(.coagent-master) .workspace-identity {display: flex; align-items: center; gap: 16px; min-width: 0;}
.coagent-dashboard:not(.coagent-master) #breadcrumb {font-size: 18px; font-weight: 600; color: var(--text-primary);}
.coagent-dashboard:not(.coagent-master) .header-business-menu {position: relative; min-width: 0;}
.coagent-dashboard:not(.coagent-master) .header-business-menu>summary {display: flex; align-items: center; gap: 7px; padding: 3px 8px; height: 38px; border: 1px solid var(--border-subtle); border-radius: var(--radius-control); background: var(--surface-soft); cursor: pointer; list-style: none;}
.coagent-dashboard:not(.coagent-master) .header-business-menu>summary::-webkit-details-marker {display: none;}
.coagent-dashboard:not(.coagent-master) .header-business-menu>summary>.icon {width: 14px; height: 14px; flex-shrink: 0; color: var(--text-secondary);}
.coagent-dashboard:not(.coagent-master) #header-business-name {font-size: 13px; font-weight: 600; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.coagent-dashboard:not(.coagent-master) .header-business-initial {display: grid; place-items: center; width: 24px; height: 24px; flex-shrink: 0; border-radius: 8px; background: var(--action); color: var(--on-action); font-size: 12px; font-weight: 600;}
.coagent-dashboard:not(.coagent-master) .header-business-popover {position: absolute; z-index: 30; top: calc(100% + 8px); left: 0; min-width: 210px; padding: 12px; border: 1px solid var(--border-subtle); border-radius: var(--radius-control); background: var(--surface-solid); box-shadow: var(--shadow-card);}
.coagent-dashboard:not(.coagent-master) .header-business-popover small {display: block; color: var(--text-secondary); font-size: 11px; margin-bottom: 8px;}
.coagent-dashboard:not(.coagent-master) .header-business-popover .button {width: 100%; font-size: 12px;}
.coagent-dashboard:not(.coagent-master) .topbar-right {flex-shrink: 0; gap: 10px;}
.coagent-dashboard:not(.coagent-master) .topbar .app-token-wallet,
.coagent-dashboard:not(.coagent-master) .topbar .theme-toggle,
.coagent-dashboard:not(.coagent-master) .topbar .language-button {height: 38px; border-radius: var(--radius-control);}
@media (min-width: 921px) {
  .coagent-dashboard:not(.coagent-master) .breadcrumbs #menu-toggle {display: none;}
  .coagent-dashboard:not(.coagent-master) .sidebar-hidden .breadcrumbs #menu-toggle {display: inline-flex;}
}
@media (max-width: 650px) {
  .coagent-dashboard:not(.coagent-master) .topbar {gap: 6px;}
  .coagent-dashboard:not(.coagent-master) .workspace-identity {gap: 10px;}
  .coagent-dashboard:not(.coagent-master) #breadcrumb {font-size: 15px;}
  .coagent-dashboard:not(.coagent-master) #header-business-name {max-width: 140px;}
  .coagent-dashboard:not(.coagent-master) .topbar-right {gap: 4px;}
}
@media (prefers-reduced-transparency: reduce) {
  .coagent-dashboard .sidebar, .coagent-dashboard .topbar, .coagent-dashboard .cg-glass {background: var(--surface-solid) !important; -webkit-backdrop-filter: none; backdrop-filter: none;}
}
/* Mobile navigation lives in the existing drawer; the header contains only Page mode. */
@media (max-width:920px) {
  .coagent-dashboard:not(.coagent-master) .topbar {height:60px;min-height:60px;max-height:60px;flex-wrap:nowrap;padding:8px 12px;gap:0;}
  .coagent-dashboard:not(.coagent-master) .topbar>.breadcrumbs,
  .coagent-dashboard:not(.coagent-master) .topbar-right>:not(#agent-mode):not(#agent-mode-help):not(#conversation-mode):not(#conversation-mode-help) {display:none;}
  .coagent-dashboard:not(.coagent-master) .topbar-right {display:flex;width:100%;justify-content:flex-start;gap:0;}
  .coagent-dashboard:not(.coagent-master) .topbar #agent-mode {height:44px;justify-self:auto;}
  body.coagent-dashboard:not(.coagent-master):has(#app-shell.sidebar-open:not([hidden])) {overflow:hidden;}
}
@media (forced-colors: active) {
  .coagent-dashboard .sidebar, .coagent-dashboard .topbar, .coagent-dashboard .cg-glass {background: Canvas !important; border: 1px solid CanvasText; box-shadow: none; backdrop-filter: none;}
  .coagent-dashboard .button, .coagent-dashboard .nav-item.active {border: 1px solid ButtonText;}
  .coagent-dashboard :focus-visible {outline-color: Highlight;}
}