/* Overview: a delivery brief, with exceptions ahead of the project portfolio. */
.content:has(.overview) { max-width: 1536px; padding: 36px 40px 48px; }
.overview { --overview-blue: #315ddc; --overview-ink: #182638; --overview-muted: #607086; --overview-line: #e3e9ef; color: var(--overview-ink); font-family: "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif; font-size: 14px; }
.overview-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 30px; }
.overview-title { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.overview h1 { font-size: 32px; font-weight: 650; letter-spacing: -.035em; line-height: 1.2; }
.overview-header p { margin-top: 9px; color: var(--overview-muted); font-size: 15px; }
.overview-demo { padding: 4px 9px; border: 1px solid #d8e1ee; border-radius: 5px; color: #607086; font-size: 12px; font-weight: 500; }
.overview-date { color: var(--overview-muted); font-size: 13px; white-space: nowrap; }
.overview-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 0 0 32px;
  padding: 0;
  border-bottom: 0;
}
.overview-metric {
  background: #ffffff;
  border: 1px solid var(--overview-line);
  border-radius: 12px;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 120px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.overview-metric:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}
.overview-metric:first-child {
  border-left: 1px solid var(--overview-line);
  padding-left: 24px;
}
.overview-metric dt {
  color: var(--overview-muted);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.overview-metric dd {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  margin: 8px 0 0;
}
.overview-metric strong {
  font-size: 46px;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
  color: var(--overview-ink);
  font-variant-numeric: tabular-nums;
}
.overview-metric dd span {
  color: var(--overview-muted);
  font-size: 13px;
  font-weight: 500;
  margin-top: 2px;
}
.overview-metric.is-review {
  background: #fdfbf7;
  border-color: #f1e2c8;
}
.overview-metric.is-review strong {
  color: #b45309;
}
.overview-metric.is-late {
  background: #fef8f8;
  border-color: #fbd5d5;
}
.overview-metric.is-late strong {
  color: #dc2626;
}
.overview-layout { display: grid; grid-template-columns: minmax(0, 1fr) 292px; align-items: start; gap: 30px; }
.overview-primary { min-width: 0; display: grid; gap: 28px; }
.overview-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 15px; }
.overview h2 { font-size: 18px; letter-spacing: -.02em; font-weight: 650; }
.overview-section-heading h2 { display: flex; gap: 9px; align-items: center; }
.overview-count { display: inline-flex; align-items: center; justify-content: center; height: 23px; min-width: 23px; padding: 0 6px; border-radius: 6px; background: #e8edf4; color: #4b6078; font-size: 12px; font-weight: 600; }
.overview-section-heading a, .overview-footer-link { color: var(--overview-muted); font-size: 13px; font-weight: 500; }
.overview-attention { border: 1px solid var(--overview-line); border-radius: 10px; background: white; overflow: hidden; }
.overview-priority { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 13px; align-items: center; padding: 19px 20px; border-top: 1px solid var(--overview-line); }
.overview-priority:first-child { border-top: 0; }
.overview-priority-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; color: #986318; background: #fff5e5; }
.overview-priority.is-late .overview-priority-icon { color: #b64040; background: #fceeee; }
.overview-priority .link-button { font-size: 14px; font-weight: 600; color: var(--overview-ink); line-height: 1.45; }
.overview-priority-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 5px; color: var(--overview-muted); font-size: 12px; }
.overview-priority-state { color: #986318; font-size: 12px; font-weight: 600; white-space: nowrap; }
.overview-priority.is-late .overview-priority-state { color: #b64040; }
.overview-projects { background: white; border: 1px solid var(--overview-line); border-radius: 10px; overflow: hidden; }
.overview-project-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 13px; }
.overview-project-table th { padding: 12px 18px; background: #f9fafc; color: var(--overview-muted); font-size: 12px; font-weight: 500; border-bottom: 1px solid var(--overview-line); }
.overview-project-table td { padding: 19px 18px; border-bottom: 1px solid var(--overview-line); }
.overview-project-table tbody tr:last-child td { border-bottom: 0; }
.overview-project-table tbody tr:hover { background: #fafbfe; }
.overview-project-table .link-button { color: var(--overview-ink); font-size: 14px; font-weight: 600; }
.overview-project-sub { display: block; color: var(--overview-muted); font-size: 12px; margin-top: 4px; }
.overview-status { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; font-size: 12px; }
.overview-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #6282c5; }
.overview-status.is-blocked::before { background: #c58c35; }
.overview-status.is-completed::before { background: #29856c; }
.overview-progress { display: flex; align-items: center; gap: 10px; min-width: 104px; }
.overview-progress progress { width: 72px; height: 5px; background: #e8edf4; color: var(--overview-blue); }
.overview-progress progress::-webkit-progress-bar { background: #e8edf4; }
.overview-progress progress::-webkit-progress-value { background: var(--overview-blue); }
.overview-progress progress::-moz-progress-bar { background: var(--overview-blue); }
.overview-progress.is-completed progress::-webkit-progress-value { background: #29856c; }
.overview-progress.is-completed progress::-moz-progress-bar { background: #29856c; }
.overview-progress span { font-size: 12px; font-variant-numeric: tabular-nums; }
.overview-due { white-space: nowrap; }
.overview-aside { min-width: 0; padding-left: 26px; border-left: 1px solid var(--overview-line); }
.overview-workload { padding-bottom: 26px; margin-bottom: 24px; border-bottom: 1px solid var(--overview-line); }
.overview-workload p { color: var(--overview-muted); margin: 7px 0 19px; font-size: 13px; }
.overview-workload-row { display: grid; grid-template-columns: minmax(0, 1fr) 26px; gap: 7px 12px; margin-top: 14px; font-size: 13px; }
.overview-workload-row strong { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.overview-workload-row progress { grid-column: 1 / -1; height: 4px; color: var(--workload-color); }
.overview-workload-row progress::-webkit-progress-value { background: var(--workload-color); }
.overview-workload-row progress::-moz-progress-bar { background: var(--workload-color); }
.overview-feed { list-style: none; padding: 0; margin: 18px 0 10px; }
.overview-feed li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding: 0 0 20px; }
.overview-feed .avatar { background: #e6ecf4; color: #536984; font-size: 10px; }
.overview-feed strong { font-size: 12px; font-weight: 600; }
.overview-feed p { font-size: 13px; color: #4e5f73; line-height: 1.5; margin-top: 2px; overflow-wrap: anywhere; }
.overview-feed time { display: block; color: var(--overview-muted); font-size: 11px; margin-top: 5px; }
.overview-empty { padding: 30px 22px; }
.overview-empty p { color: var(--overview-muted); margin: 6px 0 16px; }
.overview-attention .overview-empty { display: flex; gap: 13px; align-items: center; }
.overview-attention .overview-empty > .icon { color: #29856c; flex-shrink: 0; }
.overview-attention .overview-empty p { margin: 4px 0 0; }
.overview-more { display: block; padding: 12px 20px; border-top: 1px solid var(--overview-line); color: var(--overview-blue); font-size: 13px; }
@media (max-width: 1250px) {
  .content:has(.overview) { padding: 28px; }
  .overview-layout { grid-template-columns: minmax(0, 1fr) 240px; gap: 22px; }
  .overview-aside { padding-left: 20px; }
  .overview-project-table th, .overview-project-table td { padding-left: 12px; padding-right: 12px; }
  .overview-metric { padding: 18px 20px; }
  .overview-metric strong { font-size: 38px; }
}
@media (max-width: 1050px) {
  .overview-layout { grid-template-columns: minmax(0, 1fr); }
  .overview-aside { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; padding: 0; border-left: 0; }
  .overview-workload { border-bottom: 0; }
  .overview-date { display: none; }
}
@media (max-width: 600px) {
  .content:has(.overview) { padding: 24px 18px 36px; }
  .overview h1 { font-size: 29px; }
  .overview-header { margin-bottom: 24px; flex-direction: column; align-items: flex-start; gap: 16px; }
  .overview-header p { font-size: 14px; }
  .overview-title { gap: 10px; }
  .overview-metrics { grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 24px; }
  .overview-metric { padding: 14px 16px; }
  .overview-metric strong { font-size: 32px; }
  .overview h2 { font-size: 17px; }
  .overview-priority { grid-template-columns: 30px minmax(0, 1fr); gap: 8px 12px; padding: 16px; }
  .overview-priority-icon { width: 30px; height: 30px; align-self: start; }
  .overview-priority-state { grid-column: 2; }
  .overview-project-table thead { display: none; }
  .overview-project-table, .overview-project-table tbody { display: block; }
  .overview-project-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 17px; border-bottom: 1px solid var(--overview-line); }
  .overview-project-table tr:last-child { border: 0; }
  .overview-project-table td { display: block; border: 0; padding: 0; }
  .overview-project-table td:first-child { grid-column: 1 / -1; }
  .overview-project-table td:nth-child(3) { justify-self: end; }
  .overview-project-table .overview-due { grid-column: 1 / -1; color: var(--overview-muted); font-size: 12px; }
  .overview-due::before { content: "Due "; }
  .overview-aside { grid-template-columns: 1fr; gap: 0; }
  .overview-workload { padding-bottom: 24px; border-bottom: 1px solid var(--overview-line); }
}

/* -------------------------------------------------------------------------
   Shared theme controls + Obsidian compatibility layer.
   A number of older panels still contain literal light-mode colors; these
   rules keep those surfaces on the active dark token system.
   ------------------------------------------------------------------------- */
.theme-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.theme-column { min-width: 0; }
.theme-column-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 0 0 8px; border-bottom: 1px solid var(--line); color: var(--ink-secondary); font-size: 11px; }
.theme-column-head strong { color: var(--ink); font-size: 12px; }
.theme-column-head span { color: var(--ink-muted); font-size: 10px; text-align: right; }
.theme-list { display: grid; gap: 9px; max-height: 450px; overflow-y: auto; padding: 10px 4px 4px 0; }
.theme-card { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-subtle); color: var(--ink); cursor: pointer; transition: border-color 120ms ease, background 120ms ease, transform 120ms ease; }
.theme-card:hover { border-color: var(--line-strong); background: var(--surface); transform: translateY(-1px); }
.theme-card.is-active { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); }
.theme-swatches { display: flex; height: 36px; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; }
.theme-swatches span { flex: 1; min-width: 0; }
.theme-card-title { display: flex; align-items: center; gap: 8px; }
.theme-card-title strong { font-size: 12px; letter-spacing: -.01em; }
.theme-active-mark { color: var(--brand); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.theme-card-copy p { margin: 3px 0 0; color: var(--ink-secondary); font-size: 10px; line-height: 1.4; }
.theme-card-footer { display: flex; align-items: center; gap: 8px; padding-top: 7px; border-top: 1px solid var(--line); color: var(--ink-muted); font-size: 9px; text-transform: uppercase; letter-spacing: .07em; }
.theme-card-footer > span { flex: 1; }
.theme-default-btn { padding: 4px 7px; border: 1px solid var(--line); border-radius: 5px; background: transparent; color: var(--ink-secondary); font-size: 9px; text-transform: uppercase; letter-spacing: .04em; }
.theme-default-btn:hover, .theme-default-btn.is-default { border-color: var(--brand); background: var(--brand); color: var(--brand-contrast, #0a0a0a); }
.theme-system-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; margin-top: 14px; padding: 12px 14px; border: 1px solid var(--line); background: var(--surface-subtle); }
.theme-system-row strong, .theme-system-row span { display: block; }
.theme-system-row strong { color: var(--ink); font-size: 12px; }
.theme-system-row span, .theme-system-row small { margin-top: 3px; color: var(--ink-muted); font-size: 10px; }
.theme-system-row.is-active { border-color: var(--brand); }
.theme-toggle { width: 34px; height: 34px; min-height: 34px; }
.theme-toggle .icon { width: 17px; height: 17px; }

html[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #050505; --surface: #0f0f0f; --surface-subtle: #1a1a1a;
  --ink: #fafafa; --ink-secondary: #a3a3a3; --ink-muted: #737373;
  --line: rgba(255,255,255,.07); --line-strong: rgba(255,255,255,.14);
  --brand: #e2e2e2; --brand-hover: #fafafa; --brand-soft: rgba(255,255,255,.07);
  --brand-contrast: #0a0a0a; --ink-contrast: #0a0a0a; --ink-pill-badge: rgba(0, 0, 0, 0.16);
  --success: #34d399; --success-soft: rgba(52,211,153,.12);
  --warning: #fbbf24; --warning-soft: rgba(251,191,36,.13);
  --danger: #f87171; --danger-soft: rgba(248,113,113,.13);
  --rail: #0a0a0a; --rail-muted: #a3a3a3; --rail-active: #1a1a1a;
  --hover: rgba(255,255,255,.06); --shadow-popover: 0 30px 60px -20px rgba(0,0,0,.95);
}
html[data-theme="dark"] body { background: var(--canvas) !important; color: var(--ink) !important; }
html[data-theme="dark"] .topbar,
html[data-theme="dark"] :where(.panel, .stats, .stat, .board-card, .suggestion, .chat-message, .dialog, .feature-panel, .op-card, .op-split-master, .op-split-detail, .overview-metric, .overview-attention, .overview-projects) { background: var(--surface) !important; color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] .sidebar { background: var(--rail) !important; }
html[data-theme="dark"] .content { color: var(--ink); }
html[data-theme="dark"] :where(.panel-head, .panel-body, .feature-panel-heading, .feature-grid-head, .toolbar, .dialog-head, .dialog-footer, .op-split-header, .op-meta-grid, .op-pipeline-tracker, .attendance-filter-row, .history-box) { border-color: var(--line) !important; background: var(--surface-subtle) !important; }
html[data-theme="dark"] :where(.panel-head p, .feature-panel-heading p, .feature-grid-row small, .feature-archive-list small, .feature-request-list small, .muted, .text-muted, .cell-sub, .stat-note, .settings-option-desc, .settings-intro, .feature-empty, .op-card-sub, .op-doc-sub, .op-meta-item span, .overview-header p, .overview-date, .overview-project-sub, .overview-feed time) { color: var(--ink-muted) !important; }
html[data-theme="dark"] :where(h1, h2, h3, .cell-title, .stat-value, .feature-panel-heading h2, .feature-metrics strong, .op-card-title, .op-split-item-title, .op-doc-code, .op-meta-item strong, .overview h1, .overview h2, .overview-metric strong, .overview-project-table .link-button, .overview-priority .link-button) { color: var(--ink) !important; }
html[data-theme="dark"] .btn { background: var(--surface-subtle) !important; border-color: var(--line-strong) !important; color: var(--ink) !important; }
html[data-theme="dark"] .btn:hover { background: var(--hover) !important; border-color: var(--brand) !important; }
html[data-theme="dark"] .btn.btn--primary, html[data-theme="dark"] .chat-send { background: var(--brand) !important; border-color: var(--brand) !important; color: var(--brand-contrast, #0a0a0a) !important; }
html[data-theme="dark"] .btn.btn--primary:hover, html[data-theme="dark"] .chat-send:hover { background: var(--brand-hover) !important; }
html[data-theme="dark"] .btn--quiet { background: transparent !important; border-color: transparent !important; color: var(--ink-secondary) !important; }
html[data-theme="dark"] .btn--quiet:hover { background: var(--hover) !important; color: var(--ink) !important; }
html[data-theme="dark"] .btn--danger { background: var(--danger-soft) !important; border-color: rgba(248,113,113,.35) !important; color: var(--danger) !important; }
html[data-theme="dark"] :where(a, .link-button, .feature-link, .tab[aria-selected="true"]) { color: var(--brand) !important; }
html[data-theme="dark"] :where(input, select, textarea, .settings-select) { background: var(--surface-subtle) !important; border-color: var(--line-strong) !important; color: var(--ink) !important; }
html[data-theme="dark"] :where(input, select, textarea)::placeholder { color: var(--ink-muted) !important; }
html[data-theme="dark"] option { background: var(--surface-subtle); color: var(--ink); }
html[data-theme="dark"] :where(.badge, .feature-chip, .feature-status, .op-command-count, .op-layout-tag, .overview-count) { background: var(--brand-soft) !important; color: var(--ink-secondary) !important; border-color: var(--line) !important; }
html[data-theme="dark"] :where(.badge--progress, .feature-link, .op-command-tab.is-active, .op-layout-btn.is-active) { color: var(--brand) !important; }
html[data-theme="dark"] :where(.badge--completed, .feature-status--active, .feature-status--approved, .feature-status--received, .op-kpi-chip.is-success) { background: var(--success-soft) !important; color: var(--success) !important; }
html[data-theme="dark"] :where(.badge--blocked, .badge--review, .feature-status--warn, .op-kpi-chip.is-warn) { background: var(--warning-soft) !important; color: var(--warning) !important; }
html[data-theme="dark"] :where(.badge--overdue, .btn--danger, .op-kpi-chip.is-alert) { color: var(--danger) !important; }
html[data-theme="dark"] :where(.feature-status--archived, .feature-status--cancelled, .feature-chip--muted) { background: rgba(255,255,255,.06) !important; color: var(--ink-muted) !important; }
html[data-theme="dark"] :where(.data-table th, .op-line-table th, .overview-project-table th) { background: var(--surface-subtle) !important; color: var(--ink-muted) !important; border-color: var(--line) !important; }
html[data-theme="dark"] :where(.data-table td, .data-table th, .task-row, .feature-grid-row, .feature-archive-list > div, .feature-request-list > div, .stock-request-card, .op-line-table td, .overview-project-table td) { border-color: var(--line) !important; }
html[data-theme="dark"] :where(.data-table tbody tr:hover, .board-card:hover, .op-split-item:hover, .overview-project-table tbody tr:hover) { background: var(--hover) !important; }
html[data-theme="dark"] :where(.board-column, .op-layout-switcher, .op-kpi-ribbon, .op-command-tabs) { background: var(--surface-subtle) !important; border-color: var(--line) !important; }
html[data-theme="dark"] :where(progress, progress::-webkit-progress-bar, .overview-progress progress, .skeleton) { background: rgba(255,255,255,.08) !important; }
html[data-theme="dark"] :where(progress::-webkit-progress-value, progress::-moz-progress-bar) { background: var(--brand) !important; }
html[data-theme="dark"] :where(.template-glyph, .file-chip, .task-tree-node, .task-tree-tool-btn, .task-tree-input, .task-tree-draft-pill, .task-tree-file-pill, .audio-play-pill-btn, .settings-preview-card, .settings-preview-row) { background: var(--surface-subtle) !important; border-color: var(--line) !important; color: var(--ink) !important; }
html[data-theme="dark"] :where(.ai-prompt-wrap, .ai-conversation.has-messages .ai-prompt-wrap, .ai-starter-item:hover, .ai-effort-picker[open] > summary) { background: var(--surface-subtle) !important; border-color: var(--line-strong) !important; color: var(--ink) !important; }
html[data-theme="dark"] :where(.ai-conversation.has-messages .chat-message, .ai-conversation.has-messages .chat-message--user) { background: var(--surface-subtle) !important; color: var(--ink) !important; }
html[data-theme="dark"] :where(.account-pill-wrap, .account-dock-btn, .user-select) { background: var(--surface-subtle) !important; border-color: var(--line) !important; color: var(--ink) !important; box-shadow: none !important; }
html[data-theme="dark"] :where(.account-pill-wrap:hover, .account-dock-btn:hover) { background: var(--hover) !important; border-color: var(--line-strong) !important; }
html[data-theme="dark"] :where(.account-pill-user, .account-pill-tenant) { color: var(--ink) !important; }

/* Chats keep their own layout, but use Obsidian surfaces and neutral actions. */
html[data-theme="dark"] :where(.content--chats, .chat-main) { background: var(--canvas) !important; }
html[data-theme="dark"] :where(.chat-shell, .chat-list, .chat-list-head, .chat-empty) { background: var(--surface) !important; }
html[data-theme="dark"] :where(.chat-header, .chat-composer, .chat-reply-bar, .chat-attach-chip, .chat-rec-bar) { background: var(--surface-subtle) !important; border-color: var(--line) !important; }
html[data-theme="dark"] :where(.chat-search input, .chat-composer input) { background: var(--paper2, var(--surface-subtle)) !important; color: var(--ink) !important; border-color: var(--line) !important; }
html[data-theme="dark"] :where(.chat-thread:hover, .chat-thread.is-active, .chat-icon-btn:hover, .chat-header-btn:hover, .chat-tool-btn:hover) { background: var(--hover) !important; }
html[data-theme="dark"] :where(.chat-thread-name, .chat-header-name, .chat-bubble-text, .wa-info-name, .wa-info-desc) { color: var(--ink) !important; }
html[data-theme="dark"] :where(.chat-thread-time, .chat-thread-preview, .chat-header-sub, .chat-time, .chat-quote-text, .wa-info-meta, .chat-empty, .chat-bubble-meta) { color: var(--ink-muted) !important; }
html[data-theme="dark"] .chat-filter.is-active { background: var(--brand-soft) !important; border-color: var(--line-strong) !important; color: var(--brand) !important; }
html[data-theme="dark"] :where(.chat-bubble, .chat-system, .chat-date-pill, .chat-menu, .chat-attach-pop, .chat-emoji-pop, .wa-info-action) { background: var(--surface-subtle) !important; border-color: var(--line) !important; color: var(--ink) !important; }
html[data-theme="dark"] .chat-bubble.is-mine { background: var(--success-soft) !important; }
html[data-theme="dark"] .chat-system, html[data-theme="dark"] .chat-encrypt { background: var(--warning-soft) !important; color: var(--warning) !important; }
html[data-theme="dark"] :where(.chat-menu button.chat-menu-item, .chat-attach-pop button, .wa-info-action) { color: var(--ink-secondary) !important; }
html[data-theme="dark"] :where(.chat-menu button.chat-menu-item:hover, .chat-attach-pop button:hover, .chat-emoji-grid button:hover, .wa-info-action:hover) { background: var(--hover) !important; }
html[data-theme="dark"] :where(.chat-file-card, .chat-reaction, .chat-pending-item, .chat-file-icon) { background: rgba(255,255,255,.06) !important; border-color: var(--line) !important; color: var(--ink-secondary) !important; }
html[data-theme="dark"] .wa-info-cam { background: var(--brand) !important; border-color: var(--surface) !important; color: var(--brand-contrast, #0a0a0a) !important; }

html[data-theme="dark"] .overview { --overview-blue: var(--brand); --overview-ink: var(--ink); --overview-muted: var(--ink-muted); --overview-line: var(--line); color: var(--ink) !important; }
html[data-theme="dark"] :where(.overview-metric, .overview-attention, .overview-projects) { background: var(--surface) !important; border-color: var(--line) !important; }
html[data-theme="dark"] :where(.overview-metric.is-review, .overview-metric.is-late, .overview-priority-icon, .overview-priority.is-late .overview-priority-icon) { background: var(--surface-subtle) !important; border-color: var(--line) !important; }
html[data-theme="dark"] :where(.overview-count, .overview-project-table th, .overview-project-table tbody tr:hover) { background: var(--surface-subtle) !important; color: var(--ink-secondary) !important; }
/* Light mode keeps the operations rail dark, so it needs its own contrast
   tokens instead of inheriting the light page ink colors. */
html[data-theme="light"] {
  --brand-contrast: #ffffff;
  --ink-contrast: #ffffff;
  --ink-pill-badge: rgba(255, 255, 255, 0.18);
}
html[data-theme="light"] body { background: var(--canvas) !important; color: var(--ink) !important; }
html[data-theme="light"] .sidebar { background: var(--rail) !important; border-right-color: var(--rail-border) !important; color: var(--rail-foreground) !important; }
html[data-theme="light"] .brand { color: var(--rail-foreground) !important; }
html[data-theme="light"] .brand-mark { border-color: var(--rail-border) !important; color: var(--rail-foreground) !important; }
html[data-theme="light"] .workspace-label,
html[data-theme="light"] .nav-label,
html[data-theme="light"] .demo-label,
html[data-theme="light"] .account small { color: var(--rail-muted) !important; }
html[data-theme="light"] .nav-link { color: var(--rail-muted) !important; }
html[data-theme="light"] .nav-link:hover { background: var(--rail-hover) !important; color: var(--rail-foreground) !important; }
html[data-theme="light"] .nav-link[aria-current="page"] { background: var(--rail-active) !important; color: var(--rail-foreground) !important; box-shadow: inset 2px 0 var(--rail-accent) !important; }
html[data-theme="light"] .nav-count { background: var(--rail-active) !important; color: var(--rail-foreground) !important; }
html[data-theme="light"] .account { border-top-color: var(--rail-border) !important; }
html[data-theme="light"] .btn { background: var(--surface) !important; border-color: var(--line-strong) !important; color: var(--ink) !important; }
html[data-theme="light"] .btn:hover { background: var(--surface-subtle) !important; border-color: var(--brand) !important; }
html[data-theme="light"] .btn.btn--primary,
html[data-theme="light"] .chat-send { background: var(--brand) !important; border-color: var(--brand) !important; color: var(--brand-contrast, #ffffff) !important; }
html[data-theme="light"] .btn.btn--primary:hover,
html[data-theme="light"] .chat-send:hover { background: var(--brand-hover) !important; }
html[data-theme="light"] .btn--quiet { background: transparent !important; border-color: transparent !important; color: var(--ink-secondary) !important; }
html[data-theme="light"] .btn--quiet:hover { background: var(--hover) !important; color: var(--ink) !important; }
html[data-theme="light"] :where(input, select, textarea, .settings-select) { background: var(--surface) !important; border-color: var(--line-strong) !important; color: var(--ink) !important; }
html[data-theme="light"] :where(input, select, textarea)::placeholder { color: var(--ink-muted) !important; }
html[data-theme="light"] option { background: var(--surface) !important; color: var(--ink) !important; }
html[data-theme="light"] :where(.panel, .stats, .stat, .board-card, .suggestion, .chat-message, .dialog, .feature-panel, .op-card, .op-split-master, .op-split-detail, .overview-metric, .overview-attention, .overview-projects) { background: var(--surface) !important; color: var(--ink) !important; border-color: var(--line) !important; }
html[data-theme="light"] :where(.panel-head, .panel-body, .feature-panel-heading, .feature-grid-head, .toolbar, .dialog-head, .dialog-footer, .op-split-header, .op-meta-grid, .op-pipeline-tracker, .attendance-filter-row, .history-box) { background: var(--surface-subtle) !important; border-color: var(--line) !important; }
html[data-theme="light"] :where(h1, h2, h3, .cell-title, .stat-value, .feature-panel-heading h2, .feature-metrics strong, .op-card-title, .op-split-item-title, .op-doc-code, .op-meta-item strong, .overview h1, .overview h2, .overview-metric strong, .overview-project-table .link-button, .overview-priority .link-button) { color: var(--ink) !important; }
html[data-theme="light"] :where(.panel-head p, .feature-panel-heading p, .feature-grid-row small, .feature-archive-list small, .feature-request-list small, .muted, .text-muted, .cell-sub, .stat-note, .settings-option-desc, .settings-intro, .feature-empty, .op-card-sub, .op-doc-sub, .op-meta-item span, .overview-header p, .overview-date, .overview-project-sub, .overview-feed time) { color: var(--ink-muted) !important; }
html[data-theme="light"] :where(.data-table th, .op-line-table th, .overview-project-table th) { background: var(--surface-subtle) !important; color: var(--ink-muted) !important; border-color: var(--line) !important; }
html[data-theme="light"] :where(.data-table tbody tr:hover, .board-card:hover, .op-split-item:hover, .overview-project-table tbody tr:hover) { background: var(--hover) !important; }
html[data-theme="light"] :where(.board-column, .op-layout-switcher, .op-kpi-ribbon, .op-command-tabs) { background: var(--surface-subtle) !important; border-color: var(--line) !important; }
html[data-theme="light"] :where(progress, progress::-webkit-progress-bar, .overview-progress progress, .skeleton) { background: var(--gauge-bg) !important; }
html[data-theme="light"] :where(progress::-webkit-progress-value, progress::-moz-progress-bar) { background: var(--brand) !important; }
html[data-theme="light"] .overview { --overview-blue: var(--brand); --overview-ink: var(--ink); --overview-muted: var(--ink-muted); --overview-line: var(--line); color: var(--ink) !important; }
html[data-theme="light"] :where(.overview-metric, .overview-attention, .overview-projects) { background: var(--surface) !important; border-color: var(--line) !important; }
html[data-theme="light"] :where(.overview-count, .overview-project-table th) { background: var(--surface-subtle) !important; color: var(--ink-secondary) !important; }
html[data-theme="light"] :where(.account-pill-wrap, .account-dock-btn) { background: var(--surface) !important; border-color: var(--line) !important; color: var(--ink-secondary) !important; box-shadow: var(--shadow-popover) !important; }
html[data-theme="light"] :where(.account-pill-wrap:hover, .account-dock-btn:hover) { background: var(--surface-subtle) !important; border-color: var(--line-strong) !important; color: var(--ink) !important; }
html[data-theme="light"] .account-pill-user { color: var(--ink) !important; }
html[data-theme="light"] .account-pill-tenant, html[data-theme="light"] .account-pill-chevron { color: var(--ink-muted) !important; }

/* Count pills are intentionally high-contrast badges. The original rule used
   --ink for both background and inherited text in Obsidian, creating white on
   white numbers. */
html[data-theme="dark"] .nav-count { background: var(--ink) !important; color: var(--rail) !important; }
html[data-theme="light"] .nav-count { background: var(--ink) !important; color: var(--surface) !important; }


/* Account switcher: app-controlled upward menu for the fixed bottom dock. */
.account-pill-wrap { z-index: 140; }
.account-pill-trigger {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  min-height: 30px;
  padding: 0;
  border: 0;
  background: transparent !important;
  color: var(--rail-foreground, #fff) !important;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.account-pill-trigger:hover { background: transparent !important; color: var(--rail-foreground, #fff) !important; }
.account-pill-trigger:focus-visible { outline: 2px solid var(--rail-accent, #8baeff); outline-offset: 2px; border-radius: 8px; }
.account-pill-trigger .account-pill-avatar { display: inline-flex; flex: 0 0 auto; }
.account-switcher-menu {
  position: absolute;
  left: 0;
  bottom: calc(100% + 8px);
  z-index: 260;
  display: grid;
  gap: 3px;
  width: min(248px, calc(100vw - 28px));
  max-height: min(420px, calc(100vh - 36px));
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--line-strong);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--shadow-popover);
}
.account-switcher-menu[hidden] { display: none !important; }
.account-switcher-option {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent !important;
  color: var(--ink) !important;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.account-switcher-option:hover,
.account-switcher-option:focus-visible {
  background: var(--hover) !important;
  border-color: var(--line);
  color: var(--ink) !important;
  outline: none;
}
.account-switcher-option.is-current { background: var(--brand-soft) !important; }
.account-switcher-option-avatar { display: inline-flex; width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; overflow: hidden; }
.account-switcher-option-avatar svg,
.account-switcher-option-avatar img { width: 100%; height: 100%; display: block; object-fit: cover; }
.account-switcher-option-copy { display: grid; min-width: 0; flex: 1; gap: 2px; }
.account-switcher-option-name { overflow: hidden; color: var(--ink) !important; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.account-switcher-option-meta { overflow: hidden; color: var(--ink-muted) !important; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.account-switcher-option > .icon { width: 15px; height: 15px; flex: 0 0 15px; color: var(--brand); }
html[data-theme="light"] .account-pill-wrap:hover,
html[data-theme="dark"] .account-pill-wrap:hover { background: var(--surface-subtle) !important; border-color: var(--line-strong) !important; }
html[data-theme="light"] .account-switcher-menu { border-color: var(--line-strong); }
html[data-theme="dark"] .account-switcher-menu { border-color: var(--line-strong); }
@media (max-width: 560px) {
  .account-switcher-menu { width: min(248px, calc(100vw - 22px)); }
}


@media (max-width: 760px) {
  .theme-columns { grid-template-columns: 1fr; }
  .theme-list { max-height: none; }
  .theme-system-row { grid-template-columns: 1fr auto; }
  .theme-system-row small { grid-column: 1 / -1; }
}

/* WhatsApp Web dark chat palette. These values intentionally do not use the
   selected FieldWork theme tokens, so every dark theme keeps the same chat. */
html[data-theme="dark"] {
  --chat-wa-wallpaper: #091117;
  --chat-wa-canvas: #0f181e;
  --chat-wa-surface: #1d282e;
  --chat-wa-elevated: #26333b;
  --chat-wa-divider: #1f2930;
  --chat-wa-text: #e9edef;
  --chat-wa-muted: #8696a0;
  --chat-wa-outgoing: #005443;
  --chat-wa-green: #00a884;
  --chat-wa-read: #53bdeb;
  --chat-wa-info: #0a342d;
  --chat-wa-warning: #332914;
}
html[data-theme="dark"] :where(.content--chats, .chat-main) {
  background: var(--chat-wa-wallpaper) !important;
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] :where(.chat-shell, .chat-list, .chat-list-head) {
  background: var(--chat-wa-canvas) !important;
  border-color: var(--chat-wa-divider) !important;
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] .chat-main::before,
html[data-theme="dark"] .chat-messages::before {
  display: none !important;
}
html[data-theme="dark"] .chat-messages {
  background-color: var(--chat-wa-wallpaper) !important;
  background-image: linear-gradient(rgb(9 17 23 / .78), rgb(9 17 23 / .78)), url("/images/wa-doodle.png") !important;
  background-repeat: repeat, repeat !important;
  background-size: auto, 600px auto !important;
  background-position: 0 0, 0 0 !important;
  background-attachment: scroll, scroll !important;
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"][data-wallpaper="solid"] .chat-messages {
  background-image: none !important;
}
html[data-theme="dark"] :where(.chat-messages, .chat-messages > *, .chat-msg-row) {
  opacity: 1 !important;
}
html[data-theme="dark"] :where(.chat-header, .chat-composer, .chat-reply-bar, .chat-attach-chip, .chat-rec-bar) {
  background: var(--chat-wa-surface) !important;
  border-color: var(--chat-wa-divider) !important;
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] :where(.chat-search input, .chat-composer input) {
  background: var(--chat-wa-elevated) !important;
  border-color: var(--chat-wa-elevated) !important;
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] :where(.chat-search input, .chat-composer input)::placeholder {
  color: var(--chat-wa-muted) !important;
}
html[data-theme="dark"] :where(.chat-icon-btn, .chat-header-btn, .chat-tool-btn) {
  color: var(--chat-wa-muted) !important;
}
html[data-theme="dark"] :where(.chat-icon-btn:hover, .chat-header-btn:hover, .chat-tool-btn:hover) {
  background: var(--chat-wa-elevated) !important;
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] :where(.chat-thread:hover, .chat-thread.is-active, .chat-filter:hover) {
  background: var(--chat-wa-surface) !important;
}
html[data-theme="dark"] :where(.chat-thread-main, .chat-list, .chat-filter) {
  border-color: var(--chat-wa-divider) !important;
}
html[data-theme="dark"] :where(.chat-thread-name, .chat-header-name) {
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] :where(.chat-thread-time, .chat-thread-preview, .chat-header-sub) {
  color: var(--chat-wa-muted) !important;
}
html[data-theme="dark"] .chat-filter.is-active {
  background: var(--chat-wa-info) !important;
  border-color: var(--chat-wa-info) !important;
  color: var(--chat-wa-green) !important;
}
html[data-theme="dark"] .chat-notif-banner {
  background: var(--chat-wa-info) !important;
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] .chat-notif-banner.is-warn {
  background: var(--chat-wa-warning) !important;
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] :where(.chat-bubble, .chat-bubble:not(.is-mine), .chat-date-pill, .chat-system) {
  background: var(--chat-wa-surface) !important;
  border-color: var(--chat-wa-divider) !important;
  color: var(--chat-wa-text) !important;
  opacity: 1 !important;
}
html[data-theme="dark"] .chat-bubble.is-mine {
  background: var(--chat-wa-outgoing) !important;
  border-color: var(--chat-wa-outgoing) !important;
}
html[data-theme="dark"] :where(.chat-bubble-text, .chat-message-text, .chat-bubble-name, .chat-bubble-author) {
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] :where(.chat-bubble-meta, .chat-time, .chat-quote-text, .chat-file-sub) {
  color: var(--chat-wa-muted) !important;
}
html[data-theme="dark"] .chat-encrypt {
  background: var(--chat-wa-surface) !important;
  color: #ffd279 !important;
  border-color: var(--chat-wa-divider) !important;
}
html[data-theme="dark"] :where(.chat-quote, .chat-file-card, .chat-reaction, .chat-attach-pop, .chat-emoji-pop, .chat-menu) {
  background: var(--chat-wa-surface) !important;
  border-color: var(--chat-wa-divider) !important;
  color: var(--chat-wa-text) !important;
  opacity: 1 !important;
}
html[data-theme="dark"] :where(.chat-file-icon, .chat-reaction.is-mine) {
  background: var(--chat-wa-elevated) !important;
  color: var(--chat-wa-muted) !important;
}
html[data-theme="dark"] .chat-reaction.is-mine {
  background: var(--chat-wa-info) !important;
  border-color: var(--chat-wa-green) !important;
}
html[data-theme="dark"] :where(.chat-menu button.chat-menu-item, .chat-attach-pop button) {
  color: var(--chat-wa-text) !important;
}
html[data-theme="dark"] :where(.chat-menu button.chat-menu-item:hover, .chat-attach-pop button:hover, .chat-emoji-grid button:hover) {
  background: var(--chat-wa-elevated) !important;
}
html[data-theme="dark"] button.chat-send,
html[data-theme="dark"] .btn.chat-send,
html[data-theme="dark"] .wa-info-cam {
  background: var(--chat-wa-green) !important;
  border-color: var(--chat-wa-green) !important;
  color: #ffffff !important;
}
html[data-theme="dark"] button.chat-send:hover,
html[data-theme="dark"] .btn.chat-send:hover,
html[data-theme="dark"] .wa-info-cam:hover {
  background: #06cf9c !important;
  border-color: #06cf9c !important;
}
html[data-theme="dark"] .wa-ticks.is-read {
  color: var(--chat-wa-read) !important;
}
html[data-theme="dark"] :where(.chat-empty, .wa-info-desc) {
  background: var(--chat-wa-canvas) !important;
  color: var(--chat-wa-text) !important;
  border-color: var(--chat-wa-divider) !important;
}

/* -----------------------------------------------------------------------------
   High-Contrast Active State & Box-Text Rules (Dark & Light Mode)
   Eliminates white-on-white text in dark mode and dark-on-dark in light mode.
----------------------------------------------------------------------------- */
#map-site-focus,
.map-site-focus {
  padding: 6px 12px;
  font-size: 12px;
  background: var(--surface);
  color: var(--ink);
  backdrop-filter: blur(6px);
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  outline: none;
}

html[data-theme="dark"] .tracker-panel-tabs .panel-tab.active {
  background: var(--ink) !important;
  color: #09090b !important;
  font-weight: 700 !important;
}
html[data-theme="dark"] .tracker-panel-tabs .active .planner-tab-count {
  background: rgba(0, 0, 0, 0.16) !important;
  color: #09090b !important;
  font-weight: 700 !important;
}
html[data-theme="dark"] .mode-btn.active {
  background: var(--brand) !important;
  color: var(--brand-contrast, #0a0a0a) !important;
  font-weight: 700 !important;
}
html[data-theme="dark"] .mode-btn {
  color: var(--ink-secondary) !important;
}
html[data-theme="dark"] .mode-switch {
  background: var(--surface-subtle) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] #map-site-focus,
html[data-theme="dark"] .map-site-focus {
  background: var(--surface-subtle, #1f232b) !important;
  color: var(--ink, #fafafa) !important;
  border-color: var(--line-strong) !important;
}
html[data-theme="dark"] .tech-nametag {
  background: var(--ink) !important;
  color: #09090b !important;
  font-weight: 700 !important;
}
html[data-theme="dark"] .ai-send-button {
  background: var(--brand) !important;
  color: var(--brand-contrast, #0a0a0a) !important;
  border-color: var(--brand) !important;
}
html[data-theme="dark"] .custom-select-trigger {
  background: var(--surface-subtle) !important;
  border-color: var(--line-strong) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .custom-select-menu {
  background: var(--surface) !important;
  border-color: var(--line-strong) !important;
  box-shadow: var(--shadow-popover) !important;
}
html[data-theme="dark"] .custom-select-option {
  color: var(--ink) !important;
}
html[data-theme="dark"] .custom-select-option:hover {
  background: var(--hover) !important;
}
html[data-theme="dark"] .custom-select-option.is-selected {
  background: var(--brand-soft) !important;
  color: var(--brand) !important;
}
html[data-theme="dark"] .tech-btn-locate {
  background: var(--surface-subtle) !important;
  border-color: var(--line-strong) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .ai-table-wrap {
  background: var(--surface) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .ai-markdown-table th {
  background: var(--surface-subtle) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .ai-markdown-table td {
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .ai-markdown-table tr:nth-child(even) {
  background: var(--surface-subtle) !important;
}
html[data-theme="dark"] .challan-format-preview {
  background: var(--surface-subtle) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .ai-start-layout .ai-prompt-wrap,
html[data-theme="dark"] .ai-conversation.has-messages .ai-prompt-wrap {
  background: var(--surface-subtle) !important;
  border-color: var(--line-strong) !important;
}
html[data-theme="dark"] .ai-start-layout .ai-prompt-wrap textarea,
html[data-theme="dark"] .ai-conversation.has-messages .ai-prompt-wrap textarea {
  color: var(--ink) !important;
  caret-color: var(--ink) !important;
}
html[data-theme="dark"] .ai-prompt-wrap.is-transcribing {
  background: var(--surface-subtle) !important;
  border-color: var(--line-strong) !important;
}
html[data-theme="dark"] .ai-transcriber-close {
  background: var(--surface) !important;
  border-color: var(--line-strong) !important;
  color: var(--ink) !important;
}

/* Light mode matching contrast overrides */
html[data-theme="light"] .tracker-panel-tabs .panel-tab.active {
  background: var(--ink) !important;
  color: #ffffff !important;
}
html[data-theme="light"] .tracker-panel-tabs .active .planner-tab-count {
  background: rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
}
html[data-theme="light"] .mode-btn.active {
  background: var(--brand) !important;
  color: var(--brand-contrast, #ffffff) !important;
}
html[data-theme="light"] #map-site-focus,
html[data-theme="light"] .map-site-focus {
  background: var(--surface, #ffffff) !important;
  color: var(--ink, #0f172a) !important;
  border-color: var(--line) !important;
}