/* ===== Self-hosted fonts (replaces Typekit + unused Google Fonts) =====
   Source Sans 3 / Source Code Pro, SIL OFL licensed. Family names kept as
   "source-sans-pro"/"source-code-pro" so the theme CSS needs no changes. */
@font-face {
  font-family: "source-sans-pro";
  src: url("/fonts/SourceSans3-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "source-sans-pro";
  src: url("/fonts/SourceSans3-400i.woff2") format("woff2");
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "source-sans-pro";
  src: url("/fonts/SourceSans3-600.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "source-sans-pro";
  src: url("/fonts/SourceSans3-700.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "source-code-pro";
  src: url("/fonts/SourceCodePro-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}

/* ===== Sidenotes (Gwern/Tufte-style margin notes) =====
   enhancements.js moves footnotes into the right margin on wide screens.
   When active, the text column narrows and shifts left inside the content
   box, so the notes sit in the box's own margin rather than straddling
   its border. Reverts automatically when the margin is too narrow. */
body.sidenotes-active .article {
  width: 58%;
  min-width: 460px;
  margin-left: 3rem;
  margin-right: auto;
}
#sidenote-column {
  position: absolute;
  top: 0; /* js sets left/width */
}
.sidenote {
  position: absolute;
  width: 100%;
  font-size: 0.82em;
  line-height: 1.45;
  color: #D8CBCC;
  border-left: 2px solid #7a2a2a;
  padding-left: 10px;
}
.sidenote .sidenote-number {
  color: #FFBBBB;
  font-weight: 700;
  margin-right: 0.35em;
}
.sidenote p { margin-bottom: 0.4rem; }
body.sidenotes-active .footnotes { display: none; }

/* ===== Link preview hover cards ===== */
.link-preview-card {
  position: absolute;
  z-index: 2000;
  max-width: 380px;
  background-color: #1E0000;
  border: 1px solid #D8CBCC;
  border-radius: 6px;
  padding: 10px 12px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.65);
  pointer-events: none;
  font-size: 0.85em;
  line-height: 1.4;
  color: #D8CBCC;
}
.link-preview-card .lp-title {
  color: #FFBBBB;
  font-weight: 700;
  font-size: 1.05em;
  margin: 0 0 4px 0;
}
.link-preview-card img.lp-thumb {
  float: right;
  max-width: 90px;
  max-height: 90px;
  margin: 0 0 6px 8px;
  border-radius: 4px;
}
.link-preview-card .lp-extract {
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}
.link-preview-card .lp-domain {
  color: #A59090;
  font-size: 0.85em;
  margin: 6px 0 0 0;
}

/* ===== Pagefind search page theming ===== */
#search {
  --pagefind-ui-scale: 0.9;
  --pagefind-ui-primary: #FFBBBB;
  --pagefind-ui-text: #D8CBCC;
  --pagefind-ui-background: #1E0000;
  --pagefind-ui-border: #D8CBCC;
  --pagefind-ui-tag: #600D0D;
  --pagefind-ui-border-width: 1px;
  --pagefind-ui-border-radius: 6px;
  --pagefind-ui-image-border-radius: 4px;
  --pagefind-ui-font: "source-sans-pro", sans-serif;
}
#search .pagefind-ui__result-link { color: #FFBBBB !important; }
#search .pagefind-ui__result-excerpt mark {
  background-color: #600D0D;
  color: #FFDDDD;
}

/* ===== Misc ===== */
/* medium-zoom overlay should match the site's dark background */
.medium-zoom-overlay { z-index: 1500; }
.medium-zoom-image--opened { z-index: 1501; }