/* Screen-only black/gold surfaces for existing operational views.
   No layout, record, chart value, hidden-state or print rules are changed. */
@media screen {
  body :is(#goalsView, #targetView, #recruitView, #collectionView, #sitplanView) {
    --ops-ink: var(--crm-text);
    --ops-muted: var(--crm-muted);
    --ops-line: var(--crm-line);
    --ops-gold: var(--crm-gold);
    color: var(--crm-text);
  }

  /* Monthly goal and the W / sales panels. */
  body #goalsView :is(.monthly-goals, #performancePanel, .performance-panel),
  body #goalPerformance :is(.gp-w-panel, .gp-sales-panel, .gp-sales-card, .gp-contracts, .gp-history-wrap > details) {
    background: var(--crm-card);
    border-color: var(--crm-line);
    color: var(--crm-text);
    box-shadow: var(--crm-shadow);
  }
  body #goalsView .monthly-goals { border-left-color: var(--crm-line); }
  body #goalsView :is(.goal-kicker, .goal-incentive > span, .goal-heading em),
  body #goalPerformance :is(.gp-w-heading strong, .gp-w-input, .gp-w-rules b, .gp-nocount-record h4, .gp-nocount-record h5) { color: var(--crm-muted); }
  body #goalsView :is(.goal-pledge, .goal-metrics strong, .performance-panel-title strong, .performance-month-row label),
  body #goalPerformance :is(.gp-profile-identity strong, .gp-w-meta b, .gp-sales-head h3, .gp-sales-head h4, .gp-sales-card-head h4, .gp-sales-card-head strong, .gp-sales-values dd, .gp-sales-values strong, .gp-sales-values b, .gp-contract-row strong, .gp-history-row strong, .gp-week-history li > b) { color: var(--crm-text); }
  body #goalsView :is(.goal-metrics span, .goal-metrics small, .goal-incentive, .performance-panel-title small, .performance-month-row > small),
  body #goalPerformance :is(.gp-w-heading > small, .gp-w-meta, .gp-w-status, .gp-sales-head p, .gp-sales-values dt, .gp-sales-values span, .gp-nocount-input, .gp-nocount-manual > summary, .gp-contract-row p, .gp-contract-row small, .gp-contract-title time, .gp-history-row small, .gp-week-history li > span, .gp-help, .gp-empty) { color: var(--crm-muted); }
  body #goalsView :is(.goal-heading input, .performance-month-row input),
  body #goalPerformance :is(#gpWValue, #gpNoCountValue) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); color-scheme: dark; }
  body #goalsView .goal-heading em,
  body #goalPerformance :is(.gp-nocount-total, .gp-w-rules > span, .gp-w-monthly, .gp-nocount-record, .gp-preserved-sales, .gp-sales-total, .gp-contract-amounts, .gp-contract-deleted) { background: var(--crm-card); border-color: var(--crm-line); color: var(--crm-beige); }
  body #goalPerformance :is(.gp-w-monthly strong, .gp-sales-total h4, .gp-sales-total h5, .gp-sales-total .gp-sales-values dd, .gp-sales-total .gp-sales-values strong, .gp-preserved-sales strong, .gp-preserved-sales span, .gp-contract-amounts dd, .gp-week-history li > small) { color: var(--crm-muted); }
  body #goalPerformance :is(.gp-preserved-sales small, .gp-contract-amounts dt, .gp-contract-deleted > summary, .gp-contract-deleted .gp-contract-row strong) { color: var(--crm-muted); }
  body #goalsView .performance-panel-heading,
  body #goalPerformance :is(.gp-sales-values > div, .gp-week-history li, .gp-history-row, .gp-contract-row, .gp-nocount-manual, .gp-contracts[open] > summary, .gp-history-wrap details[open] > summary) { border-color: var(--crm-line); }
  body #goalPerformance { color: var(--crm-text); border-color: var(--crm-line); }
  body #goalPerformance :is(.gp-history-wrap summary, .gp-contracts > summary, .gp-contract-history > summary span) { color: var(--crm-beige); }
  body #goalPerformance :is(.gp-badge, .gp-contract-type, .gp-contract-type.nonlife) { background: var(--crm-card); border-color: var(--crm-line); color: var(--crm-muted); }
  body #goalPerformance :is(.gp-badge.active, .gp-badge.protected, .gp-badge.pending, .gp-badge.unconfigured) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalPerformance .gp-badge.broken { background: var(--crm-danger-bg); border-color: var(--crm-danger); color: var(--crm-danger-text); }
  body #goalPerformance :is(.gp-w-status.active, .gp-w-status.protected) { color: var(--crm-muted); }
  body #goalPerformance .gp-w-status.broken { color: var(--crm-danger-text); }
  body #goalPerformance .gp-day { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalPerformance .gp-day :is(b, strong) { color: var(--crm-text); }
  body #goalPerformance .gp-day small { color: var(--crm-muted); }
  body #goalPerformance :is(.gp-day.done, button.gp-day[aria-pressed="true"]) { background: var(--crm-raised); border-color: var(--crm-line); }
  body #goalPerformance .gp-day.done :is(b, strong, small) { color: var(--crm-muted); }
  body #goalPerformance .gp-day.today { border-color: var(--crm-line); box-shadow: var(--crm-shadow); }
  body #goalPerformance button.gp-day:disabled { background: var(--crm-card); border-color: var(--crm-line); color: var(--crm-muted); }
  body #goalPerformance button.gp-day:disabled :is(b, small) { color: var(--crm-muted); }
  body #goalPerformance :is(.gp-upgrade-warning, .gp-legacy-note) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalPerformance .gp-sales-table { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #goalPerformance .gp-sales-table :is(th, td) { border-color: var(--crm-line); }
  body #goalPerformance .gp-sales-table thead th { background: var(--crm-card); color: var(--crm-muted); }
  body #goalPerformance .gp-sales-table tbody th { background: var(--crm-card); color: var(--crm-beige); }
  body #goalPerformance .gp-sales-table td { background: var(--crm-card); color: var(--crm-text); }
  body #goalPerformance .gp-sales-table :is(th, td):last-child { background: var(--crm-raised); color: var(--crm-beige); }
  body #goalPerformance .gp-sales-table small { color: var(--crm-muted); }
  body #goalsView .monthly-goals .goal-edit,
  body #goalPerformance button { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalPerformance :is(button.primary, #gpWSave, #gpNoCountAdd) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalPerformance :is(button.gp-reset-month, #gpNoCountCancel, button[data-gp-delete], [data-gp-contract-delete], .gp-history-row button) { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #goalPerformance :is(button.gp-reset-month:hover, #gpNoCountCancel:hover, button[data-gp-delete]:hover, [data-gp-contract-delete]:hover) { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #goalPerformance #gpInlineMessage { color: var(--crm-danger-text); }

  /* Actual contract calendar: dates, counts and selected-day semantics remain. */
  body #gpContractCalendar { color: var(--crm-text); }
  body #gpContractCalendar :is(.cc-panel, .cc-detail, .cc-contract-row) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #gpContractCalendar :is(.cc-summary-title, .cc-month-controls h3, .cc-detail-heading h4, .cc-row-heading strong, .cc-amounts dd) { color: var(--crm-text); }
  body #gpContractCalendar :is(.cc-summary-title small, .cc-legend, .cc-weekdays, .cc-hint, .cc-detail-heading p, .cc-product, .cc-detail-footer small, .cc-empty, .cc-amounts dt) { color: var(--crm-muted); }
  body #gpContractCalendar :is(.cc-summary-count, .cc-unconfirmed-date, .cc-panel > summary::after) { color: var(--crm-muted); }
  body #gpContractCalendar :is(button, .cc-day) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #gpContractCalendar :is(.cc-unconfirmed, .cc-add, .cc-error, .cc-amounts, .cc-type, .cc-type.nonlife) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #gpContractCalendar .cc-day-number { color: var(--crm-text); }
  body #gpContractCalendar .cc-day-count { color: var(--crm-muted); }
  body #gpContractCalendar .cc-day.has-contract { background: var(--crm-card); border-color: var(--crm-line); }
  body #gpContractCalendar .cc-day.is-future { background: var(--crm-card); }
  body #gpContractCalendar .cc-day.is-future .cc-day-number { color: var(--crm-muted); }
  body #gpContractCalendar .cc-day.is-selected { background: var(--crm-raised); border-color: var(--crm-line); box-shadow: var(--crm-shadow); }
  body #gpContractCalendar .cc-day:hover { border-color: var(--crm-line); }
  body #gpContractCalendar :is(.cc-day.is-sunday .cc-day-number, .cc-weekdays span:first-child) { color: var(--crm-danger-text); }
  body #gpContractCalendar :is(.cc-day.is-saturday .cc-day-number, .cc-weekdays span:last-child) { color: var(--crm-muted); }
  body #gpContractCalendar .cc-dot { background: var(--crm-raised); }
  body #gpContractCalendar .cc-dot.nonlife { background: var(--crm-raised); }
  body #gpContractCalendar .cc-row-actions .cc-delete { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #gpContractCalendar .cc-row-actions .cc-delete:hover { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }

  /* Target list, including sticky name cells on compact screens. */
  body #targetBoard :is(.target-table-section, .target-table-heading, .target-unified-heading, .target-list-table, .target-table-empty) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #targetBoard .target-table-heading h3 { color: var(--crm-text); }
  body #targetBoard :is(.target-table-heading p, .target-cell-num, .target-table-memo, .target-delivery-pending, .target-schedule-place, .target-linked-activity) { color: var(--crm-muted); }
  body #targetBoard :is(.target-table-count, .stage-add-customer, .target-table-status, .target-table-status.done) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #targetBoard .target-list-table th { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #targetBoard .target-list-table td { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #targetBoard .target-list-table .target-cell-name { background: var(--crm-card); box-shadow: var(--crm-shadow); }
  body #targetBoard .target-list-table tbody tr:hover td { background: var(--crm-card); }
  body #targetBoard .target-list-table tbody tr:hover .target-cell-name { background: var(--crm-card); }
  body #targetBoard :is(.target-name-link, .target-task, .target-date, .target-linked-date) { color: var(--crm-text); }
  body #targetBoard :is(.target-date.missing, .target-progress .target-calendar.unmarked) { color: var(--crm-muted); }
  body #targetBoard :is(.target-table-actions button, .target-table-actions .next-stage, .target-table-actions .target-call, .target-linked-edit) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #targetBoard .target-table-actions .target-delete { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #targetBoard .target-linked-edit:hover { background: var(--crm-raised); color: var(--crm-text); }
  body #targetBoard .target-stage-filters { background: var(--crm-card); border-color: var(--crm-line); }
  body #targetBoard .target-stage-filters button { background: var(--crm-card); color: var(--crm-beige); border-color: var(--crm-line); }
  body #targetBoard .target-stage-filters button span { color: var(--crm-muted); }
  body #targetBoard .target-stage-filters button[aria-pressed="true"] { background: var(--crm-raised); color: var(--crm-muted); border-color: var(--crm-line); }
  body #targetBoard .target-stage-filters button[aria-pressed="true"] span { color: var(--crm-muted); }
  body #targetBoard .target-stage-badge,
  body #targetBoard .target-stage-badge[data-badge-stage] { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #targetBoard .target-table-scroll { scrollbar-color: var(--crm-line) var(--crm-bg); }
  body #targetBoard .target-list-table :is(.target-task, .target-date) { color: var(--crm-text); }
  body #targetBoard .target-list-table :is(.target-date.missing, td.target-cell-num) { color: var(--crm-muted); }
  body #targetBoard .target-list-table .target-table-empty { background: var(--crm-card); color: var(--crm-muted); }
  body #targetBoard .target-table-heading .stage-add-customer { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #targetBoard .target-progress :is(.target-calendar, .target-calendar.done) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #targetBoard .target-progress .target-calendar.unmarked { background: transparent; color: var(--crm-muted); }
  body #targetView :is(.target-create-actions button:not(.primary), .target-column, .target-column-head, .target-card) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #targetView :is(.target-phone, .target-place, .target-card-note, #targetHistory, #targetHistory p) { color: var(--crm-muted); }

  /* Collection and recruiting use opaque dark panels and tinted status chips. */
  body #collectionView :is(.collection-overview > div, .collection-companies, .collection-group, .collection-empty),
  body #recruitView :is(.recruit-panel, .recruit-empty) { background: var(--crm-card); border-color: var(--crm-line); color: var(--crm-text); }
  body #collectionView .collection-panel-head,
  body #recruitView .recruit-panel-head { background: var(--crm-card); border-color: var(--crm-line); }
  body #collectionView .collection-group .collection-panel-head { background: var(--crm-card); border-color: var(--crm-line); }
  body #collectionView :is(.collection-panel-head h3, .collection-overview strong, .collection-company label, .collection-table td b),
  body #recruitView :is(.recruit-panel-head h3, .recruit-week-grid b, .recruit-table td b, .recruit-auto-summary strong, .recruit-manual-summary b, .recruit-schedule) { color: var(--crm-text); }
  body #collectionView :is(.collection-panel-head span, .collection-overview span, .collection-overview small, .collection-caption, .collection-footnote, .collection-money small),
  body #recruitView :is(.recruit-panel-head span, .recruit-caption, .recruit-week-grid p, .recruit-week-grid small, .recruit-total i, .recruit-person-sub, .recruit-schedule.is-empty, .recruit-manual-summary span) { color: var(--crm-muted); }
  body #collectionView :is(.collection-company, .collection-company.checked, .collection-ap),
  body #recruitView :is(.recruit-total, .recruit-auto-summary, .recruit-manual-summary) { background: var(--crm-card); color: var(--crm-beige); border-color: var(--crm-line); }
  body #collectionView :is(.collection-panel-head .collection-group-number, .collection-group-2 .collection-group-number),
  body #recruitView :is(.recruit-week-grid > div > span, .recruit-total > span, .recruit-total > b, .recruit-auto-summary i) { color: var(--crm-muted); }
  body #collectionView .collection-panel-head .collection-group-number { background: var(--crm-raised); border-color: var(--crm-line); }
  body #collectionView .collection-company input { accent-color: var(--crm-gold); }
  body #collectionView .collection-company button { background: var(--crm-card); color: var(--crm-muted); }
  body #collectionView .collection-company button:hover { background: var(--crm-danger-bg); color: var(--crm-danger-text); }
  body #recruitView .recruit-week-grid > div { border-color: var(--crm-line); }
  body #recruitView .recruit-week-range { color: var(--crm-muted) !important; } /* Overrides the source's exact important range label. */
  body #collectionView .collection-table th,
  body #recruitView .recruit-table th { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #collectionView .collection-table td,
  body #recruitView .recruit-table td { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #collectionView .collection-table tbody tr:hover td,
  body #recruitView .recruit-table tbody tr:hover td { background: var(--crm-card); }
  body #collectionView :is(.collection-status, .collection-status.contacted, .collection-status.paid) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #collectionView :is(.collection-panel-head button, #collectionSetAP, .collection-row-actions button, .collection-row-actions button[data-collection-paid]),
  body #recruitView :is(.recruit-panel-head button, .recruit-row-actions button, .recruit-row-actions .recruit-move, button[data-recruit-edit]) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #collectionView .collection-row-actions .collection-delete,
  body #recruitView button[data-recruit-delete] { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #collectionView .collection-warning,
  body #recruitView .recruit-warning { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }

  /* Sitplan keeps its scrollable grid and registered-calendar schedule rows. */
  body #sitplanView :is(.sit-scroll, .sit-grid, .sit-weekly-goals, .sit-calendar-events, .sit-activity-guide, .sit-goal-metric) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #sitplanView .sit-scroll { scrollbar-color: var(--crm-line) var(--crm-bg); }
  body #sitplanView .sit-scroll::before { background: var(--crm-card); color: var(--crm-muted); }
  body #sitplanView .sit-grid :is(th, .sit-day-head) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #sitplanView .sit-grid th:first-child { background: var(--crm-card); }
  body #sitplanView .sit-grid th.sit-today { background: var(--crm-raised); color: var(--crm-text); }
  body #sitplanView .sit-grid th small { color: var(--crm-muted); }
  body #sitplanView .sit-grid td { background: var(--crm-card); border-color: var(--crm-line); }
  body #sitplanView .sit-grid td > button { background: var(--crm-card); color: var(--crm-text); }
  body #sitplanView .sit-grid td > button:is(:hover, :focus-visible) { background: var(--crm-card); }
  body #sitplanView :is(.sit-grid .sit-empty, .sit-goalbar-head > div > span, .sit-goalbar-note, .sit-goal-metric small, .sit-guide-body, .sit-guide-body p, .sit-calendar-heading small, .sit-calendar-heading > span, .sit-calendar-date > span, .sit-calendar-place, .sit-calendar-events > p) { color: var(--crm-muted); }
  body #sitplanView :is(.sit-goalbar-head b, .sit-goal-metric strong, .sit-calendar-heading h3, .sit-calendar-content) { color: var(--crm-text); }
  body #sitplanView :is(.sit-goal-inherited, .sit-guide-example) { background: var(--crm-card); border-color: var(--crm-line); color: var(--crm-muted); }
  body #sitplanView .sit-activity-guide > summary { color: var(--crm-muted); }
  body #sitplanView .sit-activity-guide > summary:hover { background: var(--crm-card); }
  body #sitplanView :is(.sit-activity-guide[open] > summary, .sit-calendar-events li) { border-color: var(--crm-line); }
  body #sitplanView :is(.sit-tools button, .sit-local, #sitGoalsEdit) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #sitplanView #sitGoalsEdit:hover { background: var(--crm-raised); border-color: var(--crm-line); }
  body :is(#sitplanView, #sitplanDialog) .sit-plan-line { color: var(--crm-text); }
  body :is(#sitplanView, #sitplanDialog) .sit-activity { background: var(--crm-raised); color: var(--crm-muted); border-color: var(--crm-line); }
  body :is(#sitplanView, #sitplanDialog) .sit-activity:is([data-sit-activity="OP"], [data-sit-activity="PC"]) { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #sitplanView .sit-calendar-review { color: var(--crm-muted) !important; } /* A legacy rendered warning has an inline brown color. */

  /* Editors and their inner cards: source-specific rules override the shared skin. */
  body :is(#goalPerformanceDialog.goal-performance-dialog, .goal-dialog, #sitplanDialog.sit-dialog, #collectionDialog, #recruitDialog, #targetEditor, #targetPicker) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body :is(#goalPerformanceDialog, .goal-dialog, #sitplanDialog, #collectionDialog, #recruitDialog, #targetEditor, #targetPicker) :is(h2, h3, label, .gp-field, .gp-check, legend) { color: var(--crm-text); }
  body #goalPerformanceDialog .gp-dialog-head h2,
  body #collectionDialog .collection-modal-head h2,
  body #recruitDialog .recruit-modal-head h2,
  body #sitplanDialog .sit-modal-head h2,
  body #sitplanDialog .sit-activity-picker > legend { color: var(--crm-text); }
  body :is(#goalPerformanceDialog, .goal-dialog, #sitplanDialog, #collectionDialog, #recruitDialog, #targetEditor, #targetPicker) :is(.help, .gp-help, .goal-help, .sit-help, .collection-caption, .recruit-form-help, .recruit-input-head, .recruit-input-row > span) { color: var(--crm-muted); }
  body :is(#goalPerformanceDialog, .goal-dialog, #sitplanDialog, #collectionDialog, #recruitDialog, #targetEditor, #targetPicker) :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
  body #collectionView :is(.collection-filter input, .collection-filter select, .collection-month input),
  body #recruitView .recruit-heading input,
  body #sitplanView .sit-tools input { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); color-scheme: dark; }
  body :is(#goalPerformanceDialog, .goal-dialog, #sitplanDialog, #collectionDialog, #recruitDialog, #targetEditor, #targetPicker) :is(input, textarea)::placeholder { color: var(--crm-muted); }
  body :is(#goalPerformanceDialog, .goal-dialog, #sitplanDialog, #collectionDialog, #recruitDialog, #targetEditor, #targetPicker) input[type="checkbox"] { accent-color: var(--crm-gold); }
  body #goalPerformanceDialog :is(.gp-contract-confirm, .gp-salary-calculator, .gp-opening-table fieldset, .gp-baseline-fields, .gp-reset-summary, .gp-reset-totals > div, .gp-legacy-note, .gp-legacy-settings),
  body #sitplanDialog :is(.sit-activity-picker, .sit-editor-preview, #sitActivityPreview) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); }
  body #goalPerformanceDialog :is(.gp-salary-formula, .gp-contract-confirm strong, .gp-legacy-settings > summary) { color: var(--crm-text); }
  body #goalPerformanceDialog :is(.gp-salary-fields small, .gp-salary-note, .gp-salary-status, .gp-reset-notes),
  body #sitplanDialog :is(.sit-insert-help, .sit-goal-inherited),
  body .goal-dialog :is(.goal-table .goal-table-head, #goalMessage) { color: var(--crm-muted); }
  body #goalPerformanceDialog :is(.gp-salary-status[data-mode="auto"], .gp-opening-table legend, .gp-baseline-fields legend),
  body #recruitDialog .recruit-form-help b { color: var(--crm-muted); }
  body #goalPerformanceDialog :is(.gp-salary-status[data-mode="error"], #gpMessage),
  body #collectionDialog #collectionFormError,
  body #recruitDialog #recruitFormError { color: var(--crm-danger-text); }
  body #goalPerformanceDialog .gp-form-actions,
  body #sitplanDialog .sit-modal-actions,
  body #collectionDialog .collection-modal-actions,
  body #recruitDialog .recruit-modal-actions { background: var(--crm-card); border-color: var(--crm-line); box-shadow: var(--crm-shadow); }
  body #sitplanDialog .sit-editor-preview > span { background: var(--crm-card); color: var(--crm-beige); border-color: var(--crm-line); }
  body #sitplanDialog #sitActivityPreview:empty::before { color: var(--crm-muted); }
  body #goalPerformanceDialog :is(.gp-dialog-head button, .gp-form-actions button, .gp-allocation-shortcuts button),
  body .goal-dialog :is(.goal-dialog-head button, .goal-dialog-actions button),
  body #sitplanDialog .sit-modal-actions button,
  body #collectionDialog :is(.collection-modal-head button, .collection-modal-actions button),
  body #recruitDialog :is(.recruit-modal-head button, .recruit-modal-actions button) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalPerformanceDialog .gp-form-actions button.primary,
  body .goal-dialog .goal-dialog-actions .primary,
  body #sitplanDialog .sit-modal-actions .primary,
  body #collectionDialog .collection-modal-actions .primary,
  body #recruitDialog .recruit-modal-actions .primary { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalPerformanceDialog .gp-form-actions button.primary:hover { background: var(--crm-raised); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalPerformanceDialog .gp-form-actions button.gp-danger { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #goalPerformanceDialog .gp-form-actions button.gp-danger:hover { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #sitplanDialog .sit-activity-picker button.sit-activity:hover { background: var(--crm-raised); color: var(--crm-text); border-color: var(--crm-line); }
  body #sitplanDialog .sit-activity-picker button.sit-activity:is([data-sit-activity="OP"], [data-sit-activity="PC"]):hover { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }

  /* The earlier shared skin groups a two-ID selector in :is(); this matched
     group deliberately has equal-or-higher specificity for every card. */
  body :is(#goalsView #goalPerformance .gp-w-panel, #goalsView #goalPerformance .gp-sales-panel, #goalsView #goalPerformance .gp-sales-card,
    #targetView #targetBoard .target-table-section,
    #collectionView .collection-overview > div, #collectionView .collection-group,
    #recruitView .recruit-panel,
    #sitplanView .sit-weekly-goals, #sitplanView .sit-activity-guide, #sitplanView .sit-calendar-events) {
    background: var(--crm-card);
    color: var(--crm-text);
    border-color: var(--crm-line);
  }
  body #goalsView #monthlyGoals :is(.goal-heading input, #goalMonth) { background: var(--crm-card); color: var(--crm-text); border-color: var(--crm-line); color-scheme: dark; }
  body #goalsView #monthlyGoals :is(.goal-metrics > div, .goal-incentive) { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #goalsView #monthlyGoals .goal-heading em { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }

  /* Collection's derived contract-document dispatch panel is rendered by
     contract-notices.js, independently of the collection table. */
  body #collectionView #contractNotices { color: var(--crm-text); }
  body #collectionView #contractNotices .cn-banner { background: var(--crm-card); border-color: var(--crm-line); color: var(--crm-text); }
  body #collectionView #contractNotices :is(.cn-heading h3, .cn-customer strong) { color: var(--crm-text); }
  body #collectionView #contractNotices :is(.cn-icon, .cn-count) { background: var(--crm-card); color: var(--crm-muted); }
  body #collectionView #contractNotices :is(.cn-caption, .cn-customer small, .cn-product, .cn-date > span, .cn-date time, summary > span, .cn-help, .cn-empty) { color: var(--crm-muted); }
  body #collectionView #contractNotices :is(.cn-caption b, .cn-date small, .cn-action label, summary, .cn-status, .cn-blocked) { color: var(--crm-muted); }
  body #collectionView #contractNotices .cn-error { color: var(--crm-danger-text); }
  body #collectionView #contractNotices :is(.cn-row, .cn-more, .cn-history) { border-color: var(--crm-line); }
  body #collectionView #contractNotices .cn-sent-row { background: var(--crm-card); }
  body #collectionView #contractNotices button { background: var(--crm-card); color: var(--crm-muted); border-color: var(--crm-line); }
  body #collectionView #contractNotices button:hover { background: var(--crm-raised); border-color: var(--crm-line); }
  body #collectionView #contractNotices #cnReload { background: transparent; color: var(--crm-muted); }
  body #collectionView #contractNotices .cn-action input { accent-color: var(--crm-gold); }
}

/* Neutral controls and precise status colors are shared by all ledgers. */
@media screen {
  body #goalPerformance button,
  body #targetBoard :is(.target-table-actions button, .target-linked-edit),
  body #collectionView :is(.collection-panel-head button, #collectionSetAP, .collection-row-actions button),
  body #recruitView :is(.recruit-panel-head button, .recruit-row-actions button, button[data-recruit-edit]),
  body #sitplanView :is(.sit-tools button, .sit-local, #sitGoalsEdit) { background: var(--crm-raised); color: var(--crm-text); border-color: var(--crm-line); }
  body #goalPerformance :is(button.primary, #gpWSave, #gpNoCountAdd),
  body #goalPerformanceDialog .gp-form-actions button.primary,
  body .goal-dialog .goal-dialog-actions .primary,
  body #sitplanDialog .sit-modal-actions .primary,
  body #collectionDialog .collection-modal-actions .primary,
  body #recruitDialog .recruit-modal-actions .primary { background: var(--crm-gold); color: var(--crm-bg); border-color: var(--crm-gold); box-shadow: none; }
  body #goalPerformanceDialog .gp-form-actions button.primary:hover { background: var(--crm-beige); color: var(--crm-bg); border-color: var(--crm-beige); }
  body #goalsView .monthly-goals { border-left-color: var(--crm-navy); }
  body #goalPerformance :is(.gp-sales-table thead th, .gp-sales-table tbody th),
  body #targetBoard .target-list-table th,
  body #collectionView .collection-table th,
  body #recruitView .recruit-table th,
  body #sitplanView .sit-grid :is(th, .sit-day-head) { background: var(--crm-navy); color: var(--crm-beige); }
  body #goalPerformance .gp-sales-table :is(th, td),
  body #targetBoard .target-list-table td,
  body #collectionView .collection-table td,
  body #recruitView .recruit-table td,
  body #sitplanView .sit-grid td { border-color: var(--crm-line-soft); }
  body #goalPerformance :is(.gp-w-heading strong, .gp-w-monthly strong, .gp-sales-total .gp-sales-values dd),
  body #goalPerformance .gp-sales-table :is(th, td):last-child { color: var(--crm-gold); }
  body #targetBoard .target-stage-filters button[aria-pressed="true"] { background: var(--crm-gold-soft); color: var(--crm-gold); border-color: var(--crm-gold-line); }
  body #targetBoard .target-stage-filters button[aria-pressed="true"] span { color: var(--crm-gold); }
  body #targetBoard .target-stage-badge[data-badge-stage] { background: var(--crm-navy); color: var(--crm-beige); border-color: var(--crm-line); }
  body #goalPerformance :is(.gp-badge.pending, .gp-badge.unconfigured),
  body #collectionView .collection-status.contacted,
  body #sitplanView .sit-grid th.sit-today { background: var(--crm-gold-soft); color: var(--crm-gold); border-color: var(--crm-gold-line); }
  body #goalPerformance :is(.gp-badge.active, .gp-badge.protected),
  body #goalPerformance :is(.gp-day.done, button.gp-day[aria-pressed="true"]),
  body #targetBoard :is(.target-table-status.done, .target-progress .target-calendar.done),
  body #collectionView .collection-status.paid { background: var(--crm-success-bg); color: var(--crm-success-text); border-color: var(--crm-success); }
  body #goalPerformance .gp-day.done :is(b, strong, small),
  body #goalPerformance :is(.gp-w-status.active, .gp-w-status.protected),
  body #collectionView .collection-entry.settled .collection-money { color: var(--crm-success-text); }
  body #collectionView .collection-row-actions button[data-collection-paid] { background: var(--crm-success-bg); color: var(--crm-success-text); border-color: var(--crm-success); }
  body #goalPerformance :is(.gp-badge.broken, button.gp-reset-month, #gpNoCountCancel, button[data-gp-delete], [data-gp-contract-delete], .gp-history-row button),
  body #goalPerformanceDialog .gp-form-actions button.gp-danger,
  body #gpContractCalendar .cc-row-actions .cc-delete,
  body #targetBoard .target-table-actions .target-delete,
  body #collectionView :is(.collection-status.pending, .collection-row-actions .collection-delete),
  body #recruitView button[data-recruit-delete] { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body #goalPerformance .gp-w-status.broken,
  body #goalPerformanceDialog .gp-salary-status[data-mode="error"],
  body #collectionView .collection-entry:not(.settled) .collection-money,
  body #collectionView #contractNotices .cn-error { color: var(--crm-danger-text); }
  body #goalPerformance :is(.gp-day.today, .gp-day.today.done) { border-color: var(--crm-gold-line); box-shadow: inset 0 2px var(--crm-gold); }
  body #gpContractCalendar .cc-day.is-selected { background: var(--crm-gold-soft); border-color: var(--crm-gold); box-shadow: inset 0 0 0 1px var(--crm-gold); }
  body #gpContractCalendar .cc-error { background: var(--crm-danger-bg); color: var(--crm-danger-text); border-color: var(--crm-danger); }
  body :is(#sitplanView, #sitplanDialog) .sit-activity,
  body :is(#sitplanView, #sitplanDialog) .sit-activity:is([data-sit-activity="OP"], [data-sit-activity="PC"]) { background: var(--crm-navy); color: var(--crm-beige); border-color: var(--crm-line); }
  body #sitplanDialog .sit-activity-picker button.sit-activity:hover,
  body #sitplanDialog .sit-activity-picker button.sit-activity:is([data-sit-activity="OP"], [data-sit-activity="PC"]):hover { background: var(--crm-gold-soft); color: var(--crm-gold); border-color: var(--crm-gold-line); }
  body #collectionView #contractNotices .cn-status:not(.cn-error) { color: var(--crm-muted); }
  body #collectionView #contractNotices .cn-blocked { color: var(--crm-gold); }
  body :is(#goalPerformanceDialog, .goal-dialog, #sitplanDialog, #collectionDialog, #recruitDialog, #targetEditor, #targetPicker)::backdrop { background: var(--crm-overlay); }
  body #goalsView :is(.goal-heading input, .performance-month-row input),
  body #goalsView #monthlyGoals :is(.goal-heading input, #goalMonth),
  body #goalPerformance :is(#gpWValue, #gpNoCountValue) { background: var(--crm-bg); }
  body #targetBoard .target-list-table .target-cell-name { box-shadow: 1px 0 var(--crm-line-soft); }
  body #recruitDialog .recruit-modal-actions { box-shadow: none; }
}