/* ==========================================================================
   Project-page theme: light, wide, generic.
   Screen only: printing still yields the light manuscript layout.
   ========================================================================== */
:root {
  --pp-bg: #ffffff;
  --pp-surface: #f7f8fa;
  --pp-surface-2: #f1f3f6;
  --pp-border: #e3e6eb;
  --pp-text: #1f2430;
  --pp-muted: #5b6472;
  --pp-faint: #8a93a0;
  --pp-accent: #2698BA;
  --pp-accent-ink: #ffffff;
  --pp-col: 940px;
  --pp-out: 110px;
  --pp-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --pp-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
}
/* Typeface: Inter throughout (not the distill Roboto), JetBrains Mono for code */
body, .pp-bar, .pp-hero, d-article, d-appendix, d-contents, d-citation-list, d-footnote-list,
#bibtex-container, figcaption, .subcap, table.ptable, .fig-hint, .supplement, .tax-fig,
.stack-fig, .tbl-toolbar, .cite-card, .viz-tip, button, input, select,
d-article p, d-article li, d-article h2, d-article h3, d-article h4, d-appendix h3 {
  font-family: var(--pp-sans) !important;
}
pre, code, #bibtex-container pre { font-family: var(--pp-mono) !important; }
body { font-feature-settings: "cv11", "ss01", "ss03"; -webkit-font-smoothing: antialiased; }
d-article h2, d-article h3, .pp-hero h1 { letter-spacing: -0.02em; }
@media (min-width: 1400px) and (max-width: 1759px) { :root { --pp-out: 0px; } }
@media (max-width: 1199px) { :root { --pp-out: 0px; } }

@media screen {
  html, body { background: var(--pp-bg) !important; color: var(--pp-text); }
  body { font-feature-settings: "kern"; }
  ::selection { background: rgba(92, 195, 228, 0.35); }

  /* ---------------- Top bar ---------------- */
  .pp-bar {
    position: sticky; top: 0; z-index: 100;
    background: rgba(255, 255, 255, 0.88); backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--pp-border);
  }
  .pp-bar-inner {
    max-width: 1240px; margin: 0 auto; padding: 0 24px; height: 52px;
    display: flex; align-items: center; gap: 20px;
  }
  .pp-bar-title { font-weight: 600; font-size: 0.92rem; color: var(--pp-text) !important; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .pp-bar nav { margin-left: auto; display: flex; gap: 18px; }
  .pp-bar nav a { color: var(--pp-muted) !important; font-size: 0.85rem; text-decoration: none; }
  .pp-bar nav a:hover { color: var(--pp-text) !important; }

  /* ---------------- Hero ---------------- */
  .pp-hero { text-align: center; padding: 72px 24px 40px; max-width: 1040px; margin: 0 auto; }
  .pp-hero h1 {
    font-size: clamp(1.9rem, 3.6vw, 2.9rem); line-height: 1.18; font-weight: 700;
    letter-spacing: -0.015em; color: #111; margin: 0 0 28px;
  }
  .pp-authors { font-size: 1.12rem; line-height: 1.9; margin: 0 0 6px; }
  .pp-authors span { white-space: nowrap; margin: 0 0.55em; color: var(--pp-text); }
  .pp-authors a { color: var(--pp-accent) !important; text-decoration: none; }
  .pp-authors a:hover { text-decoration: underline; }
  .pp-authors sup { color: var(--pp-muted); font-size: 0.7em; margin-left: 1px; }
  .pp-affil { color: var(--pp-muted); font-size: 1rem; margin: 0 0 6px; }
  .pp-notes { color: var(--pp-faint); font-size: 0.86rem; margin: 0; }
  .pp-notes a { color: var(--pp-muted) !important; }
  .pp-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 30px 0 0; }
  .pp-btn {
    display: inline-flex; align-items: center; gap: 8px; padding: 9px 18px; border-radius: 999px;
    background: var(--pp-surface-2); border: 1px solid var(--pp-border);
    color: var(--pp-text) !important; font-size: 0.9rem; font-weight: 500; text-decoration: none !important;
    transition: background 0.15s, border-color 0.15s;
  }
  .pp-btn:hover { background: #e8ebf0; border-color: #cfd5dd; }
  .pp-btn.pp-primary { background: var(--pp-accent); border-color: var(--pp-accent); color: var(--pp-accent-ink) !important; }
  .pp-btn.pp-primary:hover { filter: brightness(1.08); }
  .pp-btn svg { width: 16px; height: 16px; fill: currentColor; }

  /* distill's own title, byline and old chrome are replaced by the hero */
  d-title, d-byline, #navbar, body > header:not(.pp-bar) { display: none !important; }
  .post.distill { padding-top: 0 !important; }
  body.fixed-top-nav { padding-top: 0 !important; }

  /* ---------------- Wide single-column grid ---------------- */
  html body d-article, html body d-appendix, html body #bibtex-container {
    display: grid !important;
    grid-template-columns:
      [screen-start] 1fr
      [page-start] var(--pp-out)
      [text-start kicker-start middle-start] min(var(--pp-col), calc(100vw - 32px))
      [text-end kicker-end middle-end gutter-start] var(--pp-out)
      [page-end gutter-end] 1fr
      [screen-end] !important;
    column-gap: 0 !important;
    border-top: 1px solid var(--pp-border) !important;
    color: var(--pp-text);
    font-size: 1.02rem; line-height: 1.75;
  }
  html body d-article > *, html body d-appendix > *, html body #bibtex-container > * { grid-column: text !important; }
  html body d-article > .l-page, html body d-article > figure.l-page { grid-column: page !important; }
  d-article { padding-top: 2.2rem !important; contain: none !important; }

  /* Contents: fixed sidebar on wide screens, a card at the top otherwise */
  html body d-article d-contents {
    grid-column: text !important; grid-row: auto !important; justify-self: stretch !important;
    width: auto !important; display: block !important; margin: 0 0 2rem !important;
    padding: 1rem 1.3rem !important; border: 1px solid var(--pp-border) !important;
    border-radius: 12px; background: var(--pp-surface);
  }
  d-article d-contents nav h3 { color: var(--pp-muted) !important; font-size: 0.72rem !important; letter-spacing: 0.12em; text-transform: uppercase; }
  d-article d-contents nav div { color: var(--pp-text) !important; margin-bottom: 0 !important; font-weight: 500 !important; }
  d-article d-contents nav a { color: var(--pp-text) !important; }
  d-article d-contents nav .toc-sub a, d-article d-contents nav .toc-sub2 a { color: var(--pp-muted) !important; font-weight: 400; }
  d-article d-contents nav a:hover { color: var(--pp-accent) !important; border-bottom: none !important; }
  d-article d-contents nav a.pp-current { color: var(--pp-accent) !important; }
  @media (min-width: 1400px) {
    html body d-article d-contents {
      position: fixed !important; --pp-tw: min(280px, calc((100vw - var(--pp-col)) / 2 - var(--pp-out) - 50px));
      top: 76px; left: calc((100vw - var(--pp-col)) / 2 - var(--pp-out) - var(--pp-tw) - 30px);
      width: var(--pp-tw) !important; max-height: calc(100vh - 100px); overflow-y: auto;
      margin: 0 !important; padding: 0.2rem 0.4rem 0.2rem 0 !important;
      border: none !important; background: transparent; font-size: 0.8rem; line-height: 1.5;
      scrollbar-width: thin; scrollbar-color: #d0d5dc transparent;
      opacity: 0; pointer-events: none; transition: opacity 0.2s;
    }
    html body.pp-toc-on d-article d-contents { opacity: 1; pointer-events: auto; }
  }

  /* ---------------- Typography ---------------- */
  d-article h2 {
    font-size: 1.75rem !important; font-weight: 700 !important; border-bottom: 1px solid var(--pp-border) !important;
    padding-bottom: 0.45rem; margin-top: 3.2rem !important;
  }
  d-article h3 { font-size: 1.28rem !important; margin-top: 2.2rem !important; }
  d-article h4 { font-size: 1.08rem !important; }

  /* ---------------- Figures and tables: manuscript styling, a little more air ---------------- */
  figure.pfig { margin: 2.4rem 0 !important; }
  figure.pfig figcaption, figure.pfig .subcap { font-size: 0.86rem !important; }
  .ptable-wrap { margin: 2rem 0 !important; }
  table.ptable { font-size: 0.78rem !important; }
  table.ptable caption { font-size: 0.86rem !important; }

  /* ---------------- Appendix, references, citation ---------------- */
  d-appendix { padding-top: 2rem !important; }
  #bibtex-container { color: var(--pp-muted) !important; padding: 2rem 0 4rem; border-top: 1px solid var(--pp-border); }
  #bibtex-container pre {
    background: var(--pp-surface) !important; color: #1f2430 !important; border: 1px solid var(--pp-border);
    border-radius: 12px; padding: 16px 18px; white-space: pre-wrap; word-break: break-word; font-size: 0.8rem; margin: 0.6rem 0 1.6rem;
  }
  .pp-footer { text-align: center; color: var(--pp-faint); font-size: 0.8rem; padding: 0 16px 48px; }

  @media (max-width: 700px) {
    .pp-hero { padding: 44px 16px 28px; }
    .pp-authors { font-size: 1rem; }
    .pp-bar nav { gap: 12px; }
  }
}

@media print {
  .pp-bar, .pp-hero .pp-buttons, .pp-footer { display: none !important; }
  .pp-hero { text-align: center; padding: 0 0 1rem; }
  .pp-hero h1 { font-size: 20pt; }
  d-title, d-byline { display: none !important; }
}
