/* Copied from apps/website/src/styles/tokens and pages/legal.css; --site-rem rescales the site's 16px rem to Material's 125% root. */
@font-face {
  font-family: "Switzer";
  src: url("../fonts/switzer-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Switzer";
  src: url("../fonts/switzer-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Switzer";
  src: url("../fonts/switzer-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Switzer";
  src: url("../fonts/switzer-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --site-rem: 0.8rem;
  --site-font-body: "Switzer", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  --site-navy-950: #00061d;
  --site-navy-900: #000f47;
  --site-navy-800: #001566;
  --site-navy-700: #001c83;
  --site-navy-600: #303e73;
  --site-navy-400: #7a85b0;
  --site-navy-200: #c7ccde;
  --site-navy-050: #eef0f6;
  --site-navy-025: #f6f7fb;
  --site-dark-000: #01030b;
  --site-dark-100: #030917;
  --site-dark-200: #091223;
  --site-dark-300: #121d31;
  --site-dark-400: #1b273e;
  --site-dark-ink-primary: #e5e8ed;
  --site-dark-ink-secondary: #b1b6c0;
  --site-dark-ink-muted: #8c929f;
  --site-signal-green: #3aba6a;
  --site-white: #ffffff;

  --site-fw-medium: 500;
  --site-fw-semibold: 600;
  --site-text-2xs: calc(0.6875 * var(--site-rem));
  --site-text-sm: calc(0.875 * var(--site-rem));
  --site-text-base: var(--site-rem);
  --site-text-md: calc(1.125 * var(--site-rem));
  --site-text-xl: clamp(calc(1.5 * var(--site-rem)), calc(0.5vw + 1.38 * var(--site-rem)), calc(1.75 * var(--site-rem)));
  --site-text-3xl: clamp(calc(2.25 * var(--site-rem)), calc(1.88vw + 1.78 * var(--site-rem)), calc(3 * var(--site-rem)));
  --site-leading-tight: 1.08;
  --site-leading-snug: 1.25;
  --site-leading-relaxed: 1.7;
  --site-tracking-tight: -0.02em;
  --site-tracking-widest: 0.14em;
  --site-measure-wide: 76ch;

  --site-space-2: calc(0.5 * var(--site-rem));
  --site-space-3: calc(0.75 * var(--site-rem));
  --site-space-4: var(--site-rem);
  --site-space-5: calc(1.25 * var(--site-rem));
  --site-space-6: calc(1.5 * var(--site-rem));
  --site-space-8: calc(2 * var(--site-rem));
  --site-space-10: calc(2.5 * var(--site-rem));
  --site-space-12: calc(3 * var(--site-rem));
  --site-radius-xs: 4px;
  --site-radius-md: 10px;
  --site-radius-lg: 14px;
  --site-stroke-hair: 1px;
}

[data-md-color-scheme="default"] {
  --site-bg-canvas: var(--site-white);
  --site-surface: var(--site-white);
  --site-surface-sunken: var(--site-navy-025);
  --site-surface-hover: var(--site-navy-025);
  --site-border-subtle: #e6e9f2;
  --site-text-primary: var(--site-navy-950);
  --site-text-secondary: var(--site-navy-600);
  --site-text-muted: var(--site-navy-400);
  --site-text-eyebrow: var(--site-navy-400);
  --site-text-link: #0a5aa6;
  --site-accent: var(--site-navy-800);
  --site-footer: var(--site-navy-950);
  --site-shadow-sm: 0 2px 6px rgba(0, 21, 102, 0.07), 0 1px 2px rgba(0, 21, 102, 0.05);
  --site-shadow-lg: 0 20px 56px rgba(0, 21, 102, 0.13), 0 4px 12px rgba(0, 21, 102, 0.06);
}

[data-md-color-scheme="slate"] {
  --site-bg-canvas: var(--site-dark-100);
  --site-surface: var(--site-dark-300);
  --site-surface-sunken: var(--site-dark-000);
  --site-surface-hover: var(--site-dark-400);
  --site-border-subtle: color-mix(in oklab, #fff 8%, transparent);
  --site-text-primary: var(--site-dark-ink-primary);
  --site-text-secondary: var(--site-dark-ink-secondary);
  --site-text-muted: var(--site-dark-ink-muted);
  --site-text-eyebrow: var(--site-dark-ink-secondary);
  --site-text-link: var(--site-signal-green);
  --site-accent: var(--site-signal-green);
  --site-footer: var(--site-dark-000);
  --site-shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.45);
  --site-shadow-lg: 0 20px 56px rgba(0, 0, 0, 0.6);
}

[data-md-color-scheme] {
  --product-font-body: var(--site-font-body);
  --md-text-font-family: var(--site-font-body);
  --md-default-bg-color: var(--site-bg-canvas);
  --md-default-fg-color: var(--site-text-primary);
  --md-default-fg-color--light: var(--site-text-secondary);
  --md-default-fg-color--lighter: var(--site-text-muted);
  --md-default-fg-color--lightest: var(--site-border-subtle);
  --md-typeset-color: var(--site-text-secondary);
  --md-typeset-a-color: var(--site-text-link);
  --md-accent-fg-color: var(--site-text-primary);
  --md-code-bg-color: var(--site-surface-sunken);
  --md-code-fg-color: var(--site-text-primary);
  --md-footer-bg-color: var(--site-footer);
  --md-footer-bg-color--dark: var(--site-footer);
  --surface-card: var(--site-surface);
  --border-subtle: var(--site-border-subtle);
  --shadow-md: var(--site-shadow-sm);
  --shadow-lg: var(--site-shadow-lg);
}

.md-header {
  color: var(--site-text-primary);
  background: var(--site-surface);
  border-bottom: var(--site-stroke-hair) solid var(--site-border-subtle);
  box-shadow: none;
}

.md-header::after {
  display: none;
}

[data-md-color-scheme="default"] .md-header__button.md-logo img {
  content: url("../logo-dark.svg");
}

[data-md-color-scheme="slate"] .md-header__button.md-logo img {
  content: url("../logo-light.svg");
}

.md-header__topic {
  font-weight: var(--site-fw-semibold);
  letter-spacing: var(--site-tracking-tight);
}

.md-tabs,
[data-md-color-scheme="slate"] .md-tabs {
  color: var(--site-text-secondary);
  background: var(--site-surface);
  border-bottom: var(--site-stroke-hair) solid var(--site-border-subtle);
}

.md-tabs__link {
  opacity: 1;
  color: var(--site-text-secondary);
  font-weight: var(--site-fw-medium);
}

.md-tabs__link:hover {
  color: var(--site-text-primary);
  background: none;
}

.md-tabs__link--active {
  color: var(--site-text-primary);
  font-weight: var(--site-fw-semibold);
}

.md-tabs__link--active::after {
  background: var(--site-accent);
}

.md-search__form,
[data-md-color-scheme="default"] .md-search__form {
  background: var(--site-surface-sunken);
  border: var(--site-stroke-hair) solid var(--site-border-subtle);
  border-radius: var(--site-radius-md);
}

.md-search__form:hover,
.md-search__form:focus-within {
  background: var(--site-surface);
  border-color: var(--site-text-muted);
  box-shadow: none;
}

.md-search__input,
.md-search__input::placeholder,
.md-search__icon {
  color: var(--site-text-muted);
}

.md-search__input {
  color: var(--site-text-primary);
}

.md-path {
  font-size: var(--site-text-2xs);
  font-weight: var(--site-fw-semibold);
  letter-spacing: var(--site-tracking-widest);
  text-transform: uppercase;
  color: var(--site-text-eyebrow);
}

.md-path__link {
  color: inherit;
}

.md-typeset {
  font-size: var(--site-text-base);
  line-height: var(--site-leading-relaxed);
}

.md-typeset h1 {
  margin: var(--site-space-3) 0 var(--site-space-10);
  padding-bottom: var(--site-space-8);
  border-bottom: var(--site-stroke-hair) solid var(--site-border-subtle);
  color: var(--site-text-primary);
  font-size: var(--site-text-3xl);
  font-weight: var(--site-fw-semibold);
  line-height: var(--site-leading-tight);
  letter-spacing: var(--site-tracking-tight);
}

.md-typeset > :is(h2, h3, h4) {
  border-left: 0;
  padding-left: 0;
  color: var(--site-text-primary);
  line-height: var(--site-leading-snug);
  letter-spacing: var(--site-tracking-tight);
}

.md-typeset > h2 {
  margin: var(--site-space-12) 0 var(--site-space-4);
  padding-top: var(--site-space-5);
  border-top: var(--site-stroke-hair) solid var(--site-border-subtle);
  font-size: var(--site-text-xl);
  font-weight: var(--site-fw-semibold);
}

.md-typeset > h3 {
  margin: var(--site-space-8) 0 var(--site-space-3);
  font-size: var(--site-text-md);
  font-weight: var(--site-fw-semibold);
}

.md-typeset > h4 {
  margin: var(--site-space-6) 0 var(--site-space-2);
  font-size: var(--site-text-base);
  font-weight: var(--site-fw-semibold);
  letter-spacing: 0;
}

.md-typeset > :is(p, ul, ol, h2, h3, h4) {
  max-width: var(--site-measure-wide);
}

.md-typeset > p {
  margin: 0 0 var(--site-space-5);
}

.md-typeset > :is(ul, ol) li {
  margin-bottom: var(--site-space-2);
}

.md-typeset > :is(ul, ol) li::marker {
  color: var(--site-text-muted);
}

.md-typeset strong {
  color: var(--site-text-primary);
  font-weight: var(--site-fw-semibold);
}

.md-typeset > :is(p, ul, ol) a:not(.md-button),
.md-typeset__table a {
  text-decoration: underline;
  text-underline-offset: 0.15em;
  overflow-wrap: anywhere;
}

.md-typeset table:not([class]) {
  border: 0;
  border-collapse: collapse;
  border-radius: 0;
  box-shadow: none;
  font-size: var(--site-text-sm);
}

.md-typeset table:not([class]) :is(th, td) {
  padding: var(--site-space-3);
  border: var(--site-stroke-hair) solid var(--site-border-subtle);
  vertical-align: top;
}

.md-typeset table:not([class]) th {
  color: var(--site-text-primary);
  background: var(--site-surface-sunken);
  font-weight: var(--site-fw-semibold);
}

.md-typeset table:not([class]) tbody tr:hover {
  background: var(--site-surface-hover);
  box-shadow: none;
}

.md-typeset :not(pre) > code {
  padding: 0.1em 0.35em;
  border-radius: var(--site-radius-xs);
}

.md-nav {
  font-size: var(--site-text-sm);
}

.md-nav__link {
  color: var(--site-text-secondary);
}

.md-nav__link:hover,
.md-nav__link:focus {
  color: var(--site-text-link);
}

.md-nav__item--section > .md-nav__link,
.md-nav--primary > .md-nav__title {
  color: var(--site-text-eyebrow);
  font-size: var(--site-text-2xs);
  font-weight: var(--site-fw-semibold);
  letter-spacing: var(--site-tracking-widest);
  text-transform: uppercase;
}

.md-nav__link--active,
.md-nav__item .md-nav__link--active {
  background: var(--site-surface-hover);
  color: var(--site-text-primary) !important;
  border-radius: var(--site-radius-md);
}

.md-nav--secondary {
  border-left: var(--site-stroke-hair) solid var(--site-border-subtle);
}
