/* House type: Instrument Serif (display) · Newsreader VF (text) · IBM Plex Mono (labels)
   Self-hosted OFL. Hooks: --font-display, --font-text, --font-mono */

@font-face {
  font-family: "Instrument Display";
  src: url("/fonts/instrument-serif-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Display";
  src: url("/fonts/instrument-serif-400-ext.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Instrument Display";
  src: url("/fonts/instrument-serif-400-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Instrument Display";
  src: url("/fonts/instrument-serif-400-italic-ext.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Newsreader Text";
  src: url("/fonts/newsreader-vf.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Newsreader Text";
  src: url("/fonts/newsreader-vf-ext.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Newsreader Text";
  src: url("/fonts/newsreader-vf-italic.woff2") format("woff2");
  font-weight: 200 800;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Newsreader Text";
  src: url("/fonts/newsreader-vf-italic-ext.woff2") format("woff2");
  font-weight: 200 800;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Plex House";
  src: url("/fonts/ibm-plex-mono-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-display: "Instrument Display", "Iowan Old Style", Palatino, Georgia, serif;
  --font-text: "Newsreader Text", "Iowan Old Style", Palatino, Georgia, serif;
  --font-mono: "Plex House", ui-monospace, Menlo, monospace;
}

.social-defs {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}
.social {
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1.25rem;
  margin-top: 0.15rem;
  list-style: none;
  padding: 0;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: none;
}
.social a {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  text-decoration: none;
  color: inherit;
}
.social-ico {
  width: 0.9rem;
  height: 0.9rem;
  flex-shrink: 0;
  display: block;
  fill: currentColor;
  opacity: 0.88;
}
.social a:hover .social-ico { opacity: 1; }
footer .social { color: var(--paper-mute, var(--mute, #7A7468)); }
footer .social a:hover { color: var(--paper-ink, var(--ink, #1A1814)); }

.still-type {
  aspect-ratio: 3 / 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.7rem;
  padding: 1.6rem 1.1rem;
  background: var(--chalk, #E7E2D8);
  text-align: center;
}
.still-name {
  font-family: var(--font-display);
  font-size: clamp(0.68rem, 1.5vw, 0.88rem);
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #5C564C;
}
.still-ref {
  font-family: var(--font-mono);
  font-size: 0.55rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--paper-mute, #7A7468);
}
.still-color {
  color: #E8E2D4;
}
.still-color .still-name { color: #E8E2D4; }
.still-color .still-ref { color: rgba(232, 226, 212, 0.72); }
