/* Shared public UI colours. Keep this after feature and legacy theme styles.
   Primary = commit/search, secondary = utility, accent = selection/link.
   Component geometry, brand artwork and semantic feedback stay local. */
:root {
  color-scheme: light;
  --ui-bg: #f6f8f6;
  --ui-surface: #ffffff;
  --ui-surface-raised: #f0f5f1;
  --ui-field: #ffffff;
  --ui-line: #d7e1da;
  --ui-text: #23392d;
  --ui-muted: #62766a;
  --ui-primary: #2e6b50;
  --ui-on-primary: #ffffff;
  --ui-primary-hover: #25583f;
  --ui-secondary: #edf3ef;
  --ui-secondary-hover: #e0ebe3;
  --ui-accent: #2e6b50;
  --ui-accent-soft: #e3efe7;
  --ui-focus: #397c5b;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ui-bg: #0e2019;
  --ui-surface: #142a21;
  --ui-surface-raised: #1b3328;
  --ui-field: #10231b;
  --ui-line: #344e3f;
  --ui-text: #e4eee7;
  --ui-muted: #a1b5a7;
  --ui-primary: #34684b;
  --ui-on-primary: #f5faf6;
  --ui-primary-hover: #3d7857;
  --ui-secondary: #203c2e;
  --ui-secondary-hover: #2a4837;
  --ui-accent: #a7d5b7;
  --ui-accent-soft: #243f30;
  --ui-focus: #a7d5b7;
}
:root, :root[data-theme],
:root[data-theme] :is(.directory-home-shell, .directory-home-shell.directory-inner-shell,
  .matching-category-layer, .mobile-drawer-layer) {
  --paper: var(--ui-bg);
  --card: var(--ui-surface);
  --ink: var(--ui-text);
  --muted: var(--ui-muted);
  --line: var(--ui-line);
  --teal: var(--ui-accent);
}
:root[data-theme], :root[data-theme] body,
:root[data-theme] .directory-home-shell,
:root[data-theme] .directory-home-shell .directory-main,
:root[data-theme] .site-page-transition,
:root[data-theme] .user-profile-page { background: var(--ui-bg); color: var(--ui-text); }
:root[data-theme] .directory-home-shell .directory-topbar { background: var(--ui-bg); border-color: var(--ui-line); }
:root[data-theme] .directory-home-shell .directory-topbar::before { background: var(--ui-surface-raised); border-color: var(--ui-line); }
:root[data-theme] .directory-home-shell.directory-inner-shell.internal-page-scrolled .directory-topbar {
  background: color-mix(in srgb, var(--ui-bg) 30%, transparent);
}
:root[data-theme] :is(.account-panel, .account-sidebar, .account-guid-card,
  .account-avatar-editor, .account-appeal-card, .form-card, .side-note,
  .user-profile-main, .user-profile-hero, .user-profile-connections,
  .user-profile-page .user-profile-discovery-section, .profile-editor,
  .user-profile-about-dialog, .user-profile-menu,
  .messages-page, .messages-sidebar, .messages-content,
  .share-dialog, .more-actions-menu, .email-suggestions) {
  background: var(--ui-surface);
  color: var(--ui-text);
  border-color: var(--ui-line);
}
:root[data-theme] :is(.user-profile-topline, .user-profile-tabs) {
  background: color-mix(in srgb, var(--ui-surface) 88%, transparent);
  border-color: var(--ui-line);
}
:root[data-theme] :is(.share-dialog .share-dialog-link, .account-security-card) {
  background: var(--ui-field); color: var(--ui-text); border-color: var(--ui-line);
}
:root[data-theme] .share-dialog .share-dialog-copy {
  background: var(--ui-primary); color: var(--ui-on-primary); border-color: var(--ui-primary);
}
:root[data-theme] .share-dialog .share-dialog-copy:hover {
  background: var(--ui-primary-hover); color: var(--ui-on-primary); border-color: var(--ui-primary-hover);
}
:root[data-theme] :is(.share-dialog .share-dialog-native, .share-dialog .share-dialog-close,
  .directory-topbar .header-save, .directory-topbar .theme-toggle,
  .directory-topbar .account-link, .directory-topbar .account-email-trigger) { color: var(--ui-muted); }
:root[data-theme] :is(.share-dialog .share-dialog-native, .share-dialog .share-dialog-close,
  .directory-topbar .header-save, .directory-topbar .theme-toggle,
  .email-suggestions button):hover {
  background: var(--ui-secondary-hover); color: var(--ui-text);
}
:root[data-theme] .site-page-transition-content .aibuy-loading-spinner,
:root[data-theme] .site-page-transition-spinner { color: var(--ui-accent); }
:root[data-theme] .company-about {
  --company-ink: var(--ui-text); --company-muted: var(--ui-muted);
  --company-line: var(--ui-line); --company-soft: var(--ui-accent-soft);
  --company-accent: var(--ui-accent); --company-contrast: var(--ui-surface);
}
:root[data-theme] .company-about .company-button { background: var(--ui-primary); color: var(--ui-on-primary); }
:root[data-theme] .company-about .company-button:hover { background: var(--ui-primary-hover); }
/* Loading guide geometry also applies to the guide opened in a separate tab. */
:root .site-page-transition-brand { margin-bottom: 8px; }
:root .site-page-transition-content > .aibuy-loading-spinner { margin: 0 auto 4px; }
:root .site-page-transition-content p { margin-top: 12px; }

/* Public directory, search, low-price library and mobile navigation.
   Load after neutral-dark.css. Uses the shared public UI palette only.
   Geometry, animations, logos, saved/risk/status colours are preserved. */

/* Navigation and directory surfaces */
:root[data-theme] .directory-home-shell .directory-topbar .main-nav .directory-nav-tab {
  color: var(--ui-muted);
}
:root[data-theme] .directory-home-shell .directory-topbar .main-nav .directory-nav-tab:hover,
:root[data-theme] .directory-home-shell .directory-topbar .main-nav .directory-nav-tab.active {
  color: var(--ui-accent);
}
:root[data-theme] .directory-home-shell .directory-topbar .main-nav .directory-nav-tab.active::after {
  background: var(--ui-accent);
}
:root[data-theme] .directory-home-shell .directory-sidebar,
:root[data-theme] .directory-home-shell .directory-card {
  background: var(--ui-surface);
  border-color: var(--ui-line);
}
:root[data-theme] .directory-home-shell .directory-card:hover {
  border-color: var(--ui-accent);
}
:root[data-theme] .directory-home-shell .directory-sidebar-heading,
:root[data-theme] .directory-home-shell .directory-section-heading h2,
:root[data-theme] .directory-home-shell .directory-card-title h3 {
  color: var(--ui-text);
}
:root[data-theme] .directory-home-shell .directory-side-item {
  color: var(--ui-text);
}
:root[data-theme] .directory-home-shell .directory-side-item:hover {
  background: var(--ui-secondary-hover);
  color: var(--ui-text);
}
:root[data-theme] .directory-home-shell .directory-side-item.active {
  background: var(--ui-accent-soft);
  color: var(--ui-accent);
  box-shadow: inset 3px 0 0 var(--ui-accent);
}
:root[data-theme] .directory-home-shell .directory-side-item > svg:first-child,
:root[data-theme] .directory-tools-shell .directory-card-action {
  color: var(--ui-accent);
}
:root[data-theme] .directory-home-shell .directory-side-item.active > svg:first-child {
  color: var(--ui-accent);
}
:root[data-theme] .directory-home-shell .directory-side-item b {
  color: var(--ui-muted);
  background: var(--ui-secondary);
  border-color: var(--ui-line);
}
:root[data-theme] .directory-home-shell .directory-side-item.active b {
  color: var(--ui-accent);
  background: var(--ui-accent-soft);
}
:root[data-theme] .directory-home-shell .directory-side-link > svg:last-child,
:root[data-theme] .directory-home-shell .directory-card-open p,
:root[data-theme] .directory-home-shell .directory-section-heading p,
:root[data-theme] .directory-home-shell .directory-empty-section,
:root[data-theme] .directory-home-shell .directory-search-hint {
  color: var(--ui-muted);
}
:root[data-theme] .directory-home-shell .directory-card-divider {
  background: var(--ui-line);
}
:root[data-theme] .directory-sidebar-heading .directory-submit-link {
  background: var(--ui-secondary);
  border-color: var(--ui-line);
  color: var(--ui-text);
}
:root[data-theme] .directory-sidebar-heading .directory-submit-link:hover {
  background: var(--ui-secondary-hover);
  border-color: var(--ui-accent);
  color: var(--ui-text);
}
:root[data-theme] .directory-sorter button,
:root[data-theme] .directory-tabs button {
  color: var(--ui-muted);
}
:root[data-theme] .directory-sorter button.active,
:root[data-theme] .directory-tabs button.active {
  color: var(--ui-accent);
  border-color: var(--ui-accent);
}
:root[data-theme] .directory-category-section.is-located,
:root[data-theme] .directory-located-section.is-located {
  border-color: var(--ui-accent);
  background: color-mix(in srgb, var(--ui-accent-soft) 65%, transparent);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--ui-accent) 10%, transparent);
}

/* Search: the submit button always uses the same primary action palette.
   Clear stays a ghost action, including the scrolled glass variant. */
:root[data-theme] .directory-home-shell .directory-tools-search .directory-search-form.directory-header-search,
:root[data-theme] .directory-search-form {
  color: var(--ui-text);
  border-color: var(--ui-line);
  background: var(--ui-field);
}
:root[data-theme] .directory-home-shell .directory-tools-search .directory-search-form.directory-header-search:hover,
:root[data-theme] .directory-search-form:hover {
  border-color: var(--ui-accent);
}
:root[data-theme] .directory-home-shell .directory-tools-search .directory-search-form.directory-header-search:focus-within,
:root[data-theme] .directory-search-form:focus-within {
  border-color: var(--ui-focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-focus) 15%, transparent);
}
:root[data-theme] .directory-home-shell .directory-content.is-scrolled .directory-tools-search .directory-header-search,
[data-theme="dark"] .directory-home-shell .directory-content.is-scrolled .directory-tools-search .directory-header-search {
  background: color-mix(in srgb, var(--ui-field) 72%, transparent);
  border-color: color-mix(in srgb, var(--ui-accent) 60%, var(--ui-line));
}
:root[data-theme] .directory-search-form > svg,
:root[data-theme] .directory-header-search > svg,
:root[data-theme] .directory-header-search input::placeholder,
:root[data-theme] .directory-header-search kbd,
:root[data-theme] .directory-search-summary h2 span,
:root[data-theme] .directory-search-empty {
  color: var(--ui-muted);
}
:root[data-theme] .directory-search-empty strong {
  color: var(--ui-text);
}
:root[data-theme] .directory-search-form .directory-search-submit,
:root[data-theme] .directory-header-search .directory-search-submit {
  color: var(--ui-on-primary);
  background: var(--ui-primary);
}
:root[data-theme] .directory-search-form .directory-search-submit:hover,
:root[data-theme] .directory-header-search .directory-search-submit:hover {
  color: var(--ui-on-primary);
  background: var(--ui-primary-hover);
}
:root[data-theme] .directory-home-shell .directory-tools-search .directory-search-form .directory-search-clear {
  color: var(--ui-muted);
  background: transparent;
}
:root[data-theme] .directory-home-shell .directory-tools-search .directory-search-form .directory-search-clear:hover {
  color: var(--ui-text);
  background: var(--ui-secondary-hover);
}
:root[data-theme] .directory-search-categories button,
:root[data-theme] .directory-search-empty button,
:root[data-theme] .price-search-reset {
  color: var(--ui-text);
  border-color: var(--ui-line);
  background: var(--ui-secondary);
}
:root[data-theme] .directory-search-categories button:hover,
:root[data-theme] .directory-search-empty button:hover,
:root[data-theme] .price-search-reset:hover {
  color: var(--ui-text);
  border-color: var(--ui-accent);
  background: var(--ui-secondary-hover);
}
:root[data-theme] .directory-search-categories button[aria-pressed="true"] {
  color: var(--ui-accent);
  border-color: var(--ui-accent);
  background: var(--ui-accent-soft);
}
:root[data-theme] .directory-search-form .directory-search-submit:focus-visible,
:root[data-theme] .directory-sidebar-heading .directory-submit-link:focus-visible,
:root[data-theme] .directory-search-categories button:focus-visible,
:root[data-theme] .directory-search-empty button:focus-visible,
:root[data-theme] .price-search-reset:focus-visible {
  outline-color: var(--ui-focus);
}

/* Low-price library: selected categories share the accent hierarchy;
   purchase/open actions share the primary action hierarchy. */
:root[data-theme] .price-workspace {
  color: var(--ui-text);
  border-color: var(--ui-line);
  background: var(--ui-surface);
}
:root[data-theme] .price-spec-column,
:root[data-theme] .price-quotes,
:root[data-theme] .price-offer-table-head,
:root[data-theme] .price-offer-row {
  border-color: var(--ui-line);
}
:root[data-theme] .price-category-option,
:root[data-theme] .price-spec-option {
  color: var(--ui-text);
}
:root[data-theme] .price-category-option:hover,
:root[data-theme] .price-spec-option:hover {
  background: var(--ui-secondary-hover);
}
:root[data-theme] .price-category-option[aria-pressed="true"],
:root[data-theme] .price-spec-option[aria-pressed="true"] {
  color: var(--ui-accent);
  background: var(--ui-accent-soft);
}
:root[data-theme] .price-category-option[aria-pressed="true"] .price-count,
:root[data-theme] .price-spec-option[aria-pressed="true"] .price-spec-facts {
  color: var(--ui-accent);
}
:root[data-theme] .price-category-option[aria-pressed="true"] .price-category-icon.is-monochrome {
  filter: brightness(0);
}
:root[data-theme="dark"] .price-category-option[aria-pressed="true"] .price-category-icon.is-monochrome {
  filter: brightness(0) invert(1);
}
:root[data-theme] .price-quotes-heading,
:root[data-theme] .price-quotes-top .price-quotes-heading {
  color: var(--ui-text);
  background: var(--ui-accent-soft);
}
:root[data-theme] .price-quotes-kicker,
:root[data-theme] .price-low-toggle,
:root[data-theme] .price-quote-count small,
:root[data-theme] .price-count,
:root[data-theme] .price-spec-facts,
:root[data-theme] .price-offer-product p,
:root[data-theme] .price-offer-source,
:root[data-theme] .price-offer-update,
:root[data-theme] .price-offer-price span,
:root[data-theme] .price-search-toolbar > span,
:root[data-theme] .price-snapshot-note {
  color: var(--ui-muted);
}
:root[data-theme] .price-offer-price strong { color: var(--ui-accent); }
:root[data-theme] .price-quotes-top {
  background: color-mix(in srgb, var(--ui-surface) 65%, transparent);
}
:root[data-theme] .price-offer-table-head,
:root[data-theme] .price-quotes-top .price-offer-table-head {
  color: var(--ui-muted);
  background: color-mix(in srgb, var(--ui-secondary) 84%, transparent);
}
:root[data-theme] .price-quotes-footer {
  border-top-color: var(--ui-line);
  background: color-mix(in srgb, var(--ui-surface) 68%, transparent);
}
:root[data-theme] .price-offer-stock:not(.is-empty) {
  color: var(--ui-accent);
  background: var(--ui-accent-soft);
}
:root[data-theme] .price-offer-stock.is-empty {
  color: var(--ui-muted);
  border-color: var(--ui-line);
  background: transparent;
}
:root[data-theme] .price-offer-action a,
:root[data-theme] .deal-open-link,
:root[data-theme] .mobile-resource-open {
  color: var(--ui-on-primary);
  background: var(--ui-primary);
}
:root[data-theme] .price-offer-action a:hover,
:root[data-theme] .deal-open-link:hover,
:root[data-theme] .mobile-resource-open:hover {
  color: var(--ui-on-primary);
  background: var(--ui-primary-hover);
}
:root[data-theme] .price-pagination button {
  color: var(--ui-text);
  border-color: var(--ui-line);
  background: var(--ui-secondary);
}
:root[data-theme] .price-pagination button:hover:not(:disabled) {
  border-color: var(--ui-accent);
  background: var(--ui-secondary-hover);
}
:root[data-theme] .price-sort-button { color: var(--ui-text); }
:root[data-theme] .price-sort-button:hover { color: var(--ui-accent); }
:root[data-theme] .price-sort-arrow { color: var(--ui-muted); }
:root[data-theme] .price-sort-arrows.is-asc .price-sort-arrow-up,
:root[data-theme] .price-sort-arrows.is-desc .price-sort-arrow-down {
  color: var(--ui-accent);
  filter: none;
}
:root[data-theme] .price-low-track {
  border-color: var(--ui-line);
  background: var(--ui-field);
}
:root[data-theme] .price-low-track::after { background: var(--ui-muted); }
:root[data-theme] .price-low-toggle input:checked + .price-low-track {
  border-color: var(--ui-primary);
  background: var(--ui-primary);
}
:root[data-theme] .price-low-toggle input:checked + .price-low-track::after {
  background: var(--ui-on-primary);
}
:root[data-theme] .price-low-toggle input:focus-visible + .price-low-track {
  outline-color: var(--ui-focus);
}

@media (max-width: 650px) {
  :root[data-theme] .mobile-directory-toolbar button,
  :root[data-theme] .mobile-icon-button,
  :root[data-theme] .mobile-navigation-grid a,
  :root[data-theme] .mobile-navigation-toggle,
  :root[data-theme] .mobile-navigation-restore,
  :root[data-theme] .mobile-drawer .directory-side-item,
  :root[data-theme] .mobile-drawer-link,
  :root[data-theme] .mobile-drawer .price-category-option,
  :root[data-theme] .mobile-drawer .price-spec-option {
    color: var(--ui-text);
  }
  :root[data-theme] .mobile-price-picker button {
    color: var(--ui-text);
    border-color: var(--ui-line);
    background: var(--ui-surface);
  }
  :root[data-theme] .mobile-price-picker button svg,
  :root[data-theme] .mobile-drawer .directory-side-item svg {
    color: var(--ui-accent);
  }
  :root[data-theme] .mobile-drawer-layer { --card: var(--ui-surface-raised); }
  :root[data-theme] .mobile-drawer {
    color: var(--ui-text);
    background: var(--ui-surface-raised);
  }
  :root[data-theme] .mobile-drawer > header { border-color: var(--ui-line); }
  :root[data-theme] .mobile-drawer .directory-side-item.active,
  :root[data-theme] .mobile-drawer .price-category-option[aria-pressed="true"],
  :root[data-theme] .mobile-drawer .price-spec-option[aria-pressed="true"] {
    color: var(--ui-accent);
    background: var(--ui-accent-soft);
  }
  :root[data-theme] .mobile-drawer .price-category-option[aria-pressed="true"] .price-count,
  :root[data-theme] .mobile-drawer .price-spec-option[aria-pressed="true"] .price-spec-facts {
    color: var(--ui-accent);
  }
  :root[data-theme] .mobile-icon-button:hover { background: var(--ui-secondary-hover); }
  :root[data-theme] .mobile-navigation {
    border-color: var(--ui-line);
    background: color-mix(in srgb, var(--ui-surface-raised) 76%, transparent);
  }
  :root[data-theme] .mobile-navigation-primary a[data-highlighted="true"] { color: var(--ui-accent); }
  :root[data-theme] .mobile-navigation-indicator::before {
    border-color: color-mix(in srgb, var(--ui-accent) 22%, transparent);
    background: linear-gradient(155deg, color-mix(in srgb, var(--ui-accent-soft) 88%, transparent), color-mix(in srgb, var(--ui-accent) 24%, transparent));
  }
  :root[data-theme] .mobile-navigation-primary[data-gesture="dragging"] .mobile-navigation-indicator::before {
    background: linear-gradient(155deg, var(--ui-accent-soft), color-mix(in srgb, var(--ui-accent) 38%, transparent));
  }
  :root[data-theme] .mobile-navigation-extra { border-top-color: var(--ui-line); }
  :root[data-theme] .mobile-navigation:not(.is-minimized) .mobile-navigation-toggle:hover {
    background: var(--ui-secondary-hover);
  }
  :root[data-theme] .mobile-navigation a:focus-visible,
  :root[data-theme] .mobile-navigation button:focus-visible { outline-color: var(--ui-focus); }
  :root[data-theme] .directory-workspace-deals .price-workspace,
  :root[data-theme] .price-quotes-top,
  :root[data-theme] .price-quotes-footer { background: transparent; }
}

/* Matching, comments, exclusion popover and risk: colour-only proposal.
   Load after the component styles and neutral-dark.css.
   The shared --ui-* palette is supplied by the main theme stylesheet.
   Supply/demand, moderation, danger and brand colours remain semantic. */

:root[data-theme] :is(.match-board, .match-dialog, .matching-category-layer) {
  --match-line: var(--ui-line);
  color: var(--ui-text);
}
:root[data-theme] :is(.risk-board, .risk-overlay) {
  --risk-line: var(--ui-line);
  --risk-accent: var(--ui-accent);
  --risk-soft: var(--ui-accent-soft);
  color: var(--ui-text);
}
:root[data-theme] .matching-category-layer {
  --card: var(--ui-surface);
  --line: var(--ui-line);
  --ink: var(--ui-text);
}
:root[data-theme] .directory-home-shell :is(.directory-main-matching, .directory-main-risk) {
  background: var(--ui-bg);
}
:root[data-theme] :is(
  .match-rail, .match-main, .match-columns, .match-item, .match-detail,
  .risk-board, .risk-rail, .risk-main, .risk-columns, .risk-item,
  .risk-list-heading, .risk-detail, .risk-pagination
) {
  border-color: var(--ui-line);
  background: var(--ui-surface);
  color: var(--ui-text);
}
:root[data-theme] :is(.match-toolbar, .match-list-heading, .match-pagination) {
  border-color: var(--ui-line);
  background: color-mix(in srgb, var(--ui-surface) 78%, transparent);
}
:root[data-theme] :is(
  .match-dialog, .match-dialog header, .match-comment-editor,
  .match-comment-action-dialog, .match-blocked-panel,
  .risk-dialog, .risk-dialog header
) {
  border-color: var(--ui-line);
  background: var(--ui-surface-raised);
  color: var(--ui-text);
}
:root[data-theme] :is(.match-contact, .match-contact.match-contact-wechat,
  .match-comment-dock, .match-comment-report-preview, .match-blocked-summary,
  .risk-dialog .risk-upload, .risk-upload-item, .risk-media) {
  border-color: var(--ui-line);
  background: var(--ui-field);
}
:root[data-theme] .match-contact.match-contact-inline-actions {
  background: transparent;
}

/* Fields use a single surface; search text inputs stay transparent within it. */
:root[data-theme] :is(.match-search, .risk-search, .match-dialog input,
  .match-dialog select, .match-dialog textarea, .match-blocked-form input,
  .match-comment-action-dialog select, .risk-dialog input,
  .risk-dialog select, .risk-dialog textarea) {
  border-color: var(--ui-line);
  background: var(--ui-field);
  color: var(--ui-text);
  outline-color: var(--ui-focus);
}
:root[data-theme] :is(.match-search input, .risk-search input,
  .match-comment-form textarea, .match-comment-editor textarea,
  .match-comment-retry-form textarea) {
  border-color: var(--ui-line);
  background: transparent;
  color: var(--ui-text);
  caret-color: var(--ui-text);
}
:root[data-theme] :is(.match-search input, .risk-search input,
  .match-dialog input, .match-dialog textarea, .match-blocked-form input,
  .match-comment-form textarea, .match-comment-editor textarea,
  .risk-dialog input, .risk-dialog textarea)::placeholder {
  color: var(--ui-muted);
}
:root[data-theme] :is(.match-search, .risk-search, .match-comment-dock):focus-within,
:root[data-theme] :is(.match-dialog input, .match-dialog select,
  .match-dialog textarea, .match-blocked-form input,
  .match-comment-action-dialog select, .match-comment-retry-form textarea,
  .risk-dialog input, .risk-dialog select, .risk-dialog textarea):focus {
  border-color: var(--ui-focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-focus) 14%, transparent);
}
:root[data-theme] :is(.match-search-sort, .match-dialog select,
  .match-comment-action-dialog select, .risk-platform-select select,
  .risk-dialog select, .risk-mobile-filter select) option {
  background: var(--ui-field);
  color: var(--ui-text);
}

/* Secondary actions; explicit primary actions follow this group. */
:root[data-theme] :is(.match-contact button, .match-contact-buttons button,
  .match-detail-actions button:not(.match-fulfill), .match-pagination button,
  .match-mobile-filters select, .match-mobile-filters button,
  .match-category-button, .match-search-sort, .match-blocked-toggle,
  .match-empty .match-search-reset, .match-form-actions > button:first-child,
  .match-comment-action-dialog button:not(.match-comment-danger),
  .risk-pagination button, .risk-form-actions > button:first-child,
  .risk-mobile-filter select) {
  border-color: var(--ui-line);
  background: var(--ui-secondary);
  color: var(--ui-text);
}
:root[data-theme] :is(.match-contact button, .match-contact-buttons button,
  .match-detail-actions button:not(.match-fulfill), .match-pagination button,
  .match-mobile-filters button, .match-category-button, .match-blocked-toggle,
  .match-empty .match-search-reset, .match-form-actions > button:first-child,
  .match-comment-action-dialog button:not(.match-comment-danger),
  .risk-pagination button, .risk-form-actions > button:first-child):hover:not(:disabled) {
  border-color: var(--ui-line);
  background: var(--ui-secondary-hover);
  color: var(--ui-text);
}

/* Search, publish, reply and add-friend share the primary action palette. */
:root[data-theme] :is(.match-publish,
  .match-search button:not(.match-search-clear),
  .match-contact-buttons .match-contact-add, .match-blocked-form > button,
  .match-comment-reply, .match-comment-form .match-comment-reply,
  .match-comment-login .match-comment-reply,
  .match-comment-editor .match-comment-reply,
  .risk-search button, .risk-publish) {
  border-color: var(--ui-primary);
  background: var(--ui-primary);
  color: var(--ui-on-primary);
}
:root[data-theme] :is(.match-publish,
  .match-search button:not(.match-search-clear),
  .match-contact-buttons .match-contact-add, .match-blocked-form > button,
  .match-comment-reply, .match-comment-form .match-comment-reply,
  .match-comment-login .match-comment-reply,
  .match-comment-editor .match-comment-reply,
  .risk-search button, .risk-publish):hover:not(:disabled) {
  border-color: var(--ui-primary-hover);
  background: var(--ui-primary-hover);
  color: var(--ui-on-primary);
}

/* Neutral controls retain transparent icon/text treatments. */
:root[data-theme] :is(.match-rail-section button, .match-mine-link,
  .match-search .match-search-clear, .match-blocked-close,
  .match-comment-compose-tools .match-comment-expand,
  .match-comment-editor-close, .match-comment-reply-preview > button,
  .risk-rail-item, .risk-rail-toggle, .risk-dialog header button,
  .match-dialog header button, .risk-upload-item button) {
  background: transparent;
  color: var(--ui-muted);
}
:root[data-theme] :is(.match-rail-section button, .match-mine-link,
  .match-search .match-search-clear, .match-blocked-close,
  .match-comment-expand, .match-comment-editor-close,
  .match-comment-reply-preview > button, .risk-rail-item,
  .risk-rail-toggle, .risk-dialog header button,
  .match-dialog header button, .risk-upload-item button):hover:not(:disabled) {
  background: var(--ui-secondary-hover);
  color: var(--ui-text);
}
:root[data-theme] :is(.match-detail-back, .match-controls-toggle,
  .match-empty button, .match-profile-contact-tools :is(button, a),
  .match-blocked-footer > button, .match-blocked-summary > button,
  .match-comments .match-comment-local-actions button,
  .match-comments-pagination button, .match-comments-empty button,
  .match-comments .match-comment-thread-toggle,
  .risk-detail-back, .risk-empty button, .risk-dispute-action button) {
  color: var(--ui-accent);
}
:root[data-theme] :is(.match-contact .match-contact-copy-name,
  .match-item-comments, .match-comments .match-comment-thread-toggle,
  .risk-dispute-action button):hover {
  color: var(--ui-accent);
}

/* Selection stays distinct from hover and from the ordinary surface. */
:root[data-theme] :is(.match-item, .risk-item):hover {
  background: var(--ui-secondary-hover);
}
:root[data-theme] :is(.match-rail-section button.active, .match-item.selected,
  .risk-rail-item.active, .risk-item.selected),
:root[data-theme] :is(.match-rail-section button.active, .match-item.selected,
  .risk-rail-item.active, .risk-item.selected):hover:not(:disabled) {
  background: var(--ui-accent-soft);
  color: var(--ui-text);
  box-shadow: inset 3px 0 var(--ui-accent);
}
:root[data-theme] :is(.match-blocked-toggle.has-terms,
  .match-blocked-toggle[aria-expanded="true"]) {
  border-color: var(--ui-accent);
  background: var(--ui-accent-soft);
  color: var(--ui-accent);
}
:root[data-theme] :is(.match-blocked-toggle > span, .match-blocked-tags li,
  .match-item-tags span, .match-board .post-profile-source,
  .match-detail-tags > span:not(.match-side):not(.match-status)) {
  border-color: var(--ui-line);
  background: var(--ui-accent-soft);
  color: var(--ui-accent);
}
:root[data-theme] .match-blocked-tags button { color: var(--ui-muted); }
:root[data-theme] .match-search-highlight {
  background: var(--ui-accent-soft);
  color: var(--ui-text);
}

/* Text hierarchy is shared across both boards and their portal dialogs. */
:root[data-theme] :is(.match-rail-title, .match-toolbar h1,
  .match-item-heading .post-profile-author, .match-detail-author .post-profile-author,
  .match-detail h2, .match-dialog h2, .match-detail-body p,
  .match-item-preview, .match-contact strong, .match-detail-wechat strong,
  .match-comment-content, .match-comments-heading h3,
  .match-comment-meta .post-profile-author, .match-search-correction strong,
  .risk-item > strong, .risk-detail h1, .risk-dialog h2,
  .risk-detail-body p, .risk-detail-meta strong) {
  color: var(--ui-text);
}
:root[data-theme] :is(.match-rail-section > span,
  .match-rail-section .match-category-chevron, .match-list-heading span,
  .match-item-classification, .match-item-platform, .match-item-category,
  .match-item-meta, .match-item-meta time, .match-detail-meta,
  .match-detail .match-detail-date, .match-detail-wechat,
  .match-contact span, .match-contact small, .match-pagination span,
  .match-empty, .match-detail-placeholder, .match-dialog label,
  .match-dialog header small, .match-form-note, .match-form-count,
  .match-feedback-target, .match-feedback-count, .match-profile-contact-tools,
  .match-blocked-heading .match-blocked-hint, .match-blocked-footer,
  .match-blocked-summary, .match-search-correction,
  .match-comments-heading h3 span, .match-comments-loading,
  .match-comments-empty, .match-comment-time, .match-comment-pending,
  .match-comment-deleted .match-comment-content, .match-comment-reply-recipient,
  .match-comment-reply-recipient .post-profile-author,
  .match-comment-reply-preview, .match-comments-pagination,
  .match-comment-expanded-status > span,
  .match-comment-login .match-comment-login-placeholder,
  .match-comment-action-dialog label, .match-comment-action-dialog p,
  .risk-rail-label, .risk-platform-select, .risk-rail-note,
  .risk-list-heading > span, .risk-item p, .risk-item-meta,
  .risk-detail-meta, .risk-pagination span, .risk-empty,
  .risk-detail-placeholder, .risk-detail-body h2, .risk-evidence h2,
  .risk-evidence h2 span, .risk-no-evidence, .risk-dialog header small,
  .risk-dialog label, .risk-upload small, .risk-upload-item > svg,
  .risk-form-note, .risk-dispute-target, .risk-mobile-filter label) {
  color: var(--ui-muted);
}
:root[data-theme] :is(.match-comment-reply-preview strong, .risk-rail-title,
  .risk-dialog .risk-upload) { color: var(--ui-accent); }
:root[data-theme] .match-comment-guest-avatar {
  background: var(--ui-secondary);
  color: var(--ui-muted);
}
:root[data-theme] .match-comment-expanded-status { border-color: var(--ui-line); }
:root[data-theme] .match-comment-focused {
  background: var(--ui-accent-soft);
  outline-color: var(--ui-focus);
}

/* Social action meanings are preserved; only the generic action uses accent. */
:root[data-theme] .match-board .post-interaction-bar { color: var(--ui-muted); }
:root[data-theme] .match-board .post-interaction:not(
  .post-interaction--like, .post-interaction--dislike, .post-interaction--bookmark
) {
  --post-action-color: var(--ui-accent);
  --post-action-halo: var(--ui-accent-soft);
}
:root[data-theme] .match-comments .match-comment-action:not(
  .is-liked, .is-disliked, .is-bookmarked, .match-comment-report, .match-comment-delete
) { color: var(--ui-muted); }
:root[data-theme] .match-comments .match-comment-action:not(
  .is-liked, .is-disliked, .is-bookmarked, .match-comment-report, .match-comment-delete
):hover {
  background: var(--ui-secondary-hover);
  color: var(--ui-accent);
}

/* Existing focus geometry remains intact; colours follow the shared palette. */
:root[data-theme] :is(.match-board button, .match-board a,
  .match-dialog button, .match-profile-contact-tools :is(button, a),
  .match-blocked-panel button, .match-blocked-form input,
  .match-comment-dock button, .match-comment-editor button,
  .match-comment-action-dialog :is(button, select),
  .risk-board button, .risk-dialog button):focus-visible {
  outline-color: var(--ui-focus);
}
:root[data-theme] .risk-platform-select:focus-within { outline-color: var(--ui-focus); }
:root[data-theme] .match-resizer span {
  border-color: var(--ui-surface);
  background: var(--ui-line);
}
:root[data-theme] :is(.match-resizer:hover span, .match-resizer:focus-visible span,
  .is-resizing .match-resizer span, .match-resizer:hover::before,
  .match-resizer:focus-visible::before, .is-resizing .match-resizer::before) {
  background: var(--ui-accent);
}
:root[data-theme] .match-resizer:focus-visible {
  box-shadow: inset 0 0 0 2px var(--ui-focus);
}

/* Destructive hover affordances retain red without a light-only flash in dark mode. */
:root[data-theme="dark"] :is(.match-blocked-tags button:hover,
  .match-comments .match-comment-delete:hover) {
  background: color-mix(in srgb, #c65151 18%, var(--ui-surface));
  color: #f0a493;
}

/* Account, authentication, profiles, contact assistance and messages.
   Candidate overrides: load after existing feature CSS and neutral-dark.css.
   --ui-* values belong to the shared palette. No layout or semantic-state changes. */

/* Bridge feature-local palettes so both themes share the same surface hierarchy. */
:root[data-theme] .directory-home-shell.directory-inner-shell.auth-layout-shell {
  --paper: var(--ui-bg);
  --card: var(--ui-surface);
  --auth-surface: var(--ui-bg);
}
:root[data-theme] .account-auth.auth-split {
  --auth-text: var(--ui-text);
  --auth-muted: var(--ui-muted);
  --auth-border: var(--ui-line);
}
:root[data-theme] .auth-split .auth-form-panel { background: var(--ui-bg); }
:root[data-theme] .auth-split .auth-promo.auth-connection {
  color: var(--ui-text);
  background: var(--ui-surface-raised);
}
:root[data-theme] .phone-verification {
  --phone-text: var(--ui-text);
  --phone-muted: var(--ui-muted);
  --phone-border: var(--ui-line);
  --phone-surface: var(--ui-field);
}
:root[data-theme] .contact-page {
  --contact-ink: var(--ui-text);
  --contact-muted: var(--ui-muted);
  --contact-line: var(--ui-line);
  --contact-accent: var(--ui-accent);
  --contact-soft: var(--ui-accent-soft);
}
:root[data-theme] .direct-messages {
  --dm-surface: var(--ui-surface);
  --dm-ink: var(--ui-text);
  --dm-muted: var(--ui-muted);
  --dm-line: var(--ui-line);
  --dm-soft: var(--ui-field);
  --dm-selected: var(--ui-accent-soft);
  --dm-hover: var(--ui-secondary-hover);
  --dm-accent: var(--ui-accent);
}

/* Primary actions: one treatment for submission, save and confirmation. */
:root[data-theme] .auth-split .button.dark.auth-submit,
:root[data-theme] .phone-verification .phone-verification-primary,
:root[data-theme] .account-page .button.dark,
:root[data-theme] .profile-editor .profile-save-button,
:root[data-theme] .submission-page .button.dark,
:root[data-theme] .contact-page .contact-button-primary,
:root[data-theme] .account-appeal-submit button,
:root[data-theme] .user-profile-follow:not(.is-following):not(.is-blocked) {
  color: var(--ui-on-primary);
  background: var(--ui-primary);
  border-color: var(--ui-primary);
}
:root[data-theme] .auth-split .button.dark.auth-submit:hover:not(:disabled),
:root[data-theme] .phone-verification .phone-verification-primary:hover:not(:disabled),
:root[data-theme] .account-page .button.dark:hover:not(:disabled),
:root[data-theme] .profile-editor .profile-save-button:hover:not(:disabled),
:root[data-theme] .submission-page .button.dark:hover:not(:disabled),
:root[data-theme] .contact-page .contact-button-primary:hover:not(:disabled),
:root[data-theme] .account-appeal-submit button:hover:not(:disabled),
:root[data-theme] .user-profile-follow:not(.is-following):not(.is-blocked):hover:not(:disabled) {
  color: var(--ui-on-primary);
  background: var(--ui-primary-hover);
  border-color: var(--ui-primary-hover);
}

/* Secondary actions have a consistent quiet surface and neutral border. */
:root[data-theme] .account-email-code button,
:root[data-theme] .phone-verification .phone-verification-send,
:root[data-theme] .account-security-actions button,
:root[data-theme] .account-guid-card button,
:root[data-theme] .account-page .account-security-refresh,
:root[data-theme] .account-page .button:not(.dark),
:root[data-theme] .contact-page .contact-button-secondary,
:root[data-theme] .account-appeal-received > button,
:root[data-theme] .user-profile-edit,
:root[data-theme] .user-profile-icon-action,
:root[data-theme] .user-profile-load-more,
:root[data-theme] .user-profile-blocked-state button,
:root[data-theme] .messages-pagination button {
  color: var(--ui-text);
  background: var(--ui-secondary);
  border-color: var(--ui-line);
}
:root[data-theme] .account-email-code button:hover:not(:disabled),
:root[data-theme] .phone-verification .phone-verification-send:hover:not(:disabled),
:root[data-theme] .account-security-actions button:hover:not(:disabled),
:root[data-theme] .account-guid-card button:hover:not(:disabled),
:root[data-theme] .account-page .account-security-refresh:hover:not(:disabled),
:root[data-theme] .account-page .button:not(.dark):hover:not(:disabled),
:root[data-theme] .contact-page .contact-button-secondary:hover:not(:disabled),
:root[data-theme] .account-appeal-received > button:hover:not(:disabled),
:root[data-theme] .user-profile-edit:hover:not(:disabled),
:root[data-theme] .user-profile-icon-action:hover:not(:disabled),
:root[data-theme] .user-profile-load-more:hover:not(:disabled),
:root[data-theme] .user-profile-blocked-state button:hover:not(:disabled),
:root[data-theme] .messages-pagination button:hover:not(:disabled) {
  color: var(--ui-text);
  background: var(--ui-secondary-hover);
  border-color: var(--ui-line);
}
:root[data-theme] .account-shortcuts button {
  color: var(--ui-accent);
  background: var(--ui-surface);
  border-color: var(--ui-line);
}
:root[data-theme] .account-shortcuts button:hover:not(:disabled) {
  background: var(--ui-secondary-hover);
  border-color: var(--ui-line);
}

/* Ghost navigation and text actions; danger menus remain feature-controlled. */
:root[data-theme] .account-nav button,
:root[data-theme] .account-sidebar-logout { color: var(--ui-muted); }
:root[data-theme] .account-nav button:hover:not(:disabled),
:root[data-theme] .account-sidebar-logout:hover:not(:disabled) {
  color: var(--ui-text);
  background: var(--ui-secondary-hover);
}
:root[data-theme] .account-nav button.active {
  color: var(--ui-accent);
  background: var(--ui-accent-soft);
  box-shadow: inset 3px 0 0 var(--ui-accent);
}
:root[data-theme] .account-nav button small,
:root[data-theme] .account-shortcuts button small,
:root[data-theme] .account-password form p,
:root[data-theme] .account-security-actions small { color: var(--ui-muted); }
:root[data-theme] .account-avatar-controls button,
:root[data-theme] .account-panel-link,
:root[data-theme] .auth-split .account-legal-consent a,
:root[data-theme] .auth-split .account-auth-switch a,
:root[data-theme] .auth-split .auth-forgot-password,
:root[data-theme] .phone-verification .phone-verification-text-button,
:root[data-theme] .phone-verification .phone-verification-skip,
:root[data-theme] .messages-page .message-view,
:root[data-theme] .messages-page .messages-empty a {
  color: var(--ui-accent);
}
:root[data-theme] .account-security-actions > div { color: var(--ui-accent); }
:root[data-theme] .auth-split .auth-password-toggle {
  color: var(--ui-muted);
  background: transparent;
}
:root[data-theme] .auth-split .auth-password-toggle:hover {
  color: var(--ui-text);
  background: var(--ui-secondary-hover);
}
:root[data-theme] .auth-split .account-legal-consent input { accent-color: var(--ui-accent); }
:root[data-theme] .account-phone-change-steps li[aria-current='step'] {
  color: var(--ui-accent);
  background: var(--ui-accent-soft);
  border-color: var(--ui-line);
}

/* Fields share the search-field palette; checkbox and invalid-state colors stay intact. */
:root[data-theme] .auth-split input:not([type='checkbox']),
:root[data-theme] .phone-verification .phone-verification-field input,
:root[data-theme] .account-profile input,
:root[data-theme] .account-profile textarea,
:root[data-theme] .account-password input,
:root[data-theme] .account-logout-others input,
:root[data-theme] .account-contact-fields input,
:root[data-theme] .account-contact-preference select,
:root[data-theme] .profile-editor input,
:root[data-theme] .profile-editor textarea,
:root[data-theme] .account-appeal-form textarea,
:root[data-theme] .submission-page .form-card input:not([type='checkbox']):not([type='radio']),
:root[data-theme] .submission-page .form-card textarea,
:root[data-theme] .submission-page .form-card select {
  color: var(--ui-text);
  background: var(--ui-field);
}
:root[data-theme] :where(
  .auth-split input:not([type='checkbox']),
  .phone-verification .phone-verification-field input,
  .account-profile input,
  .account-profile textarea,
  .account-password input,
  .account-logout-others input,
  .account-contact-fields input,
  .account-contact-preference select,
  .profile-editor input,
  .profile-editor textarea,
  .account-appeal-form textarea,
  .submission-page .form-card input:not([type='checkbox']):not([type='radio']),
  .submission-page .form-card textarea,
  .submission-page .form-card select
):not([aria-invalid='true']) {
  border-color: var(--ui-line);
}
:root[data-theme] .account-profile input[readonly] {
  color: var(--ui-muted);
  background: var(--ui-surface-raised);
}
:root[data-theme] .auth-split input::placeholder,
:root[data-theme] .phone-verification input::placeholder,
:root[data-theme] .account-page input::placeholder,
:root[data-theme] .account-page textarea::placeholder,
:root[data-theme] .submission-page input::placeholder,
:root[data-theme] .submission-page textarea::placeholder { color: var(--ui-muted); }
:root[data-theme] .auth-split input:not([type='checkbox']):not([aria-invalid='true']):focus,
:root[data-theme] .phone-verification .phone-verification-field input:not([aria-invalid='true']):focus,
:root[data-theme] .account-profile input:not([aria-invalid='true']):focus,
:root[data-theme] .account-profile textarea:not([aria-invalid='true']):focus,
:root[data-theme] .account-password input:not([aria-invalid='true']):focus,
:root[data-theme] .account-logout-others input:not([aria-invalid='true']):focus,
:root[data-theme] .account-contact-fields input:not([aria-invalid='true']):focus,
:root[data-theme] .account-contact-preference select:focus,
:root[data-theme] .profile-editor input:not([aria-invalid='true']):focus,
:root[data-theme] .profile-editor textarea:not([aria-invalid='true']):focus,
:root[data-theme] .submission-page .form-card input:not([type='checkbox']):not([type='radio']):not([aria-invalid='true']):focus,
:root[data-theme] .submission-page .form-card textarea:not([aria-invalid='true']):focus,
:root[data-theme] .submission-page .form-card select:focus {
  border-color: var(--ui-focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-focus) 16%, transparent);
}
:root[data-theme] .auth-split :is(button, a, input[type='checkbox']):focus-visible,
:root[data-theme] .phone-verification :focus-visible,
:root[data-theme] .contact-page :is(button, input):focus-visible,
:root[data-theme] .messages-page :focus-visible,
:root[data-theme] .auth-split .auth-email-suggestion-panel button:focus-visible,
:root[data-theme] .account-email-menu :focus-visible,
:root[data-theme] .account-page :is(.account-security, .account-merchant-contact) :is(button, input, select, summary):focus-visible,
:root[data-theme] .account-appeal-form textarea:focus { outline-color: var(--ui-focus); }

/* Contact cards and utility surfaces; QR image backdrops intentionally stay white. */
:root[data-theme] .contact-resource-card,
:root[data-theme] .contact-ticket-card,
:root[data-theme] .contact-qr-card,
:root[data-theme] .contact-page-state,
:root[data-theme] .contact-history-item {
  background: var(--ui-surface);
  border-color: var(--ui-line);
}
:root[data-theme] .contact-code-box,
:root[data-theme] .contact-no-qr {
  background: var(--ui-surface-raised);
  border-color: var(--ui-line);
}
:root[data-theme] .contact-code-box input,
:root[data-theme] .contact-person-avatar,
:root[data-theme] .contact-step-number { color: var(--ui-accent); }
:root[data-theme] .contact-step-number { background: var(--ui-accent-soft); }
:root[data-theme] .contact-no-qr strong { color: var(--ui-text); }
:root[data-theme] .contact-page-scroll { scrollbar-color: var(--ui-line) transparent; }

/* Keep sent-message contrast coherent when the accent isn't blue. */
:root[data-theme] .dm-message.is-own .dm-bubble,
:root[data-theme] .dm-count,
:root[data-theme] .messages-private-nav .messages-channel-tabs > button > span,
:root[data-theme] .messages-channel-tabs > button > span {
  color: var(--ui-on-primary);
  background: var(--ui-primary);
}
:root[data-theme] .dm-message.is-own .dm-message-meta {
  color: color-mix(in srgb, var(--ui-on-primary) 76%, transparent);
}
:root[data-theme] .messages-tabs button[aria-pressed='true']::after { background: var(--ui-accent); }
:root[data-theme] .message-item.is-unread { background: var(--ui-accent-soft); }
:root[data-theme] .messages-mark-read:hover:enabled,
:root[data-theme] .messages-back:hover { color: var(--ui-accent); }

/* Toast semantics remain success/error-specific; neutral chrome shares the site palette. */
:root[data-theme] [data-sonner-toaster].aibuy-notifications [data-sonner-toast].aibuy-toast {
  color: var(--ui-text);
  background: var(--ui-surface-raised);
  border-color: var(--ui-line);
  border-left-color: var(--ui-accent);
}
:root[data-theme] [data-sonner-toaster].aibuy-notifications [data-sonner-toast].aibuy-toast[data-type='error'] {
  border-left-color: #c65151;
}
:root[data-theme] .aibuy-notifications [data-sonner-toast]:not([data-type='success']):not([data-type='error']) [data-icon] { color: var(--ui-accent); }
:root[data-theme] [data-sonner-toaster].aibuy-notifications [data-sonner-toast] [data-close-button] {
  color: var(--ui-muted);
  background: transparent;
}
:root[data-theme] [data-sonner-toaster].aibuy-notifications [data-sonner-toast] [data-close-button]:hover {
  color: var(--ui-text);
  background: var(--ui-secondary-hover);
}
