/* Personal surfaces and adaptive semantic tones; entity hues stay feature-owned. */
html[data-color-variant="crm"] #sidebar{background-color:var(--interface-sidebar,#fffdf9)}
.interface-colors-dialog{width:min(520px,calc(100vw - 28px));margin:auto;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--text);padding:24px}
.interface-colors-dialog h2{margin:0 0 10px}.interface-colors-dialog p{font-size:14px;line-height:1.6}
.interface-colors-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.interface-colors-fields label{margin:0;display:flex;flex-direction:column;gap:8px}
.interface-colors-fields input[type=color]{width:100%;height:48px;padding:4px;cursor:pointer}
.interface-colors-status{min-height:44px;overflow-wrap:anywhere}.interface-colors-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.interface-colors-actions button{min-height:44px}
@media(max-width:420px){.interface-colors-dialog{padding:18px}.interface-colors-actions button{flex:1 1 auto}}

/* Derived colors are opt-in. With no custom palette this layer has no effect.
   Each neutral region carries its own ink/tint/focus: a dark sidebar must not
   borrow the foreground of a light card (or the other way around). */
html[data-color-variant="crm"][data-interface-colors="custom"],
html[data-color-variant="crm"][data-interface-colors="custom"] :is(main,#team-panel,.demo-transition,.login){
  --crm-text:var(--interface-background-text);
  --text:var(--interface-background-text);
  --crm-muted:var(--interface-background-muted);
  --muted:var(--interface-background-muted);
  --crm-soft:var(--interface-background-soft);
  --soft:var(--interface-background-soft);
  --crm-hover:var(--interface-background-soft);
  --crm-control:var(--interface-background-control);
  --crm-line:var(--interface-background-control);
  --line:var(--interface-background-control);
  --border:var(--interface-background-control);
  --accent-dark:var(--interface-background-link);
  --interface-focus:var(--interface-background-focus);
  --interface-warning-bg:var(--interface-background-warning-bg);
  --interface-warning-text:var(--interface-background-warning-text);
  --interface-warning-border:var(--interface-background-warning-border);
  --interface-danger-bg:var(--interface-background-danger-bg);
  --interface-danger-text:var(--interface-background-danger-text);
  --interface-danger-border:var(--interface-background-danger-border);
  --interface-success-bg:var(--interface-background-success-bg);
  --interface-success-text:var(--interface-background-success-text);
  --interface-success-border:var(--interface-background-success-border);
  color:var(--crm-text);
}
html[data-color-variant="crm"][data-interface-colors="custom"] #sidebar{
  --crm-text:var(--interface-sidebar-text);
  --text:var(--interface-sidebar-text);
  --crm-muted:var(--interface-sidebar-muted);
  --muted:var(--interface-sidebar-muted);
  --crm-soft:var(--interface-sidebar-soft);
  --soft:var(--interface-sidebar-soft);
  --crm-hover:var(--interface-sidebar-soft);
  --crm-control:var(--interface-sidebar-control);
  --crm-line:var(--interface-sidebar-control);
  --line:var(--interface-sidebar-control);
  --border:var(--interface-sidebar-control);
  --accent-dark:var(--interface-sidebar-link);
  --interface-focus:var(--interface-sidebar-focus);
  --interface-warning-bg:var(--interface-sidebar-warning-bg);
  --interface-warning-text:var(--interface-sidebar-warning-text);
  --interface-warning-border:var(--interface-sidebar-warning-border);
  --interface-danger-bg:var(--interface-sidebar-danger-bg);
  --interface-danger-text:var(--interface-sidebar-danger-text);
  --interface-danger-border:var(--interface-sidebar-danger-border);
  --interface-success-bg:var(--interface-sidebar-success-bg);
  --interface-success-text:var(--interface-sidebar-success-text);
  --interface-success-border:var(--interface-sidebar-success-border);
  color:var(--crm-text);
}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.global-search-header,.global-search-trigger,.global-search-dialog,.global-search-popover,.employee-my-day,.employee-feedback-dialog,.planning-feedback-overview,.planning-editor-dialog,.planning-task-results,.task-attachments-popover,.task-attachments-edit-panel,.task-attachments-draft,.entry-details,dialog.safety-dialog,.dashboard-configuration,.mobile-bar,.mobile-nav-dialog,.mobile-create-menu,.mobile-list-tools,.mobile-task-menu,.mobile-create-more>summary,.login-card,.details-panel,.entity-dialog,.bulk-dialog,.team-dialog,.checklist-title-dialog,.kanban-dialog,.kanban-column-actions,.project-settings-card,.project-color-options,.entity-project-color-popover,.report-picker,.expense-revenue,.bulk-preview-card:not(.bulk-excluded),.checklist-panel,.member-picker-menu,.task-quick-menu,.task-relation-dropdown,.personal-settings-section,.availability-section,.task-pool,.planning-scroll,.team-table,.person-card,.metrics>div,.notes-rich-surface,.notes-preview,.quick-form,.layout-switch,.notes-mode-switch,.task-attachment-row,.task-card:not(.carried),.dashboard-card,.interface-colors-dialog,.task-list-preferences-dialog,.task-inline-deadline-menu,.task-row-info-menu,.task-list-extra-menu,input:not([type=checkbox]):not([type=color]),select,textarea,.task-timer-controls:is(.stopped,.loading),.timer-card:is(.stopped,.loading)){
  --panel:var(--crm-paper);
  --crm-text:var(--interface-surface-text);
  --text:var(--interface-surface-text);
  --crm-muted:var(--interface-surface-muted);
  --muted:var(--interface-surface-muted);
  --crm-soft:var(--interface-surface-soft);
  --soft:var(--interface-surface-soft);
  --crm-hover:var(--interface-surface-soft);
  --crm-control:var(--interface-surface-control);
  --crm-line:var(--interface-surface-control);
  --line:var(--interface-surface-control);
  --border:var(--interface-surface-control);
  --accent-dark:var(--interface-surface-link);
  --interface-focus:var(--interface-surface-focus);
  --interface-warning-bg:var(--interface-surface-warning-bg);
  --interface-warning-text:var(--interface-surface-warning-text);
  --interface-warning-border:var(--interface-surface-warning-border);
  --interface-danger-bg:var(--interface-surface-danger-bg);
  --interface-danger-text:var(--interface-surface-danger-text);
  --interface-danger-border:var(--interface-surface-danger-border);
  --interface-success-bg:var(--interface-surface-success-bg);
  --interface-success-text:var(--interface-surface-success-text);
  --interface-success-border:var(--interface-surface-success-border);
  color:var(--crm-text);
}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.global-search-header,.global-search-trigger,.global-search-dialog,.global-search-popover,.employee-my-day,.employee-feedback-dialog,.planning-feedback-overview,.planning-editor-dialog,.planning-task-results,.task-attachments-popover,.task-attachments-edit-panel,.task-attachments-draft,.entry-details,dialog.safety-dialog,.dashboard-configuration,.mobile-bar,.mobile-nav-dialog,.mobile-create-menu,.mobile-list-tools,.mobile-task-menu,.mobile-create-more>summary,.login-card,.details-panel,.entity-dialog,.bulk-dialog,.team-dialog,.checklist-title-dialog,.kanban-dialog,.kanban-column-actions,.project-settings-card,.project-color-options,.entity-project-color-popover,.report-picker,.expense-revenue,.bulk-preview-card:not(.bulk-excluded),.checklist-panel,.member-picker-menu,.task-quick-menu,.task-relation-dropdown,.personal-settings-section,.availability-section,.task-pool,.planning-scroll,.team-table,.person-card,.metrics>div,.notes-rich-surface,.notes-preview,.quick-form,.layout-switch,.notes-mode-switch,.task-attachment-row,.task-card:not(.carried),.dashboard-card,.interface-colors-dialog,.task-list-preferences-dialog,.task-inline-deadline-menu,.task-row-info-menu,.task-list-extra-menu,input:not([type=checkbox]):not([type=color]),select,textarea){background-color:var(--crm-paper)}

html[data-color-variant="crm"][data-interface-colors="custom"] .workspace{background-color:var(--crm-bg)}
html[data-color-variant="crm"][data-interface-colors="custom"] #sidebar{background-color:var(--interface-sidebar)}
html[data-color-variant="crm"][data-interface-colors="custom"] #sidebar :is(#main-nav .nav-icon,.team-nav-icon,.aside-bottom a){color:var(--accent-dark)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.primary,.planning-drop-marker span){background-color:var(--crm-accent);color:var(--interface-button-text)}
html[data-color-variant="crm"][data-interface-colors="custom"] .primary:hover:not(:disabled){background-color:var(--interface-button-hover);color:var(--interface-button-hover-text)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.task,.checklist-row) input[type=checkbox]:checked:after{color:var(--interface-button-text)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.task,.checklist-row) input[type=checkbox]{border-color:var(--crm-control)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.task-card.selected:not(.carried),#task-list:not(.kanban-board) .task-card.in-my-day:not(.carried),#task-list:not(.kanban-board) .task-card.in-my-day.selected:not(.carried)){background-color:var(--crm-soft);border-top-color:var(--crm-control);border-right-color:var(--crm-control);border-bottom-color:var(--crm-control)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.kanban-heading .count,.kanban-column-menu[open]>summary){background-color:var(--crm-soft);color:var(--crm-text)}
html[data-color-variant="crm"][data-interface-colors="custom"] .task-attachments-dropzone{background-color:var(--crm-soft);border-color:var(--crm-control);color:var(--crm-muted)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.dashboard-task:hover,.task-attachment-row:hover){background-color:var(--crm-soft)}
html[data-color-variant="crm"][data-interface-colors="custom"] #sidebar .main-nav-group:not([open]):has(nav button.active)>.main-nav-summary{background:var(--crm-soft);color:var(--crm-text);box-shadow:inset 3px 0 0 var(--accent-dark)}
/* Inputs have their own surface, so placeholder and focus resolve there too. */
html[data-color-variant="crm"][data-interface-colors="custom"] :is(input,textarea)::placeholder{color:var(--crm-muted);opacity:1}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(button,a,input,select,textarea,summary,[tabindex],[contenteditable]):is(:focus,:focus-visible){outline-color:var(--interface-focus)!important}
html[data-color-variant="crm"][data-interface-colors="custom"] .notes-rich-surface:focus{box-shadow:inset 0 0 0 2px var(--interface-focus)}
/* Unrelated feature-owned islands retain their existing neutral context.
   Warning/carryover/deadline treatments below are scoped separately. */
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.allocation,.calendar-event,.task-timer-controls:not(.stopped):not(.loading),.timer-card:not(.stopped):not(.loading),.error,.entity-visibility-notice,.planning-day.is-today,.planning-day-off,.planning-cell.overbooked,.planning-cell.unavailable,.notes-html-status:not(:empty)){--crm-text:#302e28;--text:#302e28;--crm-muted:#6d665c;--muted:#6d665c;--crm-soft:#eee9de;--soft:#eee9de;--crm-line:#e3ddd1;--line:#e3ddd1;--crm-control:#898170;--accent-dark:#536344;--interface-focus:#536344}

.interface-colors-dialog button:disabled{cursor:not-allowed}
.interface-colors-dialog form[aria-busy="true"] :is(input,button[data-color-write]){cursor:wait}
@media(forced-colors:active){
html[data-color-variant="crm"][data-interface-colors="custom"] :is(button,a,input,select,textarea,summary,[tabindex],[contenteditable]):is(:focus,:focus-visible){outline-color:Highlight!important}
}

html[data-color-variant="crm"][data-interface-colors="custom"] :is(.secondary:not(.danger),.task-personal-care,.checklist-add-button,.quick-form button,.week-nav button,.task-timer-button:not(.task-timer-review),.kanban-control,.notes-toolbar button,.notes-mode-switch button,.main-nav-tooltip,#sidebar .main-nav-toggle-icon){
  --panel:var(--crm-paper);
  --crm-text:var(--interface-surface-text);
  --text:var(--interface-surface-text);
  --crm-muted:var(--interface-surface-muted);
  --muted:var(--interface-surface-muted);
  --crm-soft:var(--interface-surface-soft);
  --soft:var(--interface-surface-soft);
  --crm-hover:var(--interface-surface-soft);
  --crm-control:var(--interface-surface-control);
  --crm-line:var(--interface-surface-control);
  --line:var(--interface-surface-control);
  --border:var(--interface-surface-control);
  --accent-dark:var(--interface-surface-link);
  --interface-focus:var(--interface-surface-focus);
  --interface-warning-bg:var(--interface-surface-warning-bg);
  --interface-warning-text:var(--interface-surface-warning-text);
  --interface-warning-border:var(--interface-surface-warning-border);
  --interface-danger-bg:var(--interface-surface-danger-bg);
  --interface-danger-text:var(--interface-surface-danger-text);
  --interface-danger-border:var(--interface-surface-danger-border);
  --interface-success-bg:var(--interface-surface-success-bg);
  --interface-success-text:var(--interface-surface-success-text);
  --interface-success-border:var(--interface-surface-success-border);
  color:var(--crm-text);
}
html[data-color-variant="crm"][data-interface-colors="custom"] .primary{border-color:var(--crm-control)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.empty,.empty>span,.notes-rich-surface:empty::before){color:var(--crm-muted)}
/* Two-tone backing keeps keyboard focus visible across mixed region edges and
   feature-owned colored cards; the derived outer outline adds personal hue. */
html[data-color-variant="crm"][data-interface-colors="custom"] :is(button,a,input,select,textarea,summary,[tabindex],[contenteditable]):focus-visible{box-shadow:0 0 0 2px #ffffff,0 0 0 4px #000000;outline-offset:4px}
@media(forced-colors:active){html[data-color-variant="crm"][data-interface-colors="custom"] :is(button,a,input,select,textarea,summary,[tabindex],[contenteditable]):focus-visible{box-shadow:none;outline-color:Highlight!important}}

/* A carried card follows the card tone, even on a differently colored page.
   Its ordinary text and controls share readable amber ink. Nested menus and
   inputs still establish their own personal surfaces above. Entity stripes
   (the left border), project tags, dots and stored colors are never changed. */
html[data-color-variant="crm"][data-interface-colors="custom"] #task-list .task-card.carried{
  --interface-warning-bg:var(--interface-surface-warning-bg);
  --interface-warning-text:var(--interface-surface-warning-text);
  --interface-warning-border:var(--interface-surface-warning-border);
  --interface-danger-bg:var(--interface-surface-danger-bg);
  --interface-danger-text:var(--interface-surface-danger-text);
  --interface-danger-border:var(--interface-surface-danger-border);
  --crm-text:var(--interface-warning-text);--text:var(--interface-warning-text);
  --crm-muted:var(--interface-warning-text);--muted:var(--interface-warning-text);
  --crm-soft:var(--interface-warning-bg);--soft:var(--interface-warning-bg);
  --crm-hover:var(--interface-warning-bg);
  --crm-line:var(--interface-warning-border);--line:var(--interface-warning-border);
  --border:var(--interface-warning-border);--crm-control:var(--interface-warning-border);
  --accent-dark:var(--interface-warning-text);--interface-focus:var(--interface-warning-text);
  background-color:var(--interface-warning-bg);color:var(--interface-warning-text);
  border-top-color:var(--interface-warning-border);border-right-color:var(--interface-warning-border);border-bottom-color:var(--interface-warning-border);box-shadow:none;
}
html[data-color-variant="crm"][data-interface-colors="custom"] #task-list .task-card.carried .task-title{color:var(--interface-surface-warning-text)}
/* The neutral project-name button used --crm-line as a hover fill; a semantic
   border is too strong for a text backing. The assigned entity stripe is intact. */
html[data-color-variant="crm"][data-interface-colors="custom"] #task-list .task-card.carried button.project-tag:hover:not(:disabled){background-color:var(--interface-warning-bg)}

/* Explicit status hooks only. Orange signals carryover / warning; red signals
   exceeded budget / overdue deadline. Labels, icons and severity stay intact.
   The ID-bearing list selectors intentionally win over compact/Kanban/mobile
   selectors; no broad .warning, .overdue or entity-color selector is used. */
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.carry-label,.my-day-carry-badge,.budget-status.warning,.task-budget-alert,.task-time-summary.warning,.board-time-warning,.task-deadline-alerts,.task-deadline-alerts>.task-alert-open,.task-deadline-preview.is-warning,.deadline-warning-chip,.deadline-warning-badge,.quick-date-preview.has-warning,.review-warning,.disclosure-urgent,.mobile-list-alerts .task-alert-heading,.mobile-task-date.has-warning,#task-list .mobile-task-warning,#task-list:not(.kanban-board) .task-row-info.has-warning){
  background-color:var(--interface-warning-bg);color:var(--interface-warning-text);border-color:var(--interface-warning-border);
}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.budget-status.exceeded,.task-budget-alert.exceeded,.task-time-summary.exceeded,.board-time-warning.exceeded,.task-deadline-alerts>.task-alert-open.overdue,.task-deadline-alert.overdue,.task-deadline-preview.is-overdue,.task-deadline-error,.task-inline-deadline-error,.deadline-overdue .deadline-warning-chip,.deadline-overdue .deadline-warning-badge,#task-list.kanban-board .date-chip.overdue,.deadline-overdue .mobile-task-date,#task-list .deadline-overdue .mobile-task-warning,#task-list:not(.kanban-board) .deadline-overdue .task-row-info.has-warning){
  background-color:var(--interface-danger-bg);color:var(--interface-danger-text);border-color:var(--interface-danger-border);
}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.task-time-summary.warning,.board-time-warning,.task-deadline-preview.is-warning,.task-deadline-preview.is-overdue,.task-deadline-error,.task-inline-deadline-error,.quick-date-preview.has-warning,.review-warning,.disclosure-urgent,.mobile-task-date.has-warning){border-radius:3px}
html[data-color-variant="crm"][data-interface-colors="custom"] .budget-status:is(.warning,.exceeded) .budget-rail{background-color:transparent;box-shadow:inset 0 0 0 1px currentColor}
html[data-color-variant="crm"][data-interface-colors="custom"] .budget-status.warning .budget-rail i{background-color:var(--interface-warning-text)}
html[data-color-variant="crm"][data-interface-colors="custom"] .budget-status.exceeded .budget-rail i{background-color:var(--interface-danger-text)}
html[data-color-variant="crm"][data-interface-colors="custom"] .deadline-picker-trigger[aria-invalid=true]{border-color:var(--interface-danger-border)}
html[data-color-variant="crm"][data-interface-colors="custom"] .kanban-column[data-lane=doing] .kanban-heading h2{background-color:var(--interface-warning-bg);color:var(--interface-warning-text);border-radius:3px}
html[data-color-variant="crm"][data-interface-colors="custom"] .kanban-column[data-lane=done] .kanban-heading h2{background-color:var(--interface-success-bg);color:var(--interface-success-text);border-radius:3px}
/* Keep the OS high-contrast palette and non-color status cues authoritative. */
@media(forced-colors:active){
  html[data-color-variant="crm"][data-interface-colors="custom"] :is(.deadline-warning-chip,.deadline-warning-badge,.my-day-carry-badge,#task-list:not(.kanban-board) .task-row-info.has-warning,#task-list:not(.kanban-board) .deadline-overdue .task-row-info.has-warning){background-color:Canvas;color:CanvasText;border-color:CanvasText}
}

/* Compact timer layouts intentionally remove their container backing. Keep the
   original state ink readable on dark personal surfaces too. */
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.task-timer-state,.task-timer-clock){background-color:var(--timer-surface);border-radius:3px}

.interface-colors-suggest{margin-top:14px;min-height:44px;max-width:100%;white-space:normal}


/* Screenshot-identified neutral panels use the chosen card surface and its
   own ink, including when page/sidebar/card tones intentionally differ. The
   overdue-plan label above remains a semantic amber treatment on that card. */
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.employee-my-day,.employee-feedback-dialog,.planning-feedback-overview,.planning-editor-dialog,.planning-task-results,.task-attachments-popover,.task-attachments-edit-panel,.task-attachments-draft,.entry-details,dialog.safety-dialog){border-color:var(--crm-control)}
html[data-color-variant="crm"][data-interface-colors="custom"] .task-planning-link{color:var(--accent-dark)}
html[data-color-variant="crm"][data-interface-colors="custom"] .employee-feedback-options [aria-pressed=true]{outline-color:var(--interface-focus)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.planning-feedback-proposal,.planning-task-result-group>strong,.planning-editor-dialog .allocation-budget-preview,.planning-editor-dialog input[readonly]){background-color:var(--crm-soft);color:var(--crm-text);border-color:var(--crm-control)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.planning-person-picker,.planning-editor-dialog .dialog-actions){border-color:var(--crm-control)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.planning-selected-task,.planning-editor-dialog .planning-search-status,.planning-person-picker legend,.planning-day-policy,.planning-preview-incomplete){color:var(--crm-muted)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.planning-task-result-group>button,.planning-editor-dialog .planning-person-choice){background-color:var(--crm-paper);color:var(--crm-text);border-color:var(--crm-control)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.planning-task-result-group>button:is(:hover,[aria-selected=true]),.planning-editor-dialog .planning-person-choice:has(input:checked)){background-color:var(--crm-soft);color:var(--accent-dark);border-color:var(--interface-focus)}
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.employee-feedback-error,.planning-feedback-error,.planning-follow-up-error,.planning-overload-note,.planning-range-note){background-color:var(--interface-danger-bg);color:var(--interface-danger-text);border-radius:3px}

/* Idle/loading timer chrome is neutral. The green running, amber paused and
   purple review states keep their feature-owned tokens and non-color cues. */
html[data-color-variant="crm"][data-interface-colors="custom"] :is(.task-timer-controls,.timer-card):is(.stopped,.loading){
  --timer-color:var(--interface-surface-muted);
  --timer-surface:var(--crm-paper);
  --timer-border:var(--interface-surface-control);
  color:var(--timer-color);
}
html[data-color-variant="crm"][data-interface-colors="custom"] .task-timer-global:is(.stopped,.loading){box-shadow:0 2px 7px #00000016}
html[data-color-variant="crm"][data-interface-colors="custom"] .timer-card:is(.stopped,.loading) :is(.timer-icon,p){color:var(--timer-color)}
html[data-color-variant="crm"][data-interface-colors="custom"] .timer-card:is(.stopped,.loading) .timer-icon{background-color:var(--crm-soft)}

/* Personal-care highlighting is a selection cue, not a status. Preserve the
   assigned entity stripe and the stronger carried-card warning treatment. */
html[data-color-variant="crm"][data-interface-colors="custom"] #task-list .task-card.personal-care-active:not(.carried),
html[data-color-variant="crm"][data-interface-colors="custom"] #task-list .task-card.personal-care-active:not(.carried)>.task{background-color:var(--crm-soft)}
html[data-color-variant="crm"][data-interface-colors="custom"] #task-list .task-card.personal-care-active.carried>.task{background-color:var(--interface-warning-bg)}
html[data-color-variant="crm"][data-interface-colors="custom"] .task-personal-care{background-color:var(--crm-paper);color:var(--crm-text);border-color:var(--crm-control)}
html[data-color-variant="crm"][data-interface-colors="custom"] .task-personal-care[aria-pressed=true]{background-color:var(--crm-soft);color:var(--accent-dark);border-color:var(--interface-focus)}

/* Editable checklist text already owns a focus frame. Keep one visible inset
   outline instead of stacking the general two-tone shadow around its row.
   Inset drawing also stays inside narrow/scrolling checklist panels. */
html[data-color-variant="crm"] .checklist-content :is(input.checklist-name,textarea.checklist-text,.checklist-add input):is(:focus,:focus-visible){box-shadow:none;outline:2px solid var(--interface-focus,#536344);outline-offset:-2px}
@media(forced-colors:active){html[data-color-variant="crm"] .checklist-content :is(input.checklist-name,textarea.checklist-text,.checklist-add input):is(:focus,:focus-visible){outline-color:Highlight!important}}