/* ===== Self-hosted fonts (replaces the render-blocking Google Fonts link) =====
   Bai Jamjuree, Mada, Roboto Mono — SIL OFL licensed. Family names match the
   theme CSS so no other changes are needed. */
@font-face {
  font-family: "Bai Jamjuree";
  src: url("/fonts/BaiJamjuree-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Bai Jamjuree";
  src: url("/fonts/BaiJamjuree-700.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Mada";
  src: url("/fonts/Mada-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Mada";
  src: url("/fonts/Mada-700.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Roboto Mono";
  src: url("/fonts/RobotoMono-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}

/* ===== Sidenotes (margin notes) =====
   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;
}
.sidenote {
  position: absolute;
  width: 100%;
  font-size: 0.82em;
  line-height: 1.45;
  color: #b3ebef;
  border-left: 2px solid #0a6b60;
  padding-left: 10px;
}
.sidenote .sidenote-number {
  color: #00e5a8;
  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: #004951;
  border: 1px solid #82bcad;
  border-radius: 6px;
  padding: 10px 12px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.55);
  pointer-events: none;
  font-size: 0.85em;
  line-height: 1.4;
  color: #b3ebef;
}
.link-preview-card .lp-title {
  color: #00e5a8;
  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: #82bcad;
  font-size: 0.85em;
  margin: 6px 0 0 0;
}

/* ===== Pagefind search page theming ===== */
#search {
  --pagefind-ui-scale: 0.9;
  --pagefind-ui-primary: #00e5a8;
  --pagefind-ui-text: #b3ebef;
  --pagefind-ui-background: #004951;
  --pagefind-ui-border: #82bcad;
  --pagefind-ui-tag: #005760;
  --pagefind-ui-border-width: 1px;
  --pagefind-ui-border-radius: 6px;
  --pagefind-ui-image-border-radius: 4px;
  --pagefind-ui-font: "Mada", sans-serif;
}
#search .pagefind-ui__result-link { color: #00e5a8 !important; }
#search .pagefind-ui__result-excerpt mark {
  background-color: #005760;
  color: #b3ebef;
}

/* ===== Misc ===== */
.medium-zoom-overlay { z-index: 1500; }
.medium-zoom-image--opened { z-index: 1501; }