/* Signal component skin. Opt in with body.cc-theme. Keep existing layout CSS.
   All visual values come from theme.css; structural CSS keywords remain literal.
   New API: .cc-*; existing shared/sales selectors are explicitly adapted below. */
.cc-theme { color-scheme: var(--scheme); background: var(--bg); color: var(--text); font-family: var(--font-body); font-size: var(--type-base); line-height: var(--leading-normal); }
.cc-theme :is(h1,h2,h3,h4) { color: var(--text); font-family: var(--font-display); }
.cc-theme :is(a,.cc-link) { color: var(--accent); text-underline-offset: var(--space-1); }
.cc-theme :is(button,input,select,textarea,a,summary):focus-visible { outline: var(--focus-width) solid var(--accent); outline-offset: var(--focus-offset); }
.cc-theme :is(.cc-page-header,.st-head,.dashboard-header) h1 { font-size: var(--type-xl); font-weight: var(--weight-heavy); letter-spacing: var(--tracking-tight); line-height: var(--leading-tight); }
.cc-theme :is(.cc-page-header,.st-head,.dashboard-header) p,
.cc-theme :is(.cc-muted,.st-muted,.st-sub,.card-hint,.st-agent-last,.st-agent-foot) { color: var(--muted); }
.cc-theme :is(.cc-kicker,.st-kicker) { color: var(--accent); font: var(--weight-bold) var(--type-xs)/var(--leading-normal) var(--font-mono); letter-spacing: var(--tracking-label); text-transform: uppercase; }
.cc-theme :is(.cc-card,.card) { background: var(--surface); color: var(--text); border: var(--line-width) solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); }
.cc-theme :is(.cc-card,.card) h2 { font-size: var(--type-md); font-weight: var(--weight-bold); }
.cc-theme :is(.cc-stat,.st-stat) { background: var(--surface-inset); border: var(--line-width) solid var(--border); border-radius: var(--radius-md); padding: var(--space-3); box-shadow: var(--shadow-flat); }
.cc-theme :is(.cc-stat-label,.st-stat .l) { font-size: var(--type-xs); color: var(--muted); letter-spacing: var(--tracking-label); text-transform: uppercase; }
.cc-theme :is(.cc-stat-value,.st-stat .v) { margin-top: var(--space-1); font: var(--weight-bold) var(--type-xl)/var(--leading-tight) var(--font-display); color: var(--text); font-variant-numeric: tabular-nums; letter-spacing: var(--tracking-tight); }
.cc-theme .cc-stat-note { font-size: var(--type-xs); color: var(--muted); margin-top: var(--space-2); }
.cc-theme :is(.cc-positive,.cc-stat-value.cc-positive) { color: var(--success); }
.cc-theme :is(.cc-negative,.cc-stat-value.cc-negative) { color: var(--danger); }
.cc-theme .cc-warning { color: var(--warn); }
.cc-theme .cc-table-wrap { overflow-x: auto; }
.cc-theme :is(.cc-table,table) { border-collapse: collapse; color: var(--text); font-size: var(--type-sm); font-variant-numeric: tabular-nums; }
.cc-theme :is(.cc-table,table) :is(td,th) { padding: var(--table-cell-y) var(--table-cell-x); border-bottom: var(--line-width) solid var(--border); }
.cc-theme :is(.cc-table,table) th { color: var(--muted); background: var(--surface-inset); font-size: var(--type-xs); font-weight: var(--weight-bold); letter-spacing: var(--tracking-label); text-align: left; text-transform: uppercase; }
.cc-theme :is(.cc-table,table) :is(td,th).cc-number { text-align: right; }
.cc-theme :is(.cc-table,table) tbody tr:hover { background: var(--surface-hover); }
.cc-theme :is(.cc-table,table) tr[aria-selected="true"] { background: var(--accent-soft); }
.cc-theme :is(.cc-chip,.st-pill,.st-badge,.role-pill) { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-1) var(--space-3); border: var(--line-width) solid var(--border); border-radius: var(--radius-pill); background: var(--surface-raised); color: var(--muted); font-size: var(--type-xs); font-weight: var(--weight-bold); }
.cc-theme :is(.cc-chip--accent,.st-pill.teal) { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); }
.cc-theme :is(.cc-chip--success,.st-pill.won) { color: var(--success); background: var(--success-soft); }
.cc-theme :is(.cc-chip--warn,.st-pill.amber,.st-badge.review) { color: var(--warn); background: var(--warn-soft); }
.cc-theme :is(.cc-chip--danger,.st-pill.red,.st-badge.human) { color: var(--danger); background: var(--danger-soft); }
.cc-theme :is(.cc-button,.st-btn) { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--control-height); padding: var(--space-2) var(--space-4); border: var(--line-width) solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface-raised); color: var(--text); font: var(--weight-bold) var(--type-sm)/var(--leading-normal) var(--font-body); text-decoration: none; cursor: pointer; transition: background var(--motion-fast) var(--ease), border-color var(--motion-fast) var(--ease); }
.cc-theme :is(.cc-button,.st-btn):hover { background: var(--surface-hover); border-color: var(--accent); }
.cc-theme :is(.cc-button--primary,.st-btn.primary) { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.cc-theme :is(.cc-button--primary,.st-btn.primary):hover { background: var(--accent-hover); }
.cc-theme .cc-button--ghost { background: var(--clear); border-color: var(--border); }
.cc-theme :is(.cc-button--danger,.st-btn.danger) { color: var(--danger); border-color: var(--danger); background: var(--danger-soft); }
.cc-theme :is(.cc-button,.st-btn):disabled { opacity: var(--opacity-disabled); cursor: not-allowed; }
.cc-theme :is(.cc-input,.cc-select,input:not([type=checkbox]):not([type=radio]),select,textarea) { background: var(--surface-inset); color: var(--text); border: var(--line-width) solid var(--border-strong); border-radius: var(--radius-sm); padding: var(--space-2) var(--space-3); font: var(--weight-normal) var(--type-base)/var(--leading-normal) var(--font-body); accent-color: var(--accent); }
.cc-theme :is(input,textarea)::placeholder { color: var(--muted); opacity: var(--opacity-full); }
.cc-theme :is(input,select,textarea)[aria-invalid="true"] { border-color: var(--danger); }
.cc-theme :is(input,select,textarea):disabled { opacity: var(--opacity-disabled); cursor: not-allowed; }
.cc-theme :is(input[type=checkbox],input[type=radio]) { accent-color: var(--accent); }
.cc-theme :is(.cc-tabs,.cc-segmented,.st-seg) { display: inline-flex; gap: var(--space-1); padding: var(--space-1); background: var(--surface-inset); border: var(--line-width) solid var(--border); border-radius: var(--radius-pill); }
.cc-theme :is(.cc-tabs,.cc-segmented,.st-seg) button,
.cc-theme .st-filters button { padding: var(--space-2) var(--space-3); color: var(--muted); background: var(--clear); border: var(--line-width) solid var(--clear); border-radius: var(--radius-pill); font: var(--weight-bold) var(--type-xs)/var(--leading-normal) var(--font-body); cursor: pointer; }
.cc-theme :is(.cc-tabs,.cc-segmented,.st-seg,.st-filters) :is([aria-selected=true],[aria-pressed=true],.active) { color: var(--accent); background: var(--accent-soft); border-color: var(--accent); }
.cc-theme :is(.cc-sidebar,.workspace-sidebar,.workspace-bar) { background: var(--surface-inset); color: var(--muted); border-color: var(--border); box-shadow: var(--shadow-flat); }
.cc-theme :is(.workspace-brand,.workspace-mini-brand) { color: var(--text) !important; }
.cc-theme :is(.workspace-brand-copy small,.workspace-bar>a) { color: var(--muted); }
.cc-theme :is(.cc-sidebar a,.workspace-sidebar nav>a,.workspace-group summary,.workspace-group a,.workspace-signout) { color: var(--muted); border-radius: var(--radius-sm); }
.cc-theme :is(.cc-sidebar a,.workspace-sidebar nav>a,.workspace-group summary,.workspace-group a):hover { background: var(--surface-hover); color: var(--text); }
.cc-theme :is(.cc-sidebar,.workspace-sidebar) a[aria-current=page] { color: var(--accent); background: var(--accent-soft); box-shadow: var(--shadow-active); }
.cc-theme .workspace-emblem { background: var(--accent-soft); border-color: var(--accent); box-shadow: var(--shadow-flat); }
.cc-theme .brand-mark span { background: var(--accent); animation: none !important; }
/* Keep the existing strip/grid geometry. No background textures or fake signals. */
.cc-theme :is(.cc-agent-stage,.agent-stage), .cc-theme #sales-team .st-board { background: var(--surface-inset); border: var(--line-width) solid var(--border); border-radius: var(--radius-lg); color: var(--text); }
.cc-theme :is(.agent-stage,.agent-card)::before,.cc-theme :is(.agent-stage,.agent-card)::after,
.cc-theme #sales-team .st-board::before,.cc-theme #sales-team .st-board::after,
.cc-theme #sales-team .st-board .st-agent::before { display: none; }
.cc-theme :is(.cc-agent,.agent-card),.cc-theme #sales-team .st-board .st-agent { background: var(--surface); color: var(--text); border: var(--line-width) solid var(--border-strong); border-radius: var(--radius-md); padding: var(--space-3); opacity: var(--opacity-full); filter: none; box-shadow: var(--shadow-flat); transition: border-color var(--motion-normal) var(--ease),box-shadow var(--motion-normal) var(--ease); }
.cc-theme :is(.cc-agent-top,.agent-top),.cc-theme #sales-team .st-agent-top { display: flex; align-items: center; gap: var(--space-2); }
.cc-theme :is(.cc-agent-name,.agent-name),.cc-theme #sales-team .st-agent-title { color: var(--text); font: var(--weight-bold) var(--type-sm)/var(--leading-tight) var(--font-display); white-space: normal; }
.cc-theme :is(.cc-agent-role,.agent-role),.cc-theme #sales-team .st-agent-blurb { color: var(--muted); font-size: var(--type-xs); }
.cc-theme :is(.cc-agent-avatar,.agent-avatar),.cc-theme #sales-team .st-avatar { display: grid; place-items: center; width: var(--avatar-size); height: var(--avatar-size); flex-shrink: var(--space-0); border-radius: var(--radius-sm); background: var(--surface-raised); color: var(--accent); border: var(--line-width) solid var(--border); box-shadow: var(--shadow-flat); font-weight: var(--weight-heavy); }
.cc-theme #sales-team .st-avatar.research { color: var(--research); }
.cc-theme #sales-team .st-avatar.manager { color: var(--manager); }
.cc-theme #sales-team .st-avatar.closer { color: var(--closer); }
.cc-theme :is(.cc-agent-task,.agent-task),.cc-theme #sales-team .st-agent-state { color: var(--text); font-size: var(--type-sm); line-height: var(--leading-normal); margin-top: var(--space-2); }
.cc-theme :is(.cc-agent-meta,.agent-last,.agent-foot),.cc-theme #sales-team :is(.st-agent-last,.st-agent-foot) { color: var(--muted); font: var(--weight-normal) var(--type-xs)/var(--leading-normal) var(--font-mono); letter-spacing: normal; font-variant-caps: normal; }
.cc-theme :is(.cc-agent-dot,.agent-dot),.cc-theme #sales-team .st-dot { display: inline-block; width: var(--dot-size); height: var(--dot-size); flex-shrink: var(--space-0); margin-left: auto; background: var(--muted); border-radius: var(--radius-pill); box-shadow: var(--shadow-flat); animation: none; }
.cc-theme .agent-dot::after,.cc-theme #sales-team .st-dot::after { display: none; }
.cc-theme .cc-agent[data-state=working],.cc-theme .agent-card.working,.cc-theme #sales-team .st-board .st-agent.working { border-color: var(--accent); box-shadow: var(--shadow-glow); }
.cc-theme .cc-agent[data-state=working] .cc-agent-dot,.cc-theme .agent-card.working .agent-dot,.cc-theme #sales-team .st-agent.working .st-dot { background: var(--accent); animation: cc-working var(--motion-pulse) var(--ease) infinite; }
.cc-theme .cc-agent:is([data-state=blocked],[data-state=stale]),.cc-theme .agent-card.blocked,.cc-theme .agent-card.stale,.cc-theme #sales-team .st-board .st-agent:is(.blocked,.stale) { border-color: var(--warn); box-shadow: var(--shadow-flat); }
.cc-theme .cc-agent:is([data-state=blocked],[data-state=stale]) .cc-agent-dot,.cc-theme .agent-card:is(.blocked,.stale) .agent-dot,.cc-theme #sales-team .st-agent:is(.blocked,.stale) .st-dot { background: var(--warn); animation: none; }
.cc-theme .cc-agent[data-state=done] .cc-agent-dot { background: var(--success); animation: none; }
.cc-theme .cc-agent[data-state=off] .cc-agent-dot,.cc-theme .cc-agent[data-state=idle] .cc-agent-dot { background: var(--muted); animation: none; }
@keyframes cc-working { from { box-shadow: var(--shadow-pulse-start); } to { box-shadow: var(--shadow-pulse-end); } }
.cc-theme :is(.cc-toast,.st-toast) { position: fixed; right: var(--space-5); bottom: var(--space-5); max-width: var(--toast-width); padding: var(--space-3) var(--space-4); background: var(--surface-raised); color: var(--text); border: var(--line-width) solid var(--border-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-pop); z-index: var(--layer-toast); }
.cc-theme :is(.cc-toast--danger,.st-toast.bad) { border-color: var(--danger); }
.cc-theme :is(.cc-empty,.st-empty,.empty-state) { padding: var(--space-8) var(--space-4); color: var(--muted); font-size: var(--type-base); text-align: center; background: var(--clear); }
.cc-theme #sales-team .st-draft { border-left: var(--status-width) solid var(--warn) !important; }
.cc-theme #sales-team .st-row { color: var(--text); border-color: var(--border); }
.cc-theme #sales-team .st-row:hover { background: var(--surface-hover); }
.cc-theme #sales-team .st-row.active { background: var(--accent-soft); }
.cc-theme #sales-team :is(.st-msg.inbound,.st-pre,.st-lesson .diff div) { color: var(--text); background: var(--surface-raised); }
.cc-theme #sales-team .st-msg.outbound { background: var(--accent-soft); color: var(--text); }
.cc-theme #sales-team :is(.st-row-preview,.st-kv,.st-score-note,.st-lesson details) { color: var(--text); }
.cc-theme #sales-team :is(.st-row-sub,.st-msg-meta) { color: var(--muted); opacity: var(--opacity-full); }
.cc-theme #sales-team :is(.st-thread-head,.st-list-head,.st-ev,.st-lesson,.st-history) { border-color: var(--border); }
.cc-theme .agent-card.changed :is(.agent-task,.agent-last),
.cc-theme .status.processing::before { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .cc-theme *, .cc-theme *::before, .cc-theme *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

.cc-theme .cc-agent[data-state=error] { border-color: var(--danger); box-shadow: var(--shadow-flat); }
.cc-theme .cc-agent[data-state=error] .cc-agent-dot { background: var(--danger); animation: none; }