/*
 * Visual style system — 清朗 / 经纬
 *
 * Presentation only. The two styles share the same routes, data, permissions,
 * workflow state and audit icon geometry.
 */

html[data-visual-style="refined"] {
  --visual-canvas: #e8eef6;
  --visual-surface: #fdfefe;
  --visual-surface-soft: #f1f5fa;
  --visual-line: #d3deea;
  --visual-line-soft: #e4ebf2;
  --visual-ink: #0b1b2f;
  --visual-copy: #52657c;
  --visual-faint: #7b8ca1;
  --visual-accent: #2458d3;
  --visual-accent-deep: #173f9f;
  --visual-accent-soft: #e7efff;
  --visual-nav: #0a1424;
  --visual-nav-line: #20314a;
  --visual-nav-text: #e5edf8;
  --visual-nav-muted: #8ea0b8;
  --visual-nav-active: #1c3c70;
  --visual-nav-active-text: #ffffff;
  --visual-locator-surface: #172943;
  --visual-locator-surface-deep: #112238;
  --visual-locator-ink: #f5f8ff;
  --visual-locator-muted: #b8c7da;
  --visual-locator-line: rgba(197, 215, 239, .22);
  --visual-locator-focus: #9cc1ff;
  --visual-radius-sm: 9px;
  --visual-radius: 13px;
  --visual-radius-lg: 16px;
  --visual-shadow: 0 2px 5px rgba(20, 43, 76, .04), 0 16px 38px rgba(20, 43, 76, .08);
  --visual-shadow-hover: 0 20px 46px rgba(20, 43, 76, .12);
  --visual-canvas-pattern:
    radial-gradient(circle at 94% 2%, rgba(36, 88, 211, .07), transparent 25%),
    linear-gradient(180deg, #edf2f8 0, #e8eef6 100%);
}


/* Case navigation and completed outcomes follow the Weave palette. */
html[data-visual-style="weave"] #view-fraud .fraud-flow-step em {
  color: var(--visual-accent-deep);
}
html[data-visual-style="weave"] #view-fraud .fraud-tab-btn.active {
  color: var(--visual-nav-active-text);
  background: var(--visual-nav-active);
}
html[data-visual-style="weave"] #view-fraud .fraud-output-next.done {
  border: 1px solid var(--visual-line);
  background: var(--visual-surface-soft);
}
html[data-visual-style="weave"] #view-fraud .fraud-output-next.done small {
  color: var(--visual-accent-deep);
}
html[data-visual-style="weave"] #view-fraud .fraud-output-next.done .fraud-output-checks span {
  color: var(--visual-copy);
  background: var(--visual-surface);
}

html[data-visual-style="weave"] {
  --visual-canvas: #dfe7e4;
  --visual-surface: #f8faf9;
  --visual-surface-soft: #edf2f0;
  --visual-line: #c9d6d2;
  --visual-line-soft: #dce5e2;
  --visual-ink: #24322e;
  --visual-copy: #60716b;
  --visual-faint: #7e8e88;
  --visual-accent: #34766d;
  --visual-accent-deep: #255c55;
  --visual-accent-soft: #dbeae6;
  --visual-nav: rgba(238, 244, 241, .94);
  --visual-nav-line: #d2ddda;
  --visual-nav-text: #33433e;
  --visual-nav-muted: #71817b;
  --visual-nav-active: #dce9e5;
  --visual-nav-active-text: #255c55;
  --visual-locator-surface: #2b6058;
  --visual-locator-surface-deep: #234f49;
  --visual-locator-ink: #f3faf7;
  --visual-locator-muted: #bed3cd;
  --visual-locator-line: rgba(220, 242, 235, .21);
  --visual-locator-focus: #9dd3c9;
  --visual-radius-sm: 10px;
  --visual-radius: 15px;
  --visual-radius-lg: 21px;
  --visual-shadow: 0 3px 8px rgba(32, 61, 53, .04), 0 20px 46px rgba(32, 61, 53, .1);
  --visual-shadow-hover: 0 26px 58px rgba(32, 61, 53, .14);
  --visual-canvas-pattern:
    repeating-radial-gradient(ellipse at 96% 0%, transparent 0 48px, rgba(51, 118, 109, .07) 49px 50px, transparent 51px 76px),
    linear-gradient(145deg, #e7edeb, #dbe4e1);
}

html[data-visual-style] {
  color-scheme: only light;
  --primary: var(--visual-accent);
  --primary-hover: var(--visual-accent-deep);
  --accent: var(--visual-accent);
  --accent-hover: var(--visual-accent-deep);
  --accent-light: var(--visual-accent-soft);
  --sidebar-bg: var(--visual-nav);
  --sidebar-hover: color-mix(in srgb, var(--visual-accent-soft) 58%, transparent);
  --sidebar-active: var(--visual-nav-active);
  --card-bg: var(--visual-surface);
  --card-radius: var(--visual-radius);
  --card-shadow: var(--visual-shadow);
  --text-primary: var(--visual-ink);
  --text-secondary: var(--visual-copy);
  --text-muted: var(--visual-faint);
  --border-color: var(--visual-line);
  --bg-page: var(--visual-canvas);
  --bg-hover: var(--visual-surface-soft);
  --toolbar-bg: var(--visual-surface);
  --toolbar-text: var(--visual-accent-deep);

  --oa-canvas: var(--visual-canvas);
  --oa-surface: var(--visual-surface);
  --oa-surface-soft: var(--visual-surface-soft);
  --oa-ink: var(--visual-ink);
  --oa-copy: var(--visual-copy);
  --oa-muted: var(--visual-faint);
  --oa-line: var(--visual-line);
  --oa-line-soft: var(--visual-line-soft);
  --oa-blue: var(--visual-accent);
  --oa-blue-soft: var(--visual-accent-soft);
  --oa-radius-sm: var(--visual-radius-sm);
  --oa-radius: var(--visual-radius);
  --oa-radius-lg: var(--visual-radius-lg);
  --oa-shadow: var(--visual-shadow);

  --qx2-canvas: var(--visual-canvas);
  --qx2-surface: var(--visual-surface);
  --qx2-surface-soft: var(--visual-surface-soft);
  --qx2-ink: var(--visual-ink);
  --qx2-secondary: var(--visual-copy);
  --qx2-tertiary: var(--visual-faint);
  --qx2-line: var(--visual-line);
  --qx2-line-soft: var(--visual-line-soft);
  --qx2-blue: var(--visual-accent);
  --qx2-blue-soft: var(--visual-accent-soft);
  --qx2-radius-sm: var(--visual-radius-sm);
  --qx2-radius: var(--visual-radius);
  --qx2-radius-lg: var(--visual-radius-lg);
  --qx2-shadow: var(--visual-shadow);
  --qx2-shadow-hover: var(--visual-shadow-hover);

  /* Shared presentation contracts. Page modules consume these values without
   * changing their information architecture or interaction model. */
  --visual-surface-raised: color-mix(in srgb, var(--visual-surface) 96%, white 4%);
  --visual-surface-muted: color-mix(in srgb, var(--visual-surface-soft) 78%, var(--visual-surface));
  --visual-line-strong: color-mix(in srgb, var(--visual-line) 78%, var(--visual-ink) 22%);
  --visual-selection: color-mix(in srgb, var(--visual-accent-soft) 76%, var(--visual-surface));
  --visual-focus-ring: color-mix(in srgb, var(--visual-accent) 24%, transparent);
  --visual-shadow-soft: 0 1px 2px color-mix(in srgb, var(--visual-ink) 5%, transparent), 0 8px 22px color-mix(in srgb, var(--visual-ink) 6%, transparent);
  --visual-shadow-lift: 0 18px 48px color-mix(in srgb, var(--visual-ink) 14%, transparent);

  background: var(--visual-canvas);
  accent-color: var(--visual-accent);
  caret-color: var(--visual-accent);
  scrollbar-color: color-mix(in srgb, var(--visual-accent) 38%, transparent) transparent;
  scrollbar-width: thin;
}

html[data-visual-style] ::selection {
  background: var(--visual-accent-soft);
  color: var(--visual-accent-deep);
}

html[data-visual-style] body {
  background: var(--visual-canvas-pattern);
  color: var(--visual-ink);
}

html[data-visual-style] .app-layout {
  min-height: 100dvh;
  background: var(--visual-canvas-pattern);
}

html[data-visual-style] .mobile-header {
  border-bottom: 1px solid var(--visual-nav-line);
  background: var(--visual-nav);
  color: var(--visual-nav-text);
  box-shadow: 0 2px 12px color-mix(in srgb, var(--visual-ink) 12%, transparent);
}

html[data-visual-style] .mobile-hamburger {
  color: currentColor;
}

html[data-visual-style] :is(button, input, select, textarea) {
  font-family: inherit;
}

html[data-visual-style] :is(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--visual-accent) 28%, transparent);
  outline-offset: 2px;
}

/* Shared application frame */
html[data-visual-style] .sidebar {
  border-right: 1px solid var(--visual-nav-line);
  background: var(--visual-nav);
  color: var(--visual-nav-text);
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

html[data-visual-style] .sidebar-brand {
  border-bottom-color: var(--visual-nav-line);
}

html[data-visual-style] .sidebar-brand h1 {
  color: var(--visual-nav-text);
}

html[data-visual-style] .sidebar-brand p,
html[data-visual-style] .nav-group-label,
html[data-visual-style] .sf-version {
  color: var(--visual-nav-muted);
}

html[data-visual-style] .nav-item {
  border-left-color: transparent;
  border-radius: var(--visual-radius-sm);
  color: var(--visual-nav-muted);
}

html[data-visual-style] .nav-item:hover {
  background: color-mix(in srgb, var(--visual-accent-soft) 62%, transparent);
  color: var(--visual-nav-text);
}

html[data-visual-style] .nav-item.active {
  border-left-color: var(--visual-accent);
  background: var(--visual-nav-active);
  color: var(--visual-nav-active-text);
}

html[data-visual-style] .nav-item .nav-icon {
  border-radius: calc(var(--visual-radius-sm) - 2px);
  color: currentColor;
}

html[data-visual-style] .sidebar-footer {
  border-top-color: var(--visual-nav-line);
}

html[data-visual-style] .sf-btn {
  border-color: var(--visual-nav-line);
  border-radius: var(--visual-radius-sm);
  color: var(--visual-nav-muted);
}

html[data-visual-style] .sf-btn:hover {
  border-color: color-mix(in srgb, var(--visual-accent) 28%, var(--visual-nav-line));
  background: color-mix(in srgb, var(--visual-accent-soft) 58%, transparent);
  color: var(--visual-nav-text);
}

html[data-visual-style] .project-toolbar {
  border-color: var(--visual-line);
  background: color-mix(in srgb, var(--visual-surface) 94%, var(--visual-accent) 6%);
  box-shadow: 0 8px 26px color-mix(in srgb, var(--visual-ink) 7%, transparent);
}

html[data-visual-style] :is(.project-switch-trigger, .user-info-bar, .global-work-mode-options) {
  border-color: var(--visual-line);
  background: var(--visual-surface);
  color: var(--visual-ink);
}

html[data-visual-style] .global-work-mode-options button.is-active {
  background: var(--visual-surface);
  color: var(--visual-accent-deep);
  box-shadow: 0 1px 4px color-mix(in srgb, var(--visual-ink) 13%, transparent);
}

html[data-visual-style] .user-avatar {
  background: var(--visual-accent-deep);
  color: #fff;
}

html[data-visual-style] :is(.project-switch-trigger small, .project-label, .worktop-kicker, .global-work-mode > span, .global-work-mode > small) {
  color: var(--visual-copy);
}

html[data-visual-style] .main-content {
  background: var(--visual-canvas-pattern);
}

html[data-visual-style] .breadcrumb {
  color: var(--visual-copy);
}

html[data-visual-style] .breadcrumb :is(.bc-link, .bc-label) {
  color: var(--visual-copy);
}

html[data-visual-style] .breadcrumb :is(.bc-current, strong) {
  color: var(--visual-ink);
}

html[data-visual-style] :is(.btn-primary, button.btn-primary) {
  border-color: var(--visual-accent);
  background: var(--visual-accent);
  color: #fff;
}

html[data-visual-style] :is(.btn-primary, button.btn-primary):hover {
  border-color: var(--visual-accent-deep);
  background: var(--visual-accent-deep);
}

html[data-visual-style] :is(.btn-secondary, button.btn-secondary) {
  border-color: var(--visual-line);
  background: var(--visual-surface);
  color: var(--visual-copy);
}

html[data-visual-style] :is(.form-card, .section, .result-header, .stat-card, .unified-page-heading, .app-page-hero) {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-lg);
  background-color: var(--visual-surface);
  box-shadow: var(--visual-shadow);
}

html[data-visual-style] :is(.form-card, .section, .result-header, .stat-card, .unified-page-heading, .app-page-hero) :is(h1, h2, h3, strong) {
  color: var(--visual-ink);
}

html[data-visual-style] :is(.form-card, .section, .result-header, .stat-card, .unified-page-heading, .app-page-hero) :is(p, small) {
  color: var(--visual-copy);
}

/* Dashboard is the product's visual front door and must participate fully. */
html[data-visual-style] #view-dashboard :is(.dash-director-current-stack, .dash-director-current-action) {
  border-color: var(--visual-accent-deep);
  border-radius: var(--visual-radius-lg);
  background: var(--visual-accent);
  box-shadow: 0 18px 34px color-mix(in srgb, var(--visual-accent) 24%, transparent);
}

html[data-visual-style] #view-dashboard .dash-director-current-stack .dash-director-current-action {
  border-radius: var(--visual-radius-lg) var(--visual-radius-lg) 0 0;
}

html[data-visual-style] #view-dashboard .dash-director-current-action:hover {
  background: var(--visual-accent-deep);
  box-shadow: 0 21px 38px color-mix(in srgb, var(--visual-accent) 29%, transparent);
}

html[data-visual-style] #view-dashboard .dash-director-project-switch {
  border-color: var(--visual-accent-deep);
  border-top-color: rgba(255, 255, 255, .22);
  border-radius: 0 0 var(--visual-radius-lg) var(--visual-radius-lg);
  background: var(--visual-accent-deep);
}

html[data-visual-style] #view-dashboard .dash-director-project-switch:hover {
  background: color-mix(in srgb, var(--visual-accent-deep) 84%, #000);
}

html[data-visual-style] #view-dashboard :is(.dash-director-kpi-rail, .dash-visual-panel) {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-lg);
  background: var(--visual-surface);
  box-shadow: var(--visual-shadow);
}

html[data-visual-style] #view-dashboard :is(.dash-director-kpi, .dash-visual-panel > header, .dash-stage-distribution > footer) {
  border-color: var(--visual-line-soft);
}

html[data-visual-style] #view-dashboard :is(.dash-header h1, .dash-visual-panel > header h2, .dash-stage-node > strong, .dash-stage-node > b) {
  color: var(--visual-ink);
}

html[data-visual-style] #view-dashboard :is(.dash-subtitle, .dash-visual-panel > header h2 small, .dash-stage-node > small, .dash-stage-distribution > footer) {
  color: var(--visual-copy);
}

html[data-visual-style] #view-dashboard .dash-visual-panel > header button,
html[data-visual-style] #view-dashboard .dash-stage-node.is-active > strong {
  color: var(--visual-accent-deep);
}

html[data-visual-style] #view-dashboard .dash-coverage-heading select {
  border-color: var(--visual-line);
  color: var(--visual-ink);
  background: var(--visual-surface-soft);
}

html[data-visual-style] #view-dashboard .dash-coverage-heading select:focus-visible {
  border-color: var(--visual-accent);
  outline-color: var(--visual-accent-soft);
}

html[data-visual-style] #view-dashboard .dash-stage-node-icon {
  border-color: var(--visual-line);
  color: var(--visual-copy);
  background: var(--visual-surface);
}

html[data-visual-style] #view-dashboard .dash-stage-node:hover .dash-stage-node-icon {
  border-color: var(--visual-accent);
  box-shadow: 0 0 0 5px var(--visual-accent-soft);
}

html[data-visual-style] #view-dashboard .dash-stage-node.has-projects .dash-stage-node-icon {
  border-color: color-mix(in srgb, var(--visual-accent) 44%, var(--visual-line));
  color: var(--visual-accent-deep);
  background: var(--visual-accent-soft);
}

html[data-visual-style] #view-dashboard .dash-stage-node.is-active .dash-stage-node-icon {
  border-color: var(--visual-accent);
  color: #fff;
  background: var(--visual-accent);
  box-shadow: 0 0 0 6px var(--visual-accent-soft);
}

html[data-visual-style] #view-dashboard .dash-stage-connector {
  background: var(--visual-line);
}

html[data-visual-style] #view-dashboard .dash-stage-node.has-projects .dash-stage-connector {
  background: color-mix(in srgb, var(--visual-accent) 50%, var(--visual-line));
}

html[data-visual-style] #view-dashboard .dash-coverage-row button.is-in-progress {
  color: var(--visual-accent-deep);
  background: var(--visual-accent-soft);
}

html[data-visual-style] #view-dashboard :is(.dash-coverage-summary, .dash-director-coverage-records article, .dash-director-coverage-records button) {
  border-color: var(--visual-line-soft);
  background: var(--visual-surface-soft);
}

html[data-visual-style] #view-dashboard :is(.dash-coverage-summary > span, .dash-director-coverage-metrics, .dash-director-coverage-metrics > span, .dash-director-coverage-facts, .dash-director-coverage-facts > div, .dash-director-coverage-records, .dash-director-coverage-records article, .dash-director-coverage-records button) {
  border-color: var(--visual-line-soft);
}

html[data-visual-style] #view-dashboard :is(.dash-coverage-summary b, .dash-director-coverage-metrics b, .dash-director-coverage-gaps h3, .dash-director-coverage-gaps strong, .dash-director-coverage-facts dd, .dash-director-coverage-records strong) {
  color: var(--visual-ink);
}

html[data-visual-style] #view-dashboard :is(.dash-coverage-summary small, .dash-director-coverage-metrics strong, .dash-director-coverage-gaps b, .dash-director-coverage-facts dt, .dash-director-coverage-records summary) {
  color: var(--visual-copy);
}

html[data-visual-style] #view-dashboard :is(.dash-coverage-summary em, .dash-coverage-legend > em, .dash-director-coverage-metrics small, .dash-director-coverage-gaps small, .dash-director-coverage-note, .dash-director-coverage-records small) {
  color: var(--visual-faint);
}

html[data-visual-style] #view-dashboard .dash-director-coverage-gaps > button:hover strong,
html[data-visual-style] #view-dashboard .dash-director-coverage-records svg {
  color: var(--visual-accent-deep);
}

html[data-visual-style] #view-dashboard .dash-director-coverage-actions > button {
  border-color: var(--visual-line);
  color: var(--visual-copy);
  background: var(--visual-surface);
}

html[data-visual-style] #view-dashboard .dash-director-coverage-actions > button.is-primary {
  border-color: var(--visual-accent);
  color: #fff;
  background: var(--visual-accent);
}



html[data-visual-style="weave"] #view-dashboard :is(.dash-director-kpi-rail, .dash-visual-panel) {
  background-image: radial-gradient(circle at 98% 2%, rgba(52, 118, 109, .08), transparent 24%);
}

/* -------------------------------------------------------------------------
 * Batch A presentation contract: shell + management entry pages.
 * These rules intentionally style only appearance. Business fields, order,
 * state names, navigation and actions remain owned by their existing modules.
 * ---------------------------------------------------------------------- */

body:is(
  [data-active-view="dashboard"],
  [data-active-view="history"],
  [data-active-view="auditplan"],
  [data-active-view="remediation"]
) .main-content {
  min-height: calc(100dvh - 92px);
}

html[data-visual-style] :is(
  #view-dashboard,
  #view-history,
  #view-auditplan,
  #view-remediation
) {
  color: var(--visual-ink);
}


html[data-visual-style] :is(
  #view-dashboard,
  #view-history,
  #view-auditplan,
  #view-remediation
) :is(input, select, textarea):focus-visible,
html[data-visual-style] :is(
  #view-dashboard,
  #view-history,
  #view-auditplan,
  #view-remediation
) button:focus-visible {
  outline: 3px solid var(--visual-focus-ring);
  outline-offset: 2px;
}

/* Dashboard: retain the existing cockpit layout while giving every nested
 * surface the selected visual language. */
html[data-visual-style] #view-dashboard :is(
  .dash-director-kpi,
  .dash-risk-bars,
  .dash-remediation-summary,
  .dash-coverage-table,
  .dash-priority-table,
  .dash-director-detail-panel,
  .dash-director-panel-section,
  .dash-director-coverage-list
) {
  border-color: var(--visual-line-soft);
  background-color: var(--visual-surface);
}

html[data-visual-style] #view-dashboard :is(
  .dash-visual-empty,
  .dash-coverage-summary,
  .dash-director-panel-empty,
  .dash-director-item-next
) {
  border-color: var(--visual-line-soft);
  background-color: var(--visual-surface-muted);
  color: var(--visual-copy);
}

html[data-visual-style] #view-dashboard .dash-visual-empty button {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-sm);
  background: var(--visual-surface-raised);
  color: var(--visual-copy);
}

html[data-visual-style] #view-dashboard .dash-visual-empty button:last-child {
  border-color: var(--visual-accent);
  background: var(--visual-accent);
  color: #fff;
}

html[data-visual-style] #view-dashboard .dash-visual-empty button:hover {
  border-color: var(--visual-accent);
  color: var(--visual-accent-deep);
}

html[data-visual-style] #view-dashboard .dash-visual-empty button:last-child:hover {
  border-color: var(--visual-accent-deep);
  background: var(--visual-accent-deep);
  color: #fff;
}

/* Project center: the selected workflow row is navigation emphasis, so it
 * follows the visual accent; business status chips keep their own colors. */
html[data-visual-style] #view-history .pt-oa-center {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-lg);
  background: var(--visual-surface);
  box-shadow: var(--visual-shadow-soft);
}

html[data-visual-style] #view-history :is(
  .pt-oa-header,
  .pt-oa-tabs,
  .pt-oa-matrix-head,
  .pt-oa-detail > header,
  .pt-oa-history > header,
  .pt-oa-history-list article,
  .pt-oa-meta,
  .pt-oa-state-rules dl > div
) {
  border-color: var(--visual-line-soft);
}

html[data-visual-style] #view-history :is(
  .pt-oa-header,
  .pt-oa-tabs,
  .pt-oa-workarea > main,
  .pt-oa-detail,
  .pt-oa-history,
  .pt-oa-matrix-row
) {
  background-color: var(--visual-surface);
}

html[data-visual-style] #view-history :is(
  .pt-oa-matrix-head,
  .pt-oa-detail-empty,
  .pt-oa-object,
  .pt-oa-responsibility,
  .pt-oa-state-rules,
  .pt-oa-audit-record,
  .pt-oa-history > header
) {
  background-color: var(--visual-surface-muted);
}

html[data-visual-style] #view-history :is(
  .pt-oa-project select,
  .pt-oa-history-tools select,
  .pt-oa-history-search input,
  .pt-oa-history-clear,
  .pt-oa-pagination button
) {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-sm);
  background: var(--visual-surface-raised);
  color: var(--visual-ink);
}

html[data-visual-style] #view-history .pt-oa-tabs button.is-active {
  color: var(--visual-accent-deep);
}

html[data-visual-style] #view-history .pt-oa-tabs button.is-active::after,
html[data-visual-style] #view-history .pt-oa-pagination button.is-current {
  border-color: var(--visual-accent);
  background: var(--visual-accent);
  color: #fff;
}

html[data-visual-style] #view-history .pt-oa-matrix-row:hover {
  background: var(--visual-surface-muted);
}

html[data-visual-style] #view-history .pt-oa-matrix-row.is-selected {
  background: var(--visual-selection);
  box-shadow: inset 3px 0 var(--visual-accent);
}

html[data-visual-style] #view-history :is(
  .pt-oa-node-title strong,
  .pt-oa-detail h3,
  .pt-oa-object > strong,
  .pt-oa-responsibility strong,
  .pt-oa-history-list strong
) {
  color: var(--visual-ink);
}

html[data-visual-style] #view-history :is(
  .pt-oa-project label,
  .pt-oa-project-meta small,
  .pt-oa-project-meta em,
  .pt-oa-node-title small,
  .pt-oa-detail header span,
  .pt-oa-detail section > span,
  .pt-oa-history-list small,
  .pt-oa-history-list time
) {
  color: var(--visual-faint);
}

/* Annual plan: warm/cool surfaces follow the selected style. Project status
 * colors and schedule variance colors remain semantic and are not remapped. */
html[data-visual-style] #view-auditplan :is(
  .ap-year-toolbar,
  .ap-coverage-map,
  .ap-execution-ledger,
  .ap-landing-empty
) {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-lg);
  background-color: var(--visual-surface);
  box-shadow: var(--visual-shadow-soft);
}

html[data-visual-style] #view-auditplan :is(
  .ap-coverage-head,
  .ap-coverage-chart-panel,
  .ap-coverage-module,
  .ap-coverage-map > footer,
  .ap-ledger-head,
  .ap-ledger-table th,
  .ap-ledger-table td
) {
  border-color: var(--visual-line-soft);
}

html[data-visual-style] #view-auditplan :is(
  .ap-coverage-chart-panel,
  .ap-coverage-map > footer,
  .ap-ledger-table .ap-ledger-field-head th,
  .ap-coverage-topic-summary
) {
  background-color: var(--visual-surface-muted);
}

html[data-visual-style] #view-auditplan :is(
  .ap-year-toolbar select,
  .ap-ledger-project-action,
  .ap-coverage-module-actions button
) {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-sm);
  background: var(--visual-surface-raised);
  color: var(--visual-copy);
}

html[data-visual-style] #view-auditplan :is(
  .ap-coverage-head h3,
  .ap-project-status-panel > h3,
  .ap-ledger-head h3,
  .ap-coverage-ring-center strong,
  .ap-coverage-module strong,
  .ap-ledger-table .ap-ledger-field-head th
) {
  color: var(--visual-ink);
}

html[data-visual-style] #view-auditplan :is(
  .ap-coverage-head p,
  .ap-coverage-head-actions > span,
  .ap-coverage-ring-center small,
  .ap-coverage-legend span,
  .ap-coverage-module small,
  .ap-coverage-map > footer,
  .ap-ledger-suite .ap-landing-metric span,
  .ap-ledger-suite .ap-landing-metric small
) {
  color: var(--visual-copy);
}

html[data-visual-style] #view-auditplan .ap-coverage-ring-track {
  stroke: var(--visual-line-soft);
}

html[data-visual-style] #view-auditplan .ap-coverage-ring-segment.is-not-covered {
  stroke: var(--visual-line);
}

html[data-visual-style] #view-auditplan .ap-coverage-ring-segment.is-not-applicable {
  stroke: var(--visual-surface-soft);
}

html[data-visual-style] #view-auditplan .ap-coverage-module:hover {
  background: var(--visual-surface-muted);
}

html[data-visual-style] #view-auditplan .ap-ledger-project-action:hover {
  border-color: var(--visual-accent);
  background: var(--visual-accent-soft);
  color: var(--visual-accent-deep);
}

/* Cross-project remediation: selected filters and rows use theme emphasis;
 * overdue, warning, verification and closure colors keep audit semantics. */
html[data-visual-style] #view-remediation .remediation-center {
  min-height: calc(100dvh - 126px);
}

html[data-visual-style] #view-remediation .rc-hero {
  border-color: var(--visual-line);
}

html[data-visual-style] #view-remediation .rc-hero :is(h1, strong) {
  color: var(--visual-ink);
}

html[data-visual-style] #view-remediation .rc-hero :is(p, small) {
  color: var(--visual-copy);
}

html[data-visual-style] #view-remediation .rc-hero > div:first-child > span {
  color: var(--visual-accent-deep);
}

html[data-visual-style] #view-remediation :is(
  .rc-metric,
  .rc-toolbar,
  .rc-workbench,
  .rc-boundary,
  .rc-ai-result
) {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius);
  background-color: var(--visual-surface);
  box-shadow: var(--visual-shadow-soft);
}

html[data-visual-style] #view-remediation .rc-metric {
  box-shadow: none;
}

html[data-visual-style] #view-remediation .rc-metric.active {
  border-color: var(--visual-accent);
  background: var(--visual-selection);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--visual-accent) 16%, transparent);
}

html[data-visual-style] #view-remediation :is(
  .rc-toolbar input,
  .rc-toolbar select
) {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-sm);
  background: var(--visual-surface-raised);
  color: var(--visual-ink);
}

html[data-visual-style] #view-remediation .rc-list {
  border-color: var(--visual-line-soft);
  background: var(--visual-surface-muted);
}

html[data-visual-style] #view-remediation :is(.rc-row, .rc-detail) {
  border-color: var(--visual-line-soft);
  background-color: var(--visual-surface);
}

html[data-visual-style] #view-remediation .rc-row:hover {
  border-color: color-mix(in srgb, var(--visual-accent) 44%, var(--visual-line));
  background: var(--visual-surface-raised);
}

html[data-visual-style] #view-remediation .rc-row.active {
  border-color: var(--visual-accent);
  background: var(--visual-selection);
  box-shadow: 0 0 0 2px var(--visual-focus-ring);
}

html[data-visual-style] #view-remediation :is(
  .rc-row strong,
  .rc-detail-head h2,
  .rc-empty-detail strong,
  .rc-boundary strong
) {
  color: var(--visual-ink);
}

html[data-visual-style] #view-remediation :is(
  .rc-row small,
  .rc-detail-head p,
  .rc-empty-detail span,
  .rc-boundary span,
  .rc-toolbar label,
  .rc-toolbar > span
) {
  color: var(--visual-copy);
}

/* -------------------------------------------------------------------------
 * Batch B presentation contract: pre-audit planning pages.
 * The risk register, scheme ledger and material register keep their existing
 * data, columns, controls and workflow; only their visual surfaces are themed.
 * ---------------------------------------------------------------------- */

body:is(
  [data-active-view="home"],
  [data-active-view="taskarrange"],
  [data-active-view="materials"]
) .main-content {
  min-height: calc(100dvh - 92px);
}

html[data-visual-style] :is(
  #view-home,
  #view-taskarrange,
  #view-materials
) {
  color: var(--visual-ink);
}


html[data-visual-style] :is(
  #view-home,
  #view-taskarrange,
  #view-materials
) :is(input, select, textarea):focus-visible,
html[data-visual-style] :is(
  #view-home,
  #view-taskarrange,
  #view-materials
) button:focus-visible {
  outline: 3px solid var(--visual-focus-ring);
  outline-offset: 2px;
}

/* Risk assessment: preserve risk-level colors and only theme navigation,
 * document surfaces, selection and input affordances. */
html[data-visual-style] #view-home :is(
  .pra-risk-table-head,
  .pra-risk-overview-band,
  .pra-risk-register-head,
  .pra-risk-register-sheet,
  .pra-risk-overview-metrics,
  .pra-risk-overview-levels > div
) {
  border-color: var(--visual-line) !important;
}

html[data-visual-style] #view-home :is(
  .pra-risk-table-head,
  .pra-risk-register-head,
  .pra-risk-register-sheet,
  .pra-risk-overview-metrics,
  .pra-risk-overview-levels > div
) {
  background-color: var(--visual-surface) !important;
}

html[data-visual-style] #view-home .pra-risk-overview-band {
  background-color: var(--visual-surface-soft) !important;
}

html[data-visual-style] #view-home .pra-risk-register-sheet th {
  border-color: var(--visual-line-soft) !important;
  background: var(--visual-surface-muted) !important;
  color: var(--visual-copy) !important;
}

html[data-visual-style] #view-home .pra-risk-register-sheet td {
  border-color: var(--visual-line-soft) !important;
  background: var(--visual-surface) !important;
}

html[data-visual-style] #view-home .pra-risk-register-sheet tbody tr:hover td {
  background: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-home :is(
  .pra-risk-object-heading h2,
  .pra-risk-register-head h3,
  .pra-risk-overview-summary > header strong,
  .pra-risk-overview-levels > header strong
) {
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-home :is(
  .pra-risk-object-heading span,
  .pra-risk-object-heading small,
  .pra-risk-register-head p,
  .pra-risk-overview-levels span
) {
  color: var(--visual-copy) !important;
}

/* Audit materials: retain the existing single register and all status colors,
 * but remove the fixed cool-blue treatment from neutral UI chrome. */
html[data-visual-style] #view-materials .pmat-clean-page {
  --pmat-border: var(--visual-line);
  --pmat-muted: var(--visual-faint);
  --pmat-ink: var(--visual-ink);
  --pmat-soft: var(--visual-surface-soft);
}

html[data-visual-style] #view-materials :is(
  .project-flow-nav,
  .pmat-ledger,
  .pmat-editor,
  .pmat-reference-primary,
  .pmat-tracking-panel
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-materials :is(
  .pmat-list-head,
  .pmat-view-tabs,
  .pmat-ledger-filters,
  .pmat-pagination,
  .pmat-action-panel,
  .pmat-supplement-panel
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-materials .pmat-view-tabs button {
  color: var(--visual-copy);
}

html[data-visual-style] #view-materials .pmat-view-tabs button:hover,
html[data-visual-style] #view-materials .pmat-view-tabs button.is-active {
  color: var(--visual-accent-deep);
}

html[data-visual-style] #view-materials .pmat-view-tabs button.is-active {
  border-bottom-color: var(--visual-accent);
}

html[data-visual-style] #view-materials .pmat-view-tabs b {
  background: var(--visual-surface-soft);
  color: var(--visual-faint);
}

html[data-visual-style] #view-materials .pmat-view-tabs .is-active b {
  background: var(--visual-accent-soft);
  color: var(--visual-accent-deep);
}

html[data-visual-style] #view-materials :is(
  .pmat-list-head strong,
  .pmat-name-cell strong,
  .pmat-pagination > div strong
) {
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-materials :is(
  .pmat-list-head span,
  .pmat-list-head small,
  .pmat-source-label,
  .pmat-receipt-cell span,
  .pmat-field-hint,
  .pmat-pagination
) {
  color: var(--visual-copy) !important;
}

html[data-visual-style] #view-materials .pmat-clean-page .pmat-ledger-table th {
  border-color: var(--visual-line-soft) !important;
  background: var(--visual-surface-muted) !important;
  color: var(--visual-copy) !important;
}

html[data-visual-style] #view-materials .pmat-clean-page .pmat-ledger-table td {
  border-color: var(--visual-line-soft) !important;
  background: var(--visual-surface) !important;
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-materials .pmat-clean-page .pmat-ledger-table tbody tr:hover td {
  background: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-materials :is(
  .pmat-ledger-filters input,
  .pmat-ledger-filters select,
  .pmat-pagination select,
  .pmat-pagination button,
  .pmat-row-action-line button,
  .pmat-row-action-line .pmat-upload-label
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface-raised) !important;
  color: var(--visual-copy) !important;
}

html[data-visual-style] #view-materials .pmat-pagination button.is-current {
  border-color: var(--visual-accent) !important;
  background: var(--visual-accent-soft) !important;
  color: var(--visual-accent-deep) !important;
}

html[data-visual-style] #view-materials .pmat-row-action-line :is(button, .pmat-upload-label):hover {
  border-color: var(--visual-accent) !important;
  background: var(--visual-accent-soft) !important;
  color: var(--visual-accent-deep) !important;
}

html[data-visual-style] #view-materials .pmat-row-action-line button.is-danger {
  color: #b42318 !important;
}


html[data-visual-style="weave"] :is(
  #view-home .pra-risk-register-sheet,
  #view-taskarrange .wf-scheme-brief,
  #view-taskarrange .wf-program-table,
  #view-materials .pmat-ledger
) {
  background-image: radial-gradient(circle at 99% 1%, transparent 0 38px, rgba(52, 118, 109, .06) 39px 40px, transparent 41px 72px);
}

/* -------------------------------------------------------------------------
 * Batch C presentation contract: program execution + interview + workpaper collection.
 * The existing panes, fields, actions and workflow states remain untouched.
 * ---------------------------------------------------------------------- */

body:is(
  [data-active-view="walkthrough"],
  [data-active-view="auditinterview"],
  [data-active-view="workpaper"]
) .main-content {
  min-height: calc(100dvh - 92px);
}

/* Program execution retains its approved three-column structure and tool
 * provenance colors. Only its existing presentation tokens follow the chosen
 * application style. */
html[data-visual-style] body[data-active-view="walkthrough"] {
  --pe-ink: var(--visual-ink);
  --pe-muted: var(--visual-copy);
  --pe-line: var(--visual-line);
  --pe-soft-line: var(--visual-line-soft);
  --pe-blue: var(--visual-accent);
  --pe-blue-soft: var(--visual-accent-soft);
  --pe-surface: var(--visual-surface);
  --pe-surface-soft: var(--visual-surface-soft);
  background: var(--visual-canvas-pattern);
}

html[data-visual-style] body[data-active-view="auditinterview"] {
  --aiwa-canvas: var(--visual-canvas);
  --aiwa-surface: color-mix(in srgb, var(--visual-surface) 96%, transparent);
  --aiwa-surface-solid: var(--visual-surface);
  --aiwa-sidebar: var(--visual-surface-soft);
  --aiwa-line: var(--visual-line-soft);
  --aiwa-line-strong: var(--visual-line);
  --aiwa-ink: var(--visual-ink);
  --aiwa-muted: var(--visual-copy);
  --aiwa-blue: var(--visual-accent);
  --aiwa-blue-soft: var(--visual-accent-soft);
  --aiwa-shadow: var(--visual-shadow-soft);
}

html[data-visual-style] #view-auditinterview :is(
  .aiw-panel,
  .aiw-body,
  .aiw-workbench,
  .aiw-paper-stage
) {
  background-color: var(--visual-canvas) !important;
}

html[data-visual-style] #view-auditinterview .aiw-session-nav {
  border-color: var(--visual-line) !important;
  background: color-mix(in srgb, var(--visual-surface-soft) 94%, transparent) !important;
}

html[data-visual-style] #view-auditinterview :is(
  .aiw-work-sheet,
  .aiw-tool-panel
) {
  border-color: var(--visual-line) !important;
  border-radius: var(--visual-radius) !important;
  background: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-auditinterview :is(
  .aiw-work-sheet-head,
  .aiw-task-summary,
  .aiw-basic-collapse > summary,
  .aiw-tool-rail,
  .aiw-footer
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-auditinterview .aiw-session-tab:hover {
  border-color: var(--visual-line) !important;
  background: var(--visual-surface-raised) !important;
}

html[data-visual-style] #view-auditinterview .aiw-session-tab.is-active {
  border-color: color-mix(in srgb, var(--visual-accent) 42%, var(--visual-line)) !important;
  background: var(--visual-selection) !important;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--visual-accent) 8%, transparent) !important;
}

html[data-visual-style] #view-auditinterview :is(
  .aiw-empty-actions button.is-primary,
  .aiw-tool-rail > button.is-primary,
  .aiw-tool-rail > button.is-active
) {
  border-color: var(--visual-accent) !important;
  background-color: var(--visual-accent) !important;
  color: #fff !important;
}

html[data-visual-style] #view-auditinterview .aiw-session-tab.is-active::before {
  background: var(--visual-accent) !important;
}

html[data-visual-style] #view-auditinterview :is(
  .aiw-session-nav-head > button.is-primary,
  .aiw-empty-actions button,
  .aiw-tool-rail > button,
  .aiw-tool-menu > summary,
  .aiw-work-sheet-head small
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface-raised) !important;
  color: var(--visual-copy) !important;
}

html[data-visual-style] #view-auditinterview :is(
  .aiw-session-nav-head > button.is-primary,
  .aiw-session-tab.is-active strong,
  .aiw-dossier-outline button.is-active,
  .aiw-cross-review-trigger.is-active
) {
  color: var(--visual-accent-deep) !important;
}

html[data-visual-style] #view-auditinterview .aiw-question-empty {
  border-color: var(--visual-line-strong) !important;
  background: var(--visual-surface-raised) !important;
}

html[data-visual-style] #view-auditinterview :is(
  .aiw-work-sheet-head h3,
  .aiw-question-empty strong,
  .aiw-task-summary strong,
  .aiw-basic-collapse > summary strong
) {
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-auditinterview :is(
  .aiw-work-sheet-head span,
  .aiw-question-empty span,
  .aiw-task-summary span,
  .aiw-basic-collapse > summary span
) {
  color: var(--visual-copy) !important;
}



html[data-visual-style="weave"] #view-auditinterview .aiw-paper-stage {
  background-image: repeating-radial-gradient(ellipse at 100% 0%, transparent 0 46px, rgba(52, 118, 109, .055) 47px 48px, transparent 49px 76px) !important;
}

html[data-visual-style] body[data-active-view="workpaper"] {
  --wpm-ink: var(--visual-ink);
  --wpm-copy: var(--visual-copy);
  --wpm-muted: var(--visual-faint);
  --wpm-line: var(--visual-line);
  --wpm-line-soft: var(--visual-line-soft);
  --wpm-blue: var(--visual-accent);
  --wpm-blue-soft: var(--visual-accent-soft);
  --wpm-canvas: var(--visual-canvas);
  --wpp-ink: var(--visual-ink);
  --wpp-text: var(--visual-copy);
  --wpp-muted: var(--visual-faint);
  --wpp-line: var(--visual-line);
  --wpp-line-soft: var(--visual-line-soft);
  --wpp-surface: var(--visual-surface);
  --wpp-surface-soft: var(--visual-surface-soft);
  --wpp-blue: var(--visual-accent);
  --wpp-blue-soft: var(--visual-accent-soft);
}

html[data-visual-style] body[data-active-view="workpaper"] .main-content,
html[data-visual-style] #view-workpaper .wpm-workpaper-desk {
  background-color: var(--visual-surface) !important;
}

html[data-visual-style] #view-workpaper :is(
  .wpm-desk-list,
  .wpm-directory-head,
  .wpm-document-actions
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-workpaper :is(
  .wpm-desk-detail,
  .wpm-document-head,
  .wpm-document-scroll,
  .wpm-formal-document
) {
  background-color: var(--visual-surface) !important;
}

html[data-visual-style] #view-workpaper :is(
  .wpm-directory-search .wpm-search,
  .wpm-filter-menu > summary,
  .wpm-filter-menu[open] .wpm-family-nav,
  .wpm-directory-actions .btn,
  .wpm-document-open,
  .wpm-more-actions > summary,
  .wpm-more-actions[open] > div
) {
  border-color: var(--visual-line) !important;
  background: var(--visual-surface-raised) !important;
  color: var(--visual-copy) !important;
}

html[data-visual-style] #view-workpaper .wpm-paper-row:hover {
  border-color: color-mix(in srgb, var(--visual-accent) 36%, var(--visual-line)) !important;
  background: var(--visual-surface-raised) !important;
}

html[data-visual-style] #view-workpaper .wpm-paper-row.active {
  border-color: color-mix(in srgb, var(--visual-accent) 44%, var(--visual-line)) !important;
  background: var(--visual-selection) !important;
  box-shadow: inset 2px 0 0 var(--visual-accent) !important;
}

html[data-visual-style] #view-workpaper :is(
  .wpm-document-paragraph,
  .wpm-document-scope dt,
  .wpm-workpaper-content,
  .wpm-document-table th,
  .wpm-trace-lead,
  .wpm-supporting-facts span,
  .project-linked-knowledge-cards
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-workpaper :is(
  .wpm-formal-document section,
  .wpm-document-scope,
  .wpm-document-scope > div,
  .wpm-document-table-wrap,
  .wpm-document-table th,
  .wpm-document-table td,
  .wpm-content-block + .wpm-content-block,
  .wpm-trace-disclosure,
  .wpm-supporting-context,
  .wpm-evidence-chain
) {
  border-color: var(--visual-line-soft) !important;
}

html[data-visual-style] #view-workpaper .wpm-document-body-section {
  border-top-color: color-mix(in srgb, var(--visual-accent) 55%, var(--visual-line)) !important;
}

html[data-visual-style] #view-workpaper :is(
  .wpm-document-head h2,
  .wpm-formal-document h3,
  .wpm-content-block h4,
  .wpm-paper-row > span strong,
  .wpm-directory-head strong
) {
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-workpaper :is(
  .wpm-document-head h2 span,
  .wpm-document-open:hover,
  .wpm-trace-tabs button.active,
  .wpm-responsibility-list li > span
) {
  color: var(--visual-accent-deep) !important;
}

html[data-visual-style] #view-workpaper .wpm-trace-tabs button.active {
  border-color: color-mix(in srgb, var(--visual-accent) 38%, var(--visual-line)) !important;
  background: var(--visual-selection) !important;
}



html[data-visual-style="weave"] #view-workpaper .wpm-document-scroll {
  background-image: radial-gradient(circle at 100% 0%, transparent 0 44px, rgba(52, 118, 109, .05) 45px 46px, transparent 47px 78px) !important;
}

/* -------------------------------------------------------------------------
 * Batch D presentation contract: finding consolidation, communication,
 * report drafting and remediation tracking. The business-status palette is
 * deliberately left intact; these mappings affect navigation and chrome only.
 * ---------------------------------------------------------------------- */

html[data-visual-style] body:is(
  [data-active-view="findings"],
  [data-active-view="mgmtinteraction"],
  [data-active-view="report"],
  [data-active-view="remediationtrack"]
) {
  --closure-canvas: var(--visual-canvas);
  --closure-surface: var(--visual-surface);
  --closure-surface-soft: var(--visual-surface-soft);
  --closure-ink: var(--visual-ink);
  --closure-copy: var(--visual-copy);
  --closure-muted: var(--visual-faint);
  --closure-line: var(--visual-line);
  --closure-line-soft: var(--visual-line-soft);
  --closure-blue: var(--visual-accent);
  --closure-blue-hover: var(--visual-accent-deep);
  --closure-blue-soft: var(--visual-accent-soft);
  --closure-radius: var(--visual-radius);
  --closure-radius-control: var(--visual-radius-sm);
  --closure-shadow: var(--visual-shadow-soft);
  --stage-canvas: var(--visual-canvas);
  --stage-surface: var(--visual-surface);
  --stage-surface-muted: var(--visual-surface-soft);
  --stage-ink: var(--visual-ink);
  --stage-copy: var(--visual-copy);
  --stage-muted: var(--visual-faint);
  --stage-line: var(--visual-line);
  --stage-line-soft: var(--visual-line-soft);
  --stage-blue: var(--visual-accent);
  --stage-blue-strong: var(--visual-accent-deep);
  --stage-blue-soft: var(--visual-accent-soft);
  --stage-radius: var(--visual-radius-lg);
  --stage-control-radius: var(--visual-radius-sm);
  --stage-shadow: var(--visual-shadow-soft);
}

body:is(
  [data-active-view="findings"],
  [data-active-view="mgmtinteraction"],
  [data-active-view="report"],
  [data-active-view="remediationtrack"]
) .main-content {
  min-height: calc(100dvh - 92px);
}

html[data-visual-style] body:is(
  [data-active-view="findings"],
  [data-active-view="mgmtinteraction"],
  [data-active-view="report"],
  [data-active-view="remediationtrack"]
) .main-content {
  background-color: var(--visual-canvas) !important;
}

html[data-visual-style] #view-findings .problem-consolidation-workbench {
  --pcw-ink: var(--visual-ink);
  --pcw-muted: var(--visual-copy);
  --pcw-line: var(--visual-line-soft);
  --pcw-line-strong: var(--visual-line);
  --pcw-paper: var(--visual-surface);
  --pcw-surface: var(--visual-surface-soft);
  --pcw-tint: var(--visual-accent-soft);
  --pcw-green: var(--visual-accent-deep);
  --pcw-blue: var(--visual-accent);
}

html[data-visual-style] #view-findings :is(
  .pcw-grid,
  .pcw-main,
  .pcw-compose,
  .pcw-source,
  .pcw-document-preview,
  .pcw-preview-panel
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
}

html[data-visual-style] #view-findings :is(
  .pcw-rail,
  .pcw-mode-tabs,
  .pcw-actionbar,
  .pcw-source-summary
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-findings :is(
  .pcw-mode-tabs button.is-active,
  .pcw-pager button,
  .pcw input,
  .pcw select,
  .pcw textarea
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface-raised) !important;
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-findings .pcw-candidate-row:hover {
  background: var(--visual-surface-muted) !important;
}


html[data-visual-style] #view-mgmtinteraction {
  --miw-green: var(--visual-accent);
  --miw-green-weak: var(--visual-accent-soft);
  --miw-ink: var(--visual-ink);
  --miw-muted: var(--visual-copy);
  --miw-line: var(--visual-line);
  --miw-soft: var(--visual-surface-soft);
  --mib-accent: var(--visual-accent);
  --mib-accent-soft: var(--visual-accent-soft);
  --mib-ink: var(--visual-ink);
  --mib-muted: var(--visual-copy);
  --mib-line: var(--visual-line);
  --mib-soft: var(--visual-surface-soft);
  background-color: var(--visual-canvas) !important;
}

html[data-visual-style] #view-mgmtinteraction :is(
  .miw-shell,
  .miw-queue,
  .miw-document,
  .miw-decision,
  .mib-shell,
  .mib-main,
  .mib-inspector
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-mgmtinteraction :is(
  .miw-queue-tools,
  .miw-queue-tabs,
  .miw-draft-actions,
  .miw-feedback-card,
  .mib-batches,
  .mib-summary,
  .mib-delivery
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-mgmtinteraction :is(
  .miw-queue-tools input,
  .miw-queue-tools select,
  .miw-inline-form input,
  .miw-inline-form select,
  .miw-inline-form textarea,
  .mib-shell input,
  .mib-shell select,
  .mib-shell textarea
) {
  border-color: var(--visual-line) !important;
  background: var(--visual-surface-raised) !important;
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-mgmtinteraction :is(
  .miw-queue-item.active,
  .miw-queue-tabs button.active span,
  .mib-batch.active,
  .mib-table tr.active td
) {
  background-color: var(--visual-selection) !important;
}

html[data-visual-style] #view-mgmtinteraction :is(
  .mib-batch em.closed,
  .mib-status.closed,
  .mib-cell-status.done
) {
  color: var(--closure-green) !important;
}


html[data-visual-style] #view-report .report-document-workbench {
  --rpd-blue: var(--visual-accent);
  --rpd-ink: var(--visual-ink);
  --rpd-muted: var(--visual-copy);
  --rpd-line: var(--visual-line);
  border-color: var(--visual-line) !important;
  border-radius: var(--visual-radius-lg) !important;
  background-color: var(--visual-surface-soft) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-report :is(
  .rpd-toolbar,
  .rpd-source-drawer,
  .rpd-settings-drawer,
  .rpd-review-drawer
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface-raised) !important;
}

html[data-visual-style] #view-report .rpd-outline nav button.active {
  background: var(--visual-surface) !important;
  color: var(--visual-accent-deep) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-report :is(
  .rpd-actions .btn-primary,
  .rpd-context-source-foot button
) {
  border-color: var(--visual-accent) !important;
  background: var(--visual-accent) !important;
  color: #fff !important;
  box-shadow: 0 5px 16px color-mix(in srgb, var(--visual-accent) 18%, transparent) !important;
}

/* The report paper stays white in every visual style because it represents
 * the exported document, not application chrome. */
html[data-visual-style] #view-report .rpd-paper {
  background: #fff !important;
}


html[data-visual-style] #view-remediationtrack :is(
  .closure-remediation-surface,
  .ff-remediation-head,
  .ff-remediation-kpis,
  .ff-remediation-layout,
  .ff-remediation-empty
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-remediationtrack :is(
  .ff-remediation-list,
  .ff-remediation-kpis article
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-remediationtrack .ff-remediation-row.active {
  border-color: var(--visual-accent) !important;
  background: var(--visual-selection) !important;
  box-shadow: inset 3px 0 0 var(--visual-accent) !important;
}



html[data-visual-style="weave"] :is(
  #view-findings .pcw-grid,
  #view-mgmtinteraction .miw-shell,
  #view-remediationtrack .closure-remediation-surface
) {
  background-image: radial-gradient(circle at 100% 0%, transparent 0 42px, rgba(52, 118, 109, .05) 43px 44px, transparent 45px 76px);
}

/* -------------------------------------------------------------------------
 * Batch E presentation contract: project support and professional tools.
 * Program execution is not part of this batch. Tool behavior, Harness calls,
 * graph meaning, result data and business-status colors remain unchanged.
 * ---------------------------------------------------------------------- */

body:is(
  [data-active-view="fraud"],
  [data-active-view="capabilitycenter"],
  [data-active-view="toolbox"],
  [data-active-view="qa"],
  [data-active-view="riskmodels"],
  [data-active-view="reasoningcanvasv2"],
  [data-active-view="ictest"]
) .main-content {
  min-height: calc(100dvh - 92px);
  background-color: var(--visual-canvas) !important;
}

html[data-visual-style] body:is(
  [data-active-view="qa"],
  [data-active-view="riskmodels"],
  [data-active-view="reasoningcanvasv2"],
  [data-active-view="ictest"]
) {
  --ps-canvas: var(--visual-canvas);
  --ps-surface: var(--visual-surface);
  --ps-surface-soft: var(--visual-surface-soft);
  --ps-surface-muted: var(--visual-surface-muted);
  --ps-ink: var(--visual-ink);
  --ps-secondary: var(--visual-copy);
  --ps-tertiary: var(--visual-faint);
  --ps-line: var(--visual-line);
  --ps-line-soft: var(--visual-line-soft);
  --ps-blue: var(--visual-accent);
  --ps-blue-soft: var(--visual-accent-soft);
  --ps-radius: var(--visual-radius);
  --ps-radius-lg: var(--visual-radius-lg);
  --ps-shadow: var(--visual-shadow-soft);
}

html[data-visual-style] body[data-active-view="capabilitycenter"] {
  --acc-ink: var(--visual-ink);
  --acc-muted: var(--visual-copy);
  --acc-line: var(--visual-line);
  --acc-soft: var(--visual-surface-soft);
  --acc-blue: var(--visual-accent);
}

html[data-visual-style] #view-capabilitycenter :is(
  .acc-toolbar,
  .acc-section,
  .acc-foundation-groups,
  .acc-package-card,
  .acc-search-group > div,
  .acc-base-catalog,
  .acc-detail-grid > section,
  .acc-resource-list,
  .acc-demo-preview,
  .acc-tool-overview
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-capabilitycenter :is(
  .acc-foundation-group-trigger,
  .acc-base-group,
  .acc-base-row,
  .acc-package-preview,
  .acc-package-preview-tasks article,
  .acc-search-result,
  .acc-resource-list button
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface) !important;
}

html[data-visual-style] #view-capabilitycenter :is(
  .acc-toolbar > div,
  .acc-foundation-group-trigger:hover,
  .acc-foundation-group-trigger.is-active,
  .acc-base-row:hover,
  .acc-search-result:hover
) {
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-capabilitycenter :is(
  .acc-toolbar > div button.is-active,
  .acc-package-card.is-selected,
  .acc-foundation-group-trigger.is-active
) {
  color: var(--visual-accent-deep) !important;
}

html[data-visual-style] #view-capabilitycenter .acc-toolbar > div button.is-active {
  background-color: var(--visual-surface-raised) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-toolbox .toolbox-page {
  --tb2-ink: var(--visual-ink);
  --tb2-muted: var(--visual-copy);
  --tb2-faint: var(--visual-faint);
  --tb2-blue: var(--visual-accent);
  --tb2-blue-soft: var(--visual-accent-soft);
  --tb2-line: var(--visual-line);
  --tb2-line-soft: var(--visual-line-soft);
  --tb2-surface: var(--visual-surface);
  --tb2-shadow: var(--visual-shadow-soft);
}

html[data-visual-style] #view-toolbox :is(
  .toolbox-shell,
  .toolbox-category-detail,
  .toolbox-directory-head,
  .toolbox-direct-card,
  .toolbox-workbench,
  .toolbox-standard-workspace,
  .toolbox-professional-workspace
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
}

html[data-visual-style] #view-toolbox :is(
  .toolbox-category-nav,
  .toolbox-project-compact,
  .toolbox-workspace-guide,
  .tb-data-panel,
  .tb-thinking-route,
  .tb-agent-loop-panel
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-toolbox :is(
  .toolbox-nav-group.is-active .toolbox-nav-group-head,
  .toolbox-direct-card:hover,
  .toolbox-context-switch:hover
) {
  border-color: color-mix(in srgb, var(--visual-accent) 30%, var(--visual-line)) !important;
  background-color: var(--visual-selection) !important;
}

html[data-visual-style] #view-toolbox :is(
  .toolbox-project-mark,
  .toolbox-direct-action
) {
  border-color: var(--visual-accent) !important;
  color: var(--visual-accent) !important;
}

html[data-visual-style] #view-toolbox .toolbox-project-mark {
  background-color: var(--visual-accent) !important;
  color: #fff !important;
}

html[data-visual-style] #view-qa.qa-redesigned :is(
  .prompt-panel,
  .qa-chat-container,
  .qa-knowledge-library-drawer
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-qa.qa-redesigned :is(
  .prompt-header,
  .qa-source-filter,
  .qa-mode-bar,
  .qa-input-area
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-qa.qa-redesigned .qa-input-area input {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface-raised) !important;
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-riskmodels :is(
  .rm-sidebar,
  .rm-main,
  .rm-detail-head,
  .rm-run-playbook,
  .rm-secondary-drawer,
  .rm-section,
  .rm-pipeline-note,
  .rm-model-list,
  .rm-model-entry-note
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-riskmodels :is(
  .rm-sidebar-head,
  .rm-workspace-tabs,
  .rm-run-playbook,
  .rm-field-card
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-riskmodels :is(
  .rm-workspace-tab.active,
  .rm-workspace-tab.is-active,
  .rm-model-card.active
) {
  border-color: color-mix(in srgb, var(--visual-accent) 36%, var(--visual-line)) !important;
  background-color: var(--visual-selection) !important;
  color: var(--visual-accent-deep) !important;
}

html[data-visual-style] #view-reasoningcanvasv2 :is(
  .reasoning-canvas-v2-host,
  .reasoning-canvas-ai-bar,
  .reasoning-canvas-toolbar
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
}

html[data-visual-style] #view-reasoningcanvasv2 .reasoning-canvas-v2-host {
  box-shadow: var(--visual-shadow-soft) !important;
}

/* The graph field is data-bearing. Only its neutral canvas changes; node and
 * connector colors keep their existing meaning. */
html[data-visual-style] #view-reasoningcanvasv2 #reasoning-canvas-v2-frame {
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-ictest :is(
  .ic-atlas,
  .ic-enterprise-map,
  .ic-library-detail,
  .ic-deficiency-panel,
  .ic-file-guide,
  .ic-summary-bar,
  .ic-result-summary
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-ictest :is(
  .ic-atlas-toolbar,
  .ic-enterprise-map-head,
  .ic-atlas-group,
  .ic-atlas-map
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-ictest :is(
  .ic-atlas-group > header,
  .ic-atlas-parcel,
  .ic-atlas-inspector,
  .ic-atlas-inspector > header button
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
}

html[data-visual-style] #view-ictest .ic-atlas-parcel.is-active {
  border-color: color-mix(in srgb, var(--visual-accent) 48%, var(--visual-line)) !important;
  background-color: var(--visual-selection) !important;
  box-shadow: inset 3px 0 0 var(--visual-accent), 0 0 0 2px var(--visual-focus-ring) !important;
}

html[data-visual-style] #view-fraud :is(
  .fraud-overview,
  .fraud-action-ledger,
  .fraud-case-shell,
  .fraud-detail,
  .fraud-card,
  .fraud-modal,
  .fraud-output-section
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-fraud :is(
  .fraud-overview-head,
  .fraud-action-ledger-head,
  .fraud-detail-header,
  .fraud-card-header,
  .fraud-case-nav
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-fraud :is(input, select, textarea) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface-raised) !important;
  color: var(--visual-ink) !important;
}



html[data-visual-style="weave"] :is(
  #view-capabilitycenter .acc-section,
  #view-toolbox .toolbox-shell,
  #view-qa .qa-chat-container,
  #view-riskmodels .rm-main,
  #view-reasoningcanvasv2 .reasoning-canvas-v2-host,
  #view-ictest .ic-atlas,
  #view-fraud .fraud-overview
) {
  background-image: radial-gradient(circle at 100% 0%, transparent 0 42px, rgba(52, 118, 109, .05) 43px 44px, transparent 45px 76px);
}

/* -------------------------------------------------------------------------
 * Batch F presentation contract: system settings and user permissions.
 * Permission checks, service configuration, account data and dangerous
 * actions keep their existing behavior and semantic colors.
 * ---------------------------------------------------------------------- */

body:is(
  [data-active-view="systemsettings"],
  [data-active-view="useradmin"]
) .main-content {
  min-height: calc(100dvh - 92px);
  background-color: var(--visual-canvas) !important;
}

html[data-visual-style] #view-systemsettings :is(
  .sys-card,
  .sys-ai-card,
  .sys-platform-status,
  .ai-organization,
  .ai-server-dialog
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-systemsettings :is(
  .sys-action,
  .sys-platform-status > summary,
  .ai-service-facts,
  .ai-service-status
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-systemsettings .sys-action:hover {
  border-color: color-mix(in srgb, var(--visual-accent) 32%, var(--visual-line)) !important;
  background-color: var(--visual-selection) !important;
}

html[data-visual-style] #view-useradmin #ua-content {
  --uap-line: var(--visual-line);
  --uap-line-soft: var(--visual-line-soft);
  --uap-ink: var(--visual-ink);
  --uap-copy: var(--visual-copy);
  --uap-muted: var(--visual-faint);
  --uap-primary: var(--visual-accent);
  --uap-primary-hover: var(--visual-accent-deep);
}

html[data-visual-style] #view-useradmin :is(
  .ua-container,
  .ua-personnel-panel,
  .ua-toolbar,
  .ua-dialog,
  .uat-dialog,
  .uat-editor
) {
  border-color: var(--visual-line) !important;
  background-color: var(--visual-surface) !important;
  box-shadow: var(--visual-shadow-soft) !important;
}

html[data-visual-style] #view-useradmin :is(
  .ua-user-table th,
  .ua-pagination,
  .ua-current-user,
  .ua-current-permissions,
  .ua-quota-mode,
  .ua-dialog-head,
  .ua-dialog-foot,
  .ua-access-summary,
  .ua-permission-group > header,
  .uat-header,
  .uat-footer,
  .uat-team-list
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-useradmin :is(
  .ua-user-table td,
  .ua-pagination button,
  .ua-permission-group,
  .ua-rule-grid,
  .uat-member-row,
  .uat-field input,
  .uat-field select,
  #uat-member-search
) {
  border-color: var(--visual-line-soft) !important;
  background-color: var(--visual-surface) !important;
  color: var(--visual-ink) !important;
}

html[data-visual-style] #view-useradmin .ua-user-table tbody tr:hover td,
html[data-visual-style] #view-useradmin .uat-member-row:hover {
  background-color: var(--visual-surface-muted) !important;
}

html[data-visual-style] #view-useradmin :is(
  .ua-permission-btn,
  .ua-pagination button.is-current,
  .uat-status
) {
  border-color: color-mix(in srgb, var(--visual-accent) 34%, var(--visual-line)) !important;
}

html[data-visual-style] #view-useradmin .ua-pagination button.is-current {
  background-color: var(--visual-accent) !important;
  color: #fff !important;
}

/* Destructive controls never inherit a decorative theme accent. */
html[data-visual-style] #view-useradmin :is(.ua-del-btn, .ua-permission-group.is-sensitive) {
  border-color: #ead1cf !important;
}

html[data-visual-style] #view-useradmin .ua-del-btn {
  color: #b33b38 !important;
}



html[data-visual-style="weave"] :is(
  #view-history .pt-oa-center,
  #view-auditplan .ap-coverage-map,
  #view-auditplan .ap-execution-ledger,
  #view-remediation .rc-workbench
) {
  background-image: radial-gradient(circle at 99% 1%, transparent 0 42px, rgba(52, 118, 109, .065) 43px 44px, transparent 45px 78px);
}

@media (max-width: 768px) {
  body:is(
    [data-active-view="dashboard"],
    [data-active-view="history"],
    [data-active-view="auditplan"],
    [data-active-view="remediation"],
    [data-active-view="home"],
    [data-active-view="taskarrange"],
    [data-active-view="materials"],
    [data-active-view="auditinterview"],
    [data-active-view="workpaper"],
    [data-active-view="findings"],
    [data-active-view="mgmtinteraction"],
    [data-active-view="report"],
    [data-active-view="remediationtrack"],
    [data-active-view="fraud"],
    [data-active-view="capabilitycenter"],
    [data-active-view="toolbox"],
    [data-active-view="qa"],
    [data-active-view="riskmodels"],
    [data-active-view="reasoningcanvasv2"],
    [data-active-view="ictest"]
  ) .main-content {
    min-height: calc(100dvh - 116px);
  }

  html[data-visual-style] #view-remediation .remediation-center {
    min-height: 0;
  }

  html[data-visual-style] #view-history .pt-oa-tabs {
    align-items: stretch;
    gap: 20px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-inline: 16px;
    scrollbar-width: none;
  }

  html[data-visual-style] #view-history .pt-oa-tabs::-webkit-scrollbar {
    display: none;
  }

  html[data-visual-style] #view-history .pt-oa-tabs button {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  html[data-visual-style] #view-materials .pmat-view-tabs {
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  html[data-visual-style] #view-materials .pmat-view-tabs::-webkit-scrollbar {
    display: none;
  }

  html[data-visual-style] #view-materials .pmat-view-tabs button {
    flex: 0 0 auto;
    white-space: nowrap;
  }
}

/* The same audit symbol geometry receives a different visual container. */
html[data-visual-style] :is(.audit-page-identity-icon, .audit-compact-identity-icon) {
  border-color: var(--visual-line);
  background: var(--visual-surface-soft);
  color: var(--visual-accent-deep);
  box-shadow: 0 7px 18px color-mix(in srgb, var(--visual-ink) 8%, transparent);
}

html[data-visual-style="refined"] :is(.audit-page-identity-icon, .audit-compact-identity-icon) {
  border-radius: 11px;
  background: linear-gradient(145deg, var(--visual-surface), var(--visual-accent-soft));
}


html[data-visual-style="weave"] :is(.audit-page-identity-icon, .audit-compact-identity-icon) {
  border-radius: 12px;
  background:
    radial-gradient(circle at 82% 18%, transparent 0 8px, rgba(52, 118, 109, .12) 9px 10px, transparent 11px),
    var(--visual-surface);
}

/* Archive preserves document warmth without turning every control into a prop. */





/* Weave uses relationship contours as information atmosphere. */
html[data-visual-style="weave"] .sidebar {
  overflow-x: hidden;
  backdrop-filter: blur(18px) saturate(108%);
  box-shadow: 10px 0 34px rgba(32, 61, 53, .08);
}

html[data-visual-style="weave"] .sidebar::before {
  position: absolute;
  top: 24px;
  left: -98px;
  width: 250px;
  height: 250px;
  border: 1px solid rgba(52, 118, 109, .13);
  border-radius: 48% 52% 44% 56%;
  box-shadow: 0 0 0 24px rgba(52, 118, 109, .04), 0 0 0 49px rgba(52, 118, 109, .025);
  content: "";
  pointer-events: none;
  transform: rotate(14deg);
}

html[data-visual-style="weave"] :is(.sidebar-brand, .sidebar-nav, .sidebar-footer) {
  position: relative;
  z-index: 1;
}

html[data-visual-style="weave"] .nav-item:hover {
  transform: translateX(2px);
}

html[data-visual-style="weave"] :is(.form-card, .section, .result-header, .stat-card, .unified-page-heading, .app-page-hero) {
  background-image: radial-gradient(circle at 96% 0%, transparent 0 34px, rgba(52, 118, 109, .065) 35px 36px, transparent 37px);
}

html[data-visual-style] #view-systemsettings :is(.sys-card, .sys-ai-card, .sys-platform-status) {
  border-color: var(--visual-line);
  border-radius: var(--visual-radius-lg);
  background: var(--visual-surface);
  box-shadow: var(--visual-shadow);
}

html[data-visual-style] #view-systemsettings :is(.sys-action, .sys-info-list div) {
  border-color: var(--visual-line);
}

/* Personal appearance shortcut: available to every role without exposing admin settings. */
html[data-visual-style] .visual-style-quick-picker {
  position: relative;
  flex: 0 0 auto;
}

html[data-visual-style] .visual-style-quick-picker > summary {
  display: grid;
  grid-template-columns: 16px auto;
  align-items: center;
  min-height: 38px;
  padding: 5px 10px;
  border: 1px solid var(--visual-line);
  border-radius: var(--visual-radius-sm);
  background: var(--visual-surface);
  color: var(--visual-ink);
  cursor: pointer;
  list-style: none;
  box-shadow: var(--visual-shadow-soft);
  transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

html[data-visual-style] .visual-style-quick-picker > summary::-webkit-details-marker {
  display: none;
}

html[data-visual-style] .visual-style-quick-picker > summary:hover {
  border-color: var(--visual-accent);
  background: var(--visual-surface-soft);
}

html[data-visual-style] .visual-style-quick-picker[open] > summary {
  border-color: var(--visual-accent);
  background: var(--visual-accent-soft);
}

html[data-visual-style] .visual-style-quick-picker > summary svg {
  grid-row: 1 / span 2;
  width: 15px;
  height: 15px;
  color: var(--visual-accent-deep);
}

html[data-visual-style] .visual-style-quick-picker > summary span {
  color: var(--visual-ink);
  font-size: 11px;
  font-weight: 760;
  line-height: 1.15;
}

html[data-visual-style] .visual-style-quick-picker > summary small {
  color: var(--visual-faint);
  font-size: 9px;
  line-height: 1.2;
  white-space: nowrap;
}

html[data-visual-style] .visual-style-quick-panel {
  position: absolute;
  z-index: 1200;
  top: calc(100% + 10px);
  right: 0;
  width: min(330px, calc(100vw - 28px));
  padding: 10px;
  border: 1px solid var(--visual-line);
  border-radius: var(--visual-radius-lg);
  background: var(--visual-surface);
  box-shadow: var(--visual-shadow-lift);
}

html[data-visual-style] .visual-style-quick-panel::before {
  content: '';
  position: absolute;
  top: -5px;
  right: 24px;
  width: 9px;
  height: 9px;
  border-top: 1px solid var(--visual-line);
  border-left: 1px solid var(--visual-line);
  background: var(--visual-surface);
  transform: rotate(45deg);
}

html[data-visual-style] .visual-style-quick-head {
  display: grid;
  gap: 3px;
  padding: 6px 7px 9px;
  border-bottom: 1px solid var(--visual-line-soft);
}

html[data-visual-style] .visual-style-quick-head strong {
  color: var(--visual-ink);
  font-size: 13px;
}

html[data-visual-style] .visual-style-quick-head span {
  color: var(--visual-copy);
  font-size: 10px;
  line-height: 1.45;
}

html[data-visual-style] .visual-style-quick-option {
  position: relative;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 60px;
  margin-top: 5px;
  padding: 7px;
  border: 1px solid transparent;
  border-radius: var(--visual-radius-md);
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

html[data-visual-style] .visual-style-quick-option:hover {
  background: var(--visual-surface-soft);
}

html[data-visual-style] .visual-style-quick-option.is-active {
  border-color: var(--visual-accent);
  background: var(--visual-accent-soft);
}

html[data-visual-style] .visual-style-quick-option:has(input:focus-visible) {
  outline: 3px solid color-mix(in srgb, var(--visual-accent) 26%, transparent);
  outline-offset: 2px;
}

html[data-visual-style] .visual-style-quick-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

html[data-visual-style] .visual-style-quick-option > span:last-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

html[data-visual-style] .visual-style-quick-option strong {
  color: var(--visual-ink);
  font-size: 12px;
  font-weight: 760;
}

html[data-visual-style] .visual-style-quick-option small {
  overflow: hidden;
  color: var(--visual-copy);
  font-size: 10px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-visual-style] .visual-style-quick-swatch {
  position: relative;
  width: 42px;
  height: 38px;
  overflow: hidden;
  border: 1px solid var(--visual-line);
  border-radius: 8px;
  background: var(--visual-canvas);
}

html[data-visual-style] .visual-style-quick-swatch i,
html[data-visual-style] .visual-style-quick-swatch b {
  position: absolute;
  display: block;
}

html[data-visual-style] .visual-style-quick-option.is-refined .visual-style-quick-swatch {
  background: #f3f6f8;
}

html[data-visual-style] .visual-style-quick-option.is-refined .visual-style-quick-swatch i {
  inset: 0 auto 0 0;
  width: 11px;
  background: #0a1424;
}

html[data-visual-style] .visual-style-quick-option.is-refined .visual-style-quick-swatch b {
  inset: 8px 6px auto 16px;
  height: 7px;
  border-radius: 3px;
  background: #2458d3;
}




html[data-visual-style] .visual-style-quick-option.is-weave .visual-style-quick-swatch {
  border-color: #c9d6d2;
  border-radius: 12px;
  background: repeating-radial-gradient(ellipse at 92% 4%, transparent 0 8px, rgba(52, 118, 109, .18) 9px 10px, transparent 11px 15px), #edf2f0;
}

html[data-visual-style] .visual-style-quick-option.is-weave .visual-style-quick-swatch i {
  top: 11px;
  left: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #34766d;
  box-shadow: 19px 14px 0 #34766d;
}

html[data-visual-style] .visual-style-quick-option.is-weave .visual-style-quick-swatch b {
  top: 17px;
  left: 14px;
  width: 22px;
  height: 1px;
  background: #6c9f96;
  transform: rotate(30deg);
  transform-origin: left center;
}

@media (max-width: 760px) {
  html[data-visual-style] .project-toolbar .project-bar-inner {
    gap: 6px;
    padding-inline: 10px;
  }

  html[data-visual-style] .user-info-bar {
    width: 100%;
    min-width: 0;
    justify-content: flex-end;
    gap: 6px;
    padding: 5px 7px;
  }

  html[data-visual-style] .user-info-content {
    display: none;
  }

  html[data-visual-style] .global-work-mode {
    min-width: 0;
  }

  html[data-visual-style] .global-work-mode-options {
    padding: 2px;
  }

  html[data-visual-style] .global-work-mode-options button {
    min-width: 42px;
    padding-inline: 5px;
    font-size: 9px;
    white-space: nowrap;
  }

  html[data-visual-style] .user-avatar {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
  }

  html[data-visual-style] .user-logout-btn {
    min-width: 42px;
    padding-inline: 7px;
  }

  html[data-visual-style] .visual-style-quick-picker > summary {
    grid-template-columns: 15px;
    justify-items: center;
    min-width: 40px;
    padding-inline: 8px;
  }

  html[data-visual-style] .visual-style-quick-picker > summary svg {
    grid-row: auto;
  }

  html[data-visual-style] .visual-style-quick-picker > summary span {
    font-size: 9px;
  }

  html[data-visual-style] .visual-style-quick-picker > summary small {
    display: none;
  }

  html[data-visual-style] .visual-style-quick-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: -86px;
    bottom: auto;
    left: auto;
    width: min(330px, calc(100vw - 28px));
    max-height: calc(100vh - 132px);
    overflow-y: auto;
  }

  html[data-visual-style] .visual-style-quick-panel::before {
    display: none;
  }

}

@media (prefers-reduced-motion: reduce) {
  html[data-visual-style] .sidebar,
  html[data-visual-style] .nav-item,
  html[data-visual-style] .visual-style-quick-picker > summary,
  html[data-visual-style] .visual-style-quick-option {
    transition: none;
  }
}

/* Management entry titles share the dashboard's restrained left-aligned
 * hierarchy. This presentation layer does not change page actions or data. */
html[data-visual-style] :is(
  #view-history > .app-page-hero.unified-page-heading,
  #view-auditplan > .app-page-hero.unified-page-heading,
  #view-remediation .rc-hero
) {
  min-height: 98px;
  margin: 0 0 20px;
  padding: 24px 0 18px;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-visual-style] :is(
  #view-history > .app-page-hero.unified-page-heading,
  #view-auditplan > .app-page-hero.unified-page-heading
) {
  display: block;
}

html[data-visual-style] :is(
  #view-history > .app-page-hero.unified-page-heading,
  #view-auditplan > .app-page-hero.unified-page-heading
) .app-page-hero-copy {
  display: block !important;
}

html[data-visual-style] :is(
  #view-history > .app-page-hero h2,
  #view-auditplan > .app-page-hero h2,
  #view-remediation .rc-hero h1
) {
  margin: 0;
  color: var(--visual-ink);
  font-size: clamp(28px, 2.35vw, 38px) !important;
  font-weight: 760;
  letter-spacing: -.04em;
  line-height: 1.12;
}

html[data-visual-style] :is(
  #view-history > .app-page-hero p,
  #view-auditplan > .app-page-hero p,
  #view-remediation .rc-hero p
) {
  max-width: 780px;
  margin: 9px 0 0;
  color: var(--visual-copy);
  font-size: 14px;
  line-height: 1.45;
}

html[data-visual-style] #view-remediation .rc-hero small {
  margin-top: 7px;
  color: var(--visual-faint);
  font-size: 12px;
  line-height: 1.45;
}


@media (max-width: 760px) {
  html[data-visual-style] :is(
    #view-history > .app-page-hero.unified-page-heading,
    #view-auditplan > .app-page-hero.unified-page-heading,
    #view-remediation .rc-hero
  ) {
    min-height: 0;
    margin-bottom: 16px;
    padding: 18px 0 14px;
  }

  html[data-visual-style] :is(
    #view-history > .app-page-hero h2,
    #view-auditplan > .app-page-hero h2,
    #view-remediation .rc-hero h1
  ) {
    font-size: clamp(24px, 8vw, 30px) !important;
  }

  html[data-visual-style] #view-remediation .rc-hero {
    align-items: stretch;
  }
}
/* Management interaction baseline: shared feedback, without changing business state. */
html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) {
  --management-control-motion:160ms;
  --management-focus:var(--visual-accent-deep);
}
html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) :is(button,summary,select,input) {
  transition:background-color var(--management-control-motion) ease, border-color var(--management-control-motion) ease, color var(--management-control-motion) ease;
}
html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) :is(button,summary,select,input,[tabindex="0"],[id="dash-portfolio-result-summary"]):focus-visible {
  /* The legacy application baseline marks its global focus outline important. */
  outline:2px solid var(--management-focus) !important;
  outline-offset:2px;
}
html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) :is(button:disabled,button[aria-disabled="true"]) {
  opacity:.58;
  cursor:not-allowed;
  transform:none;
}
html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) button[aria-busy="true"] { cursor:progress; }
html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) .btn { border-radius:var(--visual-radius-sm); }
html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) .btn-secondary:not(:disabled):not([aria-disabled="true"]):hover {
  border-color:var(--visual-accent);
  background:var(--visual-surface-soft);
  color:var(--visual-accent-deep);
}
html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) .btn-primary:not(:disabled):not([aria-disabled="true"]):active { background:var(--visual-accent-deep); }
html[data-visual-style] #view-dashboard :is(.dash-home-project-row,.dash-attention-item,.dash-stage-filter):not(:disabled):hover,
html[data-visual-style] #view-history :is(.pt-project-row,.pt-filter-pill,.pt-object-option,.pt-oa-outline-stage button):not(:disabled):hover,
html[data-visual-style] #view-auditplan .ap-landing-metric:not(:disabled):hover { background:var(--visual-surface-soft); }
html[data-visual-style] #view-dashboard :is(.dash-home-project-row,.dash-attention-item,.dash-stage-filter):not(:disabled):active,
html[data-visual-style] #view-history :is(.pt-project-row,.pt-filter-pill,.pt-object-option,.pt-oa-outline-stage button):not(:disabled):active,
html[data-visual-style] #view-auditplan .ap-landing-metric:not(:disabled):active { background:var(--visual-accent-soft); }
html[data-visual-style] #view-dashboard :is(.dash-home-project-row,.dash-attention-item):focus-visible,
html[data-visual-style] #view-history .pt-project-row:focus-visible { outline-offset:-3px !important; }
html[data-visual-style] #view-dashboard .dash-stage-filter[aria-pressed="true"],
html[data-visual-style] #view-history :is(.pt-filter-pill,.pt-object-option)[aria-pressed="true"],
html[data-visual-style] #view-history .pt-oa-outline-stage button[aria-current="step"],
html[data-visual-style] #view-auditplan .ap-landing-metric[aria-pressed="true"] {
  border-color:var(--visual-accent);
  background:var(--visual-accent-soft);
  color:var(--visual-accent-deep);
}
html[data-visual-style] #view-auditplan .ap-landing-metric:not(.is-active) { border-color:var(--visual-line); background:var(--visual-surface); }
html[data-visual-style] #view-auditplan .ap-landing-metric.is-active { box-shadow:none; }
html[data-visual-style] #view-dashboard .dash-home-project-progress > i,
html[data-visual-style] #view-dashboard .dash-home-operating-track > i { background:var(--visual-accent); }
html[data-visual-style] #view-dashboard .dash-home-stage-snapshot { background:var(--visual-surface); }
@media (max-width:760px) {
  html[data-visual-style] #view-dashboard :is(.dash-stage-filter,.dash-portfolio-pagination button,.dash-portfolio-result-head button),
  html[data-visual-style] #view-auditplan :is(.ap-ledger-result-meta button,.ap-landing-metric),
  html[data-visual-style] #view-history :is(.pt-filter-pill,.pt-oa-outline-stage button) { min-height:44px; }
}
@media (prefers-reduced-motion:reduce) {
  html[data-visual-style] :is(#view-dashboard,#view-history,#view-auditplan) :is(button,summary,select,input) { transition:none; }
}