@import url("../fonts/fonts.css");

:root {
  --opsight-font-sans: "DM Sans", Arial, Helvetica, sans-serif;
  --opsight-font-heading: "Space Grotesk", Arial, sans-serif;
  --opsight-font-display: "Instrument Serif", serif;
  --opsight-font-body-size: 1rem;
  --opsight-font-intro-size: 0.9375rem;
  --opsight-font-page-title: clamp(2.125rem, 4.5vw, 2.875rem);
  --opsight-font-table-size: 0.875rem;
  --opsight-font-table-heading-size: 0.694444rem;
  --opsight-paper: #fffdfc;
  --opsight-paper-translucent: rgba(255, 253, 252, 0.97);
  --opsight-surface: #ffffff;
  --opsight-white-translucent: rgba(255, 255, 255, 0.32);
  --opsight-ink: #1f161c;
  --opsight-accent: #d63384;
  --opsight-accent-rgb: 214, 51, 132;
  --opsight-accent-hover: #b0236a;
  --opsight-accent-soft: #f9edf3;
  --opsight-muted: #756670;
  --opsight-line: #e9dfe4;
  --opsight-border: #dfcdd6;
  --opsight-tint: var(--opsight-accent-soft);
  --opsight-soft-surface: #fcf7fa;
  --opsight-dark-muted: #f0cddd;
  --opsight-error: #ad2452;
  --opsight-warning: #916218;
  --opsight-selection: #f4d5e5;
  --opsight-selection-accent: var(--opsight-accent-hover);
  --opsight-event-border: var(--opsight-border);
  --opsight-evidence-highlight: var(--opsight-accent-soft);
  --opsight-event-hover: #f4e4ec;
  --opsight-shadow: rgba(68, 32, 53, 0.2);
  --opsight-divider: #b990a5;
  --opsight-focus-ring: #edb5d0;
  --opsight-subtle: #9c8592;
  --opsight-mask-opaque: #000;
  --opsight-carousel-dot: #777777;
  --opsight-carousel-track: #888888;
  --opsight-carousel-fill: #1d1d1d;
  --opsight-carousel-duration: 7000ms;
}

html {
  font-size: 90%;
}