/* Shared visual foundation. Page styles own layout, not brand primitives. */
@font-face {
  font-family: "Space Grotesk";
  src: url("/fonts/space-grotesk.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("/fonts/instrument-serif-regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("/fonts/instrument-serif-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("/fonts/ibm-plex-mono-400.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("/fonts/ibm-plex-mono-500.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("/fonts/ibm-plex-mono-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
:root {
  --paper: #f2efe6;
  --ink: #171714;
  --orange: #ff5a36;
  --orange-editorial: #c93f24;
  --blue: #315cff;
  --line: #cfcbc0;
  --muted: #6d6a61;
  --white: #fffdf8;
  --tracking-serif: -0.012em;
  --tracking-label: 0.1em;
}
*:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 3px;
}
.skip-link {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 8px;
  transform: translateY(-160%);
  padding: 12px 16px;
  background: var(--ink);
  color: var(--white);
  font: 700 0.75rem "Space Grotesk", sans-serif;
  text-decoration: none;
}
.skip-link:focus {
  transform: none;
}
