/* Work-item anchors and disclosures use the existing surface and focus tokens. */
.workitem-test-step-actions [data-test-step-action="remove"] .btn-icon { color: var(--ui-danger); }
.workitem-section-navigation { background: var(--paper); }
.workitem-section-disclosure { border-bottom: 1px solid var(--muted); }
.workitem-section-disclosure > summary {
  cursor: pointer;
  min-height: var(--ui-control-height);
  align-content: center;
  font-weight: 600;
  background: var(--ui-workitem-context-soft);
  color: var(--ui-workitem-context-ink);
}
.workitem-section-disclosure > summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Work-item relations share their appearance in details and document sidebars. */
.img-resizable.has-diagram-pages > .diagram-edit-btn {
  top: var(--ui-space-2);
  bottom: auto;
  width: var(--ui-control-compact);
  height: var(--ui-control-compact);
}

.workitem-trace-group + .workitem-trace-group { margin-top: 20px; }
.workitem-trace-group-title {
  display: flex; align-items: center; gap: 8px;
  margin: 0 0 6px; color: var(--ink-soft); font-size: var(--ui-text-small); font-weight: 600;
}
.workitem-trace-group-title > svg { width: 17px; height: 17px; flex: none; }
.workitem-trace-count { font-weight: 400; font-variant-numeric: tabular-nums; }
.workitem-trace-row, .workitem-usage-item { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 7px 0; border-bottom: 1px solid var(--border-soft); }
.workitem-trace-row-content { flex: 1; min-width: 0; }
.workitem-trace-link, .workitem-usage-link { display: flex; align-items: baseline; gap: 8px; min-width: 0; color: var(--ink); text-decoration: none; }
.workitem-trace-link > .trace-type-icon { align-self: flex-start; margin-top: 2px; flex: none; }
.workitem-trace-identity { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; overflow-wrap: anywhere; }
.workitem-trace-identity > strong { flex: none; color: var(--ui-info); white-space: nowrap; font-weight: 600; }
.workitem-trace-link:hover .workitem-trace-identity > span, .workitem-usage-link:hover .workitem-usage-title { text-decoration: underline; text-underline-offset: 3px; }
.workitem-trace-link:focus-visible, .workitem-usage-link:focus-visible { outline: 2px solid var(--ui-info); outline-offset: 3px; border-radius: 2px; }
.workitem-usage-link { flex: 1; align-items: center; min-height: var(--ui-control-compact); }
.workitem-usage-link > .doc-icon { flex: none; border: 0; border-radius: 0; }
.workitem-usage-title { min-width: 0; overflow-wrap: anywhere; }
.testing-reference-facts { font-size: var(--ui-text-small); }
.testing-reference-facts dt, .testing-reference-result-heading time { color: var(--ink-soft); }
.workitem-trace-row .workitem-trace-remove { display: inline-flex; position: static; flex: none; opacity: 1; margin: 0; }
.workitem-trace-warning-label { display: block; margin-top: 3px; color: var(--ui-warning); font-size: var(--ui-text-small); }
.workitem-trace-focus { display: flex; flex-direction: column; align-items: center; max-width: 760px; margin: 0 auto 24px; }
.workitem-trace-branches { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: 16px; width: 100%; list-style: none; padding: 0; margin: 0; position: relative; }
.workitem-trace-lane-label { margin: 0; color: var(--ink-soft); font-size: var(--ui-text-small); font-weight: 600; }
.workitem-trace-branch { display: flex; flex: 1 1 220px; flex-direction: column; align-items: center; min-width: 0; position: relative; }
.workitem-trace-branch.workitem-trace-up { flex-direction: column-reverse; }
.workitem-trace-node { position: relative; width: 100%; max-width: 330px; min-width: 0; padding: 10px 12px; border: 1px solid var(--muted); border-radius: var(--ui-radius); background: var(--surface); }
.workitem-trace-node.is-current { background: var(--ui-selected); border-color: var(--accent); }
.workitem-trace-node .workitem-trace-row { border: 0; padding: 4px 0 0; }
.workitem-trace-node .workitem-trace-identity > span { flex-basis: 100%; }
.workitem-trace-node-type, .workitem-trace-node-meta { color: var(--ink-soft); font-size: var(--ui-text-small); overflow-wrap: anywhere; }
.workitem-trace-node-meta { margin-top: 5px; }
.workitem-trace-tree { container-type: inline-size; min-width: 0; }
.workitem-trace-edge { position: relative; display: grid; place-items: center; width: 48px; height: 64px; flex: none; color: var(--ink-soft); }
.workitem-trace-edge > svg { display: block; width: 24px; height: 64px; }
.workitem-trace-edge .workitem-trace-edge-add { position: absolute; top: 16px; left: calc(50% - 16px); width: 32px; min-height: 32px; padding: 0; opacity: 0; background: var(--surface); border: 1px solid var(--muted); }
.workitem-trace-edge:hover .workitem-trace-edge-add, .workitem-trace-edge:focus-within .workitem-trace-edge-add { opacity: 1; }
.trace-picker-filter-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* Keep the link picker focused on two-line candidates and compact controls. */
#traceLinkModal { padding: 0; gap: 0; }
#traceLinkModal .modal-header { padding: 12px 16px; border-bottom: 1px solid var(--muted); }
#traceLinkModal .trace-picker-heading { min-width: 0; }
#traceLinkContext { margin-top: 3px; font-weight: 400; overflow-wrap: anywhere; }
#traceLinkModal .trace-picker-body { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 0; overflow: visible; }
#traceLinkModal .trace-picker-sidebar { padding: 12px; background: var(--surface-soft); border-right: 1px solid var(--muted); }
#traceLinkModal .trace-picker-filter-title { font-weight: 600; margin-bottom: 8px; }
#traceLinkModal .field { margin: 0; gap: 4px; min-width: 0; }
#traceLinkModal .trace-picker-sidebar > .field { margin-bottom: 12px; align-self: start; }
#traceLinkModal .field > span { font-size: var(--ui-text-small); }
#traceLinkModal :is(.field input:not([type="checkbox"]), .field select, .workitem-searchable-picker-trigger) { min-height: var(--ui-control-compact); height: auto; padding: 5px 8px; }
#traceLinkModal .field select { min-width: 0; width: 100%; }
#traceLinkModal .workitem-searchable-picker-overlay { width: min(300px, calc(100vw - 56px)); right: auto; background: var(--canvas); }
#traceLinkModal .trace-picker-linked-toggle { display: flex; align-items: flex-start; gap: 6px; }
#traceLinkModal .trace-picker-linked-toggle input { flex: none; margin-top: 3px; }
#traceLinkHideLinkedHint { margin: 4px 0 0 22px; }
#traceLinkModal .trace-picker-filter-actions { display: grid; gap: 0; margin-top: 12px; }
#traceLinkModal .trace-picker-filter-actions button { justify-content: flex-start; padding-inline: var(--ui-space-2); min-height: 32px; font-size: var(--ui-text-small); }
#traceLinkModal .trace-picker-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; padding: 12px 14px 4px; gap: 4px; }
#traceLinkModal #traceLinkRecent { flex: none; width: 100%; min-height: 24px; margin: 0; padding: 0; border: 0; background: transparent; font-size: var(--ui-text-small); font-weight: 400; }
#traceLinkModal .trace-link-recent-item { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#traceLinkModal #traceLinkRecent .workitem-select-label { min-height: 0; padding: 0; }
#traceLinkModal #traceLinkRecent .workitem-select-text { white-space: nowrap; }
#traceLinkModal #traceLinkRecent .workitem-type-icon { display: none; }
#traceLinkModal .trace-picker-results-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px; flex: none; }
#traceLinkCount { font-weight: 600; }
#traceLinkModal .trace-picker-sort { display: flex; align-items: center; gap: 4px; font-size: var(--ui-text-small); color: var(--ink-soft); }
#traceLinkSort { width: auto; min-height: 28px; padding: 2px 4px; border-color: transparent; font-size: var(--ui-text-small); }
#traceLinkModal #traceLinkList { flex: 1 1 auto; min-height: 0; overflow-y: auto; margin: 0; }
#traceLinkModal #traceLinkList .workitem-select-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; min-height: 48px; padding: 6px 2px; border: 0; border-top: 1px solid var(--muted); border-radius: 0; }
#traceLinkModal .trace-picker-label { min-width: 0; }
#traceLinkModal .trace-picker-identity { display: grid; grid-template-columns: max-content minmax(0, 1fr); align-items: baseline; gap: 8px; }
#traceLinkModal .trace-picker-identity > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#traceLinkModal .trace-picker-metadata { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--ui-text-small); color: var(--ink-soft); margin-top: 1px; }
#traceLinkModal .trace-picker-linked { align-self: center; max-width: 95px; font-size: var(--ui-text-small); color: var(--ink-soft); }
#traceLinkModal .modal-actions { padding: 6px 12px; border-top: 1px solid var(--muted); }
#traceLinkNotApplicable { margin-right: auto; }
@media (max-width: 600px) {
  #traceLinkModal .trace-picker-body { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); }
  #traceLinkModal .trace-picker-sidebar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 12px; padding: 10px 12px; border-right: 0; border-bottom: 1px solid var(--muted); }
  #traceLinkModal .trace-picker-filter-title { display: none; }
  #traceLinkModal .trace-picker-sidebar > .field { margin: 0; }
  #traceLinkModal .trace-picker-filter-actions { display: flex; grid-column: 1 / -1; margin: 0; gap: 12px; }
  #traceLinkModal .trace-picker-main { padding: 10px 12px 4px; }
  #traceLinkModal .trace-picker-linked { max-width: 70px; }
}
@media (pointer: coarse) {
  #traceLinkModal :is(button, select, input:not([type="checkbox"]), .workitem-searchable-picker-trigger, .reviewer-pick-row, .trace-picker-linked-toggle) { min-height: 44px; }
  #traceLinkModal :is(input, select) { font-size: 16px; }
}
.workitem-trace-branches:not([data-branch-count="1"]) { flex-direction: column; align-items: stretch; max-width: 350px; padding-left: 20px; }
.workitem-trace-branches:not([data-branch-count="1"]) > .workitem-trace-branch { flex: none; }
.workitem-trace-branches:not([data-branch-count="1"]) > .workitem-trace-branch > .workitem-trace-edge { width: 100%; }
.workitem-trace-branches:not([data-branch-count="1"]) > .workitem-trace-branch > .workitem-trace-edge::before { content: ''; position: absolute; top: 0; left: -20px; right: 50%; height: 1px; background: var(--muted); }
.workitem-trace-targets:not([data-branch-count="1"]) > .workitem-trace-branch:not(:last-child)::before { content: ''; position: absolute; left: -20px; top: 0; bottom: -16px; width: 1px; background: var(--muted); }
.workitem-trace-sources:not([data-branch-count="1"]) > .workitem-trace-branch > .workitem-trace-edge::before { top: auto; bottom: 0; }
.workitem-trace-sources:not([data-branch-count="1"]) > .workitem-trace-branch:not(:first-child)::before { content: ''; position: absolute; left: -20px; top: -16px; bottom: 0; width: 1px; background: var(--muted); }
@media (hover: none) {
  .workitem-trace-edge .workitem-trace-edge-add { opacity: 1; width: 44px; min-height: 44px; top: 10px; left: calc(50% - 22px); }
}
@media (max-width: 600px) {
  .workitem-trace-branches[data-branch-count="1"] > .workitem-trace-branch { flex-basis: 100%; }
  .workitem-trace-branches { gap: 12px; }
  .workitem-trace-targets:not([data-branch-count="1"]) > .workitem-trace-branch:not(:last-child)::before { bottom: -12px; }
  .workitem-trace-sources:not([data-branch-count="1"]) > .workitem-trace-branch:not(:first-child)::before { top: -12px; }
}
/* Shared application appearance. Keep these rules unlayered: they own the
 * component appearance above the app-layout layer, regardless of selector IDs.
 * Domain styles own layout and document content, never alternate UI themes. */
.profile-accessibility-warning {
  padding: var(--ui-space-4);
  background: var(--ui-warning-soft);
  color: var(--ui-warning);
  border: 1px solid currentColor;
  border-radius: var(--ui-radius);
}

:root {
  --ui-code-background: #0f1724;
  --ui-code-ink: #d8e2f0;
  --ui-workitem-context-ink: #a65313;
  --ui-workitem-context-soft: color-mix(in srgb, var(--ui-workitem-context-ink) 8%, var(--canvas));
  --ui-font: Calibri, "Segoe UI", Arial, sans-serif;
  --ui-text: 14px;
  --ui-text-small: 13px;
  --ui-radius: 8px;
  --ui-radius-panel: 12px;
  --ui-control-height: 36px;
  --ui-control-compact: 32px;
  --ui-toolbar-icon-size: 18px;
  --ui-space-1: 4px;
  --ui-space-2: 8px;
  --ui-space-3: 12px;
  --ui-space-4: 16px;
  --ui-space-5: 24px;
  --ink: #1d1b1a;
  --ink-soft: #564f4b;
  --paper: #f8f3ee;
  --canvas: #ffffff;
  --accent: #c83232;
  --accent-2: #a62626;
  --muted: #d9d1c7;
  --sidebars: #fff1f1;
  --surface: var(--canvas);
  --panel: var(--canvas);
  --surface-soft: var(--paper);
  --surface-muted: var(--paper);
  --border-soft: var(--muted);
  --ui-secondary: var(--accent);
  --ui-secondary-ink: var(--accent-2);
  --brand-on-secondary: #ffffff;
  --ui-primary-soft: color-mix(in srgb, var(--accent) 9%, var(--canvas));
  --ui-secondary-soft: color-mix(in srgb, var(--ui-secondary) 13%, var(--canvas));
  --ui-secondary-border: color-mix(in srgb, var(--ui-secondary) 60%, var(--muted));
  --ui-hover: #efe7dd;
  --ui-table-row-hover: #f7f0e7;
  --ui-selected: #fbe7e7;
  --ui-start-surface: #fffdf9;
  --ui-start-surface-header: #faf6ef;
  --ui-start-surface-hover: #fff9ef;
  --ui-workspace: color-mix(in srgb, var(--accent) 9%, var(--paper));
  --ui-diagram-line: color-mix(in srgb, var(--ink) 52%, var(--canvas));
  --ui-danger: #a62626;
  --ui-danger-soft: #fde5e5;
  --ui-success: #245f34;
  --ui-success-soft: #e3f2e7;
  --ui-warning: #805500;
  --ui-warning-soft: #fff0c9;
  --ui-info: #234f74;
  --ui-info-soft: #e4eff8;
  /* Storage scopes are distinct from brand actions and success/error states. */
  --ui-scope-global: #7046b5;
  --ui-scope-global-soft: #f3eefb;
  --ui-scope-project: #2463aa;
  --ui-scope-project-soft: #edf4fc;
  --shadow: rgba(33, 29, 25, 0.15);
}

/* Profile workspace uses shared controls and theme surfaces. */
.profile-content {
  background: var(--canvas);
}
.profile-section-heading h2 { font-size: 18px; }
.profile-section-heading h3 { font-size: var(--ui-text); }
.profile-section-heading p { color: var(--ink-soft); }
.profile-mfa-setup-panel { background: var(--surface-soft); border-radius: var(--ui-radius); }
.profile-mfa-qr-card { background: #fff; border-radius: var(--ui-radius); }
.profile-content .status-pill { background: var(--surface-soft); color: var(--ink-soft); border-color: var(--muted); }
.profile-content .status-pill[data-mfa-enabled="1"] { background: var(--ui-success-soft); color: var(--ui-success); border-color: var(--ui-success); }
.profile-content .profile-agent-detail { border: 0; margin: 0; }
.profile-content .profile-agent-detail > [data-agent-panel] { padding: 0; }
.profile-content [hidden] { display: none; }

body { font-family: var(--ui-font); color: var(--ink); background: var(--paper); }
.workitem-searchable-picker,
.workitem-searchable-picker-trigger { min-width: 0; max-width: 100%; box-sizing: border-box; }
/* Shared searchable choices: keep tools visible while the compact list scrolls. */
.workitem-searchable-picker-overlay {
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-2);
  max-height: min(480px, var(--workitem-picker-available-height, calc(100dvh - 24px)));
  box-sizing: border-box;
  overflow: hidden;
  padding: var(--ui-space-2);
}
.workitem-searchable-picker-overlay[hidden] { display: none; }
.workitem-searchable-picker-overlay[popover] {
  position: fixed;
  inset: auto;
  margin: 0;
}
.workitem-searchable-picker-above { top: auto; bottom: calc(100% + 4px); }
.workitem-searchable-picker-search { flex: none; margin: 0; min-width: 0; }
.workitem-searchable-picker-overlay .reviewer-pick-list {
  display: flex;
  flex-direction: column;
  flex: 0 1 auto;
  min-height: 0;
  max-height: 360px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.workitem-searchable-picker-overlay .reviewer-pick-row {
  display: flex;
  flex: none;
  width: 100%;
  min-width: 0;
  align-items: center;
  gap: var(--ui-space-2);
  min-height: var(--ui-control-compact);
  padding: var(--ui-space-1) var(--ui-space-2);
  margin: 0;
  box-sizing: border-box;
  border: 0;
  border-radius: var(--ui-space-1);
  background: transparent;
  color: var(--ink);
  font-size: var(--ui-text);
  box-shadow: none;
  overflow-wrap: anywhere;
}
.workitem-searchable-picker-overlay .reviewer-pick-row[hidden],
.workitem-searchable-picker-group[hidden] { display: none; }
.workitem-searchable-picker-overlay .reviewer-pick-row:hover { background: var(--ui-hover); }
.workitem-searchable-picker-overlay .reviewer-pick-row:has(input:checked) { background: var(--ui-selected); }
.workitem-searchable-picker-overlay .reviewer-pick-row:has(input:disabled) { color: var(--ink-soft); }
.workitem-searchable-picker-overlay .reviewer-pick-row input { flex: none; margin: 0; }
.workitem-searchable-picker-overlay .document-workflow-choice { align-items: flex-start; }
.workitem-searchable-picker-overlay .document-workflow-choice > input { margin-top: var(--ui-space-1); }
.document-workflow-feedback .document-workflow-blockers { color: var(--ink); font-size: var(--ui-text); line-height: 1.4; }
.workitem-searchable-picker-actions,
.workitem-searchable-picker-group-heading {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--ui-space-1) var(--ui-space-2);
  flex: none;
}
.workitem-searchable-picker-actions { border-bottom: 1px solid var(--muted); padding-bottom: var(--ui-space-1); }
.workitem-searchable-picker-group-heading { justify-content: space-between; padding: var(--ui-space-1) var(--ui-space-2); }
.workitem-searchable-picker-group-label { font-size: var(--ui-text-small); font-weight: 600; overflow-wrap: anywhere; }
.workitem-searchable-picker-action.ghost {
  min-height: var(--ui-control-compact);
  padding: var(--ui-space-1);
  font-size: var(--ui-text-small);
  border-color: transparent;
  background: transparent;
  color: var(--accent-2);
}
.workitem-searchable-picker-status {
  flex: none;
  border-top: 1px solid var(--muted);
  padding-top: var(--ui-space-2);
  color: var(--ink-soft);
  font-size: var(--ui-text-small);
}
@media (pointer: coarse) {
  .workitem-searchable-picker-overlay .reviewer-pick-row,
  .workitem-searchable-picker-action.ghost { min-height: 44px; }
}
button, input, select, textarea { font-family: var(--ui-font); }

/* Action buttons share one shape. Icon tools use the same compact size in
 * tables, editors, navigation and dialogs. Full-card buttons retain layout. */
:where(.primary, .ghost, .danger, .tool-btn, .icon-btn, .icon-action,
  .app-nav-action, .project-home-shortcut, .project-home-link-btn,
  .wi-review-action-btn, .workitem-review-card-actions button,
  .global-home-attention button, .global-home-context button) {
  min-height: var(--ui-control-height);
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius);
  padding: 7px 12px;
  background-color: var(--canvas);
  color: var(--ink);
  font-size: var(--ui-text);
  font-weight: 600;
  line-height: 20px;
  box-shadow: none;
  cursor: pointer;
}
:is(.tool-btn, .icon-btn, .icon-action) { display: inline-flex; }
:is(.tool-btn, .icon-btn, .icon-action, .app-nav-icon-action) {
  align-items: center;
  justify-content: center;
  min-height: var(--ui-control-compact);
  height: var(--ui-control-compact);
  min-width: var(--ui-control-compact);
  padding: 4px;
  background-color: transparent;
  border-color: transparent;
}
:is(.primary, .workitem-review-accept) {
  background-color: var(--accent);
  border-color: var(--accent);
  color: var(--canvas);
}
.danger { background-color: var(--ui-danger); border-color: var(--ui-danger); color: var(--canvas); }
:where(.ghost, .tool-btn, .icon-btn, .icon-action, .app-nav-action,
  .project-home-shortcut, .project-home-link-btn, .wi-review-action-btn,
  .workitem-review-card-actions button, .global-home-attention button,
  .global-home-context button):hover:not(:disabled) {
  background-color: var(--ui-hover);
  border-color: var(--muted);
  color: var(--ink);
}
:is(.primary, .workitem-review-accept, .danger):hover:not(:disabled) {
  background-color: var(--accent-2); border-color: var(--accent-2); color: var(--canvas);
}
:is(.tool-btn, .icon-btn, .ghost):not(.tab-btn, .meta-view-toggle, .app-nav-action):is(.active, .is-active, [aria-pressed="true"]),
:is(.tool-btn, .icon-btn, .ghost):not(.tab-btn, .meta-view-toggle, .app-nav-action):is(.active, .is-active, [aria-pressed="true"]):hover:not(:disabled) {
  background-color: var(--ui-selected); border-color: var(--accent); color: var(--accent-2);
}

/* Shared AI action identity from the document editor, independent of branding. */
.ai-tool-btn {
  --ui-ai-background: linear-gradient(135deg, #f45d3a 0%, #e02e6c 55%, #6d1b7b 100%);
  --ui-ai-background-hover: linear-gradient(135deg, #ff6a43 0%, #e93676 55%, #782087 100%);
  --ui-ai-ink: #fffdf8;
  --ui-ai-border: #d83b62;
  --ui-ai-border-hover: #c92e58;
  --ui-ai-shadow: rgba(178, 43, 84, 0.32);
  --ui-ai-shadow-hover: rgba(178, 43, 84, 0.42);
  color: var(--ui-ai-ink);
  background: var(--ui-ai-background);
  border-color: var(--ui-ai-border);
  box-shadow: 0 2px 7px var(--ui-ai-shadow);
}
.ai-tool-btn :is(.icon, .btn-icon) { filter: none; }
.ai-tool-btn:hover:not(:disabled):not(.tool-context-disabled):not([aria-disabled="true"]) {
  color: var(--ui-ai-ink);
  background: var(--ui-ai-background-hover);
  border-color: var(--ui-ai-border-hover);
  filter: saturate(1.1) brightness(1.05);
  box-shadow: 0 3px 9px var(--ui-ai-shadow-hover);
}
.ai-tool-btn:is(:disabled, .tool-context-disabled, [aria-disabled="true"]) {
  background: var(--muted);
  border-color: var(--muted);
  color: var(--ink-soft);
  filter: none;
  box-shadow: none;
}

/* Content tabs are text-only; the main navigation is a separate component. */
.trace-workspace-title { font: 600 16px/1.4 var(--ui-font); }
.settings-editor-title { display: flex; align-items: baseline; gap: var(--ui-space-1); min-width: 0; margin: 0; font: 600 20px/1.4 var(--ui-font); }
.settings-editor-title > [data-i18n] { flex: 0 0 auto; }
.settings-editor-project { max-width: 24ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.settings-editor-status { color: var(--ink-soft); font: 400 var(--ui-text-small)/1.4 var(--ui-font); white-space: nowrap; }
.settings-editor-status.is-dirty { color: var(--ui-warning); }
.help-licenses-table .work-table td:first-child { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
.help-licenses-table .work-table th:nth-child(2) { width: 100px; }
.help-licenses-table .work-table th:nth-child(3) { width: 180px; }
.workflow-more-actions > summary { display: flex; align-items: center; justify-content: center; list-style: none; }
.workflow-more-actions > summary::-webkit-details-marker { display: none; }
.btn-icon[data-icon="auto-layout"] { mask-image: url('/icons/auto-layout.svg'); -webkit-mask-image: url('/icons/auto-layout.svg'); }
.trace-type-card:is(.is-selected, .is-connect-source) { background: var(--ui-selected); }
.trace-config-inspector-rule { font-size: var(--ui-text); }
.trace-config-inspector-rule + .trace-config-inspector-rule { border-top: 1px solid var(--muted); }
.trace-config-inspector-rule.is-selected { background: var(--ui-selected); }
.trace-view-header { border-bottom: 1px solid var(--muted); }
.trace-level-picker .trace-levels-info { background: var(--canvas); border: 1px solid var(--muted); border-radius: var(--ui-radius); box-shadow: 0 4px 16px var(--shadow); }
.trace-as-of-info { min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--ink-soft); font: 400 var(--ui-text-small)/1.4 var(--ui-font); }
.trace-as-of-info::before { display: none; }
.trace-as-of-info.has-warning { background: var(--ui-warning-soft); color: var(--ui-warning); padding: var(--ui-space-2); border-radius: var(--ui-radius); }
:is(.tab-btn, .meta-view-toggle, .project-home-tabs button,
  .global-home-tabs button, .workitem-view-tabs button) {
  min-height: var(--ui-control-height);
  padding: 7px 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink-soft);
  font: 600 var(--ui-text)/20px var(--ui-font);
  box-shadow: none;
}
:is(.tab-btn, .meta-view-toggle, .project-home-tabs button,
  .global-home-tabs button, .workitem-view-tabs button):hover:not(:disabled) {
  background: transparent; color: var(--ink);
}
:is(.tab-btn, .meta-view-toggle, .project-home-tabs button,
  .global-home-tabs button, .workitem-view-tabs button):is(.active, [aria-selected="true"], [aria-pressed="true"]) {
  background: transparent; color: var(--accent-2); border: 0;
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 2px;
}
:is(.panel-tabs, .view-tabs, .project-home-tabs, .global-home-tabs, .workitem-view-tabs) { gap: var(--ui-space-1); }
:is(.project-home-tabs, .global-home-tabs) button:is([aria-selected="true"], [aria-pressed="true"]) {
  text-decoration: none;
  box-shadow: inset 0 -2px 0 var(--accent-2);
}
:is(.global-home-project-table, .global-home-inbox-table, .project-home-data-table) {
  background: var(--ui-start-surface);
}
:is(.global-home-project-table, .global-home-inbox-table, .project-home-data-table) th {
  background: var(--ui-start-surface-header);
  color: var(--ink);
  font-size: var(--ui-text);
  font-weight: 600;
}
:is(.global-home-project-table, .global-home-inbox-table, .project-home-data-table) tbody tr:hover,
:is(.global-home-recent-row, .project-home-document):hover {
  background: var(--ui-start-surface-hover);
}
:is(.global-home-task, .project-home-task, .global-home-project-row, .global-home-project) { cursor: pointer; }
:is(#globalHomeDashboard .global-home-recent-row, #projectHomeView .project-home-document):hover { color: var(--ink); text-decoration: none; }
:is(.global-home-recent-row, .project-home-document, .project-home-status-legend, .project-home-reference-counts) {
  background: var(--ui-start-surface);
}

/* Selectable regions retain document alignment and share application controls. */
.document-zone-button {
  display: flex;
  flex-direction: column;
  gap: var(--ui-space-2);
  min-width: 0;
  min-height: 64px;
  padding: var(--ui-space-2);
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius);
  background: var(--canvas);
  color: var(--ink);
  text-align: inherit;
  white-space: normal;
  overflow-wrap: anywhere;
}
.document-zone-button:hover { background: var(--ui-hover); }
.document-zone-button[aria-pressed="true"] {
  border-color: var(--accent-2);
  background: var(--ui-selected);
}
.document-zone-label { font-size: var(--ui-text-small); color: var(--ink-soft); }
.document-zone-button [data-branding-preview] { font-size: var(--ui-text-small); width: 100%; }
.document-zone-button img { max-width: 100%; max-height: 90px; object-fit: contain; }
.document-zone-button.is-empty .document-zone-label { margin-block: auto; }

/* Header navigation: white labels on the brand surface, white active button. */
.topbar .app-nav-action {
  color: var(--canvas);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--ui-radius);
  text-decoration: none;
}
.topbar .app-nav-action:hover:not(:disabled) {
  color: var(--canvas);
  background: rgba(255, 255, 255, .15);
  border-color: transparent;
}
.topbar .app-nav-action:is(.active, [aria-pressed="true"], [aria-expanded="true"]),
.topbar .app-nav-action:is(.active, [aria-pressed="true"], [aria-expanded="true"]):hover:not(:disabled) {
  color: var(--accent-2);
  background: var(--canvas);
  border-color: transparent;
  text-decoration: none;
}
.topbar .app-nav-action:focus-visible { outline-color: var(--canvas); outline-offset: 2px; }
.topbar .brand { padding: 0; }

.navigation-more-chevron { transform: rotate(90deg); }
.navigation-overflow-menu {
  z-index: 76;
  min-width: min(220px, calc(100vw - 16px));
  max-width: calc(100vw - 16px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.navigation-overflow-menu[hidden], .navigation-more[hidden] { display: none !important; }
.navigation-overflow-menu .context-item { min-height: 44px; color: var(--ink); font-size: 14px; }
.navigation-overflow-menu .context-item:focus-visible { outline-color: var(--accent); }

@media (min-width: 901px) {
  .topbar .view-tabs { flex: 1 1 0; overflow: visible; }
  .topbar .view-tabs .navigation-overflowed { display: none; }
  .topbar .navigation-more { flex: 0 0 auto; white-space: nowrap; min-height: 40px; }
  .topbar .view-tabs .navigation-compact-active { width: 40px; min-width: 40px; padding: 0; justify-content: center; }
  .topbar .navigation-compact-active .btn-label { display: none; }
}
@media (max-width: 900px) {
  .topbar .navigation-more { display: none; }
}

/* One editor-toolbar surface, including the variable editor's mini-actions. */
:is(.toolbar, .mini-actions, .comment-editor-toolbar, .wi-inline-rich-toolbar, .template-preview-toolbar) {
  display: flex;
  align-items: center;
  gap: var(--ui-space-1);
  padding: var(--ui-space-1);
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius);
  background: var(--paper);
  color: var(--ink);
}
.comment-editor > .comment-editor-toolbar {
  border: 0;
  border-bottom: 1px solid var(--muted);
  border-radius: 0;
  background: var(--canvas);
}
.mini-actions { flex-wrap: wrap; }
.document-toolbar-shell > .toolbar {
  border-radius: 0;
}
:is(.toolbar, .mini-actions, .comment-editor-toolbar, .wi-inline-rich-toolbar, .template-preview-toolbar) .tool-btn {
  font-size: var(--ui-text);
  line-height: 20px;
  padding: 4px;
}
:is(.toolbar, .mini-actions, .comment-editor-toolbar, .wi-inline-rich-toolbar, .template-preview-toolbar) .tool-btn:is(.icon-only, .icon-glyph) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--ui-control-compact);
  min-width: var(--ui-control-compact);
}
.toolbar [data-work-item-create-icon] {
  display: inline-flex;
}
.toolbar .toolbar-work-item-type-icon {
  margin: 0;
}
:is(.toolbar, .mini-actions, .comment-editor-toolbar, .work-item-toolbar, .wi-inline-rich-toolbar, .template-preview-toolbar, .editor-toolbar-menu) .icon {
  width: var(--ui-toolbar-icon-size);
  height: var(--ui-toolbar-icon-size);
  flex: 0 0 var(--ui-toolbar-icon-size);
  filter: none;
}
/* Reserve room for the disclosure arrow without shrinking the command icon. */
.toolbar .tool-btn.dropdown-icon-btn {
  width: auto;
  min-width: var(--ui-control-compact);
}
.toolbar :is(.toolbar-labelled-menu-btn, .toolbar-insert-menu-btn) {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-1);
  padding-inline: var(--ui-space-2);
  white-space: nowrap;
}
.toolbar .tool-select {
  min-height: var(--ui-control-compact);
  height: var(--ui-control-compact);
  font-size: var(--ui-text-small);
}
.workitem-document-toolbar .tool-select {
  flex: 0 0 auto;
  max-width: 100%;
  padding: 4px 24px 4px 7px;
}
.workitem-document-toolbar .tool-style-select { width: 116px; }
.workitem-document-toolbar .tool-font-size-select { width: 72px; }
.toolbar .toolbar-group {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
}
.toolbar .toolbar-group + .toolbar-group {
  border-left: 1px solid var(--muted);
  padding-left: var(--ui-space-1);
}
.toolbar .toolbar-group {
  border-right: 0;
  margin-right: 0;
  padding-right: 0;
}
.toolbar .dropdown-icon-btn::after,
.toolbar-chevron { flex-shrink: 0; }
.editor-toolbar-submenu-arrow {
  width: 6px;
  height: 6px;
  margin-left: auto;
  margin-right: 3px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
  flex-shrink: 0;
}
.home-editor-toolbar { width: auto; flex-wrap: wrap; }
.home-editor-toolbar .toolbar-group { flex-wrap: wrap; }
.home-editor-toolbar .project-home-color { position: relative; }
.home-editor-toolbar .project-home-color input[type="color"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.review-status-counters { margin-bottom: var(--ui-space-4); }
#homeView, #projectHomeView, #projectHomeView .project-home-panel { background: var(--paper); }
.topbar .view-tabs { background-color: var(--accent); }

/* Only application fields: document typography, color swatches, checkboxes
 * and range inputs keep their actual content/interaction semantics. */
:where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="hidden"], [type="file"], [type="button"], [type="submit"]), select, textarea):not(:where(#docCanvas *, #templateContent *, .ProseMirror *)) {
  min-height: var(--ui-control-height);
  padding: 7px 12px;
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius);
  background-color: var(--canvas);
  color: var(--ink);
  font-size: var(--ui-text);
  line-height: 20px;
  box-shadow: none;
}
/* Space reserved for the existing search icon and native/custom select arrow. */
.workitem-searchbar .field:first-child input { padding-left: 36px; }
:is(.field, .work-filters, .modal, .work-query-builder) select { padding-right: 34px; }
.field { gap: var(--ui-space-2); font-size: var(--ui-text); }
.config-entity-editor .field { text-align: left; }
/* Labels and actions stay readable without increasing compact control heights. */
:where(.tree, .context-item, .workitem-review-reason label, #workItemQueryModal label) {
  font-size: var(--ui-text);
}
:where(.meta-subtle, .context-label, .doc-type-badge, .doc-save-status,
  .form-error, .form-success, .field-validation-error, .comment-editor-error,
  .comment-editor-hint, .workitem-hover-preview-label,
  .workitem-hover-preview-status, .workitem-hover-preview-footer,
  .workitem-fixed-context-provenance, .comment-source-badge, .comment-status,
  .comment-metadata-chip, .tool-color-title, .doc-toc-panel-title,
  .work-query-and, #commentModal .comment-input-hint, .reviewer-meta,
  .trace-tree-level-badge, .trace-tree-node-meta, .editor-toolbar-menu-heading,
  .context-menu-hint, .editor-slash-menu-category, .trace-type-inventory-level,
  .trace-type-card-meta, .trace-group-count, .trace-relation) {
  font-size: var(--ui-text-small);
  line-height: 1.4;
}
/* Emphasize field labels without changing the text inside detail controls. */
.workitem-workspace-details .field > span {
  font-size: var(--ui-text);
  font-weight: 700;
}
.workitem-workspace-details .workitem-pre-condition-field .workitem-custom-rich-editor {
  background-color: var(--canvas);
}
input::placeholder, textarea::placeholder { color: var(--ink-soft); opacity: 1; }
input[type="checkbox"], input[type="radio"], input[type="range"] { accent-color: var(--accent); }
:is(input, select, textarea):is(.is-invalid, [aria-invalid="true"]) { border-color: var(--ui-danger); }
.form-error, .field-validation-error, .comment-editor-error { color: var(--ui-danger); }
.form-success { color: var(--ui-success); }

/* Editable document pages show focus through the caret instead of a page frame. */
:is(button, a, input, select, textarea, summary, [tabindex]):not(.doc-canvas[contenteditable="true"], .wi-document-editing .wi-inline-title-input):focus-visible {
  outline: 2px solid var(--accent);
  /* Keep the ring inside controls at scroll and popup clipping edges. */
  outline-offset: -2px;
}
/* Work-item keyboard navigation marks the active row instead of the container. */
#workItemsView .work-table-wrapper:focus-visible { outline: none; }
:is(button, input, select, textarea):disabled { opacity: .5; cursor: not-allowed; }

/* Document review actions retain their semantic colors in every application theme. */
.wi-review-action-btn.accept {
  border-color: #6ca676;
  background-color: #edf9ef;
  color: #296131;
}
.wi-review-action-btn.reject {
  border-color: #cc8888;
  background-color: #fdeeee;
  color: #9f2d2d;
}
.wi-review-action-btn.comment {
  border-color: #4c84c7;
  background-color: #eaf3ff;
  color: #185a9d;
}
.wi-review-action-btn:is(.accept, .reject, .comment):focus-visible { outline-color: currentColor; }

/* Surfaces and headings use the same hierarchy on both home pages and in
 * working views. Width, scrolling, positioning and responsive layout stay local. */
:is(.modal, .login-card, .project-home-card, .global-home-project,
  .global-home-inbox, .global-home-recent, .home-panel, .home-section,
  .project-home-kpi, .global-home-kpi, .workitem-hover-preview, .document-search-panel) {
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius-panel);
  background-color: var(--canvas);
  color: var(--ink);
}
.home-section { padding: var(--ui-space-5); min-width: 0; }
.home-section-hint { margin: var(--ui-space-1) 0 0; color: var(--ink-soft); font-size: var(--ui-text-small); font-weight: 400; line-height: 1.5; max-width: 70ch; }
@media (max-width: 760px) { .home-section { padding: var(--ui-space-3); } }
#globalHomeNews.home-panel {
  border: 0;
  border-radius: var(--ui-radius-panel);
  background-color: var(--canvas);
}
:is(.project-home-heading, .global-home-heading) h1, #templateManagerModal .template-workspace-title {
  font-size: 28px; line-height: 1.2; font-weight: 700; letter-spacing: -.4px;
}
#templateManagerModal .template-workspace-title { border-color: transparent; background: transparent; }

#templateContent :is(td, th).selectedCell { outline: 2px solid var(--accent); outline-offset: -2px; box-shadow: inset 0 0 0 2px var(--muted); }
:is(.panel-header, .project-home-card h2, #globalHomeDashboard h2, .modal-header, .document-search-panel-header) {
  font-size: 16px; font-weight: 700;
}
.document-search-panel { box-shadow: 0 18px 48px var(--shadow); }
.document-search-panel-header { background: var(--paper); border-bottom: 1px solid var(--muted); }
.document-search-panel-actions { background: var(--paper); border-top: 1px solid var(--muted); }
.document-search-result.is-error { color: var(--ui-danger); }
:is(.project-home-kpi, .global-home-kpi) { padding: var(--ui-space-4); }
:is(.project-home-kpi, .global-home-kpi) strong { font-size: 28px; line-height: 1.2; }
:is(.project-home-kpi, .global-home-kpi):hover { background-color: var(--ui-hover); }
.work-query-builder, .comment-entry, .comment-editor { border-radius: var(--ui-radius); background-color: var(--canvas); border-color: var(--muted); }
.workitem-searchbar .work-query-builder { border: 0; background: transparent; }
.workitem-searchbar .work-query-icon { display: inline-flex; align-items: center; justify-content: center; }
.workitem-searchbar .work-query-icon .btn-icon { width: var(--ui-space-4); height: var(--ui-space-4); flex: 0 0 var(--ui-space-4); margin: 0; }
.workitem-searchbar .work-query-row { border-radius: var(--ui-radius); }
.workitem-searchbar .work-query-row > button { height: var(--ui-control-compact); min-height: var(--ui-control-compact); }
.workitem-searchbar .work-query-remove {
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--ui-control-compact); padding: var(--ui-space-1);
  color: var(--ui-danger);
}
.workitem-searchbar .work-query-remove:hover:not(:disabled) { color: var(--ui-danger); background: var(--ui-danger-soft); }
.workitem-searchbar :is(input, select, button):focus-visible { outline-offset: -2px; }
/* Editor chrome follows the app palette; document content keeps its own colors. */
:is(.document-properties-primary,
  .document-properties-name-control input[readonly], .workitem-history-view-toolbar,
  .trace-tree-section, .trace-header-row, .trace-header) {
  background: var(--paper);
  border-color: var(--muted);
}
:is(.home-content, .doc-empty-card, .context-menu, .editor-generated-context-menu,
  .tool-color-popover, .template-color-popover, .review-filter-popover,
  .comment-command-menu, .workitem-searchable-picker-overlay, .doc-wi-meta-field-list,
  .doc-external-toc, .document-search-panel, .doc-ai-panel,
  .doc-ai-chapter-list, .doc-ai-review-panel, .template-history-wrapper) {
  background: var(--canvas);
  border-color: var(--muted);
  color: var(--ink);
}
:is(.sidebar-resize-flag, .meta-comments-resize-flag,
  .context-step-btn, .doc-ai-context-picker) {
  background: var(--paper);
  border-color: var(--muted);
  color: var(--ink-soft);
}
:is(.sidebar-resize-flag, .meta-comments-resize-flag):is(:hover, :focus-visible),
.context-item:hover,
.template-table-context-menu button:is(:hover, :focus-visible) {
  background: var(--ui-hover);
  border-color: var(--muted);
}
:is(.tree-item.active, .document-tree .document-tree-document.active,
  #documentList .list-item.active, #workItemHistoryList .list-item.active) {
  background: var(--ui-selected);
  border-color: var(--accent);
}

.doc-sidebar {
  background: var(--canvas);
  padding: var(--ui-space-2);
}

.workspace.document-toolbar-active :is(.doc-sidebar, .meta-sidebar),
.meta-sidebar:has(.workitem-workspace-details) { border-radius: 0; }

.doc-sidebar > .panel-header {
  font-size: calc(var(--ui-text) + 2px);
}

.document-tree .document-tree-row {
  font-size: var(--ui-text);
  line-height: 1.4;
}

.document-tree .doc-title-text {
  font-weight: 400;
}

.document-tree .document-tree-document.active .doc-title-text,
.document-tree .document-tree-folder-name {
  font-weight: 600;
}

.document-tree :is(.folder-icon, .doc-icon),
.editor-toolbar-menu-create :is(.folder-icon, .doc-icon) {
  background: var(--ink-soft);
  border: 0;
  border-radius: 0;
  mask: url('./icons/majesticons/document-line.svg') center / contain no-repeat;
}

.document-tree .folder-icon,
.editor-toolbar-menu-create .folder-icon {
  mask-image: url('./icons/majesticons/folder-line.svg');
}

.document-tree .doc-icon[data-doc-type='test'] {
  mask-image: url('./icons/majesticons/flask-line.svg');
}

.document-tree .active :is(.folder-icon, .doc-icon) {
  background: var(--accent-2);
}

.document-tree-toggle::before {
  background: var(--ink-soft);
  mask: url('./icons/majesticons/chevron-right-line.svg') center / contain no-repeat;
}

.document-tree [role='button']:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.editor-toolbar-menu-create .context-item {
  min-height: 44px;
  font-size: calc(var(--ui-text) + 1px);
}

@media (max-width: 1200px) {
  .document-sidebar-toggle { display: none; }
  .document-tree-toggle { min-width: 44px; min-height: 44px; }
}

@media (pointer: coarse) {
  .document-tree .document-tree-row { min-height: 44px; }
  .document-tree-toggle { min-width: 44px; min-height: 44px; }
}
:is(.work-table, .testing-table) > :is(thead, tbody, tfoot) > tr > th { background-color: var(--paper); border-color: var(--muted); }
:is(.work-table, .testing-table) > :is(thead, tbody, tfoot) > tr > td { border-color: var(--muted); }
.work-table > :is(thead, tbody) > tr:not(.workitem-lazy-spacer, .work-item-detail) > :is(th, td) {
  padding: var(--ui-space-1) var(--ui-space-2);
}
.work-table, .trace-cell { font-size: calc(var(--ui-text) + 2px); line-height: 1.5; }
:is(.work-table .workitem-table-status, .work-table .meta-subtle, .trace-cell-missing, .trace-cell .meta-subtle) { font-size: var(--ui-text); }
:is(.work-table, .testing-table):where(:not(.document-fmea-table)) > tbody > tr:hover > td { background-color: var(--ui-hover); }
:is(.work-table, .testing-table):where(:not(.document-fmea-table)) > tbody > tr:is(.selected, .active, .bulk-selected) > td { background-color: var(--ui-selected); }
.testing-table > tbody > tr[data-testing-item-row] {
  --testing-row-color: var(--ui-info-soft);
  --ui-table-row-background: color-mix(in srgb, var(--testing-row-color) 55%, var(--paper));
  --ui-table-row-hover: color-mix(in srgb, var(--testing-row-color) 80%, var(--paper));
}
.testing-table > tbody > tr[data-testing-result="passed"] { --testing-row-color: var(--ui-success-soft); }
.testing-table > tbody > tr[data-testing-result="accepted"] { --testing-row-color: var(--ui-warning-soft); }
.testing-table > tbody > tr[data-testing-result="failed"] { --testing-row-color: var(--ui-danger-soft); }
.testing-table > tbody > tr[data-testing-item-row].selected {
  --ui-table-row-background: var(--testing-row-color);
  --ui-table-row-hover: var(--testing-row-color);
}
:is(#workItemsView, .testing-overview) .workitem-column-resize-handle { position: absolute; display: block; right: 0; top: 6px; bottom: 6px; width: 9px; height: auto; cursor: col-resize; z-index: 4; touch-action: none; }
:is(#workItemsView, .testing-overview) .workitem-column-resize-handle::after { content: ''; position: absolute; left: 8px; top: 0; bottom: 0; width: 1px; background: #a29b95; }
:is(#workItemsView, .testing-overview) .workitem-column-resize-handle:is(:hover, :focus-visible)::after { width: 2px; background: var(--accent); }
:is(#workItemsView, .testing-overview) .workitem-column-resize-handle:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

:is(#workItemsView, .testing-overview) .work-table .actions-col { padding-inline: 2px; text-align: center; }

/* Keep the fixed actions on the same opaque surface as the selected row. */
.work-table .actions-col { box-shadow: none; }
.work-table-wrapper { scrollbar-color: var(--ink-soft) var(--paper); scrollbar-width: auto; }
#auditView .work-table > tbody > tr[data-severity="critical"] > td { background-color: var(--ui-danger-soft); }
#auditView .work-table > tbody > tr[data-severity="warning"] > td { background-color: var(--ui-warning-soft); }
#auditView .work-table tr[data-severity="critical"] :is(.audit-severity, .audit-action) { color: var(--ui-danger); }
#auditView .work-table tr[data-severity="warning"] :is(.audit-severity, .audit-action) { color: var(--ui-warning); }
#auditView tr[data-severity="critical"] .audit-severity { border-color: var(--ui-danger); background-color: var(--ui-danger-soft); }
#auditView tr[data-severity="warning"] .audit-severity { border-color: var(--ui-warning); background-color: var(--ui-warning-soft); }
#workItemsView .work-table .row-actions .icon-action { border-color: transparent; background: transparent; }
#workItemsView .work-table .row-actions .icon-action:is(:hover, :focus-visible) { background: var(--ui-hover); }
#workItemsView .work-table .row-actions .icon-action.workitem-suspect-active { background: var(--ui-success-soft); }

.workitem-mobile-actions, .workitem-mobile-code { display: none; }
.settings-dropdown[hidden] { display: none; }
#homeView:has(.global-home-empty-workspace) #globalHomeNews:not(:focus-within) #homeToolbar,
#projectHomeMeta:has(.project-home-empty-start) #projectHomeDescription:not(:focus-within) #projectHomeToolbar {
  display: none;
}
.save-toast[data-tone="error"] {
  top: auto;
  bottom: var(--ui-space-4);
  width: max-content;
  max-width: min(36rem, calc(100vw - 2 * var(--ui-space-4)));
  box-sizing: border-box;
  border-radius: var(--ui-radius-panel);
  padding: var(--ui-space-3) var(--ui-space-4);
  font-size: var(--ui-text);
  background: var(--ui-danger-soft);
  color: var(--ui-danger);
}
/* Empty document views retain their editor nodes while showing only useful navigation. */
#documentsView:has(#docEmptyState:not([hidden])) .doc-editor > .toolbar,
.workspace:has(#documentsView.active #docEmptyState:not([hidden])) > :is(#metadataSidebar, .document-toolbar-shell) {
  display: none;
}
.workspace:has(#documentsView.active #docEmptyState:not([hidden])) {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}
.workspace:has(#documentsView.active #docEmptyState:not([hidden])) > .main {
  grid-column: 1;
  grid-row: 1;
}
#documentsView:has(#docEmptyState:not([hidden])) .doc-editor {
  height: 100%;
  margin-top: 0;
}
@media (min-width: 1201px) {
  body.projects-sidebar-pinned:not(.doc-editor-fullscreen-mode) .workspace > .sidebar {
    border-radius: 0;
  }
  body.projects-sidebar-pinned:not(.doc-editor-fullscreen-mode)
    .workspace:has(#documentsView.active #docEmptyState:not([hidden])) {
    grid-template-columns:
      minmax(var(--sidebar-min-width), var(--left-sidebar-width)) minmax(0, 1fr);
  }
  body.projects-sidebar-pinned:not(.doc-editor-fullscreen-mode)
    .workspace:has(#documentsView.active #docEmptyState:not([hidden])) > .main {
    grid-column: 2;
  }
}
.context-menu {
  overflow-x: hidden;
}
.project-tree-context-menu {
  /* Project drawer uses layer 70, above the default context-menu layer. */
  z-index: 71;
}
.context-menu .context-item {
  box-sizing: border-box;
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}
.context-menu-modern {
  --context-menu-row-height: 32px;
  --context-menu-icon-size: 18px;
  position: fixed;
  z-index: 10000;
  display: block;
  min-width: 248px;
  box-sizing: border-box;
  max-width: calc(100vw - 16px);
  max-height: calc(100dvh - 16px);
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  padding: 6px;
  border: 0;
  border-radius: var(--ui-radius);
  background: var(--canvas);
  color: var(--ink);
  box-shadow: 0 8px 28px var(--shadow);
  font: 400 13px/1.4 var(--ui-font);
}
.context-menu-modern .context-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
  min-height: var(--context-menu-row-height);
  padding: 6px 10px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: inherit;
  font: inherit;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: start;
  cursor: pointer;
}
.context-menu-modern .context-item .btn-icon {
  width: var(--context-menu-icon-size);
  height: var(--context-menu-icon-size);
  min-width: var(--context-menu-icon-size);
  flex: 0 0 var(--context-menu-icon-size);
}
.context-menu-modern .context-menu-arrow { margin-left: auto; }
.context-menu-modern .context-item:is(:hover, :focus-visible, :focus-within) {
  background: color-mix(in srgb, var(--ink) 6%, var(--canvas));
}
.context-menu-modern .context-item:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}
.context-menu-modern .context-item-danger { color: var(--ui-danger); }
.context-menu-modern .context-item-danger:is(:hover, :focus-visible) { background: var(--ui-danger-soft); }
.context-menu-modern .context-item:disabled {
  color: var(--ink-soft);
  cursor: default;
  background: transparent;
  opacity: .55;
}
.context-menu-modern .context-menu-identity {
  padding: 4px 10px 6px;
  font-size: var(--ui-text-small);
  font-weight: 600;
  color: var(--ink-soft);
}
.context-menu-modern .context-separator { height: 1px; margin: 4px 6px; background: var(--muted); }
.context-menu-modern .context-menu-hint { padding: 5px 10px 2px; font-size: var(--ui-text-small); font-weight: 400; color: var(--ink-soft); }
.context-menu-modern .context-item.has-submenu > .context-menu-modern.submenu { display: none; }
.context-menu-modern .context-item.has-submenu.submenu-open > .context-menu-modern.submenu { display: block; }
@media (pointer: coarse), (max-width: 600px) {
  .context-menu-modern { --context-menu-row-height: 44px; }
}
@media screen and (max-width: 600px) {
  .work-table:has(#workItemList) .row-actions { display: none; }
  .work-table:has(#workItemList) .workitem-mobile-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
  }
  .workitem-mobile-code {
    display: block;
    color: var(--ink-soft);
    font-size: var(--ui-text-small);
  }
}

/* License settings share the flat surfaces and type hierarchy of administration. */
.admin-license-panel,
.admin-license-request-panel {
  background: var(--canvas);
  color: var(--ink);
}
.admin-license-request-panel { border-top: 1px solid var(--muted); }
.admin-license-title { margin: 0; font-size: 28px; line-height: 1.2; }
.admin-license-panel-title { margin: 0; font-size: 16px; font-weight: 700; }
.admin-license-summary,
.admin-license-request-copy { color: var(--ink-soft); font-size: var(--ui-text); line-height: 1.5; }
.admin-license-summary,
.admin-license-card,
.admin-license-request-copy,
.admin-license-request-note { overflow-wrap: anywhere; }
.admin-license-card { border-bottom: 1px solid var(--muted); }
.admin-license-card-title { font-size: var(--ui-text); font-weight: 600; }
.admin-license-card-value { font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
.admin-license-card-meta,
.admin-license-request-note { color: var(--ink-soft); font-size: var(--ui-text-small); }
.admin-license-progress { background: var(--muted); border-radius: var(--ui-radius); }
.admin-license-progress-fill { background: var(--ui-success); border-radius: inherit; }
.admin-license-progress-fill.is-warning { background: var(--ui-warning); }
.admin-license-progress-fill.is-critical { background: var(--ui-danger); }
.admin-license-notice {
  background: var(--ui-warning-soft);
  border: 1px solid var(--ui-warning);
  border-radius: var(--ui-radius);
  color: var(--ui-warning);
  font-size: var(--ui-text);
}

/* Complementary designs are opt-in; the classic theme retains its original appearance. */
:root[data-complementary-branding] {
  :is(.tool-btn, .icon-btn, .ghost):not(.tab-btn, .meta-view-toggle, .app-nav-action):is(.active, .is-active, [aria-pressed="true"]),
  :is(.tool-btn, .icon-btn, .ghost):not(.tab-btn, .meta-view-toggle, .app-nav-action):is(.active, .is-active, [aria-pressed="true"]):hover:not(:disabled) {
    background-color: var(--ui-selected); border-color: var(--ui-secondary-border); color: var(--ui-secondary-ink);
  }
  .topbar .app-nav-action:is(.active, [aria-pressed="true"], [aria-expanded="true"]),
  .topbar .app-nav-action:is(.active, [aria-pressed="true"], [aria-expanded="true"]):hover:not(:disabled) {
    background: var(--ui-secondary); color: var(--brand-on-secondary);
  }

  /* The workspace surrounds the document; paper and document formatting stay local. */
  @media screen {
    .doc-page { --doc-workspace-background: var(--ui-workspace); }
  }
  :is(.template-manager-section, .template-preview-mode-switch,
    .template-preview-toolbar-group, .template-preview-color-control input, #templateLogoPreview) {
    border-color: var(--muted);
  }
  .template-manager-section { background: var(--paper); }
  .template-manager-section-accent {
    background: var(--ui-secondary-soft);
    border-color: var(--ui-secondary-border);
  }
  .template-preview-mode-switch { background: var(--canvas); }
  :is(.template-manager-section-header > div:first-child, .template-preview-color-control) { color: var(--ink); }

  /* Traceability and workflow share diagram surfaces, outlines and selection colors. */
  :is(.trace-config-toolbar, .trace-config-display-popover, .trace-config-workspace,
    .trace-config-inventory, .trace-config-inspector, .trace-config-canvas-heading,
    .trace-level-column, .trace-level-column-head, .trace-type-inventory-item,
    .trace-config-inspector fieldset, .trace-rule-row.is-readonly, .workflow-toolbar, .workflow-validation,
    .workflow-editor-layout, .workflow-palette, .workflow-inspector,
    .workflow-palette-item, .workflow-inspector fieldset) { border-color: var(--muted); }
  :is(.trace-config-toolbar, .trace-config-display-popover, .trace-config-inventory,
    .trace-config-inspector, .trace-config-canvas-heading, .trace-type-inventory-item,
    .workflow-palette, .workflow-inspector, .workflow-palette-item) {
    background: var(--canvas);
    color: var(--ink);
  }
  .trace-config-display-popover { box-shadow: 0 10px 28px var(--shadow); }
  .trace-config-canvas-shell { background: var(--paper); }
  :is(.trace-level-editor, .workflow-canvas) {
    background-color: var(--paper);
    background-image: radial-gradient(var(--muted) 1px, transparent 1px);
  }
  .trace-level-column-head { background: var(--canvas); }
  .trace-level-column.is-selected .trace-level-column-head {
    background: var(--ui-selected);
    box-shadow: inset 0 -3px var(--ui-secondary);
  }
  .trace-level-column.is-drop-target {
    background: var(--ui-selected);
    box-shadow: inset 0 0 0 2px var(--ui-secondary-ink);
  }
  .trace-level-column.is-view-hidden { background: var(--paper); }
  .trace-level-column.is-view-hidden .trace-level-column-head { background: var(--muted); }
  :is(.trace-type-card, .workflow-node) {
    background: var(--canvas);
    border-color: var(--muted);
    color: var(--ink);
    box-shadow: 0 3px 10px var(--shadow);
  }
  .trace-level-editor { background-image: none; }
  .trace-type-card { box-shadow: none; }
  .trace-type-card:is(:hover, .is-selected, .is-connect-source, .is-connection-target-hover),
  .workflow-node:is(.is-selected, .is-connecting) {
    border-color: var(--ui-secondary-ink);
  }
  .workflow-node:is(.is-selected, .is-connecting) { box-shadow: 0 0 0 3px var(--ui-selected); }
  .trace-type-card:is(.is-selected, .is-connection-target-hover),
  .workflow-node.is-selected { background: var(--ui-secondary-soft); }
  .trace-type-inventory-item:is(:hover, .is-selected),
  .workflow-palette-item:hover {
    background: var(--ui-selected);
    border-color: var(--ui-secondary-border);
  }
  :is(.trace-type-inventory-level, .trace-type-card-meta, .trace-rule-kind, .workflow-empty),
  :is(.trace-config-modal, .workitem-workflow-modal) .meta-subtle { color: var(--ink-soft); }
  .trace-config-inspector-rule.is-selected {
    background: var(--ui-selected);
  }
  :is(.trace-type-card-connector, .trace-type-card-target, .workflow-node-anchor) {
    background: var(--canvas);
    border-color: var(--ui-diagram-line);
  }
  .trace-type-card-connector:is(:hover, :focus-visible),
  .trace-type-card.is-connect-source .trace-type-card-connector,
  .trace-type-card.is-valid-target .trace-type-card-target,
  .workflow-node-anchor:hover {
    background: var(--ui-selected);
    border-color: var(--ui-secondary-ink);
  }
  .workflow-node-anchor:hover { box-shadow: 0 0 0 3px var(--ui-selected); }
  :is(.trace-config-edge, .workflow-edge) { stroke: var(--ui-diagram-line); }
  .trace-config-edge:is(.is-related, .is-selected), .workflow-edge.is-selected {
    stroke: var(--ui-secondary-ink);
  }
  .workflow-edge.is-selected { filter: drop-shadow(0 1px 2px var(--ui-secondary-soft)); }
  :is(.trace-config-edge-preview, .workflow-edge-preview) {
    stroke: var(--accent);
  }
  .workflow-edge-preview { filter: drop-shadow(0 1px 2px var(--ui-primary-soft)); }
  .workflow-edges #workflowArrow path { fill: var(--ui-diagram-line); }
  .workflow-edges #workflowArrowSelected path { fill: var(--ui-secondary-ink); }
  .workflow-edge-handle { fill: var(--canvas); stroke: var(--ui-secondary-ink); }
  .workflow-edge-label rect {
    fill: var(--canvas);
    stroke: var(--muted);
    filter: drop-shadow(0 1px 2px var(--shadow));
  }
  .workflow-edge-label text { fill: var(--ink); }
  .workflow-edge-label.is-selected rect { fill: var(--ui-selected); stroke: var(--ui-secondary-ink); }
  .workflow-edge-label.is-selected text { fill: var(--ui-secondary-ink); }
  .trace-config-validation {
    background: var(--ui-warning-soft); border-color: var(--ui-warning); color: var(--ui-warning);
  }
  .trace-config-validation.is-valid {
    background: var(--ui-success-soft); border-color: var(--ui-success); color: var(--ui-success);
  }
  .workflow-validation-error { color: var(--ui-danger); }
  .workflow-validation-warning { color: var(--ui-warning); }
  .workflow-validation-ok { color: var(--ui-success); }
  :is(.trace-group, .trace-tree-node-card, .link-item) { background: var(--canvas); border-color: var(--muted); }
  .trace-group-label { color: var(--accent-2); }
  .trace-group-count {
    background: var(--paper); border-color: var(--muted); color: var(--ink-soft);
  }
  .trace-tree-node-card:hover { background: var(--ui-hover); border-color: var(--ui-secondary-border); }
  .trace-tree-node-card.is-current { background: var(--ui-selected); border-color: var(--ui-secondary-ink); }
  .link-item.link-item-warning { background: var(--ui-warning-soft); border-color: var(--ui-warning); }

}

/* Loading surfaces follow the current palette, including full-page history loads. */
.hourglass-spinner {
  border-color: var(--muted);
  border-top-color: var(--accent);
}
.view-load-indicator {
  background: var(--canvas);
  box-shadow: 0 8px 24px var(--shadow);
}
/* Persistent status for local editor operations; document content stays editable. */
.view-load-indicator.is-editor-action {
  top: auto;
  left: auto;
  right: var(--ui-space-4);
  bottom: var(--ui-space-4);
  transform: none;
  z-index: var(--document-floating-panel-layer);
  max-width: min(420px, calc(100vw - 2 * var(--ui-space-4)));
  gap: var(--ui-space-3);
  padding: var(--ui-space-3) var(--ui-space-4);
  border-radius: var(--ui-radius-panel);
  white-space: normal;
  color: var(--ink);
}
.is-editor-action .hourglass-spinner { flex-shrink: 0; }
.editor-action-progress-copy { display: grid; gap: var(--ui-space-1); min-width: 0; }
.editor-action-progress-copy small { color: var(--ink-soft); font-size: var(--ui-text-small); }
@media (prefers-reduced-motion: reduce) {
  .is-editor-action .hourglass-spinner { animation: none; }
}
@media print {
  .view-load-indicator.is-editor-action { display: none; }
}
.app-starting #viewLoadIndicator,
.view-load-indicator.is-history-route {
  background: var(--paper);
  box-shadow: none;
}
.app-starting #viewLoadIndicator::before,
.view-load-indicator.is-history-route::before {
  box-shadow: 0 10px 30px var(--shadow);
}
/* Stay neutral on the first paint while the saved palette is still loading. */
:root:not([data-customer-branding]) .app-starting,
:root:not([data-customer-branding]) .app-starting #viewLoadIndicator {
  background: var(--canvas);
}

/* Matrix surfaces share the app palette; result colors retain their meaning. */
:is(.trace-item, .trace-empty-action) {
  background: transparent;
  color: var(--ink);
}
.trace-cell-add-action {
  background: transparent;
  border-color: transparent;
  color: var(--ink);
}
.trace-cell-add-action { color: var(--accent); }
.workitem-read-field {
  display: inline-flex;
  align-items: center;
  border: 0;
  border-radius: 0;
  background: transparent;
  font: inherit;
  justify-content: flex-start;
  min-height: 0;
  padding: 0;
  text-align: left;
}
.trace-empty-action.is-not-applicable {
  color: var(--ink-soft);
}
:where(.trace-row.has-conflict > .trace-cell:first-child,
  .trace-row-group .trace-merged-row.has-conflict > .trace-cell:first-child) {
  background: var(--paper);
}
.trace-table > .trace-row:not(.trace-header-row):is(:hover, :focus-within),
.trace-table > .trace-row:not(.trace-header-row):is(:hover, :focus-within) > .trace-cell,
.trace-row-group:is(:hover, :focus-within) .trace-cell {
  background: var(--ui-hover);
}
:is(.trace-empty-action, .trace-cell-add-action):is(:hover, :focus-visible):not(:disabled) {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent) inset;
}
:is(.trace-empty-action, .trace-cell-add-action):is(:hover, :focus-visible):not(:disabled) {
  background: var(--ui-hover);
}
.trace-cell-add-action:is(:hover, :focus-visible):not(:disabled) { background: transparent; }
.trace-cell:has(.trace-item[data-work-item-id]):is(:hover, :focus-within) {
  box-shadow: 0 0 0 2px var(--accent) inset;
}
.trace-item.test-result.passed {
  background: var(--ui-success-soft);
  border-color: var(--ui-success);
}
.trace-item.test-result.accepted {
  background: var(--ui-warning-soft);
  border-color: var(--ui-warning);
}
.trace-item.test-result.failed {
  background: var(--ui-danger-soft);
  border-color: var(--ui-danger);
}
.trace-row.has-conflict .trace-cell:first-child .trace-item:first-child::before,
.trace-row-group .trace-merged-row.has-conflict .trace-cell:first-child .trace-item:first-child::before {
  color: var(--ui-warning);
}

:is(.status-badge, .status-pill, .testing-badge, .review-status-pill,
  .mfa-policy-badge, .role-mfa-badge, .workitem-hover-preview-status,
  .project-home-tag, .global-home-tag) {
  display: inline-flex;
  align-items: center;
  align-self: center;
  justify-content: center;
  min-height: 24px;
  padding: 2px 8px;
  border: 1px solid var(--muted);
  border-radius: 999px;
  font: 600 var(--ui-text-small)/18px var(--ui-font);
  background-color: var(--paper);
  color: var(--ink-soft);
}
:is(.status-badge.active, .status-pill[data-mfa-enabled="1"],
  .testing-badge-passed, .testing-badge-finished, .review-status-pill.accepted) {
  color: var(--ui-success); background-color: var(--ui-success-soft); border-color: var(--ui-success);
}
:is(.status-badge.inactive, .testing-badge-failed, .review-status-pill.rejected) {
  color: var(--ui-danger); background-color: var(--ui-danger-soft); border-color: var(--ui-danger);
}
:is(.review-status-pill.pending, .trace-config-toolbar .status-pill.is-dirty) {
  color: var(--ui-warning); background-color: var(--ui-warning-soft); border-color: var(--ui-warning);
}
:is(.testing-badge-accepted, .testing-badge-in_progress, .mfa-policy-badge, .role-mfa-badge) {
  color: var(--ui-info); background-color: var(--ui-info-soft); border-color: var(--ui-info);
}

@media (pointer: coarse) {
  :is(.toolbar, .mini-actions, .comment-editor-toolbar, .wi-inline-rich-toolbar, .template-preview-toolbar) .tool-btn,
  .toolbar .tool-btn:is(.icon-only, .icon-glyph),
  .toolbar .tool-btn.dropdown-icon-btn { min-width: 44px; min-height: 44px; }
  .toolbar .tool-select { min-height: 44px; }
  .workitem-searchbar .work-query-row > button { min-height: 44px; }
  .workitem-searchbar .work-query-remove { min-width: 44px; }
  :is(.primary, .ghost, .danger, .tool-btn, .icon-btn, .icon-action, .tab-btn,
    .app-nav-action, .project-home-shortcut, .project-home-tabs button,
    .global-home-tabs button, .workitem-view-tabs button) { min-height: 44px; }
  :where(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="hidden"]), select):not(:where(#docCanvas *, #templateContent *, .ProseMirror *)) { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  :is(button, input, select, textarea, .work-filters, .work-query-builder) { transition: none; }
}

/* Work-item actions live in the page gutter, outside the content flow. */
:is(.wi-block-below-controls, .wi-review-actions) {
  background: var(--canvas);
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius);
}
.wi-review-actions[hidden] { display: none; }
.wi-review-actions .icon-action { border-color: transparent; }
.wi-block-below-controls {
  opacity: 0;
  pointer-events: none;
}
:is(.wi-block-below-controls, .wi-review-actions) .icon-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  opacity: 1;
  pointer-events: inherit;
}
.wi-block-below-controls .wi-drag-handle { cursor: grab; }
.wi-block-below-controls .wi-remove {
  border-top-color: var(--muted);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.wi-block-below-controls .wi-remove:hover:not(:disabled) { color: var(--ui-danger); }
.wi-block-below-controls .icon-action:disabled { opacity: 0.45; cursor: not-allowed; }
.wi-block:is(:hover, :focus-within, .active, .wi-document-editing, .wi-selected, .ProseMirror-selectednode) > .wi-block-below-controls {
  opacity: 1;
  pointer-events: auto;
}
/* Keep the active grip visible; another rail remains reachable by keyboard. */
.doc-canvas .wi-block > .wi-block-below-controls[data-wi-rail-suppressed] {
  opacity: 0;
  pointer-events: none;
}

/* Shared 20px outline icons; preserve button visibility and responsive layout. */
.btn-icon { width: 20px; height: 20px; flex: 0 0 20px; display: inline-block; vertical-align: middle; }
:is(.icon-btn, .icon-action, .app-nav-icon-action) { width: var(--ui-control-compact); min-width: var(--ui-control-compact); flex-shrink: 0; text-align: center; align-content: center; }

@media (pointer: coarse) { :is(.icon-btn, .icon-action, .app-nav-icon-action, .topbar .brand) { min-width: 44px; min-height: 44px; } }

/* Application branding tokens do not affect document/export branding. */
:root[data-customer-branding] .topbar { color: var(--brand-on-primary); }
:root[data-customer-branding] :is(.primary, .topbar .app-nav-action) { color: var(--brand-on-primary); }
:root[data-customer-branding] .primary:hover { color: var(--brand-on-primary-hover); }
:root[data-customer-branding]:not([data-complementary-branding]) .topbar .app-nav-action:is(.active, [aria-pressed="true"], [aria-expanded="true"]) { color: var(--ink); }
.topbar .brand:has(.customer-brand-logo) { width: auto; flex-basis: auto; }
.topbar .brand-logo.customer-brand-logo { width: auto; max-width: 160px; height: 36px; }
.login-title .brand-logo.customer-brand-logo { width: auto; max-width: 220px; height: 52px; }

.app-branding-scheme { border: 2px solid var(--muted); border-radius: var(--ui-radius); background: var(--canvas); color: var(--ink); }
.app-branding-scheme[aria-pressed="true"] { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.app-branding-swatches { border: 1px solid var(--muted); border-radius: var(--ui-radius); }

/* Settings scope identity: shared tokens, text labels and icon shapes. */
[data-settings-scope="GLOBAL"] {
  --settings-scope-accent: var(--ui-scope-global);
  --settings-scope-background: var(--ui-scope-global-soft);
}
[data-settings-scope="PROJECT"] {
  --settings-scope-accent: var(--ui-scope-project);
  --settings-scope-background: var(--ui-scope-project-soft);
}

.config-sidebar-scope .ghost {
  border-color: transparent;
  box-shadow: none;
}

.settings-hub-sidebar .config-sidebar-scope .ghost[data-settings-scope][aria-pressed="true"],
.settings-hub-sidebar .config-sidebar-scope .ghost[data-settings-scope][aria-pressed="true"]:hover {
  color: var(--settings-scope-accent);
  background: var(--settings-scope-background);
  border-color: transparent;
  font-weight: 600;
}

.settings-hub-group-title, .settings-hub-section h2 {
  display: flex; align-items: center; gap: var(--ui-space-2);
  overflow-wrap: anywhere;
}
.settings-hub-group-title {
  margin: 0 12px 4px; color: var(--settings-scope-accent);
  font-size: var(--ui-text); font-weight: 600;
}
.settings-hub-group-title > .btn-icon { flex-shrink: 0; }
.settings-hub-group-description, .settings-hub-nav-text small {
  color: var(--ink-soft); font-size: var(--ui-text-small); font-weight: 400;
}
.settings-hub-group-description { margin: 0 12px 12px; }
.settings-hub-nav-text { display: grid; min-width: 0; }
.settings-hub-nav-group + .settings-hub-nav-group {
  border-top: 1px solid var(--muted); padding-top: var(--ui-space-5);
}
.settings-hub-nav-group .settings-hub-eyebrow { margin-top: var(--ui-space-5); }
.settings-hub-sidebar [data-settings-scope] .ghost[aria-current="page"],
.settings-hub-sidebar [data-settings-scope] .ghost[aria-current="page"]:hover,
.settings-hub-sidebar #settingsHubOverview[aria-current="page"],
.settings-hub-sidebar .profile-navigation .ghost[aria-current="page"],
.settings-hub-sidebar .profile-navigation .ghost[aria-current="page"]:hover {
  background: var(--ui-hover); color: var(--ink); font-weight: 600;
  border-color: transparent; box-shadow: none;
}
.settings-hub-sidebar [data-settings-scope] .ghost:hover:not(:disabled) {
  background: var(--ui-hover); color: var(--ink);
}

.settings-administration .ghost:hover:not(:disabled) {
  background: var(--ui-hover);
  color: var(--ink);
}

.settings-detail-content { background: var(--canvas); }

.document-config-check.field {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--ui-space-2);
  padding: var(--ui-space-2) 0;
}

.document-config-check input[type="checkbox"] {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  min-height: 0;
  margin: 0;
}
.settings-scope-badge {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  padding: 4px 9px; border-radius: 20px;
  font: 400 var(--ui-text-small)/18px var(--ui-font);
  color: var(--settings-scope-accent); background: var(--settings-scope-background);
  overflow-wrap: anywhere; text-align: left;
}
.settings-scope-badge > .btn-icon { width: 16px; height: 16px; flex: 0 0 16px; }
.config-master-item.settings-hub-card { background: var(--canvas); }
.settings-hub-card-text { min-width: 0; }
.settings-hub-section h2 > .btn-icon { color: var(--settings-scope-accent); flex-shrink: 0; }
.settings-scope-impact {
  flex: 0 0 auto; padding: 12px 16px;
  border-radius: var(--ui-radius);
  background: var(--settings-scope-background); color: var(--ink);
  overflow-wrap: anywhere;
}
.settings-scope-impact strong { font-size: var(--ui-text); font-weight: 600; }
.settings-scope-impact p { margin: 3px 0 0; font-size: var(--ui-text-small); color: var(--ink-soft); }
.config-reuse-host { border: 0; border-radius: 0; margin: 0; padding: 0; }
.config-reuse-host > summary { display: none; }
.config-reuse-warning { color: var(--ui-warning); background: var(--ui-warning-soft); padding: var(--ui-space-3); border-radius: var(--ui-radius); }
.settings-detail-header { flex: 0 0 auto; }
#settingsDetailView:has(#templateManagerModal[data-settings-inline]:not(.settings-inline-suspended)) > .settings-scope-impact {
  margin: 0 16px 8px;
}
@media (max-width: 640px) {
  .settings-detail-view { gap: 5px; }
  .settings-detail-header { gap: 8px; }
  .settings-detail-header h1 { font-size: 24px; }
  .settings-scope-impact { padding: 10px 12px; }
}

/* Local SVG masks inherit the active text color. Majesticons are MIT licensed. */
.icon {
  background-color: currentColor;
  mask: var(--app-icon) center / contain no-repeat;
  -webkit-mask: var(--app-icon) center / contain no-repeat;
}
.btn-icon[data-icon="home"] { mask-image: url("/icons/majesticons/home-line.svg"); -webkit-mask-image: url("/icons/majesticons/home-line.svg"); }
.btn-icon[data-icon="doc"] { mask-image: url("/icons/majesticons/document-line.svg"); -webkit-mask-image: url("/icons/majesticons/document-line.svg"); }
.btn-icon[data-icon="eye"] { mask-image: url("/icons/majesticons/eye-line.svg"); -webkit-mask-image: url("/icons/majesticons/eye-line.svg"); }
.btn-icon[data-icon="external"] { mask-image: url("/icons/majesticons/open-line.svg"); -webkit-mask-image: url("/icons/majesticons/open-line.svg"); }
.btn-icon[data-icon="copy"] { mask-image: url("/icons/majesticons/clipboard-line.svg"); -webkit-mask-image: url("/icons/majesticons/clipboard-line.svg"); }
.btn-icon[data-icon="play"] { mask-image: url("/icons/majesticons/play-circle-line.svg"); -webkit-mask-image: url("/icons/majesticons/play-circle-line.svg"); }
.btn-icon[data-icon="flag"] { mask-image: url("/icons/majesticons/flag-line.svg"); -webkit-mask-image: url("/icons/majesticons/flag-line.svg"); }
.btn-icon[data-icon="lock"] { mask-image: url("/icons/majesticons/lock-line.svg"); -webkit-mask-image: url("/icons/majesticons/lock-line.svg"); }
.btn-icon[data-icon="pause"] { mask-image: url("/icons/majesticons/pause-circle-line.svg"); -webkit-mask-image: url("/icons/majesticons/pause-circle-line.svg"); }
.btn-icon[data-icon="archive"] { mask-image: url("/icons/majesticons/box-line.svg"); -webkit-mask-image: url("/icons/majesticons/box-line.svg"); }
.btn-icon[data-icon="back"] { mask-image: url("/icons/majesticons/arrow-left-line.svg"); -webkit-mask-image: url("/icons/majesticons/arrow-left-line.svg"); }
.btn-icon[data-icon="list"] { mask-image: url("/icons/majesticons/list-box-line.svg"); -webkit-mask-image: url("/icons/majesticons/list-box-line.svg"); }
.btn-icon[data-icon="trace"] { mask-image: url("/icons/majesticons/git-compare-line.svg"); -webkit-mask-image: url("/icons/majesticons/git-compare-line.svg"); }
.btn-icon[data-icon="link"] { mask-image: url("/icons/majesticons/link-line.svg"); -webkit-mask-image: url("/icons/majesticons/link-line.svg"); }
/* Two columns of the installed three-dot icon form the six-dot drag grip. */
.btn-icon[data-icon="move"] {
  mask-image: url("/icons/majesticons/more-menu-vertical-line.svg"), url("/icons/majesticons/more-menu-vertical-line.svg");
  -webkit-mask-image: url("/icons/majesticons/more-menu-vertical-line.svg"), url("/icons/majesticons/more-menu-vertical-line.svg");
  mask-position: calc(50% - 3px) center, calc(50% + 3px) center;
  -webkit-mask-position: calc(50% - 3px) center, calc(50% + 3px) center;
  mask-size: 24px 24px;
  -webkit-mask-size: 24px 24px;
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
}
.btn-icon[data-icon="vars"] { mask-image: url("/icons/majesticons/curly-braces-line.svg"); -webkit-mask-image: url("/icons/majesticons/curly-braces-line.svg"); }
.btn-icon[data-icon="search"] { mask-image: url("/icons/majesticons/search-line.svg"); -webkit-mask-image: url("/icons/majesticons/search-line.svg"); }
.btn-icon[data-icon="filter"] { mask-image: url("/icons/majesticons/filter-line.svg"); -webkit-mask-image: url("/icons/majesticons/filter-line.svg"); }
.btn-icon[data-icon="users"] { mask-image: url("/icons/majesticons/users-line.svg"); -webkit-mask-image: url("/icons/majesticons/users-line.svg"); }
.btn-icon[data-icon="grid"] { mask-image: url("/icons/majesticons/view-columns-line.svg"); -webkit-mask-image: url("/icons/majesticons/view-columns-line.svg"); }
.btn-icon[data-icon="star"] { mask-image: url("/icons/majesticons/award-line.svg"); -webkit-mask-image: url("/icons/majesticons/award-line.svg"); }
.btn-icon[data-icon="pin"] { mask-image: url("/icons/majesticons/pin-line.svg"); -webkit-mask-image: url("/icons/majesticons/pin-line.svg"); }
.btn-icon[data-icon="user"] { mask-image: url("/icons/majesticons/user-line.svg"); -webkit-mask-image: url("/icons/majesticons/user-line.svg"); }
.btn-icon[data-icon="logout"] { mask-image: url("/icons/majesticons/logout-line.svg"); -webkit-mask-image: url("/icons/majesticons/logout-line.svg"); }
.btn-icon[data-icon="settings"] { mask-image: url("/icons/majesticons/settings-cog-line.svg"); -webkit-mask-image: url("/icons/majesticons/settings-cog-line.svg"); }
.btn-icon[data-icon="help"] { mask-image: url("/icons/majesticons/question-circle-line.svg"); -webkit-mask-image: url("/icons/majesticons/question-circle-line.svg"); }
.btn-icon[data-icon="audit"] { mask-image: url("/icons/majesticons/article-search-line.svg"); -webkit-mask-image: url("/icons/majesticons/article-search-line.svg"); }
.btn-icon[data-icon="backup"] { mask-image: url("/icons/majesticons/hard-drive-line.svg"); -webkit-mask-image: url("/icons/majesticons/hard-drive-line.svg"); }
.btn-icon[data-icon="restore"] { mask-image: url("/icons/majesticons/reload-line.svg"); -webkit-mask-image: url("/icons/majesticons/reload-line.svg"); }
.btn-icon[data-icon="download"] { mask-image: url("/icons/majesticons/arrow-down-line.svg"); -webkit-mask-image: url("/icons/majesticons/arrow-down-line.svg"); }
.btn-icon[data-icon="edit"] { mask-image: url("/icons/majesticons/edit-pen-2-line.svg"); -webkit-mask-image: url("/icons/majesticons/edit-pen-2-line.svg"); }
.btn-icon[data-icon="upload"] { mask-image: url("/icons/majesticons/arrow-up-line.svg"); -webkit-mask-image: url("/icons/majesticons/arrow-up-line.svg"); }
.btn-icon[data-icon="trash"] { mask-image: url("/icons/majesticons/delete-bin-line.svg"); -webkit-mask-image: url("/icons/majesticons/delete-bin-line.svg"); }
.btn-icon[data-icon="save"] { mask-image: url("/icons/majesticons/save-line.svg"); -webkit-mask-image: url("/icons/majesticons/save-line.svg"); }
.btn-icon[data-icon="reload"] { mask-image: url("/icons/majesticons/reload-line.svg"); -webkit-mask-image: url("/icons/majesticons/reload-line.svg"); }
.btn-icon[data-icon="hourglass"] { mask-image: url("/icons/hourglass.svg"); -webkit-mask-image: url("/icons/hourglass.svg"); }
.btn-icon[data-icon="suspect"] { mask-image: url("/icons/majesticons/alert-circle-line.svg"); -webkit-mask-image: url("/icons/majesticons/alert-circle-line.svg"); }
.btn-icon[data-icon="check"] { mask-image: url("/icons/majesticons/clipboard-check-line.svg"); -webkit-mask-image: url("/icons/majesticons/clipboard-check-line.svg"); }
.btn-icon[data-icon="send"] { mask-image: url("/icons/majesticons/send-line.svg"); -webkit-mask-image: url("/icons/majesticons/send-line.svg"); }
.btn-icon[data-icon="close"] { mask-image: url("/icons/majesticons/close-line.svg"); -webkit-mask-image: url("/icons/majesticons/close-line.svg"); }
.btn-icon[data-icon="minimize"] { mask-image: url("/icons/majesticons/minus-line.svg"); -webkit-mask-image: url("/icons/majesticons/minus-line.svg"); }
.btn-icon[data-icon="maximize"] { mask-image: url("/icons/majesticons/arrows-expand-full-line.svg"); -webkit-mask-image: url("/icons/majesticons/arrows-expand-full-line.svg"); }
.btn-icon[data-icon="restore-size"] { mask-image: url("/icons/majesticons/arrows-collapse-full-line.svg"); -webkit-mask-image: url("/icons/majesticons/arrows-collapse-full-line.svg"); }
.btn-icon[data-icon="ai"] { mask-image: url("/icons/majesticons/robot-line.svg"); -webkit-mask-image: url("/icons/majesticons/robot-line.svg"); }
.btn-icon[data-icon="comment"] { mask-image: url("/icons/majesticons/comment-line.svg"); -webkit-mask-image: url("/icons/majesticons/comment-line.svg"); }
.btn-icon[data-icon="plus"] { mask-image: url("/icons/majesticons/plus-line.svg"); -webkit-mask-image: url("/icons/majesticons/plus-line.svg"); }
.btn-icon[data-icon="globe"] { mask-image: url("/icons/majesticons/globe-grid-line.svg"); -webkit-mask-image: url("/icons/majesticons/globe-grid-line.svg"); }
.btn-icon[data-icon="folder"] { mask-image: url("/icons/majesticons/folder-line.svg"); -webkit-mask-image: url("/icons/majesticons/folder-line.svg"); }
.btn-icon[data-icon="project-add"] { mask-image: url("/icons/majesticons/folder-plus-line.svg"); -webkit-mask-image: url("/icons/majesticons/folder-plus-line.svg"); }
.btn-icon[data-icon="chevron-left"] { mask-image: url("/icons/majesticons/chevron-left-line.svg"); -webkit-mask-image: url("/icons/majesticons/chevron-left-line.svg"); }
.btn-icon[data-icon="chevron-right"] { mask-image: url("/icons/majesticons/chevron-right-line.svg"); -webkit-mask-image: url("/icons/majesticons/chevron-right-line.svg"); }
.icon-save { --app-icon: url("/icons/majesticons/save-line.svg"); }
.icon-refresh { --app-icon: url("/icons/majesticons/reload-line.svg"); }
.icon-export { --app-icon: url("/icons/majesticons/arrow-up-line.svg"); }
.icon-undo { --app-icon: url("/icons/majesticons/undo-line.svg"); }
.icon-redo { --app-icon: url("/icons/majesticons/redo-line.svg"); }
.icon-search { --app-icon: url("/icons/majesticons/search-line.svg"); }
.icon-link { --app-icon: url("/icons/majesticons/link-line.svg"); }
.icon-more { --app-icon: url("/icons/majesticons/more-menu-line.svg"); }
.btn-icon[data-icon="more"] { mask-image: url("/icons/majesticons/more-menu-line.svg"); -webkit-mask-image: url("/icons/majesticons/more-menu-line.svg"); }
.icon-highlight { --app-icon: url("/icons/majesticons/edit-pen-4-line.svg"); }
.icon-indent { --app-icon: url("/icons/majesticons/menu-expand-right-line.svg"); }
.icon-outdent { --app-icon: url("/icons/majesticons/menu-expand-left-line.svg"); }
.icon-version { --app-icon: url("/icons/majesticons/git-commit-line.svg"); }
.icon-history { --app-icon: url("/icons/majesticons/clock-line.svg"); }
.icon-fullscreen { --app-icon: url("/icons/majesticons/arrows-expand-full-line.svg"); }
.icon-reviews { --app-icon: url("/icons/majesticons/chat-text-line.svg"); }
.icon-table { --app-icon: url("/icons/majesticons/table-line.svg"); }
.icon-image { --app-icon: url("/icons/majesticons/image-line.svg"); }
.icon-comment { --app-icon: url("/icons/majesticons/comment-line.svg"); }
.icon-requirement { --app-icon: url("/icons/majesticons/article-line.svg"); }
.icon-toc { --app-icon: url("/icons/majesticons/list-box-line.svg"); }
.icon-draw { --app-icon: url("/icons/majesticons/sitemap-line.svg"); }
.icon-braces { --app-icon: url("/icons/majesticons/curly-braces-line.svg"); }
.icon-list { --app-icon: url("/icons/majesticons/radio-list-line.svg"); }
.icon-eraser { --app-icon: url("/icons/majesticons/eraser-line.svg"); }
.icon-brush { --app-icon: url("/icons/format-painter.svg"); }
.icon-ai { --app-icon: url("/icons/majesticons/robot-line.svg"); }
.icon-unlink { --app-icon: url("/icons/majesticons/link-circle-line.svg"); }
.icon-work-item-create { --app-icon: url("/icons/majesticons/file-plus-line.svg"); }
.icon-work-item-reference { --app-icon: url("/icons/majesticons/link-line.svg"); }
.icon-work-items { --app-icon: url("/icons/majesticons/list-box-line.svg"); }
.icon-work-item-metadata { --app-icon: url("/icons/majesticons/info-circle-line.svg"); }
.icon-settings { --app-icon: url("/icons/majesticons/settings-cog-line.svg"); }
.icon-traceability { --app-icon: url("/icons/majesticons/git-compare-line.svg"); }
.icon-figure-list { --app-icon: url("/icons/majesticons/image-multiple-line.svg"); }
.icon-table-list { --app-icon: url("/icons/majesticons/view-rows-line.svg"); }
.icon-break { --app-icon: url("/icons/majesticons/distribute-vertical-line.svg"); }
.icon-toc-panel { --app-icon: url("/icons/majesticons/list-box-line.svg"); }
.icon-list-ol { --app-icon: url("/icons/majesticons/checkbox-list-detail-line.svg"); }
.icon-align-left { --app-icon: url("/icons/majesticons/text-align-left-line.svg"); }
.icon-align-center { --app-icon: url("/icons/majesticons/text-align-center-line.svg"); }
.icon-align-right { --app-icon: url("/icons/majesticons/text-align-right-line.svg"); }
.icon-fit-width { --app-icon: url("/icons/majesticons/arrows-expand-full-line.svg"); }
.btn-icon[data-icon="fit-width"] { mask-image: url("/icons/majesticons/arrows-expand-full-line.svg"); -webkit-mask-image: url("/icons/majesticons/arrows-expand-full-line.svg"); }
.btn-icon[data-icon="history"] { mask-image: url("/icons/majesticons/clock-line.svg"); -webkit-mask-image: url("/icons/majesticons/clock-line.svg"); }
.is-exit .icon-fullscreen { --app-icon: url("/icons/majesticons/arrows-collapse-full-line.svg"); }

/* Text formatting uses the same SVG grid as the other toolbar commands. */
.icon-bold { --app-icon: url("/icons/majesticons/bold-line.svg"); }
.icon-italic { --app-icon: url("/icons/majesticons/italic-line.svg"); }
.icon-underline { --app-icon: url("/icons/majesticons/underline-line.svg"); }
.icon-strike-through { --app-icon: url("/icons/majesticons/strike-through-line.svg"); }
.icon-superscript { --app-icon: url("/icons/superscript.svg"); }
.icon-subscript { --app-icon: url("/icons/subscript.svg"); }
.workitem-load-status {
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink-soft);
  font-size: var(--ui-text-small);
  font-weight: 400;
  line-height: 1.4;
}
.trace-history-progress { color: var(--ink-soft); font-size: var(--ui-text-small); }
.trace-history-progress progress, .trace-ai-progress progress { accent-color: var(--accent); }

/* Template script functions */
#templateFunctionManager, .scripts-function-manager { display: grid; gap: var(--ui-space-3); min-width: 0; }
.scripts-function-fields { display: grid; gap: var(--ui-space-2); min-width: 0; }
.scripts-function-fields .scripts-code { font-family: Consolas, monospace; min-height: 18rem; }
.scripts-help-link { color: var(--accent-2); text-underline-offset: 3px; }
.script-block-controls { margin-block-end: var(--ui-space-2); }
.generated-content-pagination:not([hidden]) {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: var(--ui-space-3);
  margin-block-start: var(--ui-space-2);
}
@media print { .generated-content-pagination { display: none !important; } }
@media print { .script-block-controls { display: none; } }
.scripts-parameter-row { display: flex; flex-wrap: wrap; gap: var(--ui-space-2); align-items: end; }
.scripts-parameter-row .field { flex: 1 1 140px; }
.scripts-preview { flex: 1 0 240px; width: 100%; min-height: 240px; border: 1px solid var(--muted); border-radius: var(--ui-radius); background: var(--paper); }
.script-generated-block { position: relative; }

/* Compact focus actions sit below the document's scrollable page. */
.document-editor-footer {
  --ui-toolbar-icon-size: 16px;
  background: var(--canvas);
  color: var(--ink);
  border-top: 1px solid var(--muted);
  font-family: var(--ui-font);
  font-size: var(--ui-text-small);
}
.doc-editor:has(> .document-editor-footer) > .doc-page {
  border-radius: 0;
}
.document-workitem-context,
.doc-fullscreen-controls {
  color: var(--ink);
  font-family: var(--ui-font);
  font-size: var(--ui-text-small);
}
.document-context-separator,
.document-editor-footer > .doc-fullscreen-controls::before {
  content: '';
  flex: 0 0 1px;
  height: 18px;
  margin-inline: var(--ui-space-1);
  background: var(--muted);
}
.document-workitem-context-position {
  color: color-mix(in srgb, var(--ink) 72%, var(--canvas));
  font-weight: 400;
}
.document-workitem-context:has([data-selection-kind="table"]:not([hidden])) .document-workitem-context-description::before {
  content: '';
  flex: 0 0 var(--ui-toolbar-icon-size);
  height: var(--ui-toolbar-icon-size);
  background: currentColor;
  mask: url('/icons/majesticons/table-line.svg') center / contain no-repeat;
  -webkit-mask: url('/icons/majesticons/table-line.svg') center / contain no-repeat;
}
.document-workitem-context-focus {
  font-weight: 600;
}
.document-workitem-save-actions {
  color: var(--ink);
  background: var(--canvas);
  border-radius: var(--ui-radius-panel);
  box-shadow: 0 6px 24px color-mix(in srgb, var(--ink) 18%, transparent);
  font: var(--ui-text-small)/1.4 var(--ui-font);
}
.workitem-document-conflict {
  color: var(--ink);
  background: var(--ui-warning-soft);
  border: 1px solid var(--ui-warning);
  border-radius: var(--ui-radius);
}
.document-workitem-context .tool-btn,
.doc-fullscreen-controls .tool-btn,
.doc-fullscreen-controls .doc-fit-width-button {
  min-height: var(--ui-control-compact);
  min-width: var(--ui-control-compact);
  font-size: var(--ui-text-small);
}
.document-editor-footer .tool-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ui-space-1);
  padding: 0 var(--ui-space-1);
}
.document-editor-footer .tool-btn.icon-only {
  width: var(--ui-control-compact);
}
@media (max-width: 760px) {
  .document-editor-footer > .doc-fullscreen-controls::before,
  .doc-fullscreen-controls > .document-context-separator,
  .doc-fullscreen-exit .btn-label {
    display: none;
  }
  .doc-fullscreen-controls .doc-fullscreen-exit {
    width: var(--ui-control-compact);
    padding: 0;
  }
}
.doc-zoom-presets {
  font-variant-numeric: tabular-nums;
}
body:not(.doc-editor-fullscreen-mode) #docFullscreenExitBtn {
  display: none;
}
.document-editor-footer .tool-btn[data-toolbar-menu]:not(.icon-only)::after {
  content: '';
  width: 6px;
  height: 6px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  margin-left: var(--ui-space-1);
}
.document-editor-footer :is(.btn-icon, .icon) {
  width: var(--ui-toolbar-icon-size);
  min-width: var(--ui-toolbar-icon-size);
  height: var(--ui-toolbar-icon-size);
  flex: 0 0 var(--ui-toolbar-icon-size);
}
.document-workitem-context .tool-btn[aria-pressed="true"] {
  color: var(--accent-2);
  background: var(--ui-selected);
}

/* Document and work-item sidebars share header geometry and field typography. */
.workitem-workspace-details .workitem-details-header .workitem-details-heading {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 var(--ui-space-2);
  font-size: 20px;
}
.workitem-workspace-details :is(.workitem-responsibility-editor, .work-item-custom-fields) > .field {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 1fr auto;
  align-items: start;
  align-self: stretch;
  gap: var(--ui-space-2);
}
.workitem-workspace-details :is(.workitem-responsibility-editor, .work-item-custom-fields) > .field > span { font-weight: 600; min-height: 20px; }
.workitem-workspace-details :is(.workitem-responsibility-editor, .work-item-custom-fields) > .field > span:not(.field-label-with-icon)::after,
.workitem-workspace-details .field-label-with-icon > span:last-child::after { content: ':'; }
.workitem-workspace-details .work-item-custom-fields > .field > .workitem-boolean-field::after { content: none; }
.workitem-workspace-details .field .workitem-searchable-picker-trigger {
  display: flex;
  align-items: center;
  height: var(--ui-control-height);
  padding-block: 0;
  line-height: 20px;
}
@media (pointer: coarse), (max-width: 600px) {
  .workitem-workspace-details .workitem-details-form .field :is(input:not([type="checkbox"]):not([type="radio"]), select, .workitem-searchable-picker-trigger) { min-height: 44px; }
}
.workitem-boolean-field { display: inline-flex; align-items: center; gap: var(--ui-space-2); }
.workitem-workspace-details .workitem-boolean-label::after { content: ':'; }
.workitem-revision-indicator { display: inline-flex; align-items: center; align-self: center; color: var(--ink-soft); }
.workitem-revision-indicator:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.workitem-workspace-details .workitem-details-heading > .type-icon {
  flex: none;
}
.workitem-workspace-details .workitem-details-heading > .workitem-details-code,
.testing-item-detail-header .workitem-details-code {
  display: inline;
  flex: none;
}
.workitem-workspace-details .workitem-details-header:has(.workitem-header-links),
.testing-item-detail-header {
  background: var(--ui-workitem-context-soft);
  border-radius: 0;
}
.workitem-workspace-details .workitem-details-header .workitem-details-code,
.workitem-workspace-details .workitem-header-links .workitem-header-link,
.workitem-workspace-details .workitem-header-links .workitem-header-add,
.workitem-workspace-details .workitem-header-links .workitem-header-more,
.testing-item-detail-header .workitem-details-code {
  color: var(--ui-workitem-context-ink);
}
.workitem-workspace-details .workitem-header-links {
  font-family: var(--ui-font);
  font-size: var(--ui-text-small);
}
.workitem-workspace-details .workitem-header-links .workitem-header-link {
  font-weight: 600;
}
.workitem-workspace-details .workitem-header-empty,
.workitem-workspace-details .workitem-header-direction {
  color: var(--ink-soft);
}
.workitem-workspace-details .workitem-header-tail .workitem-header-more {
  border-color: transparent;
  background: transparent;
  padding: 2px 4px;
  min-height: var(--ui-control-compact);
  font-size: var(--ui-text-small);
}
.workitem-workspace-details .workitem-header-links .workitem-header-link:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.workitem-workspace-details .workitem-header-tail :is(.workitem-header-more, .workitem-header-add):hover:not(:disabled) {
  background: color-mix(in srgb, var(--ui-workitem-context-ink) 14%, var(--canvas));
}
@media (pointer: coarse), (max-width: 600px) {
  .workitem-workspace-details .workitem-header-tail :is(.workitem-header-more, .workitem-header-add) {
    min-width: 44px;
    min-height: 44px;
  }
}
.workitem-responsibility-editor > .field {
  margin: 0;
}
.workitem-responsibility-editor > .field > span {
  display: flex;
  align-items: center;
  min-height: 20px;
  margin-bottom: 0;
}
.workitem-responsibility-editor .reviewer-pick-list {
  min-height: var(--ui-control-height);
}
.workitem-details-document :is(input, select, textarea, .workitem-custom-rich-editor) {
  background: var(--canvas);
}
.workitem-details-document .workitem-document-fields-title {
  color: var(--ink);
  font-size: var(--ui-text);
}

.wi-workflow-lock .btn-icon {
  width: var(--ui-space-4);
  height: var(--ui-space-4);
  flex-basis: var(--ui-space-4);
}

/* Work-item content keeps its document appearance while its editor is active. */
:is(.wi-document-editing, .wi-document-prepared) .wi-inline-title-input {
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
:is(.wi-document-editing, .wi-document-prepared) .wi-inline-desc-host {
  border: 0;
  border-radius: 0;
  background: transparent;
}
:is(.wi-document-editing, .wi-document-prepared) .wi-inline-rich-surface,
:is(.wi-document-editing, .wi-document-prepared) .wi-inline-rich-surface .ProseMirror {
  background: transparent;
  color: inherit;
}
:is(.wi-document-editing, .wi-document-prepared) .wi-inline-field-label {
  font-size: inherit;
  color: inherit;
}
.wi-document-editing .wi-inline-title-input:focus {
  outline: none;
  box-shadow: none;
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-underline-offset: .2em;
}
/* The full block frame supplies focus indication without a second editor frame. */
.wi-document-editing .wi-inline-rich-surface:focus-visible {
  outline: none;
}
.doc-canvas :is(.wi-document-editing, .wi-document-prepared) table.wi-inline-table,
.doc-canvas :is(.wi-document-editing, .wi-document-prepared) table.wi-inline-table :is(th, td) {
  border-color: var(--doc-table-border);
}
.doc-canvas :is(.wi-document-editing, .wi-document-prepared) table > tbody > tr[data-table-header="true"] > th {
  background: var(--doc-table-header-bg);
  color: var(--doc-table-header-text);
}
@media (pointer: coarse) {
  .document-workitem-context .tool-btn,
  .doc-fullscreen-controls :is(.tool-btn, .doc-fit-width-button) {
    min-width: 44px;
    min-height: 44px;
  }
}
#docCanvas .script-generated-block.ProseMirror-selectednode,
#templateContent .script-generated-block:focus { outline: 2px solid var(--accent); outline-offset: 2px; }
/* Traceability AI uses the shared modal, field and action styles. */
#traceAiModal { width: 80vw; height: 80vh; max-height: calc(100vh - 32px); }
#traceAiModal .modal-body { display: flex; flex-direction: column; gap: var(--ui-space-2); }
#traceAiModal .modal-body > * { flex-shrink: 0; }
#traceAiModal .modal-body > .trace-ai-results { flex-shrink: 1; }
#traceAiModal.trace-ai-maximized { width: calc(100vw - 32px); height: calc(100dvh - 32px); inset: 16px auto auto 50%; transform: translateX(-50%); }
.trace-ai-window-actions { display: flex; gap: var(--ui-space-2); margin-left: auto; }
#traceAiModal .modal-header > [data-trace-ai-close] { order: 2; }
.trace-ai-new-tab { margin-right: auto; }
.trace-ai-dock { position: fixed; bottom: var(--ui-space-2); left: var(--ui-space-3); z-index: 49; display: flex; max-width: calc(100vw - 24px); }
.trace-ai-dock[hidden] { display: none; }
.trace-ai-dock-tab { position: relative; overflow: hidden; display: flex; align-items: center; gap: var(--ui-space-2); min-width: 0; text-align: left; }
.trace-ai-dock-tab::before { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--trace-ai-progress, 0%); background: var(--ui-info-soft); transition: width 250ms ease; pointer-events: none; }
.trace-ai-dock[data-status="complete"] .trace-ai-dock-tab::before { background: var(--ui-success-soft); }
.trace-ai-dock[data-status="error"] .trace-ai-dock-tab::before { background: var(--ui-danger-soft); }
.trace-ai-dock-tab > span { position: relative; }
.trace-ai-dock-label { display: flex; flex-direction: column; gap: var(--ui-space-1); min-width: 0; }
.trace-ai-dock-tab .meta-subtle { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .trace-ai-dock-tab::before { transition: none; } }
.trace-ai-setup { display: grid; align-content: start; gap: var(--ui-space-2); flex-shrink: 0; }
.trace-ai-setup > p, .trace-ai-summary p { margin: 0; }
.trace-ai-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ui-space-2); }
.trace-ai-fields .field { margin: 0; min-width: 0; }
.trace-ai-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ui-space-2); flex-shrink: 0; }
.trace-ai-summary > p { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trace-ai-help { font-size: var(--ui-text-small); }
.trace-ai-help > summary { cursor: pointer; white-space: nowrap; }
.trace-ai-help[open] { flex-basis: 100%; order: 5; }
.trace-ai-help > p { margin: var(--ui-space-1) 0 0; }
.trace-ai-setup[hidden], .trace-ai-summary[hidden] { display: none; }
.trace-ai-sources { display: grid; gap: var(--ui-space-2); max-height: 140px; overflow: auto; }
.trace-ai-source { overflow-wrap: anywhere; }
.trace-ai-results { display: flex; flex-direction: column; gap: var(--ui-space-2); flex: 1; min-height: 240px; }
.trace-ai-table-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ui-space-2); flex-shrink: 0; }
.trace-ai-table-toolbar > h3 { margin: 0; font-size: var(--ui-text); }
.trace-ai-table-count { margin: 0; }
.trace-ai-table-toolbar .trace-ai-priority-field { display: flex; align-items: center; gap: var(--ui-space-2); margin: 0 0 0 auto; width: auto; }
.trace-ai-priority-field > span { font-size: var(--ui-text-small); }
.trace-ai-priority-field > select { width: auto; min-width: 150px; }
.trace-ai-results > h3, .trace-ai-results > p { margin: 0; }
.trace-ai-results > .field { max-width: 240px; margin: 0; }
.trace-ai-selection-actions { display: flex; flex-wrap: wrap; gap: var(--ui-space-2); }
.trace-ai-modes { display: flex; flex-wrap: wrap; gap: var(--ui-space-3); border: 1px solid var(--border-soft); border-radius: var(--ui-radius); }
.trace-ai-results[hidden] { display: none; }
.trace-ai-table-wrapper { min-width: 0; min-height: 120px; max-width: 100%; max-height: none; }
.trace-ai-table { min-width: 800px; width: 100%; table-layout: fixed; }
.trace-ai-table th:first-child { width: 44px; }
.trace-ai-table th:nth-child(2), .trace-ai-table th:nth-child(3) { width: 140px; }
.trace-ai-table th:nth-child(5) { width: 96px; }
.trace-ai-table th:nth-child(6) { width: 104px; }
.trace-ai-table td { vertical-align: top; overflow-wrap: anywhere; white-space: normal; }
.trace-ai-table td p { margin: 0 0 var(--ui-space-1); }
.trace-ai-activity { display: grid; gap: var(--ui-space-1); }
.trace-ai-status { margin: 0; }
.trace-ai-status:empty { display: none; }
.trace-ai-progress { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--ui-space-1) var(--ui-space-2); }
.trace-ai-progress > span:last-child { grid-column: 2; grid-row: 1; text-align: right; }
.trace-ai-progress[hidden] { display: none; }
.trace-ai-progress progress { width: 100%; height: var(--ui-space-2); grid-column: 1 / -1; }
@media (max-width: 700px) {
  #traceAiModal { width: calc(100vw - 32px); height: calc(100dvh - 32px); inset: 16px auto auto 50%; }
  .trace-ai-fields { grid-template-columns: minmax(0, 1fr); }
  .trace-ai-summary { align-items: start; }
  .trace-ai-progress { grid-template-columns: 1fr; }
  .trace-ai-progress > span:last-child { grid-column: 1; grid-row: 2; text-align: left; }
  .trace-ai-priority-field > span { display: none; }
  .trace-ai-table-toolbar .trace-ai-priority-field { margin-left: 0; }
  #traceAiModal .modal-header { flex-wrap: wrap; gap: var(--ui-space-1); }
  #traceAiModal .modal-actions { flex-wrap: wrap; }
}
.ai-chat-sidebar, .ai-chat-conversation {
  background: var(--canvas);
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius-panel);
}
.ai-chat-sidebar { padding: var(--ui-space-3); background: var(--paper); }
.ai-chat-sidebar-title { margin: var(--ui-space-1) var(--ui-space-2) var(--ui-space-2); font-size: var(--ui-text); font-weight: 600; }
.ai-chat-header { border-bottom: 1px solid var(--muted); }
.ai-chat-header h2 { font-size: 18px; line-height: 1.3; }
.ai-chat-identity { display: grid; place-items: center; width: var(--ui-control-height); height: var(--ui-control-height); flex: none; background: var(--paper); border-radius: var(--ui-radius); }
.ai-chat-project { color: var(--ink-soft); font-size: var(--ui-text-small); }
.ai-chat-list-item[aria-pressed="true"] { background: var(--ui-selected); }
.ai-chat-workspace .ai-chat-list-item { border-color: transparent; }
.ai-chat-workspace .ai-chat-list-item[aria-pressed="true"] { border-color: var(--accent); }
.ai-chat-message { font-size: calc(var(--ui-text) + 2px); line-height: 1.65; }
.ai-chat-message-heading { display: flex; align-items: center; gap: var(--ui-space-2); margin-bottom: var(--ui-space-2); color: var(--ink-soft); font-size: var(--ui-text-small); }
.ai-chat-message-heading .btn-icon { width: 18px; height: 18px; }
.ai-chat-message-heading strong { color: var(--ink); font-weight: 600; }
.ai-chat-message-user { background: var(--paper); border: 1px solid var(--muted); border-radius: var(--ui-radius-panel); }
.ai-chat-message-assistant { background: transparent; border: 0; }
.ai-chat-work-item-preview { max-width: 850px; margin: 0 auto var(--ui-space-4); padding: var(--ui-space-4); background: var(--paper); border: 1px solid var(--muted); font-size: calc(var(--ui-text) + 2px); border-radius: var(--ui-radius); }
.ai-chat-work-item-preview .wi-desc { white-space: pre-wrap; line-height: 1.65; overflow-wrap: anywhere; }
.ai-chat-work-item-preview .work-title { font-size: 18px; line-height: 1.4; margin-bottom: var(--ui-space-3); }
.ai-chat-work-item-title { min-width: 0; overflow-wrap: anywhere; }
.ai-chat-work-item-meta { color: var(--ink-soft); font-size: var(--ui-text-small); margin-bottom: var(--ui-space-2); }
.ai-chat-work-item-links { display: flex; flex-wrap: wrap; gap: var(--ui-space-3); margin-top: var(--ui-space-4); padding-top: var(--ui-space-3); border-top: 1px solid var(--muted); }

.ai-chat-document-actions { min-width: 0; }
.ai-chat-document-actions > .doc-ai-review-actions { margin-block: var(--ui-space-2); }
.ai-chat-proposal-cards { display: grid; gap: var(--ui-space-2); white-space: normal; }
.ai-chat-proposal-cards .doc-ai-proposal-item,
.ai-chat-proposal-cards .doc-ai-proposal-head,
.ai-chat-proposal-cards .doc-ai-proposal-field { min-width: 0; }
.ai-chat-proposal-cards .doc-ai-proposal-field { display: grid; gap: var(--ui-space-1); }
.ai-chat-work-item-criteria-label { display: block; margin-top: var(--ui-space-3); }
.ai-chat-markdown { max-width: 74ch; line-height: 1.7; }
.ai-chat-markdown > :first-child { margin-top: 0; }
.ai-chat-markdown > :last-child { margin-bottom: 0; }
.ai-chat-markdown :is(p, ul, ol, pre, blockquote, table) { margin: var(--ui-space-3) 0; }
.ai-chat-markdown :is(ul, ol) { padding-left: var(--ui-space-5); }
.ai-chat-markdown li { padding-inline-start: var(--ui-space-1); margin: var(--ui-space-2) 0; }
.ai-chat-markdown li::marker { color: var(--ink-soft); }
.ai-chat-markdown li > p { margin: var(--ui-space-1) 0; }
.ai-chat-markdown :is(h1, h2, h3, h4, h5, h6) { line-height: 1.35; margin: var(--ui-space-5) 0 var(--ui-space-2); font-weight: 600; text-wrap: balance; }
.ai-chat-markdown h1 { font-size: 22px; }
.ai-chat-markdown h2 { font-size: 20px; }
.ai-chat-markdown :is(h3, h4, h5, h6) { font-size: 18px; }
.ai-chat-markdown code { background: var(--paper); border-radius: var(--ui-radius); padding: 0 var(--ui-space-1); font-family: "Courier New", monospace; font-size: .9em; color: inherit; }
.ai-chat-markdown pre { background: var(--paper); border: 1px solid var(--muted); border-radius: var(--ui-radius); padding: var(--ui-space-3); white-space: pre-wrap; overflow-wrap: anywhere; font-variant-ligatures: none; tab-size: 4; }
.ai-chat-markdown pre code { padding: 0; background: transparent; }
.ai-chat-markdown [data-chat-language="c"] pre { background: var(--ui-code-background); color: var(--ui-code-ink); }
.ai-chat-markdown [data-chat-language="c"] code { font-family: "Cascadia Code", "Consolas", "Courier New", monospace; }
.ai-chat-markdown blockquote { margin-inline: 0; padding-inline-start: var(--ui-space-3); border-inline-start: 1px solid var(--muted); color: var(--ink-soft); }
.ai-chat-markdown table { width: 100%; max-width: 100%; table-layout: fixed; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.ai-chat-markdown :is(th, td) { border-bottom: 1px solid var(--muted); padding: var(--ui-space-2) var(--ui-space-3); text-align: left; vertical-align: top; }
.ai-chat-markdown th { background: var(--paper); font-weight: 600; }
.ai-chat-markdown hr { border: 0; border-top: 1px solid var(--muted); margin: var(--ui-space-5) 0; }
.ai-chat-markdown a, .ai-chat-work-item-links a { color: var(--accent-2); text-underline-offset: 3px; }
.ai-chat-message-progress, .ai-chat-context { color: var(--ink-soft); font-size: var(--ui-text-small); }
.ai-chat-message-progress { border-inline-start: 1px solid var(--muted); }
.ai-chat-day-timestamp { color: var(--ink-soft); font-size: var(--ui-text-small); font-variant-numeric: tabular-nums; }
.ai-chat-composer { border-top: 1px solid var(--muted); }
.ai-chat-composer textarea { background: var(--paper); font-size: calc(var(--ui-text) + 2px); line-height: 1.5; caret-color: var(--accent); }
.ai-chat-composer textarea:focus { background: var(--canvas); }
.ai-chat-composer [data-chat-status] { color: var(--ink-soft); font-size: var(--ui-text-small); }
.ai-chat-composer [data-chat-status].form-error { color: var(--ui-danger); }
.ai-chat-empty { color: var(--ink-soft); font-size: calc(var(--ui-text) + 2px); line-height: 1.6; }
.ai-chat-empty h3 { margin: var(--ui-space-4) 0 var(--ui-space-2); color: var(--ink); font-size: 28px; font-weight: 600; line-height: 1.2; text-wrap: balance; }
.ai-chat-empty p { max-width: 54ch; margin: 0 0 var(--ui-space-5); }
.ai-chat-messages[aria-busy="true"] .ai-chat-message-progress:last-of-type { border-inline-start-color: var(--accent); }
.ai-chat-task-dock { left: auto; right: var(--ui-space-4); bottom: var(--ui-space-4); width: min(360px, calc(100vw - 32px)); align-items: flex-start; gap: var(--ui-space-1); }
.ai-chat-task-dock .trace-ai-dock-tab { flex: 1; min-width: 0; text-decoration: none; }
.ai-chat-task-dock .trace-ai-dock-label { overflow-wrap: anywhere; }
.ai-chat-task-dock > button { flex: none; min-width: 44px; min-height: 44px; }
.ai-chat-task-dock[data-status="complete"] .trace-ai-dock-tab { background: var(--ui-success-soft); border-color: var(--ui-success); color: var(--ink); }
.ai-chat-task-dock[data-status="error"] .trace-ai-dock-tab { background: var(--ui-danger-soft); border-color: var(--ui-danger); }
.ai-chat-traceability { container: chat-trace / inline-size; }
.ai-chat-traceability :is(.trace-ai-sources, .trace-ai-table-wrapper) { height: auto; max-height: none; overflow: visible; scrollbar-gutter: auto; }
.ai-chat-traceability .trace-ai-results { min-height: 0; flex: none; }
.ai-chat-traceability .trace-ai-table { min-width: 0; }
.ai-chat-traceability .trace-ai-table th:nth-child(2), .ai-chat-traceability .trace-ai-table th:nth-child(3) { width: 16%; }
.ai-chat-traceability .trace-ai-table th button { min-width: 0; width: 100%; white-space: normal; overflow-wrap: anywhere; }
.ai-chat-traceability .trace-ai-table th:nth-child(n+5) button { padding-inline: var(--ui-space-1); }
.ai-chat-traceability .trace-ai-summary > p { overflow: visible; white-space: normal; }
@container chat-trace (max-width: 720px) {
  .ai-chat-traceability .trace-ai-table, .ai-chat-traceability .trace-ai-table :is(thead, tbody) { display: block; width: 100%; }
  .ai-chat-traceability .trace-ai-table thead tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ai-chat-traceability .trace-ai-table tbody tr { display: grid; grid-template-columns: minmax(0, 1fr); padding: var(--ui-space-3); gap: var(--ui-space-3); border-bottom: 1px solid var(--muted); }
  .ai-chat-traceability .trace-ai-table :is(th, td) { display: block; width: auto; min-width: 0; }
  .ai-chat-traceability .trace-ai-table tbody td { padding: 0; border: 0; overflow-wrap: anywhere; }
  .ai-chat-traceability .trace-ai-table td::before { display: block; content: attr(data-label); margin-bottom: var(--ui-space-1); color: var(--ink-soft); font-size: var(--ui-text-small); font-weight: 600; }
}
@media (max-width: 900px) {
  .ai-chat-workspace .ai-chat-sidebar-actions { flex-direction: row; }
  .ai-chat-workspace .ai-chat-mobile-action { display: inline-flex; }
  .ai-chat-workspace button { min-height: 44px; min-width: 44px; }
  .ai-chat-composer textarea { font-size: 16px; }
}
@media (pointer: coarse) {
  .ai-chat-workspace button { min-height: 44px; min-width: 44px; }
}

/* Public login presentation. Scoped to the split login; reset/lock pages retain
   their existing card layout. Tokens keep saved customer themes effective. */
.login-modern { --ui-control-height: 52px; background: var(--canvas); }
.login-modern .login-intro { background: var(--paper); }
.login-modern .login-access, .login-modern .login-legal-footer { background: var(--canvas); }
.login-modern .login-brand { font: 700 30px/1.2 var(--ui-font); letter-spacing: -.5px; }
.login-modern .login-intro h1 { font: 700 clamp(32px, 3.6vw, 58px)/1.15 var(--ui-font); letter-spacing: -1.4px; }
.login-modern .login-intro p { font-size: clamp(17px, 1.6vw, 24px); line-height: 1.5; color: var(--ink-soft); }
.login-modern .login-heading h2 { font: 700 clamp(32px, 3.1vw, 48px)/1.15 var(--ui-font); letter-spacing: -1px; }
.login-modern .login-description { font-size: 21px; line-height: 1.5; color: var(--ink-soft); }
.login-modern .field > :is(span, label) { font-size: 16px; font-weight: 600; }
.login-modern .login-form input:not([type="checkbox"], [type="hidden"]) { font-size: 17px; }
.login-modern .login-form input::placeholder { color: color-mix(in srgb, var(--ink) 45%, var(--canvas)); opacity: 1; }
.login-modern .login-remember-row { font-size: 15px; }
.login-modern .login-remember-row input { width: 20px; height: 20px; }
.login-modern .ghost-link { color: var(--accent-2); font-size: 15px; padding: 0; min-height: 44px; }
.login-modern .login-language .tab-btn { min-height: 44px; font-size: 16px; }
.login-modern .login-submit { font-size: 17px; }
.login-modern .login-password-toggle { min-height: 44px; min-width: 44px; height: 44px; color: var(--ink-soft); }
.login-eye-icon { display: inline-block; width: 22px; height: 22px; background: currentColor; mask: url('/icons/majesticons/eye-line.svg') center / contain no-repeat; }
.login-password-toggle[aria-pressed="true"] .login-eye-icon { mask-image: url('/icons/majesticons/eye-off-line.svg'); }
.login-modern #loginPasswordResetSuccess { display: flex; align-items: center; gap: var(--ui-space-3); padding: var(--ui-space-4); font-size: 15px; line-height: 1.5; background: var(--ui-success-soft); border: 1px solid color-mix(in srgb, var(--ui-success) 20%, var(--canvas)); border-radius: var(--ui-radius); }
.login-modern #loginPasswordResetSuccess::before { content: ''; width: 28px; height: 28px; flex-shrink: 0; background: var(--ui-success); mask: url('/icons/majesticons/clipboard-check-line.svg') center / contain no-repeat; }
.login-modern .login-trace-lines path { stroke: var(--muted); stroke-width: 2; }
.login-modern .login-trace-card { background: var(--canvas); border: 1px solid color-mix(in srgb, var(--muted) 65%, var(--canvas)); border-radius: var(--ui-radius-panel); box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 7%, transparent); }
.login-modern .login-trace-card strong { font-size: 3.167cqw; line-height: 1.2; font-weight: 700; }
.login-modern .login-trace-placeholder { background: color-mix(in srgb, var(--ink) 13%, var(--canvas)); border-radius: var(--ui-radius); }
.login-modern .login-trace-icon { background: var(--accent); mask: url('/icons/majesticons/document-line.svg') center / contain no-repeat; }
.login-modern .login-trace-icon.requirement { mask-image: url('/icons/majesticons/article-line.svg'); }
.login-modern .login-trace-icon.verification { mask-image: url('/icons/majesticons/shield-line.svg'); }
.login-modern .login-trace-dot { fill: var(--accent); stroke: var(--canvas); stroke-width: 2; }
.login-modern .login-legal-footer { font-size: 13px; }
.login-modern [hidden] { display: none; }
@media (max-width: 800px) {
  .login-modern .login-brand { font-size: 24px; }
  .login-modern .login-intro h1 { font-size: 30px; letter-spacing: -.6px; }
  .login-modern .login-intro p { font-size: 16px; }
  .login-modern .login-heading h2 { font-size: 32px; }
  .login-modern .login-description { font-size: 18px; }
}

/* Explicit bulk fields reuse the detail workspace and native checkbox semantics. */
.bulk-field-heading > label { font-size: var(--ui-text); font-weight: 700; }
.bulk-field-change { color: var(--accent-2); }
.bulk-field-content > small { color: var(--ink-soft); font-size: var(--ui-text-small); }
.bulk-field-content > .bulk-replace-warning { color: var(--ui-warning); font-weight: 600; }
.bulk-field-content > :disabled { color: var(--ink-soft); background-color: var(--paper); }
.bulk-field-row:has(> .bulk-field-enable:checked) .bulk-field-content > :is(input, select, textarea) { border-color: var(--accent); }
.bulk-reviewer-list { background: var(--canvas); border-color: var(--muted); border-radius: var(--ui-radius); }
.bulk-details-footer { background: var(--paper); border-top: 1px solid var(--muted); padding: var(--ui-space-4); }
.bulk-reviewer-list small { color: var(--ink-soft); font-size: var(--ui-text-small); }

/* Work Item history shares the app surfaces and selected-state tokens. */
.workitem-history-list-item {
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius-panel);
  background: var(--canvas);
}
.workitem-history-list-item.active { border-color: var(--accent); background: var(--ui-selected); }
.workitem-history-select { border: 0; background: transparent; color: var(--ink); border-radius: var(--ui-radius); }
.workitem-history-select:hover:not(:disabled) { background: var(--ui-hover); }
.workitem-history-select > span:not(.workitem-history-revision-line) { color: var(--ink-soft); font-size: var(--ui-text-small); }
.workitem-history-summary { font-size: var(--ui-text); font-weight: 600; }
.workitem-history-current { color: var(--ui-success); background: var(--ui-success-soft); border-radius: var(--ui-radius); padding: 2px var(--ui-space-2); font-size: var(--ui-text-small); }
.workitem-history-detail-heading h3, .workitem-history-restore-form h3 { font-size: 16px; }
.workitem-history-snapshot-header, .workitem-history-section { background: var(--canvas); border-color: var(--muted); border-radius: var(--ui-radius-panel); }
.workitem-history-snapshot-header { background: var(--paper); }
.workitem-history-revision-badge { background: var(--paper); color: var(--ink); border-color: var(--muted); }
.workitem-history-snapshot-grid { background: var(--muted); border-color: var(--muted); }
.workitem-history-snapshot-grid > div { background: var(--canvas); }
.workitem-history-state-note { color: var(--ink); background: var(--ui-info-soft); border-color: var(--ui-info); border-radius: var(--ui-radius); }
.workitem-history-unknown-value { color: var(--ink-soft); }
.workitem-history-restore-checkbox input { width: auto; }

/* Shared document/template table actions keep one compact submenu level. */
.table-action-menu {
  width: min(292px, calc(100vw - 16px));
  max-height: calc(100dvh - 16px);
  overflow-x: hidden;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  gap: var(--ui-space-1);
  border-radius: var(--ui-radius-panel);
  background: var(--canvas);
  color: var(--ink);
}
.table-action-menu .context-menu { background: var(--canvas); }
.table-action-menu .has-submenu::after,
.table-action-menu .has-submenu:not(.submenu-open) > .submenu { display: none; }
.table-action-menu .context-item {
  min-height: var(--ui-control-height);
  font-size: var(--ui-text);
  font-weight: 400;
  color: var(--ink);
  gap: var(--ui-space-2);
}
.table-action-menu .btn-icon { flex-shrink: 0; }
.table-action-menu .context-item:is(:hover, :focus-visible) { background: var(--ui-hover); }
.table-action-menu .context-item:disabled { opacity: .45; cursor: default; }
.table-action-menu .context-item:disabled:hover { background: transparent; }
.table-action-menu .context-check {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  border: 1px solid var(--ink-soft);
  border-radius: 3px;
}
.table-action-menu .context-check::after {
  content: '';
  width: 8px;
  height: 5px;
  margin-top: 3px;
  border-left: 2px solid var(--canvas);
  border-bottom: 2px solid var(--canvas);
  transform: rotate(-45deg);
  visibility: hidden;
}
.table-action-menu [aria-checked="true"] .context-check { background: var(--ink); border-color: var(--ink); }
.table-action-menu [aria-checked="true"] .context-check::after { visibility: visible; }
.table-action-menu .context-item[data-action$="delete"],
.table-action-menu .context-item[data-action="teststep-remove"] { color: var(--ui-danger); }
.table-action-menu .context-label,
.table-menu-selection {
  color: var(--ink-soft);
  font-size: var(--ui-text-small);
  text-transform: none;
  letter-spacing: normal;
  font-weight: 400;
  padding: var(--ui-space-2);
}
.table-clipboard-tools {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--ui-space-1);
}
.table-action-menu .table-clipboard-tool {
  flex-direction: column;
  justify-content: center;
  gap: var(--ui-space-1);
  text-align: center;
  min-width: 0;
  min-height: 58px;
  padding: var(--ui-space-1);
  font-size: var(--ui-text-small);
}
.table-clipboard-tool > .context-text { flex: 0; }
.table-clipboard-tool > .context-arrow { display: none; }
.table-action-menu .submenu {
  width: min(280px, calc(100vw - 16px));
  max-height: calc(100dvh - 16px);
  overscroll-behavior: contain;
}
.table-action-menu [data-table-format-panel]:not([hidden]) {
  display: grid;
  gap: var(--ui-space-1);
}
.table-action-menu .table-color-control {
  display: flex;
  align-items: center;
  gap: var(--ui-space-2);
  font-size: var(--ui-text);
  color: var(--ink);
}
.table-color-control input[type="color"] { width: 48px; height: var(--ui-control-height); padding: var(--ui-space-1); }
.table-action-menu .context-step-btn { width: var(--ui-control-compact); height: var(--ui-control-compact); }
.table-action-menu .context-step-btn .btn-icon { width: 20px; height: 20px; }
.table-action-menu .context-control-row:not(.table-color-control) { grid-template-columns: 32px minmax(48px, 1fr) 52px 32px; }
.table-action-menu .context-number-label { color: var(--ink); }
.table-action-menu .context-number-input { color: var(--ink); background: var(--canvas); border-color: var(--muted); }
.table-action-menu .context-separator { background: var(--muted); }
.table-action-menu [data-color-swatch="yellow"] > .btn-icon { color: #b58900; }
.table-action-menu [data-color-swatch="green"] > .btn-icon { color: #52834d; }
.table-action-menu [data-color-swatch="blue"] > .btn-icon { color: #4a72a5; }
.table-action-menu [data-color-swatch="gray"] > .btn-icon { color: #808080; }
@media (pointer: coarse) {
  .table-action-menu .context-item,
  .table-action-menu .context-step-btn,
  .table-color-control input[type="color"] { min-width: 44px; min-height: 44px; }
}
@media (pointer: coarse) {
  .workitem-history-select, .workitem-history-copy-link { min-width: 44px; min-height: 44px; }
}

/* Labelled configuration rows use the common field and surface tokens. */
.workitem-config-field-label { color: var(--ink); font-weight: 700; }
.workitem-config-form-table .workitem-config-row-heading { color: var(--ink); background: transparent; font-weight: 700; }
.workitem-config-form-table tbody > tr + tr { border-top: 1px solid var(--muted); }

.workitem-config-form-table { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.workitem-config-form-table :is(th, td) { border: 0; background: transparent; }

.workitem-config-form-wrapper { border: 0; border-radius: 0; box-shadow: none; }
.workitem-config-form-table tbody tr:hover,
.workitem-config-form-table tbody tr:hover td { background-color: transparent; }

/* One review flow in work-item details and document sidebars. */
.workitem-review-overview { padding-bottom: var(--ui-space-5); }
.workitem-review-heading { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--ui-space-2); margin-bottom: var(--ui-space-3); }
.workitem-review-heading h3 { margin: 0; font-size: var(--ui-text); }
.workitem-review-heading > button { margin-left: auto; align-self: center; }
.workitem-review-heading > button, .workitem-review-decision-actions > button { display: inline-flex; align-items: center; gap: var(--ui-space-2); }
.workitem-review-people { list-style: none; padding: 0; margin: 0 0 var(--ui-space-3); }
.workitem-review-person { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--ui-space-2); padding-block: var(--ui-space-2); border-bottom: 1px solid var(--muted); }
.workitem-review-person > strong { min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
.workitem-review-person-status, .workitem-review-person-actions { display: inline-flex; align-items: center; gap: var(--ui-space-1); }
.workitem-review-person-status { font-size: var(--ui-text-small); }
.workitem-review-person-status.accepted { color: var(--ui-success); }
.workitem-review-person-status.rejected { color: var(--ui-danger); }
.workitem-review-person-status.pending { color: var(--ink-soft); }
.workitem-review-person-status .btn-icon { width: 16px; height: 16px; }
.workitem-review-heading > .workitem-review-assignment { margin-left: auto; min-width: 0; align-self: center; }
.workitem-review-assignment .workitem-searchable-picker { width: auto; }
.workitem-review-assignment button { display: inline-flex; align-items: center; justify-content: center; gap: var(--ui-space-2); }
.workitem-review-assignment .workitem-searchable-picker-trigger { width: auto; min-height: var(--ui-control-height); padding: var(--ui-space-2) var(--ui-space-3); }
.workitem-review-assignment .workitem-searchable-picker-trigger::after { content: none; }
.workitem-review-assignment .workitem-searchable-picker-overlay { left: auto; width: min(320px, calc(100vw - 32px)); max-width: calc(100vw - 32px); }
.workitem-review-assignment .reviewer-pick-list { overflow-x: hidden; }
.workitem-review-assignment .workitem-searchable-picker-overlay > button { margin-top: var(--ui-space-2); width: 100%; }
.workitem-review-decision { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ui-space-3); margin-top: var(--ui-space-4); }
.workitem-review-decision-actions { display: flex; flex-wrap: wrap; gap: var(--ui-space-2); }
.workitem-review-activity { padding-top: var(--ui-space-4); border-top: 1px solid var(--muted); }
.workitem-review-timeline-options { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-space-2) var(--ui-space-4); margin-bottom: var(--ui-space-3); }
.workitem-review-timeline-options .comment-filter { display: flex; align-items: center; gap: var(--ui-space-2); margin: 0; }
.workitem-review-timeline-options .comment-filter input { margin: 0; }
.workitem-review-timeline { position: relative; display: grid; gap: 0; min-width: 0; }
.workitem-review-timeline::before { content: ''; position: absolute; inset: 8px auto 16px 10px; width: 1px; background: var(--muted); }
.workitem-review-timeline-entry { position: relative; min-width: 0; padding: 0 0 var(--ui-space-3) 32px; overflow-wrap: anywhere; }
.workitem-review-event-icon { position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 21px; height: 24px; background: var(--paper); color: var(--ink-soft); }
.workitem-review-event-icon .btn-icon { width: 18px; height: 18px; }
.workitem-review-event-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--ui-space-1) var(--ui-space-3); }
.workitem-review-event-heading time { font-variant-numeric: tabular-nums; }
.workitem-review-event-details { color: var(--ink-soft); margin-top: var(--ui-space-1); }
.workitem-review-timeline-entry[data-review-kind="accepted"] :is(.workitem-review-event-icon, .workitem-review-event-heading > strong) { color: var(--ui-success); }
.workitem-review-timeline-entry[data-review-kind="rejected"] :is(.workitem-review-event-icon, .workitem-review-event-heading > strong, [data-timeline-comment-label]) { color: var(--ui-danger); }
.workitem-review-timeline .comment-row { border: 0; border-radius: 0; padding: 0; background: transparent; cursor: default; box-shadow: none; }
.workitem-review-timeline .comment-source-line { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--ui-space-1) var(--ui-space-3); margin: 0 0 var(--ui-space-1); }
.workitem-review-timeline .comment-source-line .comment-meta { margin-left: 0; font-variant-numeric: tabular-nums; }
.workitem-review-timeline .comment-row-header { flex-wrap: wrap; gap: var(--ui-space-1) var(--ui-space-3); margin-bottom: var(--ui-space-2); }
.workitem-review-timeline .comment-row-body { max-width: 75ch; }
.workitem-review-timeline .comment-row.is-closed .comment-row-body { color: var(--ink-soft); }
.workitem-review-timeline .comment-thread-toolbar { margin-top: var(--ui-space-2); }
.workitem-review-timeline .comment-thread-actions { justify-content: flex-start; }
.workitem-review-timeline .comment-thread-children { margin-left: 0; border-left: 1px solid var(--muted); }
.workitem-review-timeline .comment-thread-children[aria-hidden="true"] { visibility: hidden; }
.workitem-review-timeline .comment-inline-btn { display: inline-flex; align-items: center; gap: var(--ui-space-1); }
.workitem-review-timeline .comment-inline-btn .btn-icon { width: 16px; height: 16px; }
.workitem-review-timeline > [data-timeline-empty] { margin: 0; padding-left: 32px; }
.workitem-review-activity [data-review-timeline-notice] { margin-block: 0 var(--ui-space-4); }
/* Recent individual rules live inside the filter dialog. */
.work-query-recent { min-width: 0; border-top: 1px solid var(--muted); padding-top: var(--ui-space-2); }
.work-query-recent > summary { display: flex; align-items: center; gap: var(--ui-space-2); min-height: var(--ui-control-height); cursor: pointer; font-weight: 600; }
.work-query-recent > summary::-webkit-details-marker { display: none; }
.work-query-recent > summary .btn-icon { margin-left: auto; width: 16px; height: 16px; }
.work-query-recent[open] > summary .btn-icon { transform: rotate(90deg); }
.work-query-recent > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: var(--ui-radius); }
.work-query-recent-list { display: grid; min-width: 0; }
.work-query-recent-choice { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--ui-space-2); width: 100%; min-height: var(--ui-control-height); padding: var(--ui-space-2) var(--ui-space-1); border: 0; border-bottom: 1px solid var(--muted); border-radius: 0; background: transparent; text-align: left; font-weight: 400; }
.work-query-recent-choice > span { min-width: 0; overflow-wrap: anywhere; }
.work-query-recent-choice .btn-icon { width: 16px; height: 16px; }
.work-query-recent-choice:disabled { opacity: 1; color: var(--ink-soft); background: transparent; }
.work-query-recent-choice:hover:not(:disabled) { background: var(--ui-hover); }
.work-query-recent-list > p { padding-block: var(--ui-space-2); }
@media (pointer: coarse) { .work-query-recent-choice, .work-query-recent > summary { min-height: 44px; } }

/* Shared review decisions follow the title and trace links in both detail views. */
.workitem-review-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ui-space-3) var(--ui-space-4);
  width: 100%;
  min-width: 0;
  min-height: 0;
  height: auto;
  max-height: none;
  box-sizing: border-box;
  margin-block: var(--ui-space-4) var(--ui-space-3);
  padding: var(--ui-space-3) var(--ui-space-4);
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius);
  background: var(--canvas);
  overflow: visible;
}
.workitem-review-card[hidden], .workitem-review-reason[hidden], .workitem-review-feedback[hidden] { display: none; }
.workitem-review-card-summary { display: grid; gap: var(--ui-space-2); flex: 1 1 240px; min-width: 0; }
.workitem-review-card-heading { display: flex; align-items: center; gap: var(--ui-space-2); min-width: 0; overflow-wrap: anywhere; }
.workitem-review-card-icon { display: inline-flex; flex: none; color: var(--ui-warning); }
.workitem-review-card-heading strong { font-size: var(--ui-text); }
.workitem-review-progress { display: flex; flex-wrap: wrap; gap: var(--ui-space-1) var(--ui-space-4); color: var(--ink-soft); font-size: var(--ui-text-small); }
.workitem-review-card-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--ui-space-2); min-width: 0; max-width: 100%; margin-left: auto; }
.workitem-review-card-actions button { min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.workitem-review-card-actions .workitem-review-details { color: var(--ui-info); border-color: transparent; background: var(--paper); }
.workitem-review-reject > .btn-icon { color: var(--ui-danger); }
.workitem-review-reason { display: grid; gap: var(--ui-space-3); flex-basis: 100%; min-width: 0; padding-top: var(--ui-space-3); border-top: 1px solid var(--muted); }
.workitem-review-reason label { display: grid; gap: var(--ui-space-2); font-size: var(--ui-text-small); }
.workitem-review-reason textarea { width: 100%; box-sizing: border-box; min-height: 78px; resize: vertical; background: var(--canvas); }
.workitem-review-feedback { flex-basis: 100%; min-width: 0; color: var(--ui-danger); font-size: var(--ui-text-small); }
.workitem-details-layout:has(.workitem-review-card:not([hidden])) #metaReviewSection :is(#metaReviewAccept, #metaReviewReject) { display: none; }

/* Reviews and comments use the same quiet list surface. */
.meta-review-workspace { font: var(--ui-text)/1.45 var(--ui-font); }
.meta-review-workspace :is(button, summary) { font-family: inherit; }
.meta-review-workspace .review-summary-controls {
  background: var(--canvas);
  border-bottom: 0;
  padding-bottom: var(--ui-space-2);
}
.meta-review-workspace .review-summary-header { margin-bottom: 0; }
.meta-review-workspace .review-summary-header > div { font-weight: 600; }
.meta-review-workspace .meta-bottom {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.review-summary-row { border-bottom: 1px solid var(--muted); }
.review-summary-row .review-summary-item { border: 0; }
.review-summary-totals { color: var(--ink-soft); font-size: var(--ui-text-small); padding: 4px 0; }
.meta-review-workspace .review-summary-row .review-status-pill {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: var(--ui-text-small);
  font-weight: 400;
}
.review-summary-row .review-summary-item-title { font-size: var(--ui-text); }
.review-summary-row > .review-summary-item > summary:hover { background: var(--paper); }
.review-summary-row .review-summary-reviewers { margin-left: var(--ui-space-5); background: transparent; border-radius: 0; }
.review-summary-row .review-summary-reviewers .reviewer-line {
  border-left: 0;
  border-radius: 0;
  background: transparent;
  padding: var(--ui-space-2) 0;
}
.review-summary-row:has(> .review-summary-item > summary:focus-visible) { outline: 2px solid var(--accent); outline-offset: -2px; }
.review-summary-tabs .meta-view-toggle.active { color: var(--accent); border-bottom-color: var(--accent); }
.review-summary-tabs + .meta-review-workspace.mode-comments .meta-bottom {
  padding: 0;
}
.meta-comments-resizable > .panel-header { margin: 0; }
.comment-section-heading { align-items: center; }
.comment-filter-settings { position: relative; flex: none; }
.comment-filter-settings > summary { list-style: none; }
.comment-filter-settings > summary::-webkit-details-marker { display: none; }
.comment-filter-options {
  position: absolute;
  top: calc(100% + var(--ui-space-1));
  left: 0;
  z-index: 20;
  width: max-content;
  max-width: min(320px, calc(100vw - 64px));
  padding: var(--ui-space-3);
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius);
  background: var(--canvas);
  box-shadow: 0 4px 12px var(--shadow);
}
.comment-filter-options .comment-filter { margin: 0; padding: var(--ui-space-2) 0; }
.review-summary-shortcut { text-decoration: none; color: var(--ink-soft); }
.review-summary-shortcut svg, .review-summary-page-actions svg, .comment-work-item-shortcut svg,
[data-comment-navigation] svg, #metaAddComment svg, #metaAddWorkItemComment svg { background-color: transparent; }
.comment-work-item-shortcut { color: var(--accent); }
.comment-list:has(> .comment-thread-row) { gap: 2px; }
.comment-row.comment-thread-row {
  position: relative;
  padding: 18px 48px 18px 20px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: color-mix(in srgb, var(--canvas) 55%, var(--ui-warning-soft));
  color: var(--ink);
}
.comment-row.comment-thread-row:first-child { border-radius: var(--ui-radius-panel) var(--ui-radius-panel) 0 0; }
.comment-row.comment-thread-row:last-child { border-radius: 0 0 var(--ui-radius-panel) var(--ui-radius-panel); }
.comment-row.comment-thread-row:only-child { border-radius: var(--ui-radius-panel); }
.comment-row.comment-thread-row.is-navigation-selected {
  outline: 2px solid var(--ui-danger);
  outline-offset: -2px;
}
.comment-row.comment-thread-row[data-comment-status="in_progress"] { background: var(--ui-info-soft); }
.comment-row.comment-thread-row[data-comment-status="blocked"] { background: var(--ui-danger-soft); }
.comment-row.comment-thread-row[data-comment-status="resolved"],
.comment-row.comment-thread-row.is-closed { background: color-mix(in srgb, var(--canvas) 55%, var(--ui-success-soft)); }
.comment-row.comment-thread-row .comment-row-body {
  margin: 0 0 11px;
  font-size: var(--ui-text);
  line-height: 1.5;
  overflow-wrap: anywhere;
  color: var(--ink);
}
.comment-row-body > :first-child { margin-top: 0; }
.comment-row-body > :last-child { margin-bottom: 0; }
.comment-row.comment-thread-row .comment-row-header {
  margin: 0;
  font-size: var(--ui-text-small);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.comment-row.comment-thread-row .comment-row-header strong { color: var(--ink); font-weight: 600; }
.comment-row.comment-thread-row .comment-meta { color: var(--ink-soft); }
.workitem-review-timeline .comment-row.comment-thread-row { padding-block: var(--ui-space-2); }
.workitem-review-timeline .comment-row.comment-thread-row :is(.comment-row-body, .comment-row-header),
.workitem-review-timeline .comment-entry-body { line-height: 1.4; }
.workitem-review-timeline .comment-row.comment-thread-row .comment-row-body { margin-bottom: var(--ui-space-1); }
.workitem-review-timeline :is(.comment-row-body, .comment-entry-body) > p:not(:last-child) { margin-bottom: var(--ui-space-1); }
.workitem-review-timeline .comment-thread-row .comment-thread-toolbar,
.workitem-review-timeline .comment-thread-children,
.workitem-review-timeline .comment-thread-child + .comment-thread-child { margin-top: var(--ui-space-1); }
.workitem-review-timeline .comment-row.comment-thread-row .comment-thread-more { top: var(--ui-space-1); }
.comment-row.comment-thread-row .comment-thread-more {
  position: absolute;
  top: var(--ui-space-3);
  right: var(--ui-space-2);
  background: transparent;
  border: 0;
  color: var(--ink-soft);
}
.comment-thread-more svg { background-color: transparent; }
.comment-thread-row .comment-thread-toolbar { margin-top: var(--ui-space-2); }
.comment-row .comment-thread-toggle, .comment-thread-no-replies {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  width: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink-soft);
  font-size: var(--ui-text-small);
  line-height: 1.5;
}
.comment-thread-no-replies .btn-icon, .comment-row .comment-thread-toggle .btn-icon { width: 16px; height: 16px; }
.comment-thread-menu.comment-thread-actions { display: grid; width: max-content; max-width: calc(100vw - 16px); }
.comment-thread-menu[hidden] { display: none; }
.comment-thread-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
@media (max-width: 600px) {
  .comment-row.comment-thread-row { padding-left: var(--ui-space-4); padding-right: 60px; }
  .comment-row.comment-thread-row .comment-row-body { font-size: var(--ui-text); }
}

/* Comment metadata and details share application typography and semantic colors. */
:is(.comment-row, .comment-detail) .comment-entry-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: baseline;
  gap: var(--ui-space-1) var(--ui-space-2);
  margin: 0 0 var(--ui-space-2);
  color: var(--ink-soft);
  font: var(--ui-text-small)/1.5 var(--ui-font);
}
:is(.comment-row, .comment-detail) .comment-entry-header strong { color: var(--ink); font-weight: 600; }
:is(.comment-row, .comment-detail) .comment-meta { margin: 0; font: inherit; font-variant-numeric: tabular-nums; }
:is(.comment-row, .comment-detail) .comment-status {
  display: inline-flex;
  align-items: center;
  gap: var(--ui-space-1);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: var(--ui-text-small);
  color: var(--ui-warning);
  font-weight: 600;
}
:is(.comment-row, .comment-detail) .comment-status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }
:is(.comment-row, .comment-detail) .comment-status.in_progress { color: var(--ui-info); }
:is(.comment-row, .comment-detail) .comment-status.blocked { color: var(--ui-danger); }
:is(.comment-row, .comment-detail) .comment-status.resolved { color: var(--ui-success); }
:is(.comment-row, .comment-detail) .comment-status.closed { color: var(--ink-soft); }
.comment-detail { --comment-action-size: var(--ui-control-height); display: flex; flex-direction: column; min-height: 0; min-width: 0; container-type: inline-size; font: var(--ui-text)/1.5 var(--ui-font); }
.comment-detail-header { flex: none; justify-content: space-between; margin: 0; padding: var(--ui-space-3) var(--ui-space-4); border-bottom: 1px solid var(--muted); }
.comment-detail-content { display: flex; flex-direction: column; gap: var(--ui-space-4); padding: var(--ui-space-4); min-height: 0; overflow-y: auto; }
.comment-detail .comment-entry { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
.comment-detail .comment-entry + .comment-entry { border-top: 1px solid var(--muted); padding-top: var(--ui-space-4); }
.comment-metadata { display: grid; gap: var(--ui-space-1); margin-top: var(--ui-space-2); }
.comment-metadata .comment-metadata-chip {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  align-items: baseline;
  gap: var(--ui-space-3);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ink);
  font: var(--ui-text-small)/1.5 var(--ui-font);
}
.comment-metadata-chip strong { font-weight: 400; color: var(--ink-soft); }
.comment-metadata .comment-metadata-link .icon-link { display: none; }
.comment-metadata-link .comment-linked-item-label { color: var(--accent); }
.comment-detail .comment-entry-body, .comment-editor-content { color: var(--ink); font: var(--ui-text)/1.5 var(--ui-font); }
.comment-detail-status { display: flex; align-items: center; flex-wrap: wrap; }
.comment-detail-status select { width: auto; min-height: var(--ui-control-compact); }
.comment-detail .field { margin: 0; }
.comment-detail-actions { flex: none; align-items: center; justify-content: space-between; flex-wrap: nowrap; padding: var(--ui-space-3) var(--ui-space-4); border-top: 1px solid var(--muted); gap: var(--ui-space-3); }
.comment-detail-secondary-actions, .comment-detail-reply-actions { display: flex; align-items: center; gap: var(--ui-space-2); min-width: 0; }
.comment-detail-reply-actions { margin-left: auto; }
.comment-detail-actions .comment-detail-delete { color: var(--ui-danger); }
.comment-detail-actions button { flex: none; width: auto; margin: 0; white-space: nowrap; }
#commentModal { --comment-action-size: var(--ui-control-height); container-type: inline-size; }
#commentModal .modal-actions { flex-wrap: nowrap; align-items: center; }
/* The complete German action labels need about 500px including footer spacing. */
@container (max-width: 520px) {
  .comment-collapsible-action .btn-label { display: none; }
  .comment-collapsible-action { width: var(--comment-action-size); min-width: var(--comment-action-size); padding-inline: var(--ui-space-1); justify-content: center; }
}
@container (max-width: 320px) {
  .comment-detail-actions, .comment-detail-secondary-actions, .comment-detail-reply-actions { gap: var(--ui-space-1); }
}
@media (pointer: coarse) {
  .comment-detail, #commentModal { --comment-action-size: 44px; }
}
.workitem-comment-detail:has(> .comment-detail) { display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.workitem-comment-detail > .comment-detail { flex: 1; }

/* Dialog backdrops cover responsive navigation as well as the workspace. */
.modal-overlay {
  z-index: 80;
}

/* Window geometry is presentation only; each feature retains its save/close lifecycle. */
.modal[data-modal-size] {
  --modal-preferred-width: 640px;
  top: max(16px, 6vh);
  width: min(var(--modal-preferred-width), calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  max-height: min(88dvh, calc(100dvh - 32px));
  border-radius: var(--ui-radius-panel);
  gap: var(--ui-space-3);
  padding: var(--ui-space-4);
}
.modal[data-modal-size="compact"] { --modal-preferred-width: 440px; }
.modal[data-modal-size="editor"] { --modal-preferred-width: 920px; }
.modal[data-modal-size="large"] { --modal-preferred-width: 1120px; }
.modal[data-modal-maximized="true"] {
  inset: 16px;
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
  transform: none;
}
.modal[data-settings-inline] { max-width: none; }
.modal[data-modal-size] .modal-header { gap: var(--ui-space-3); min-width: 0; touch-action: none; }
.modal[data-modal-size] .modal-header > :first-child { min-width: 0; overflow-wrap: anywhere; }
.modal-window-actions { display: flex; align-items: center; gap: var(--ui-space-1); flex-shrink: 0; }
.modal-window-context { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-top: var(--ui-space-1); font-size: var(--ui-text-small); font-weight: 400; color: var(--ink-soft); }
.modal[data-modal-size] .modal-body { gap: var(--ui-space-2); overscroll-behavior: contain; }
.modal[data-modal-size] .modal-body :focus-visible { outline-offset: -2px; }
.modal[data-modal-size] .modal-actions { gap: var(--ui-space-2); flex-wrap: wrap; padding-inline-end: 24px; }
.modal[data-modal-size] .field { gap: var(--ui-space-1); }
.modal[data-modal-size] .modal-resize-handle { width: 32px; height: 32px; touch-action: none; }
.modal[data-modal-size] .modal-resize-handle::after { inset: 14px 4px 4px 14px; }
.modal[data-modal-size="compact"] .modal-resize-handle,
.modal[data-modal-maximized="true"] .modal-resize-handle,
[data-settings-inline] .modal-window-actions { display: none; }
.modal-window-confirm {
  position: fixed;
  inset: 0;
  transform: none;
  width: min(440px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: var(--ui-space-4);
  border-radius: var(--ui-radius-panel);
  color: var(--ink);
}
.modal-window-confirm:not([open]) { display: none; }
.modal-window-confirm[open] { display: grid; }
.modal-window-confirm::backdrop { background: rgba(20, 15, 11, 0.55); }
.modal-window-confirm h2 { margin: 0; font: inherit; font-weight: 700; }
.modal-continue-dock {
  position: fixed;
  inset: auto 12px 8px auto;
  z-index: 49;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--ui-space-2);
  max-width: calc(100vw - 24px);
  max-height: 30dvh;
  overflow: auto;
}
.modal-continue-dock[hidden] { display: none; }
.modal-continue-dock > .trace-ai-dock { position: static; inset: auto; max-width: 100%; }
.modal-continue-entry {
  display: flex;
  align-items: center;
  padding: var(--ui-space-1);
  background: var(--canvas);
  border: 1px solid var(--muted);
  border-radius: var(--ui-radius);
  min-width: 0;
  max-width: min(440px, 100%);
}
.modal-continue-restore { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; text-align: start; }
.modal-continue-restore :is(strong, span) { max-width: 100%; overflow-wrap: anywhere; }
.modal-continue-restore strong { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.modal-continue-restore > span:first-of-type { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 760px) {
  .modal[data-modal-size]:not([data-settings-inline]) {
    top: 8px;
    max-width: calc(100vw - 16px);
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
    padding: var(--ui-space-3);
  }
  .modal[data-modal-maximized="true"] { inset: 8px; }
  .modal[data-modal-size] .modal-header { align-items: flex-start; }
}
@media (pointer: coarse) {
  .modal-window-actions .icon-btn,
  .modal-continue-entry .icon-btn { min-width: 44px; min-height: 44px; }
  .modal[data-modal-size] .modal-resize-handle { width: 44px; height: 44px; }
  .modal[data-modal-size] .modal-actions { padding-inline-end: 36px; }
}

/* Configured document icons share the catalog's foreground color. */
.document-type-label { display: inline-flex; align-items: center; gap: var(--ui-space-2); }
.doc-icon.document-configured-icon { background: none; mask: none; -webkit-mask: none; }
.doc-icon.document-configured-icon::before { display: none; }
.doc-icon.document-configured-icon svg { width: 100%; height: 100%; fill: none; }
.work-table .table-entry-action { border: 0; background: transparent; padding: 0; text-align: left; font-weight: 600; }
.work-table .table-entry-action:hover { text-decoration: underline; }
.doc-connection-notice {
  padding: var(--ui-space-2) var(--ui-space-3);
  background: var(--ui-warning-soft);
  color: var(--ui-warning);
  font-size: var(--ui-text);
  line-height: 1.4;
  overflow-wrap: anywhere;
}

/* Work-item list reference; the legacy ID keeps existing callers compatible. */
:root {
  --ui-list-font: Arial, Helvetica, sans-serif;
  --ui-list-header: #f8f6f4;
}
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; min-height: 40px; padding: 0 12px; border-bottom: 1px solid #ded7d1; background: #fff; }
:is(#workItemsView, .ui-list-workspace) .workitem-primary-toolbar, :is(#workItemsView, .ui-list-workspace) .workitem-personal-views, :is(#workItemsView, .ui-list-workspace) .workitem-creation-shortcuts { display: flex; flex: 0 0 auto; align-items: center; flex-wrap: nowrap; gap: 2px; margin: 0; padding: 0; }
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools :is(button:not(.primary), select), :is(#workItemsView, .ui-list-workspace) .workitem-query-toggle { min-height: 32px; height: 32px; padding: 4px; border: 0; border-radius: 3px; box-shadow: none; background-color: transparent; color: #25221f; }
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools button:not(.primary):hover, :is(#workItemsView, .ui-list-workspace) .workitem-query-toggle:hover { background: #f5efed; }
#variablesView .workitem-list-tools button.danger { padding-inline: var(--ui-space-3); color: var(--ui-danger); }
#variablesView .variable-document-context { overflow-wrap: anywhere; color: var(--ink-soft); font-size: var(--ui-text-small); }
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools .icon-only, :is(#workItemsView, .ui-list-workspace) #importWorkItemsBtn { width: 32px; min-width: 32px; display: inline-flex; align-items: center; justify-content: center; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar { display: flex; flex: 0 0 auto; align-items: center; flex-wrap: wrap; margin: 0; padding: 6px 12px; gap: 8px; border-bottom: 1px solid #ded7d1; background: #fff; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .work-filters { display: flex; flex: 1 1 260px; min-width: 0; margin: 0; gap: 8px; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .field { margin: 0; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .field:first-child { flex: 1 1 160px; min-width: 160px; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .field:nth-child(2) { flex: 0 1 156px; min-width: 110px; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar :is(input, select) { min-height: 32px; height: 32px; padding-top: 4px; padding-bottom: 4px; background-color: #fff; border-radius: 5px; font: var(--ui-text-small) var(--ui-list-font); }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .work-toolbar { flex: 0 0 auto; padding: 0; gap: 4px; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar > .work-toolbar { margin-left: auto; }
:is(#workItemsView, .ui-list-workspace) .work-table-wrapper { flex: 1 1 auto; min-height: 0; margin: 0; border: 0; border-radius: 0; background: #fff; box-shadow: none; }
:is(#workItemsView, .ui-list-workspace) .work-table { margin: 0; font: var(--ui-text) var(--ui-list-font); }
:is(#workItemsView, .ui-list-workspace) .work-table > thead { position: sticky; top: 0; z-index: 3; }
:is(#workItemsView, .ui-list-workspace) .work-table > thead::before { content: ''; position: absolute; inset: 0 auto 0 0; width: max(100%, 100cqw); box-sizing: border-box; border-bottom: 1px solid var(--muted); background: var(--ui-list-header); pointer-events: none; }
:is(#workItemsView, .ui-list-workspace) .work-table > :is(thead, tbody) > tr:not(.workitem-lazy-spacer, .work-item-detail) > :is(td, th), :is(#workItemsView, .ui-list-workspace) .trace-header { line-height: 20px; font-size: 14px; color: #171717; }
:is(#workItemsView, .ui-list-workspace) .work-table > thead > tr > th, :is(#workItemsView, .ui-list-workspace) .trace-header { font: 400 14px/20px var(--ui-list-font); background: var(--ui-list-header); position: relative; }
:is(#workItemsView, .ui-list-workspace) .work-table > tbody > tr:where(:not(.workitem-lazy-spacer, .work-item-detail)) > td { height: 36px; box-sizing: border-box; background: var(--ui-table-row-background, #fff); border-bottom: 1px solid #eee8e3; }
:is(#workItemsView, .ui-list-workspace) .work-table:not(.trace-merged-table):where(:not(.document-fmea-table)) > tbody > tr:hover:not(.work-item-detail):not(.active):not(.bulk-selected):not(.workitem-skeleton-row) > td,
:is(#workItemsView, .ui-list-workspace) .trace-row-group:is(:hover, :focus-within) .work-table:where(:not(.document-fmea-table)) > tbody > tr > td { background: var(--ui-table-row-hover); }
:is(#workItemsView, .ui-list-workspace) .work-table:where(:not(.document-fmea-table)) > tbody > tr.active > td,
:is(#workItemsView, .ui-list-workspace) .trace-row-group.active .work-table:where(:not(.document-fmea-table)) > tbody > tr > td { background: #fbe7e7; }
:is(#workItemsView, .ui-list-workspace) .work-table:where(:not(.document-fmea-table)) > tbody > tr.bulk-selected > td { background: #f3e7e5; }

/* Shared configuration navigation from the work-item type editor. */
.config-master-item { display: flex; align-items: flex-start; gap: 8px; width: 100%; min-height: 54px; padding: 10px 12px; border: 0; border-bottom: 1px solid var(--muted); border-radius: 0; background: transparent; text-align: left; color: var(--ink); box-sizing: border-box; }
.config-master-item[hidden] { display: none; }
.config-master-item:hover { background: var(--surface-soft); }
.config-master-item[aria-current="true"],
.config-master-item[aria-pressed="true"] { background: var(--ui-selected, var(--surface-soft)); }
.config-master-order { flex: 0 0 24px; padding-top: 2px; color: var(--ink-soft); font-size: var(--ui-text-small); font-variant-numeric: tabular-nums; text-align: right; }
.config-master-item-text { display: grid; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.config-master-item-text strong { font-size: 13px; font-weight: 600; }
.config-master-item-text small { color: var(--ink-soft); font-size: var(--ui-text-small); }

.ui-list-workspace { display: flex; flex-direction: column; gap: 0; min-width: 0; min-height: 0; font-family: var(--ui-list-font); font-size: var(--ui-text); color: #171717; background: var(--paper); }
.ui-list-workspace .work-table-wrapper { container-type: inline-size; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .field:first-child { position: relative; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .field:first-child::before { content: ''; position: absolute; left: 13px; top: 12px; width: 11px; height: 11px; border: 1.5px solid var(--ink-soft); border-radius: 50%; pointer-events: none; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .field:first-child::after { content: ''; position: absolute; left: 24px; top: 24px; width: 6px; border-top: 1.5px solid var(--ink-soft); transform: rotate(45deg); pointer-events: none; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .field > span { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar input[type="search"] { padding-left: 36px; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #7d6f61 50%), linear-gradient(135deg, #7d6f61 50%, transparent 50%); background-position: calc(100% - 18px) calc(50% - 3px), calc(100% - 12px) calc(50% - 3px); background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; padding-right: 34px; }
:is(#workItemsView, .ui-list-workspace) .workitem-view-navigation { display: flex; flex: 1 1 340px; align-items: center; min-width: 0; max-width: 100%; gap: 4px; }
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools > .workitem-primary-toolbar { flex-wrap: wrap; justify-content: flex-end; margin-left: auto; max-width: 100%; }
:is(#workItemsView, .ui-list-workspace) .workitem-personal-views > select { display: none !important; }
:is(#workItemsView, .ui-list-workspace) .workitem-creation-shortcuts button { position: relative; }
:is(#workItemsView, .ui-list-workspace) .workitem-creation-shortcuts button::after { content: '+'; position: absolute; right: 0; bottom: 0; font-size: 13px; line-height: 12px; color: var(--accent); }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar { flex-wrap: nowrap; min-height: 44px; box-sizing: border-box; overflow-x: auto; }
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar > .work-toolbar, :is(#workItemsView, .ui-list-workspace) .work-query-builder > .work-toolbar { display: flex; flex: 0 0 auto; flex-wrap: nowrap; }
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools,
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar,
:is(#workItemsView, .ui-list-workspace) .workitem-view-menu,
.workitem-workspace-details .workitem-details-savebar {
  background: var(--canvas);
}
:is(#workItemsView, .ui-list-workspace) .workitem-primary-toolbar,
:is(#workItemsView, .ui-list-workspace) .workitem-personal-views,
:is(#workItemsView, .ui-list-workspace) .workitem-creation-shortcuts,
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .work-toolbar {
  gap: var(--ui-space-2);
}
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .work-filters,
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar .field {
  align-items: center;
}
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar :is(input, select) {
  box-sizing: border-box;
  width: 100%;
}
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar {
  flex-wrap: wrap;
  overflow-x: hidden;
}
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar:has(.work-query-builder.is-open) {
  flex-wrap: nowrap;
  align-items: flex-end;
}
:is(#workItemsView, .ui-list-workspace) .workitem-searchbar { background: var(--paper); }
@media (pointer: coarse), (max-width: 600px) {
  :is(#workItemsView, .ui-list-workspace) :is(.workitem-list-tools, .workitem-searchbar) :is(button, select, input:not([type="checkbox"])) { min-height: 44px; height: 44px; }
  :is(#workItemsView, .ui-list-workspace) .icon-only { width: 44px; min-width: 44px; }
}

/* Project membership workspace uses the shared theme and control vocabulary. */
.project-edit-tabs { border-bottom: 1px solid var(--muted); }
.project-members-count { padding: 2px 6px; border-radius: 4px; background: var(--surface-soft); color: var(--ink-soft); font-size: var(--ui-text-small); font-variant-numeric: tabular-nums; }
.project-members-table { font-size: var(--ui-text); }
.project-members-table th { background: var(--surface-soft); color: var(--ink-soft); font-size: var(--ui-text-small); font-weight: 600; }
.project-members-table th, .project-members-table td { border-bottom: 1px solid var(--muted); }
.project-member-controls { border-left: 1px solid var(--muted); }
.project-member-selection-heading { font-size: var(--ui-text-small); }
#projectMemberSelectedCount { color: var(--accent); font-weight: 600; font-variant-numeric: tabular-nums; }
.project-member-candidate { border-bottom: 1px solid var(--muted); }
.project-member-candidate:hover { background: var(--ui-hover); }
.project-member-candidate:has(input:checked) { background: var(--ui-selected); }
.project-member-avatar { border-radius: 50%; background: var(--surface-soft); color: var(--ink-soft); font-size: var(--ui-text-small); font-weight: 600; }
.project-member-display-name { font-size: var(--ui-text); font-weight: 600; }
.project-member-username, .project-member-username-column { color: var(--ink-soft); font-size: var(--ui-text-small); }
.project-member-role-badge { border-radius: 4px; background: var(--surface-soft); color: var(--ink-soft); font-size: var(--ui-text-small); }
.project-member-role-option { border: 1px solid var(--muted); border-radius: 6px; background: var(--canvas); color: var(--ink); font-size: var(--ui-text-small); }
.project-member-role-option:has(input:checked) { border-color: var(--accent); color: var(--accent); background: var(--ui-primary-soft); }
.project-member-role-option:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.project-member-role-option:has(input:disabled) { opacity: .55; cursor: default; }
.project-member-role-check { border: 1px solid var(--muted); border-radius: 3px; color: transparent; font-size: 11px; }
.project-member-role-option input:checked + .project-member-role-check { border-color: var(--accent); background: var(--accent); color: var(--brand-on-primary, #fff); }
.project-member-remove { color: var(--ui-danger); }
.project-members-empty { color: var(--ink-soft); font-size: var(--ui-text-small); }
@media (max-width: 620px) {
  .project-member-controls { border-left: 0; border-bottom: 1px solid var(--muted); }
  .project-member-candidate, .project-member-selection-heading label { min-height: 44px; }
}

/* Shared loading states for compact list workspaces. */
:is(#workItemsView, .ui-list-workspace) .workitem-skeleton-row { pointer-events: none; }
:is(#workItemsView, .ui-list-workspace) .workitem-skeleton-text {
  display: block;
  position: relative;
  overflow: hidden;
  width: 72%;
  max-width: 24ch;
  height: 0.75rem;
  border-radius: 3px;
  background: color-mix(in srgb, var(--ink) 10%, var(--canvas));
}
:is(#workItemsView, .ui-list-workspace) .workitem-skeleton-row:nth-child(3n) .workitem-skeleton-text { width: 58%; }
:is(#workItemsView, .ui-list-workspace) .workitem-skeleton-row [data-col-id="title"] .workitem-skeleton-text { width: 86%; max-width: 48ch; }
:is(#workItemsView, .ui-list-workspace) .workitem-skeleton-text::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 15%, color-mix(in srgb, var(--canvas) 80%, transparent) 50%, transparent 85%);
  transform: translateX(-100%);
  animation: workitem-skeleton-glow 1.4s linear infinite;
}
:is(#workItemsView, .ui-list-workspace) .workitem-row-arriving { animation: workitem-row-arrive 140ms ease-out; }
@keyframes workitem-skeleton-glow { to { transform: translateX(100%); } }
@keyframes workitem-row-arrive { from { opacity: 0.55; } to { opacity: 1; } }
@media (max-width: 600px) {
  :is(#workItemsView, .ui-list-workspace) .workitem-skeleton-row .workitem-mobile-code { padding-block: 4px; }
  :is(#workItemsView, .ui-list-workspace) .workitem-skeleton-row .workitem-mobile-code .workitem-skeleton-text { width: 8ch; max-width: 40%; }
  :is(#workItemsView, .ui-list-workspace) .workitem-skeleton-row [data-col-id="title"] > .workitem-skeleton-text { margin-block: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  :is(#workItemsView, .ui-list-workspace) .workitem-skeleton-text::after { animation: none; display: none; }
  :is(#workItemsView, .ui-list-workspace) .workitem-row-arriving { animation: none; }
}

/* Shared compact view tabs preserve the list navigation contract. */
:is(#workItemsView, .ui-list-workspace) .workitem-view-tabs { display: flex; flex: 0 1 auto; min-width: 0; flex-wrap: nowrap; overflow-x: hidden; margin: 0; border: 0; gap: 0; }
:is(#workItemsView, .ui-list-workspace) .workitem-view-tabs button { flex: 0 0 auto; min-height: 36px; padding: 6px 8px; white-space: nowrap; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; text-decoration: none; }
:is(#workItemsView, .ui-list-workspace) .workitem-view-tabs button[aria-selected="true"], :is(#workItemsView, .ui-list-workspace) .workitem-view-tabs button[aria-pressed="true"] { border-bottom: 2px solid var(--accent-2); color: var(--accent-2); }
:is(#workItemsView, .ui-list-workspace) .workitem-view-tabs button:is(:hover, :focus-visible) { background: transparent; }
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools .ai-tool-btn:not(:disabled):not([aria-disabled="true"]) { color: var(--ui-ai-ink); }
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools .ai-tool-btn:hover:not(:disabled):not([aria-disabled="true"]) { background: var(--ui-ai-background-hover); }
:is(#workItemsView, .ui-list-workspace) .workitem-list-tools .ai-tool-btn:is(:disabled, [aria-disabled="true"]) { color: var(--ink-soft); background: var(--muted); }

/* Search controls shared by the Work Item and Traceability workspaces. */
.workitem-searchbar .workitem-search-apply { width: auto; min-width: 0; padding: 4px 12px; }

:is(#workItemsView, .ui-list-workspace) .workitem-query-toggle { display: inline-flex; align-items: center; gap: 5px; width: auto; font-size: 12px; white-space: nowrap; }
:is(#workItemsView, .ui-list-workspace) .work-query-builder { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0; }
:is(#workItemsView, .ui-list-workspace) .work-query-builder.is-open { display: flex; flex: 1 1 0; flex-wrap: nowrap; gap: 6px; min-width: 0; border: 0; background: transparent; }
:is(#workItemsView, .ui-list-workspace) .work-query-rows { display: flex; flex: 1 1 auto; flex-wrap: nowrap; min-width: 0; overflow-x: auto; }
:is(#workItemsView, .ui-list-workspace) .work-query-rows .work-query-row { flex: 0 0 auto; }
:is(#workItemsView, .ui-list-workspace) :is(.workitem-search-apply, .workitem-search-reset).query-mode-hidden { display: none; }
:is(#workItemsView, .ui-list-workspace) .work-query-builder :is(button, .work-query-chip) { min-height: var(--ui-control-compact); height: var(--ui-control-compact); }
:is(#workItemsView, .ui-list-workspace) .work-query-builder.is-open {
  flex-wrap: wrap;
  overflow: hidden;
}
:is(#workItemsView, .ui-list-workspace) .work-query-rows {
  display: contents;
}
:is(#workItemsView, .ui-list-workspace) .work-query-rows .work-query-row {
  max-width: min(240px, 100%);
}
:is(#workItemsView, .ui-list-workspace) .work-query-builder > .work-toolbar {
  order: 2;
  margin-left: auto;
}
:is(#workItemsView, .ui-list-workspace) .work-query-builder:has(.work-query-rows > .placeholder) > .work-query-icon {
  order: 0;
}
:is(#workItemsView, .ui-list-workspace) .work-query-rows > .placeholder {
  order: 1;
  flex: 1 1 140px;
}
:is(#workItemsView, .ui-list-workspace) :is(.work-filters, .work-query-builder)[hidden] { display: none !important; }
:is(#workItemsView, .ui-list-workspace) .work-query-builder.is-open { justify-content: flex-start; }
:is(#workItemsView, .ui-list-workspace) .work-query-rows .work-query-row { margin: 0; background: var(--canvas); }
:is(#workItemsView, .ui-list-workspace) .work-query-view .work-query-chip { display: flex; align-items: center; padding: 0 8px; }
:is(#workItemsView, .ui-list-workspace) .work-query-rows > .placeholder { padding: 0; margin: 0; text-align: left; font-size: 12px; }
:is(#workItemsView, .ui-list-workspace) .work-query-builder > .work-query-icon { order: 1; flex: 0 0 var(--ui-control-compact); }
:is(#workItemsView, .ui-list-workspace) .workitem-query-toggle.active { flex: 0 0 36px; width: 36px; padding: 0; justify-content: center; }
:is(#workItemsView, .ui-list-workspace) .workitem-query-toggle.active .btn-label { display: none; }
@media (pointer: coarse), (max-width: 600px) {
  .workitem-searchbar .workitem-search-apply { min-height: 44px; height: 44px; }
  :is(#workItemsView, .ui-list-workspace) .work-query-builder :is(button, .work-query-chip) { min-height: 44px; height: 44px; }
  :is(#workItemsView, .ui-list-workspace) .work-query-builder > .work-query-icon { flex-basis: 44px; }
}

/* Search actions keep their footprint in simple and advanced queries. */
.workitem-searchbar .work-toolbar { align-items: center; }
.workitem-searchbar .work-toolbar :is(.workitem-search-apply, .workitem-search-reset) {
  flex-shrink: 0;
  min-height: var(--ui-control-compact);
  height: var(--ui-control-compact);
}
.workitem-searchbar .work-toolbar .workitem-search-reset {
  width: var(--ui-control-compact);
  min-width: var(--ui-control-compact);
  padding: 0;
  justify-content: center;
}
.fmea-toolbar { padding-block: 12px; }
.fmea-toolbar > strong { font-size: 14px; font-weight: 600; }
.fmea-toolbar button { white-space: nowrap; }
.trace-config-fmea-proposal { border: 1px solid var(--muted); border-radius: var(--ui-radius-control); background: var(--canvas); }
.editor-entity-picker-option[aria-selected="true"] { background: var(--ui-selected); }
.workitem-calculated-field input.workitem-calculated-value[readonly] { color: var(--ink-soft); cursor: default; }
.workitem-calculated-field input.workitem-calculated-value[readonly]:not([data-field-tone]) { background: var(--ui-list-header, var(--paper)); }
.custom-field-source-rule { min-width: 0; margin: var(--ui-space-4) 0; padding: var(--ui-space-4) 0 0; border: 0; border-top: 1px solid var(--muted); }
.custom-field-source-rule > legend { padding-inline-end: var(--ui-space-2); font-size: var(--ui-text); font-weight: 600; }
.custom-field-source-condition, .custom-field-source-expression { min-width: 0; margin: var(--ui-space-3) 0 0; padding: 0; border: 0; }
:is(.custom-field-source-condition, .custom-field-source-expression) > legend { margin-block-end: var(--ui-space-2); padding: 0; font-size: var(--ui-text-small); color: var(--ink-soft); }
.custom-field-source-condition > legend { padding-inline-end: var(--ui-space-2); font-weight: 600; }
.custom-field-source-condition + .custom-field-source-condition { border-block-start: 1px solid var(--muted); padding-block-start: var(--ui-space-3); }
.custom-field-source-editor .workitem-searchable-picker-trigger { white-space: normal; overflow-wrap: anywhere; height: auto; }
.fmea-row-count { font-size: 12px; color: var(--ink-soft); }
.fmea-scroll { border-block: 1px solid var(--muted); }
.document-fmea-table > :is(thead, tbody) > tr > :is(th, td) { background: var(--canvas); border-bottom: 1px solid var(--muted); border-inline-end: 1px solid color-mix(in srgb, var(--muted) 55%, transparent); }
.document-fmea-table > thead > tr > th { font-size: 12px; font-weight: 600; line-height: 1.35; color: var(--ink); }
.document-fmea-table > thead > .fmea-groups > th { background: var(--ui-list-header); font-size: 11px; }
.document-fmea-table > tbody > tr > td { font-size: 13px; line-height: 1.5; }
.document-fmea-table .fmea-group-start { border-inline-start: 1px solid var(--muted); }
.document-fmea-table > tbody > tr:is(:hover, :focus-within) > td:not([data-field-tone]) { background: var(--ui-table-row-hover, var(--ui-list-header)); }
.document-fmea-table > tbody > .fmea-active-row > td:not([data-field-tone]) { background: var(--ui-selected); }
.document-fmea-table td:focus, .document-fmea-table .fmea-selected { outline: 2px solid var(--accent); outline-offset: -2px; }
.document-fmea-table [data-fmea-kind="rating"] { font-variant-numeric: tabular-nums; }
.document-fmea-table .fmea-derived { background: var(--ui-list-header); }
.document-fmea-table .fmea-cell-editor { padding: 0; border: 0; border-radius: 0; background: transparent; font: inherit; color: inherit; }
.document-fmea-table .fmea-preview { font-size: 12px; color: var(--ink-soft); }
.document-fmea-table .fmea-link-action { padding: 2px 4px; min-width: 32px; min-height: 32px; }
.fmea-footer { font-size: 12px; color: var(--ink-soft); }
.fmea-scroll-hint { font-weight: 600; }
:is([data-field-tone="red"], .document-fmea-table td[data-field-tone="red"]) { background-color: var(--ui-danger-soft); color: var(--ui-danger); }
:is([data-field-tone="yellow"], .document-fmea-table td[data-field-tone="yellow"]) { background-color: var(--ui-warning-soft); color: var(--ui-warning); }
:is([data-field-tone="green"], .document-fmea-table td[data-field-tone="green"]) { background-color: var(--ui-success-soft); color: var(--ui-success); }
.document-fmea-table .fmea-active-row > td[data-field-tone] { box-shadow: inset 0 -2px var(--accent); }
.document-fmea-table .fmea-columns > th { border-inline-end: 0; }
.document-fmea-table .fmea-columns > th.fmea-group-start { border-inline-start: 0; }
.document-fmea-table .fmea-columns > th > .workitem-column-resize-handle { position: absolute; display: block; left: auto; right: 0; top: 0; bottom: 0; width: 9px; height: auto; cursor: col-resize; z-index: 8; touch-action: none; }
.document-fmea-table .fmea-columns > th > .workitem-column-resize-handle::after { content: ''; position: absolute; left: auto; right: 0; top: 0; bottom: 0; width: 1px; background: var(--muted); }
.document-fmea-table .fmea-columns > th > .workitem-column-resize-handle:is(:hover, :focus-visible)::after { width: 2px; background: var(--accent); }
.document-fmea-table .workitem-column-resize-handle:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.fmea-cell-error { margin-block-start: 6px; color: var(--danger, #b91c1c); font-size: 12px; }
.document-fmea-table .fmea-invalid { outline: 2px solid var(--danger, #b91c1c); outline-offset: -2px; }
@media (pointer: coarse) { .document-fmea-table .fmea-link-action { min-width: 44px; min-height: 44px; } }

.work-table .sort-indicator[data-indicator]::after {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  vertical-align: middle;
  background: currentColor;
  mask: url('/icons/majesticons/arrow-up-line.svg') center / contain no-repeat;
}
.work-table .sort-indicator[data-indicator="desc"]::after { transform: rotate(180deg); }
@media (pointer: coarse), (max-width: 600px) {
  .workitem-searchbar .work-toolbar :is(.workitem-search-apply, .workitem-search-reset) { min-height: 44px; height: 44px; }
  .workitem-searchbar .work-toolbar .workitem-search-reset { min-width: 44px; width: 44px; }
}

/* Connected multiline editors share the white Work Item editing surface. */
.wi-inline-desc-editor:has(> :is(.wi-inline-rich-toolbar, .workitem-document-toolbar):not([hidden])) {
  background: var(--canvas);
  border-radius: var(--ui-radius);
}
.wi-inline-desc-editor > :is(.wi-inline-rich-toolbar, .workitem-document-toolbar) {
  background: var(--canvas);
  border-radius: var(--ui-radius) var(--ui-radius) 0 0;
  border-bottom: 0;
}
.wi-inline-desc-editor > :is(.wi-inline-rich-toolbar, .workitem-document-toolbar)[hidden] {
  display: none;
}
.wi-inline-desc-editor:has(> :is(.wi-inline-rich-toolbar, .workitem-document-toolbar):not([hidden])) > .wi-inline-rich-surface {
  background: var(--canvas);
  border: 1px solid var(--muted);
  border-radius: 0 0 var(--ui-radius) var(--ui-radius);
}
.testing-detail-pane,
.testing-item-detail,
.testing-overall-result > .testing-rich-text {
  background: var(--canvas);
}
/* Rowspans must highlight together with any variant in their equipment family. */
:is(#workItemsView, .ui-list-workspace) .testing-equipment-table :is(tbody:hover td[rowspan], tbody:focus-within td[rowspan]) { background: var(--ui-table-row-hover); }

:is(#workItemsView, .ui-list-workspace) .testing-header { padding-block: var(--ui-space-1); }

:is(#workItemsView, .ui-list-workspace) .testing-result-summary.workitem-view-tabs {
  flex-wrap: wrap;
  overflow: visible;
}
:is(#workItemsView, .ui-list-workspace) .testing-result-summary .testing-summary-link[aria-pressed="true"] { border-bottom-color: currentColor; }
:is(#workItemsView, .ui-list-workspace) .testing-result-summary .testing-summary-link[data-testing-summary-filter="PASSED"] { color: var(--ui-success); }
:is(#workItemsView, .ui-list-workspace) .testing-result-summary .testing-summary-link[data-testing-summary-filter="ACCEPTED"] { color: var(--ui-info); }
:is(#workItemsView, .ui-list-workspace) .testing-result-summary .testing-summary-link[data-testing-summary-filter="FAILED"] { color: var(--ui-danger); }

.testing-completion-missing { outline: 2px solid var(--ui-danger); outline-offset: 2px; }
.testing-result-button-passed:is(:hover, :focus-visible) { color: var(--ui-success); background: var(--ui-success-soft); border-color: var(--ui-success); outline-color: var(--ui-success); }
.testing-result-button-accepted:is(:hover, :focus-visible) { color: var(--ui-info); background: var(--ui-info-soft); border-color: var(--ui-info); outline-color: var(--ui-info); }
.testing-result-button-failed:is(:hover, :focus-visible) { color: var(--ui-danger); background: var(--ui-danger-soft); border-color: var(--ui-danger); outline-color: var(--ui-danger); }
.testing-result-control[data-result-key="PASSED"] .testing-result-button-passed { color: var(--canvas); background: var(--ui-success); border-color: var(--ui-success); }
.testing-result-control[data-result-key="ACCEPTED"] .testing-result-button-accepted { color: var(--canvas); background: var(--ui-info); border-color: var(--ui-info); }
.testing-result-control[data-result-key="FAILED"] .testing-result-button-failed { color: var(--canvas); background: var(--ui-danger); border-color: var(--ui-danger); }

.testing-result-button-group { flex-wrap: wrap; gap: var(--ui-space-1); }
.testing-result-button { flex-basis: 128px; border-radius: var(--ui-radius); }
.testing-result-button .btn-label { word-break: normal; overflow-wrap: normal; }

/* Navigation links retain the existing row and action appearance. */
a.app-nav-action, a.context-item, a.document-tree-document, .project-item a.tree-label {
  text-decoration: none;
}
a.document-tree-document, .project-item a.tree-label { color: inherit; }
.project-item a.tree-label { flex: 1; }

/* Document side-view chrome follows the shared application palette. */
.workspace.document-sideviews-mode > .document-sideview-toolbar {
  background: var(--canvas);
  border-inline-start: 1px solid var(--muted);
}
.document-sideview-toolbar > .icon-btn { color: var(--ink-soft); }
.document-sideview-toolbar svg.btn-icon { background: transparent; mask: none; fill: none; }
.document-sideview-toolbar > .icon-btn[aria-pressed="true"] {
  color: var(--accent-2);
  background: var(--ui-primary-soft);
  border-color: var(--ui-secondary-border);
}
.document-sideview-toolbar > .icon-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.workspace.document-sideviews-mode > :is(#metadataSidebar, #pinnedDocumentSidebar) { background: var(--canvas); border-inline-start: 1px solid var(--muted); box-shadow: none; }
.workspace.document-sideviews-mode > :is(#metadataSidebar, #pinnedDocumentSidebar) > .sidebar-header { border-bottom: 1px solid var(--muted); }
.workspace.document-sideviews-mode .metadata-sidebar-title { font-size: 15px; font-weight: 600; }
.document-properties-sidebar-heading h3 { font-weight: 600; }
.document-properties-status { color: var(--ink); background: var(--surface-soft); }
#documentPropertiesSidebarContent > h3,
.document-properties-history,
.document-properties-sidebar-actions { border-top: 1px solid var(--muted); }
.document-properties-history > summary { color: var(--ink-soft); }

/* Visible separators also advertise the shared table column resize handles. */
.workitem-column-resize-handle::after { background: var(--muted); }

/* Step editor toolbars stick below their table header. */
:is(#workItemsView, .ui-list-workspace) .testing-step-table > thead { z-index: 4; }

/* Role administration uses the shared settings surface and selection states. */
.role-manager-list-panel { background: var(--canvas); border-right: 1px solid var(--muted); }
.role-editor { background: var(--canvas); }
.role-list-item-meta { display: flex; align-items: center; flex-wrap: wrap; gap: var(--ui-space-2); color: var(--ink-soft); font-size: var(--ui-text-small); }
.role-editor-heading h2, .role-permission-heading h3 { font-size: 16px; }
.permission-category { border: 0; border-bottom: 1px solid var(--muted); border-radius: 0; padding: 0; background: transparent; }
.permission-category-header { display: list-item; list-style: disclosure-closed inside; cursor: pointer; font-weight: 600; }
.permission-category[open] > summary { list-style-type: disclosure-open; }
.permission-category-header > .meta-subtle { font-weight: 400; font-variant-numeric: tabular-nums; }
.permission-option { border-top: 1px solid var(--muted); cursor: pointer; }
.permission-option:hover { background: var(--ui-hover); }
.permission-option:has(input:disabled) { cursor: default; }
.permission-option-key { color: var(--ink-soft); font-size: var(--ui-text-small); }
.permission-risk { padding: var(--ui-space-1) var(--ui-space-2); border-radius: var(--ui-radius); font-size: var(--ui-text-small); }
.permission-risk[data-risk="critical"] { color: var(--ui-danger); background: var(--ui-danger-soft); }
.permission-risk[data-risk="elevated"] { color: var(--ui-warning); background: var(--ui-warning-soft); }
@media (max-width: 760px) {
  .role-manager-list-panel { border-right: 0; border-bottom: 1px solid var(--muted); }
}

.users-table-wrapper .work-table th { cursor: default; }
@media (max-width: 600px) {
  :is(#workItemsView, .ui-list-workspace) .users-filter-controls .users-search-field:first-child {
    flex-basis: 100%;
  }
}

/* User role assignments reuse the shared control and list styling. */
.role-assignment-project-row + .role-assignment-project-row {
  border-top: 1px solid var(--muted);
}

@media (pointer: coarse), (max-width: 600px) {
  .role-assignment-remove { min-height: 44px; }
}
.workitem-icon-dialog[open]:has(.workitem-icon-results) {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.workitem-icon-dialog > :not(.workitem-icon-results) {
  flex-shrink: 0;
}

.workitem-icon-dialog .workitem-icon-results {
  min-height: 0;
  max-height: 45vh;
  overflow-y: auto;
  align-content: start;
  padding: var(--ui-space-1);
}

.workitem-icon-category {
  grid-column: 1 / -1;
  margin: var(--ui-space-3) 0 var(--ui-space-1);
  font-size: var(--ui-text-small);
  color: var(--ink-soft);
}

.workitem-icon-category:first-child {
  margin-top: 0;
}

/* Keep visible traceability gaps yellow during hover and selection. */
#traceabilityView .trace-row-group .work-table > tbody > tr.has-conflict > td {
  background: #fff3cd;
}