/* Device-local appearance controls. The dark palette is staff-only and screen-only.
   Pair foregrounds with surfaces: inherited light text must never sit on a fixed light card. */
.appearance-settings {
  min-width: 0;
  display: grid;
  gap: 10px;
  margin: 0;
  border: 1px solid var(--surface-line, var(--line));
  border-radius: var(--radius, 8px);
  padding: 14px;
  color: var(--ink);
  background: var(--paper);
}

.appearance-settings legend {
  padding: 0 5px;
  color: var(--navy);
  font-size: 14px;
  font-weight: 900;
}

.appearance-settings > p,
.appearance-settings > small {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.appearance-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.appearance-options label {
  min-width: 0;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--surface-line-strong, var(--line));
  border-radius: var(--radius-sm, 6px);
  padding: 9px 10px;
  color: var(--navy);
  background: var(--paper);
  font-size: 13px;
  font-weight: 850;
  cursor: pointer;
}

.appearance-options label:hover,
.appearance-options label:has(input:checked) {
  border-color: var(--teal);
  background: var(--surface-hover, rgba(17, 199, 189, 0.08));
}

.appearance-options label:has(input:focus-visible) {
  outline: 0;
  box-shadow: var(--focus-ring, 0 0 0 3px rgba(17, 199, 189, 0.2));
}

.appearance-options input {
  width: 17px;
  height: 17px;
  min-height: 0;
  margin: 0;
  accent-color: var(--teal-dark, var(--teal));
}

.appearance-status {
  min-height: 18px;
  font-size: 12px;
  font-weight: 750;
}

@media (max-width: 430px) {
  .appearance-options {
    grid-template-columns: 1fr;
  }

  .appearance-options label {
    justify-content: flex-start;
  }
}

@media print {
  .appearance-settings {
    display: none !important;
  }
}

@media screen {
  html[data-app-theme="light"] .field-home-mobile :is(.field-home-heading > span, .field-home-days > span, .field-home-map-live) { color: #506675; }

  html[data-app-theme="dark"] {
    color-scheme: dark;
    --navy: #d9edf7;
    --deep: #eef8fb;
    --blue: #54c5ec;
    --teal: #45d4ca;
    --teal-dark: #35b8b0;
    --ink: #e8f0f4;
    --muted: #a7bac5;
    --slate: #b6c6ce;
    --line: #36505e;
    --paper: #132733;
    --soft: #192f3c;
    --open: #60a5fa;
    --danger: #fb7185;
    --success: #4fd1c5;
    --warning: #fbbf24;
    --warning-ink: #ffe3aa;
    --surface-line: rgba(180, 208, 221, 0.2);
    --surface-line-strong: rgba(180, 208, 221, 0.32);
    --surface-hover: rgba(69, 212, 202, 0.12);
    --focus-ring: 0 0 0 3px rgba(69, 212, 202, 0.3);
    --shadow: 0 22px 70px rgba(0, 7, 12, 0.5);
    --shadow-soft: 0 6px 20px rgba(0, 7, 12, 0.3);
    background: #081722;
  }

  html[data-app-theme="dark"] body,
  html[data-app-theme="dark"] .workspace,
  html[data-app-theme="dark"] .crew-dashboard:has(.field-home-mobile) {
    color: var(--ink);
    background: #0b1d28;
  }

  html[data-app-theme="dark"] .sidebar {
    background: #07151e;
    border-right-color: rgba(183, 215, 228, 0.15);
  }

  html[data-app-theme="dark"] .topbar,
  html[data-app-theme="dark"] .mobile-tabbar {
    color: var(--ink);
    background: rgba(11, 29, 40, 0.97);
    border-color: var(--surface-line);
    box-shadow: 0 8px 24px rgba(0, 7, 12, 0.3);
  }

  html[data-app-theme="dark"] .topbar :is(.eyebrow, #page-title),
  html[data-app-theme="dark"] .mobile-tabbar :is(a, button) {
    color: var(--muted);
  }

  html[data-app-theme="dark"] .mobile-tabbar :is(a.active, button[aria-expanded="true"]),
  html[data-app-theme="dark"] .nav-list a.active,
  html[data-app-theme="dark"] .nav-list a:hover {
    color: #eafffc;
    background: #134d4d;
  }

  html[data-app-theme="dark"] :is(
    .section, .card, .panel, .nested-section, .section-heading,
    .jobber-report-card, .jobber-workflow-card, .jobber-performance-card,
    .crm-job-card, .client-card, .quote-followup-card, .payment-card,
    .schedule-card, .time-clock-card, .time-live-panel, .time-payroll-panel,
    .team-roster-section, .team-editor-panel, .team-member-row,
    .ops-focus-card, .manager-job-column, .field-route-card, .field-task-card,
    .message-inbox-list, .message-conversation-panel, .message-stat,
    .report-stat, .payment-summary-card, .quote-followup-stat, .client-stat,
    .owner-workflow-card, .owner-performance-card, .owner-appointment-row,
    .field-home-map-card, .field-home-visit-card, .field-home-empty-visit, .native-message-thread-panel
  ) {
    color: var(--ink);
    background-color: var(--paper);
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] #app > .section,
  html[data-app-theme="dark"] #app > .section > .section-heading,
  html[data-app-theme="dark"] .schedule-control-panel,
  html[data-app-theme="dark"] .schedule-pulse {
    background: transparent;
  }

  html[data-app-theme="dark"] .field-home-mobile .field-home-map-art { background: var(--soft); }

  html[data-app-theme="dark"] :is(h1, h2, h3, h4, legend, strong),
  html[data-app-theme="dark"] :is(.section-heading, .section-heading.teal) :is(h2, h3),
  html[data-app-theme="dark"] :is(.create-menu-heading, .notification-panel-head) strong {
    color: var(--ink);
  }

  html[data-app-theme="dark"] :is(.muted, small, .field span, .field label, .label),
  html[data-app-theme="dark"] :is(.section-heading, .section-heading.teal) p {
    color: var(--muted);
  }

  html[data-app-theme="dark"] :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    textarea, select
  ) {
    color: var(--ink);
    background-color: #0e202c;
    border-color: var(--surface-line-strong);
  }

  html[data-app-theme="dark"] :is(input, textarea)::placeholder {
    color: #8198a5;
    opacity: 1;
  }

  html[data-app-theme="dark"] select option {
    color: var(--ink);
    background: #102430;
  }

  html[data-app-theme="dark"] :is(
    .button.secondary, .icon-button, .secondary-icon-button, .password-toggle,
    .menu-button, .logout-button, .clock-status-pill, .schedule-range,
    .schedule-display, .schedule-arrow, .schedule-current, .layout-option,
    .notification-button, .field-home-days button, .field-home-map-controls button
  ) {
    color: var(--ink);
    background: #162d3a;
    border-color: var(--surface-line-strong);
  }

  html[data-app-theme="dark"] :is(.button.primary, .create-button) {
    color: #f5fffe;
    background: #0f766e;
    border-color: #2ebdb3;
  }

  html[data-app-theme="dark"] :is(.button.primary, .create-button):hover {
    color: #fff;
    background: #0b615c;
  }

  html[data-app-theme="dark"] :is(
    .button.secondary, .icon-button, .secondary-icon-button, .password-toggle,
    .menu-button, .schedule-range, .schedule-display, .schedule-arrow,
    .schedule-current, .notification-button
  ):hover {
    color: #eafffc;
    background: #174047;
    border-color: rgba(69, 212, 202, 0.55);
  }

  html[data-app-theme="dark"] :is(.crm-tabs, .schedule-display-toggle) {
    background: #0e202c;
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(.crm-tabs a.active, .schedule-range.active, .schedule-display.active) {
    color: #eafffc;
    background: #174047;
  }

  html[data-app-theme="dark"] :is(table, th, td) {
    color: var(--ink);
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(thead, th) {
    background-color: #102632;
  }

  html[data-app-theme="dark"] tbody tr:hover > td {
    background-color: #183440;
  }

  html[data-app-theme="dark"] :is(
    .create-menu, .team-row-menu-popover, .native-thread-menu-content,
    .schedule-filter-popover-menu, .phone-number-add-popover,
    .customer-detail-more-menu, .report-column-popover,
    .marketing-builder-menu > div, .native-email-emoji-menu,
    .native-email-send-menu, .notification-panel
  ) {
    color: var(--ink);
    background: #122732;
    border-color: var(--surface-line-strong);
    box-shadow: var(--shadow-soft);
  }

  html[data-app-theme="dark"] :is(
    .create-menu-item, .team-row-menu-popover button, .native-email-emoji-menu button,
    .native-email-send-menu button, .phone-number-add-popover button,
    .customer-detail-more-menu button
  ):hover {
    color: var(--ink);
    background: #1a3b45;
  }

  html[data-app-theme="dark"] :is(
    dialog, .app-issue-modal, .phone-setup-modal, .email-system-modal,
    .pipeline-client-modal, .pipeline-decision-modal, .pipeline-opportunity-drawer,
    .schedule-manager-panel, .schedule-job-sheet-card, .schedule-create-sheet,
    .review-log-modal, .camera-modal, .property-measurement-dialog,
    .quote-send-modal, .christmas-lights-dialog, .christmas-lights-drawer,
    .christmas-lights-sheet, .customer-edit-modal, .mh-dialog,
    .native-standalone-dialer-card, .pwa-install-dialog
  ) {
    color: var(--ink);
    background-color: #10242f;
    border-color: var(--surface-line-strong);
  }

  html[data-app-theme="dark"] :is(
    dialog, .app-issue-modal, .phone-setup-modal, .email-system-modal,
    .schedule-manager-panel, .schedule-job-sheet-card, .quote-send-modal,
    .christmas-lights-dialog, .customer-edit-modal
  ) :is(header, footer) {
    background-color: #122a36;
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(
    .app-issue-overlay, .phone-setup-overlay, .email-system-modal-overlay,
    .pipeline-stage-summary-overlay, .pipeline-client-overlay,
    .pipeline-opportunity-overlay, .schedule-manager-backdrop,
    .schedule-job-sheet-backdrop, .camera-overlay, .quote-send-overlay,
    .christmas-lights-dialog-overlay, .christmas-lights-drawer-overlay,
    .christmas-design-group-dialog-backdrop, .mh-dialog-backdrop
  ) {
    background-color: rgba(0, 8, 13, 0.78);
  }

  html[data-app-theme="dark"] :is(
    .quote-new-customer-section, .quote-new-customer-notes,
    .quote-new-customer-actions, .schedule-job-sheet-section,
    .schedule-job-location, .schedule-unscheduled-drawer,
    .phone-setup-drawer, .phone-number-change-drawer,
    .phone-system-advanced-drawer, .phone-system-support-drawer,
    .job-edit-drawer, .team-jobber-section, .team-permissions,
    .empty-state, .payment-reconciliation-panel
  ) {
    color: var(--ink);
    background: #142b37;
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(
    .global-search, .message-bubble-list, .native-message-bubble-list,
    .native-thread-head, .native-customer-composer,
    .native-messages-page.is-native-thread-open,
    .native-inbox-recovery-back
  ) {
    color: var(--ink);
    background: #0d202b;
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(
    .notification-actions, .notification-group summary:hover,
    .notification-group[open] summary, .notification-item:hover,
    .notification-item:focus-visible, .notification-item.is-unread
  ) {
    background: #16343e;
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(.notification-action, .notification-item) {
    color: var(--ink);
    background: var(--paper);
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(.notification-action small, .notification-item-copy span, .notification-item-copy small) {
    color: var(--muted);
  }

  html[data-app-theme="dark"] .notification-badge {
    border-color: #0b1d28;
  }

  html[data-app-theme="dark"] :is(
    .owner-workflow-links a:hover, .owner-appointment-row:hover,
    .client-directory-row:hover, .client-card:hover, .crm-job-card:hover,
    .schedule-card:hover, .payment-card:hover, .quote-followup-card:hover,
    .team-member-row:hover, .message-thread-card:hover
  ) {
    background-color: #183440;
  }

  html[data-app-theme="dark"] :is(
    .owner-appointment-toggle .is-active, .field-home-map-feedback,
    .field-home-map-feedback button, .field-home-more,
    .christmas-sales-workspace, .christmas-sales-lane,
    .christmas-sales-intake-controls, .christmas-sales-calendar-grid,
    .christmas-sales-day-agenda, .christmas-sales-substage-group,
    .schedule-planning-workspace, .schedule-planning-token,
    .christmas-lights-sheet-wrap
  ) {
    color: var(--ink);
    background-color: #142b37;
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(
    .marketing-hub, .mh-page, .mh-card, .mh-stat,
    .marketing-builder-shell, .marketing-builder-preview,
    .pricing-shell, .pricing-summary-panel, .pricing-quick-view,
    .pipeline-board, .pipeline-stage, .pipeline-card,
    .report-card, .report-table-wrap
  ) {
    color: var(--ink);
    background-color: var(--paper);
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(
    .toast.is-error, .form-alert, .global-action-banner.needs-attention
  ) {
    color: #fecdd3;
    background: #421927;
    border-color: rgba(251, 113, 133, 0.5);
  }

  html[data-app-theme="dark"] :is(.toast.is-success, .global-action-banner) {
    color: #b7f5ed;
    background: #103c3b;
    border-color: rgba(69, 212, 202, 0.5);
  }

  html[data-app-theme="dark"] :is(.toast.is-warning, .global-network-banner, .notification-status) {
    color: #ffe3aa;
    background: #412f16;
    border-color: rgba(251, 191, 36, 0.5);
  }

  html[data-app-theme="dark"] .global-network-banner:is(.is-offline, .has-error) {
    color: #fecdd3;
    background: #421927;
    border-color: rgba(251, 113, 133, 0.5);
  }

  html[data-app-theme="dark"] .login-panel,
  html[data-app-theme="dark"] .personal-profile {
    color: var(--ink);
    background: var(--paper);
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(.profile-photo-row, [data-lead-alerts]:not(:empty)) {
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(.profile-help, .personal-profile .field small, .lead-alert-choice small, .lead-alert-receipt small) {
    color: var(--muted);
  }

  html[data-app-theme="dark"] :is(
    .employee-checklist, .employee-checklist-card, .employee-checklist-row,
    .employee-checklist-manager-row, .checklist-library,
    .employee-checklist-editor-fields :is(input, select, textarea)
  ) {
    color: var(--ink);
    background: var(--paper);
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(.employee-checklist-manager-toolbar, .employee-checklist-row:hover, .employee-checklist-row:focus-visible) {
    background: #183440;
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] .employee-checklist-row.is-complete {
    color: var(--muted);
    background: #112d2d;
  }

  html[data-app-theme="dark"] .employee-checklist-row.is-overdue,
  html[data-app-theme="dark"] .employee-checklist-manager-row > em.is-high {
    color: #ffe3aa;
    background: #412f16;
  }

  html[data-app-theme="dark"] :is(.employee-checklist-row-icon, .employee-checklist-toggle) {
    color: var(--ink);
    background: #162d3a;
    border-color: var(--surface-line-strong);
  }

  html[data-app-theme="dark"] :is(
    .visit-flow .task-row, .visit-flow .guided-support, .visit-flow .inline-media-prompt,
    .visit-quick-card, .visit-share-photo, .todo-current-checklists,
    .visit-conflict-details, .visit-collage-share, .billing-receipts article,
    .crew-job-notes, .crew-job-notes-preview, .visit-directions > section
  ) {
    color: var(--ink);
    background: #142b37;
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(.visit-flow .task-row:has(> .check:checked), .visit-share-photo:has(input:checked)) {
    background: #113732;
    border-color: #35b8b0;
  }

  html[data-app-theme="dark"] .visit-flow .task-row .check:not(:checked) {
    background: #0e202c;
    border-color: var(--surface-line-strong);
  }

  html[data-app-theme="dark"] :is(.visit-quick-card p, .visit-later, .crew-job-notes .crew-job-notes-help, .billing-total small, .billing-channels small, .billing-send > small) {
    color: var(--muted);
  }

  html[data-app-theme="dark"] :is(.visit-reference-photos a, .visit-details-load button, .visit-directions header button) {
    color: var(--ink);
    background: #162d3a;
    border-color: var(--surface-line-strong);
  }

  html[data-app-theme="dark"] body.pwa-install-page {
    color: var(--ink);
    background: radial-gradient(circle at 12% 8%, rgba(69, 212, 202, 0.14), transparent 34rem), #081722;
  }

  html[data-app-theme="dark"] .pwa-install-page-card {
    color: var(--ink);
    background: rgba(16, 36, 47, 0.98);
    border-color: var(--surface-line);
    box-shadow: var(--shadow);
  }

  html[data-app-theme="dark"] :is(.pwa-install-page-card h1, .pwa-install-dialog h2, .pwa-install-steps li) {
    color: var(--ink);
  }

  html[data-app-theme="dark"] :is(.pwa-install-page-lede, .pwa-install-page-note, .pwa-install-dialog-intro) {
    color: var(--muted);
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] :is(.pwa-install-dialog-close, .pwa-install-steps li::before) {
    color: #b7f5ed;
    background: #174047;
  }

  html[data-app-theme="dark"] :is(.toast, .global-network-banner, .global-action-banner) :is(strong, span) {
    color: inherit;
  }

  html[data-app-theme="dark"] :is(.leaflet-container, .google-map, [class*="map-canvas"]) {
    color-scheme: light;
  }
  html[data-app-theme="dark"] body :is(
    .owner-home-panel, .owner-workflow-grid, .owner-performance-list, .owner-empty-row,
    .schedule-timegrid, .schedule-timegrid-column, .schedule-time-axis, .schedule-command-bar,
    .schedule-timegrid-head, .schedule-timegrid-corner, .schedule-month-cell,
    .schedule-date-picker, .schedule-select-filter, .schedule-filter-popover > summary,
    .schedule-tool-control, .schedule-crew-chip, .schedule-mobile-day, .mobile-selected-day, .mobile-day-chip,
    .crm-client-table, .crm-client-table-row, .crm-client-metrics > article, .crm-client-directory-search, .client-filter-pill,
    .pipeline-ledger-switch, .pipeline-mode-tabs a, .sales-workspace-reports, .sales-workspace-tabs a,
    .native-messages-page > .section-body, .native-message-console, .native-message-rail,
    .native-empty-thread, .native-workspace-tabs, .native-workspace-tabs a, .native-inbox-filters a,
    .todo-review, .time-empty-row, .personal-time-tabs, .personal-time-tabs button, .time-payroll-summary > article,
    .report-directory-section, .christmas-lights-search, .christmas-sales-lane > header,
    .christmas-sales-view-tabs, .christmas-sales-lane-tabs, .christmas-sales-intake-tabs a, .christmas-sales-intake-heading button,
    .wh-card, .app-hub-section, .issue-report-button
  ) {
    color: var(--ink);
    background: var(--paper);
    border-color: var(--surface-line);
  }

  html[data-app-theme="dark"] body :is(
    .schedule-timegrid-head.is-today, .schedule-timegrid-column.is-today, .schedule-crew-chip.active,
    .schedule-mobile-day.is-selected, .mobile-day-chip.active, .mobile-selected-day.is-today, .personal-time-tabs button[aria-selected="true"],
    .pipeline-mode-tabs a.is-active, .pipeline-ledger-switch a.is-active, .sales-workspace-tabs a.is-active, .native-workspace-tabs a.active,
    .native-inbox-filters a.active, .christmas-sales-view-tabs a.is-active, .christmas-sales-intake-tabs a.is-active
  ) {
    color: #c8fff4;
    background: #174047;
    border-color: #35b8b0;
  }

  html[data-app-theme="dark"] body :is(
    .guided-phase, .guide-step-button, .jobsite-work-header, .jobsite-mobile-submit-bar,
    .job-work-timer, .toast,
    .crm-detail-card, .crm-detail-section, .crm-detail-stat, .crm-detail-actions,
    .customer-detail-card, .customer-detail-summary, .customer-detail-section,
    .quote-line-item, .quote-price-card, .pricing-service-card, .pricing-option
  ) { color: var(--ink); background: var(--paper); border-color: var(--surface-line); }
  html[data-app-theme="dark"] .visit-flow .guide-step-button.is-active { background: #174047; border-color: #35b8b0; }
  html[data-app-theme="dark"] :is(.guide-step-button span, .guide-mobile-status) { color: #c8fff4; background: #174047; }
  html[data-app-theme="dark"] :is(.job-scope-review, .job-scope-unavailable) { background: #412f16; }
  html[data-app-theme="dark"] :is(.billing-state, .billing-portal-link) { color: #71ddc0; }
  html[data-app-theme="dark"] .visit-flow .task-row:has(> .check:checked) > div > strong { color: #b7f5dc; }

  html[data-app-theme="dark"] body :is(
    .crm-job-history-metrics > article, .team-list-count, .app-update-banner, .app-update-banner button,
    .inventory-table-shell, .inventory-table-head, .inventory-row, .inventory-section-tabs,
    .mh-empty, .mh-filter-details, .mh-metric, .mh-tabs a,
    .qa-rule, .qa-connections, .qa-deliveries, [data-qa-attention], .qa-quote-requests,
    .command-center-page > .section-body, .command-center-layout > section,
    .command-pillar-grid > section, .command-system-map-grid > article,
    .command-daily-grid > article, .command-cutover-grid > article,
    .report-toolbar, .jobber-detail-row.header
  ) { color: var(--ink); background: var(--paper); border-color: var(--surface-line); }

  html[data-app-theme="dark"] body :is(
    .inventory-section-tabs a.active, .mh-tabs a[aria-current], .qa-status.paused
  ) { color: #c8fff4; background: #174047; }

  html[data-app-theme="dark"] body :is(.qa-status.ready, .client-status, .inventory-status-cell.ready) {
    color: #b7f5dc; background: #113732;
  }

  html[data-app-theme="dark"] body :is(.qa-status.blocked, .qa-status.attention, .inventory-status-cell.build) {
    color: #ffe3aa; background: #412f16;
  }

  html[data-app-theme="dark"] :is(.schedule-kind-legend, .schedule-legend, .wh, .wh dt, .wh label > span) {
    color: var(--muted);
  }

  html[data-app-theme="dark"] .command-center-page :is(
    .command-automation-pillar-plan, .command-build-card, .command-system-next,
    .command-automation-next, .command-gap-card, .command-priority-item,
    .command-automation-dependency, .command-glance-card, .command-action,
    .command-system-item, .command-next-move
  ) { color: var(--ink); background: var(--paper); border-color: var(--surface-line); }

  html[data-app-theme="dark"] body :is(
    .christmas-crew-view-tabs, .christmas-crew-summary, .christmas-crew-setup,
    .christmas-crew-existing-item, .christmas-crew-setup-form, .christmas-crew-member-grid label,
    .christmas-crew-column, .christmas-crew-column > header, .christmas-crew-column > header b,
    .christmas-crew-job-card, .christmas-installer-assignment, .christmas-installer-picker label,
    .christmas-installer-picker label > span, .christmas-installer-empty-link,
    .christmas-crew-management, .christmas-crew-calendar, .christmas-crew-calendar-day,
    .christmas-crew-calendar-day > header, .christmas-crew-onboard-form, .christmas-crew-compact-form,
    .christmas-crew-foreman-card, .christmas-crew-person-avatar, .christmas-crew-roster-card,
    .christmas-crew-roster-card > header b, .christmas-preview-walkthrough,
    .install-card, .install-pack, .install-job-notes, .install-profile, .install-overview,
    .install-evidence form, .install-check:has(input:checked),
    .owner-change, .schedule-empty-note, .schedule-live-status, .mobile-month-cell, .pipeline-stage-head > span,
    .christmas-lights-stage > header b, .mh-next-links a, .mh-source-filters a,
    .mh-lsa-notes, .mh-arrival-times
  ) { color: var(--ink); background: var(--paper); border-color: var(--surface-line); }

  html[data-app-theme="dark"] body :is(.christmas-crew-page, .christmas-install-workflow) {
    color: var(--ink); background: #0b1d28;
  }

  html[data-app-theme="dark"] body :is(.christmas-crew-page, .christmas-install-workflow, .install-profile, .install-overview) :is(
    h2, h3, h4, strong, summary, a:not(.button), label, p, span, small, em
  ) { color: var(--ink); }

  html[data-app-theme="dark"] body :is(
    .christmas-crew-page small, .christmas-crew-heading span, .christmas-crew-management-head span,
    .christmas-crew-calendar > header span, .christmas-crew-calendar-day > header span,
    .christmas-crew-calendar-day > a > span, .christmas-crew-calendar-day > a > small,
    .install-muted, .install-job-header p, .install-material-row small, .install-usage-row small,
    .install-pack-list small, .install-overview-list small,
    .schedule-select-filter span, .schedule-filter-popover summary span, .schedule-load-strip p, .schedule-live-status,
    .native-message-rail-head span, .native-panel-head span, .native-inbox-filters em,
    .native-compose-destination, .todo-review p, .todo-toolbar > span, .todo-resources,
    .christmas-sales-view-tabs a, .christmas-sales-view-tabs b, .christmas-sales-lane-title em, .christmas-sales-lane-tabs a,
    .christmas-sales-intake-controls em, .inventory-section-tabs a,
    .mh-page p, .mh-page label > span, .mh-period span, .mh-metric > span,
    .mh-filter-options summary, .mh-filters .text-button
  ) { color: var(--muted); }

  html[data-app-theme="dark"] body :is(
    .christmas-crew-setup-callout, .christmas-crew-access-note, .christmas-crew-preview-banner,
    .christmas-crew-work-type, .christmas-crew-invite-status, .christmas-crew-member-list em,
    .install-status, .install-success, .crm-client-table-status.is-ready
  ) { color: #b7f5dc; background: #113732; border-color: #397a65; }

  html[data-app-theme="dark"] body :is(
    .christmas-crew-access-note.is-warning, .christmas-crew-invite-status.is-pending,
    .christmas-crew-member-list em.is-pending, .install-warning, .mh-data-note
  ) { color: #ffe3aa; background: #412f16; border-color: #987339; }

  html[data-app-theme="dark"] body :is(.christmas-crew-access-note.is-error, .christmas-crew-work-type.is-maintenance) {
    color: #ffd6df; background: #48222e; border-color: #ae526b;
  }

  html[data-app-theme="dark"] body :is(.owner-performance-good, .install-back, .install-photo-grid a, .install-reference-grid a) { color: #b7f5dc; }
  html[data-app-theme="dark"] body :is(.install-message, .schedule-month-date strong) { color: #ffe3aa; }
  html[data-app-theme="dark"] body :is(.pipeline-ledger-mark, .pipeline-stage-icon) { color: #fff; background: #17534f; }
  html[data-app-theme="dark"] body .christmas-sales-view-tabs a.is-active { color: #c8fff4; background: #174047; }
  html[data-app-theme="dark"] body .christmas-sales-view-tabs a.is-active :is(span, b) { color: #c8fff4; background: #174047; }
  html[data-app-theme="dark"] body .owner-performance-good { color: #b7f5dc !important; }
  html[data-app-theme="dark"] body .schedule-month-cell.is-today .schedule-month-date strong { color: #ffb4c5 !important; }
  html[data-app-theme="dark"] body .christmas-lights-tabs a.is-active { color: #c8fff4; }
  html[data-app-theme="dark"] body .christmas-sales-lane-tabs a.is-active :is(span, b) { color: #c8fff4; background: #174047; }
  html[data-app-theme="dark"] body :is(.mobile-month-cell.active, .mobile-month-cell.is-today) { background: #174047; border-color: #35b8b0; }
  html[data-app-theme="dark"] body :is(.mobile-selected-head, .mobile-selected-day.is-today .mobile-selected-head) { color: var(--ink); background: #174047; }

  html[data-app-theme="dark"] body :is(
    .pipeline-card-value, .christmas-lights-record, .christmas-renewal-status, .christmas-renewal-source.is-unassigned,
    .native-thread-item.active, .native-email-message-card, .native-email-card-head, .native-email-summary,
    .mh-source-summary, .mh-source-summary tbody tr, .mh-table-wrap, .mh-table td
  ) { color: var(--ink); background: var(--paper); border-color: var(--surface-line); }
  html[data-app-theme="dark"] body :is(.crm-status.unscheduled, .service-tags > span, .native-contact-trailing em) {
    color: #eafffc; background: #17534f;
  }
  html[data-app-theme="dark"] body :is(.crm-client-table-status.is-lead, .crm-client-table-status.is-active) {
    color: #b7f5dc; background: #113732;
  }
  html[data-app-theme="dark"] body .crm-client-table-status.is-needs-info { color: #ffe3aa; background: #412f16; }
  html[data-app-theme="dark"] body :is(
    .christmas-renewal-source.is-unassigned, .christmas-renewal-status em,
    .native-contact-trailing time, .native-thread-contact-line, .native-email-sender-line span,
    .native-email-summary-actions time, .customer-phone-assignment, .native-thread-item p, .native-thread-head p,
    .native-email-preview, .native-email-recipient, .native-email-recipient span
  ) { color: var(--muted); }
  html[data-app-theme="dark"] .mh-source-summary td::before { color: var(--muted); }
  html[data-app-theme="dark"] body .mh-source-summary a { color: #b7f5dc; }
  html[data-app-theme="dark"] body :is(.christmas-lights-record-top b, .christmas-renewal-card-summary b) { color: #b7f5dc; }
  /* Received HTML email keeps its authored light surface and matching text palette. */
  html[data-app-theme="dark"] .native-email-body {
    --ink: #17212b; --muted: #526174; --navy: #143a56; --deep: #0b2538;
    color: var(--ink); color-scheme: light;
  }

  html[data-app-theme="dark"] body .native-messages-page .message-page-actions .button,
  html[data-app-theme="dark"] body .native-standalone-dialer-card :is(
    .native-dialer-key, .native-dialer-nav button, .native-dialer-control,
    .native-dialer-live-panel, .native-dialer-mode-panel, [data-native-dialer-choice]
  ) {
    color: var(--ink); background: var(--soft); border-color: var(--surface-line-strong);
  }
  html[data-app-theme="dark"] body .native-standalone-dialer-card :is(
    .native-dialer-number input, .native-dialer-note input, .native-dialer-transfer-panel input
  ) { color: var(--ink); background: var(--paper); border-color: var(--surface-line-strong); }
  html[data-app-theme="dark"] body .native-standalone-dialer-card :is(
    .native-dialer-title strong, .native-dialer-from-button, .native-dialer-from-button strong,
    .native-dialer-meta strong, .native-dialer-live-summary strong, .native-dialer-mode-panel strong,
    .native-dialer-key strong, .native-dialer-nav button :is(svg, span),
    [data-native-dialer-choice] :is(strong, span)
  ) { color: var(--ink); }
  html[data-app-theme="dark"] body .native-standalone-dialer-card :is(
    .native-dialer-key small, .native-dialer-title em, .native-dialer-display label > span,
    .native-dialer-meta em, .native-dialer-live-summary span, .native-dialer-live-summary em,
    .native-dialer-mode-panel span, [data-native-manual-dialer-status]
  ) { color: var(--muted); }
  html[data-app-theme="dark"] body .native-standalone-dialer-card :is(
    .native-dialer-key:hover:not(:disabled), .native-dialer-nav button.is-active, .native-dialer-control.is-active
  ) { color: var(--ink); background: #174047; }
  html[data-app-theme="dark"] body .native-standalone-dialer-card .native-dialer-control.is-end {
    color: #ffd6df; background: #48222e;
  }
  html[data-app-theme="dark"] body .native-messages-page .message-page-actions .button :is(svg, span) { color: inherit; }

}
