/* Shared design tokens for the sample site, the support widget and the Operator Platform. */
:root {
  --bg: #f7f6f2;
  --surface: #ffffff;
  --ink: #17353b;
  --ink-hover: #0f2529;
  --divider: #d8dede;
  --divider-strong: #b9c4c2;
  --text-2: #45565c;
  --support: #234e66;
  --support-tint: #e8eff2;
  --visitor-tint: #eef1ef;
  --priority: #9a352d;
  --priority-tint: #f8ecea;
  --review: #7c510b;
  --review-tint: #f7f0e3;
  --focus: #234e66;

  --font-title: 'Manrope', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body: 'Source Sans 3', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: ui-monospace, 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;

  --s1: 8px;
  --s2: 16px;
  --s3: 24px;
  --s4: 32px;
  --s5: 40px;
  --s6: 48px;
  --s8: 64px;

  --radius: 10px;
  --radius-lg: 12px;
  --target: 44px;
  --shadow-panel: 0 12px 32px rgba(23, 53, 59, 0.14), 0 2px 6px rgba(23, 53, 59, 0.08);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
}

.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

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