/* Canonical source: meinGPT platform brand system, 2026-08-use-case-platform. */
:root {
  --color-background: #FCFAF9;
  --color-text: #1C1B1A;
  --color-text-top: #1C1B1A;
  --color-muted: color-mix(in srgb, #1C1B1A 72%, #FCFAF9);
  --color-border: #C1C0B8;
  --color-surface: #ECEBE5;
  --color-surface-emphasized: #FFFFFF;
  --color-surface-strong: #C1C0B8;
  --color-surface-selected: color-mix(in srgb, #002CFF 12%, #FFFFFF);
  --color-input: #FFFFFF;
  --color-input-border: #C1C0B8;
  --color-action: #002CFF;
  --color-action-hover: #003263;
  --color-on-action: #FFFFFF;
  --color-link: #002CFF;
  --color-link-hover: #003263;
  --color-server: #002CFF;
  --color-neutral-action: #2E2E2E;
  --color-neutral-action-hover: #1C1B1A;
  --color-on-neutral-action: #FFFFFF;
  --motion-duration-pane: 160ms;
}

:root[data-theme='dark'] {
  --color-background: #1C1B1A;
  --color-text: #ECEBE5;
  --color-text-top: #FFFFFF;
  --color-muted: #ECEBE5;
  --color-border: #C1C0B8;
  --color-surface: #2E2E2E;
  --color-surface-emphasized: color-mix(in srgb, #2E2E2E 88%, #FFFFFF);
  --color-surface-strong: color-mix(in srgb, #2E2E2E 72%, #FFFFFF);
  --color-surface-selected: #003263;
  --color-input: #1C1B1A;
  --color-input-border: #C1C0B8;
  --color-action: #002CFF;
  --color-action-hover: color-mix(in srgb, #002CFF 82%, #FFFFFF);
  --color-on-action: #FFFFFF;
  --color-link: color-mix(in srgb, #002CFF 72%, #FFFFFF);
  --color-link-hover: #FFFFFF;
  --color-server: #002CFF;
}

:focus-visible {
  outline-color: #002CFF;
  outline-width: 2px;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}