/* Client VI: bordered controls use one focus edge. */
html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) {
  --client-focus-edge: color-mix(in srgb, var(--brand-primary, #7c3aed) 53%, #fafafa);
  --client-selected-ink: color-mix(in srgb, var(--brand-primary, #7c3aed) 42%, #fafafa);
}

html[data-theme="light"]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) {
  --client-focus-edge: color-mix(in srgb, var(--brand-primary, #6d28d9) 44%, #242428);
  --client-selected-ink: color-mix(in srgb, var(--brand-primary, #6d28d9) 27%, #242428);
}

html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) body #root :is(
  input:not(.header-search input, .workspace-asset-search input, [type="checkbox"], [type="radio"], [type="range"], [type="file"], [type="hidden"], [type="color"], [type="button"], [type="submit"], [type="reset"]),
  textarea:not(.agent-floating-editor > textarea),
  select:not(.inline-select select, .project-toolbar select),
  button[role="combobox"]
):focus,
html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) body #root :is(
  .character-hub-tabs > button,
  .sidebar .nav-item,
  .composer-media-type-switch > button,
  .skill-template-card,
  .asset-preview-dialog > header button,
  .character-library-toolbar > button
):focus-visible,
html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) body #root :is(
  .agent-compose,
  .project-prompt-box,
  .asset-canvas-composer,
  .workspace-asset-search,
  .member-amount-input
):focus-within {
  border-color: var(--client-focus-edge) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* The editor shell owns the border of a borderless prompt field. */
html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) body #root :is(
  .agent-compose .prompt-inline-input,
  .project-prompt-box .prompt-inline-input,
  .asset-canvas-composer .prompt-inline-input,
  .asset-canvas-composer textarea,
  .workspace-asset-search input,
  .member-amount-input input
):focus {
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Select options are portaled to the document body. */
html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) body .ailink-select-popover .ailink-select-option[aria-selected="true"],
html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) body #root .character-hub-tabs > button[aria-pressed="true"] {
  color: var(--client-selected-ink) !important;
}

html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) body .ailink-select-option[aria-selected="true"] .ailink-select-tick {
  color: inherit !important;
}

@media (forced-colors: active) {
  html[data-theme]:has(#root :is(.app-shell, .workspace)):not(:has(#root .platform-admin-shell)) {
    --client-focus-edge: Highlight;
    --client-selected-ink: CanvasText;
  }
}