/* ==========================================================================
   funding.css -- the campaign index, the campaign page and the 3D viewer.

   Loaded after cnc.css and shop.css and uses their tokens (--ink, --surface,
   --accent, --line, --good, --warn ...), so it inherits both themes without
   defining a second palette. Nothing here sets a colour literal except the
   two the 3D canvas needs, and those are commented where they appear.

   THE PROGRESS BAR IS A SET OF CLASSES, NOT A STYLE ATTRIBUTE
   ----------------------------------------------------------
   A funded percentage is data, and the CSP is `style-src 'self'` -- so the
   width cannot be written as `style="width:63%"`. Twenty-one classes in steps
   of five cover the bar at a resolution nobody can see the difference beyond,
   and funding.js rounds to the nearest one. The exact figure is always printed
   as text beside the bar, so the rounding hides nothing.
   ========================================================================== */

/* ---------------------------------------------------------------- index -- */
.fund-grid {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.fund-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-1);
}

.fund-card__tag { margin: 0; }
.fund-card__title { margin: 2px 0 0; font-size: 1.12rem; line-height: 1.25; }
.fund-card__tagline { margin: 0; color: var(--ink-2); font-size: .92rem; }
.fund-card__pct { margin: 0; font-size: .86rem; color: var(--ink-3); }
.fund-card__eta { margin: 0; font-size: .82rem; color: var(--ink-3); }

.fund-card__stats {
  margin: 4px 0 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 14px;
}
.fund-card__stats > div { display: grid; gap: 1px; }
.fund-card__stats dt {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ink-3);
}
.fund-card__stats dd { margin: 0; font-weight: 600; font-size: .95rem; }

.fund-card__link {
  margin-top: auto;
  padding-top: 8px;
  font-weight: 600;
  text-decoration: none;
  color: var(--accent);
}
.fund-card__link:hover { text-decoration: underline; }

/* ------------------------------------------------------------ the bar ---- */
.fund-bar {
  position: relative;
  height: 9px;
  border-radius: var(--radius-pill);
  background: var(--surface-3);
  overflow: hidden;
}
.fund-bar__fill {
  display: block;
  height: 100%;
  width: 0;
  background: var(--good);
  border-radius: var(--radius-pill);
  transition: width .35s ease;
}
.fund-bar__fill--0   { width: 0; }
.fund-bar__fill--5   { width: 5%; }
.fund-bar__fill--10  { width: 10%; }
.fund-bar__fill--15  { width: 15%; }
.fund-bar__fill--20  { width: 20%; }
.fund-bar__fill--25  { width: 25%; }
.fund-bar__fill--30  { width: 30%; }
.fund-bar__fill--35  { width: 35%; }
.fund-bar__fill--40  { width: 40%; }
.fund-bar__fill--45  { width: 45%; }
.fund-bar__fill--50  { width: 50%; }
.fund-bar__fill--55  { width: 55%; }
.fund-bar__fill--60  { width: 60%; }
.fund-bar__fill--65  { width: 65%; }
.fund-bar__fill--70  { width: 70%; }
.fund-bar__fill--75  { width: 75%; }
.fund-bar__fill--80  { width: 80%; }
.fund-bar__fill--85  { width: 85%; }
.fund-bar__fill--90  { width: 90%; }
.fund-bar__fill--95  { width: 95%; }
.fund-bar__fill--100 { width: 100%; }

/* -------------------------------------------------------------- how it -- */
.fund-how { margin: 44px 0 8px; }
.fund-how__list {
  list-style: none;
  counter-reset: step;
  margin: 16px 0 0;
  padding: 0;
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.fund-how__list > li {
  counter-increment: step;
  padding: 16px 16px 16px 46px;
  position: relative;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.fund-how__list > li::before {
  content: counter(step);
  position: absolute;
  left: 16px;
  top: 16px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-pill);
  background: var(--accent-soft);
  color: var(--accent);
  font-size: .78rem;
  font-weight: 700;
}
.fund-how__list h3 { margin: 0 0 4px; font-size: .98rem; }
.fund-how__list p { margin: 0; font-size: .88rem; color: var(--ink-2); }

/* -------------------------------------------------------------- detail -- */
/* 64px: the sticky section bar (below) must not cover a heading it jumps to. */
.fund-detail > section,
.fund-detail > header { scroll-margin-top: 64px; }

.fund-hero {
  background: var(--bg-tint);
  border-block: 1px solid var(--line);
  padding: 26px 0 30px;
  margin-bottom: 8px;
}
.fund-hero__in {
  display: grid;
  gap: 26px;
  grid-template-columns: minmax(0, 1.6fr) minmax(260px, .9fr);
  align-items: start;
}
@media (max-width: 860px) {
  .fund-hero__in { grid-template-columns: minmax(0, 1fr); }
}
.fund-hero__status { margin: 0 0 8px; display: flex; gap: 10px; align-items: center; }
.fund-hero__code {
  font-family: var(--font-mono);
  font-size: .8rem;
  color: var(--ink-3);
}
.fund-hero__text h1 { margin: 0 0 8px; }
.fund-summary { margin-top: 10px; color: var(--ink-2); max-width: 72ch; }

.fund-raise {
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-2);
  position: sticky;
  top: 16px;
}
.fund-raise__amount { margin: 0; font-size: 1.7rem; font-weight: 700; line-height: 1.1; }
.fund-raise__of { margin: 2px 0 12px; font-size: .86rem; color: var(--ink-3); }
.fund-raise__stats {
  margin: 14px 0 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.fund-raise__stats > div { display: grid; gap: 1px; }
.fund-raise__stats dt {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ink-3);
}
.fund-raise__stats dd { margin: 0; font-weight: 600; font-size: .92rem; }
.fund-raise__refund {
  margin: 14px 0 0;
  font-size: .82rem;
  color: var(--ink-2);
  padding: 8px 10px;
  background: var(--good-soft);
  border-radius: var(--radius);
}
.fund-raise__cta { margin-top: 14px; width: 100%; text-align: center; }
.fund-raise__note { margin: 10px 0 0; font-size: .8rem; color: var(--warn); }

.fund-h2 { margin: 34px 0 12px; font-size: 1.3rem; }

/* ------------------------------------------------------------ showcase -- */
.fund-film { margin: 0 0 22px; }
.fund-film__video {
  width: 100%;
  max-height: 68vh;
  background: #101418;          /* a video letterboxes; it does so against black */
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  display: block;
}
.fund-film__cap { margin: 6px 0 0; font-size: .84rem; color: var(--ink-3); }

.fund-gallery {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
/* Drawings span the grid: see renderGallery() in funding.js. */
.fund-gallery__item--wide { grid-column: 1 / -1; }
.fund-gallery__item--wide .fund-shot__img {
  /* White, because a technical drawing is drawn on paper and its strokes are
     dark: on the dark theme it would otherwise be dark-on-dark. */
  background: #ffffff;
  padding: 8px;
  max-height: 70vh;
  object-fit: contain;
}

.fund-shot { margin: 0; }
.fund-shot__img {
  width: 100%;
  height: auto;
  display: block;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}
.fund-shot__cap { margin: 5px 0 0; font-size: .82rem; color: var(--ink-3); }

.fund-3d { margin: 6px 0 22px; }
.fund-3d__head h3 { margin: 0 0 4px; font-size: 1.05rem; }
.fund-3d__hint { margin: 0 0 10px; font-size: .86rem; color: var(--ink-2); max-width: 68ch; }

/* ------------------------------------------------------------- 3D view -- */
.r3d { display: block; }
.r3d__stage {
  position: relative;
  /* Pure white, like the drawing sheets: the isometric is drawn on paper and
     the interactive model is the same illustration, so it sits on the same
     ground rather than on the page tint. */
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 16 / 10;
  max-height: 70vh;
}
@media (max-width: 620px) { .r3d__stage { aspect-ratio: 4 / 3; } }

.r3d__canvas {
  display: block;
  width: 100%;
  height: 100%;
  touch-action: none;       /* the canvas owns drag and pinch, not the page */
  cursor: grab;
}
.r3d__canvas:active { cursor: grabbing; }
.r3d__canvas:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }

.r3d__controls {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  align-items: center;
}
.r3d__views { display: flex; flex-wrap: wrap; gap: 6px; }
.r3d__btn {
  font: inherit;
  font-size: .82rem;
  padding: 5px 11px;
  border: 1px solid var(--line-2);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--ink-2);
  cursor: pointer;
}
.r3d__btn:hover { background: var(--surface-2); color: var(--ink); }
.r3d__btn--reset { border-color: var(--accent-line); color: var(--accent); }

.r3d__explode { display: flex; align-items: center; gap: 8px; }
.r3d__explode-label { font-size: .82rem; color: var(--ink-2); }
.r3d__slider { width: 150px; accent-color: var(--accent); }

.r3d__legend {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
}
.r3d__legend-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .8rem;
  color: var(--ink-2);
  cursor: pointer;
}
.r3d__swatch {
  flex: none;
  display: block;
  border-radius: 2px;
}
.r3d__legend-check { accent-color: var(--accent); }

.r3d__caption { margin: 8px 0 0; font-size: .78rem; color: var(--ink-3); }

.r3d__fallback {
  padding: 22px;
  border: 1px dashed var(--line-2);
  border-radius: var(--radius-lg);
  background: var(--surface-2);
  color: var(--ink-2);
  font-size: .9rem;
}
.r3d__fallback-link { font-weight: 600; }

/* --------------------------------------------------------------- specs -- */
.fund-specs__list {
  margin: 0;
  display: grid;
  gap: 8px 22px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.fund-specs__row { display: grid; gap: 1px; }
.fund-specs__row dt {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ink-3);
}
.fund-specs__row dd { margin: 0; font-weight: 600; }
.fund-specs__link { margin: 14px 0 0; font-size: .88rem; }

/* --------------------------------------------------------------- tiers -- */
.fund-tiers__lede { margin: 0 0 14px; color: var(--ink-2); max-width: 72ch; }

.fund-tierlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
}

.fund-tier {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.fund-tier--on {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}
.fund-tier--gone { opacity: .62; }
.fund-tier--free { border-style: dashed; }

.fund-tier__price { margin: 0; font-size: 1.32rem; font-weight: 700; color: var(--price-ink); }
.fund-tier__saving { margin: 0; font-size: .82rem; color: var(--good); }
.fund-tier__title { margin: 4px 0 0; font-size: 1.02rem; }
.fund-tier__blurb { font-size: .9rem; color: var(--ink-2); }
.fund-tier__rewardh {
  margin: 8px 0 2px;
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--ink-3);
}
.fund-tier__reward { font-size: .9rem; }
.fund-tier__eta { margin: 6px 0 0; font-size: .82rem; color: var(--ink-3); }
.fund-tier__left { margin: 2px 0 0; font-size: .82rem; color: var(--ink-3); }
.fund-tier__left--few { color: var(--warn); font-weight: 600; }
.fund-tier__pick { margin-top: auto; align-self: start; }

/* -------------------------------------------------------------- pledge -- */
.fund-form {
  margin: 0;
  max-width: 720px;
  display: grid;
  gap: 18px;
}
.fund-form__block {
  margin: 0;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
}
.fund-form__block > legend {
  padding: 0 6px;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--ink-3);
}
.fund-form__chosen {
  margin: 0 0 12px;
  padding: 8px 10px;
  background: var(--accent-soft);
  border-radius: var(--radius);
  font-weight: 600;
  font-size: .92rem;
}
.fund-form__row {
  display: grid;
  gap: 0 12px;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}
.fund-form__total { margin: 10px 0 0; font-size: 1.02rem; }
.fund-form__total strong { font-size: 1.2rem; }
.fund-form__tax { display: block; margin-top: 4px; font-size: .8rem; color: var(--ink-3); }
.fund-form__submit { justify-self: start; min-width: 190px; }
.fund-form__legal { margin: 0; font-size: .8rem; color: var(--ink-3); max-width: 72ch; }

.field--check { display: flex; align-items: flex-start; gap: 8px; }
.field--check > label { font-weight: 400; font-size: .88rem; }
.field__opt { color: var(--ink-3); font-weight: 400; }
.field__hint { margin: 2px 0 0; font-size: .8rem; color: var(--ink-3); }

.fund-alert {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid var(--danger);
  border-radius: var(--radius);
  background: var(--danger-soft);
  color: var(--danger);
}
.fund-alert p { margin: 0; }

.fund-done {
  margin: 0 0 16px;
  padding: 18px;
  border: 1px solid var(--good);
  border-radius: var(--radius-lg);
  background: var(--good-soft);
}
.fund-done h3 { margin: 0 0 6px; }
.fund-done p { margin: 0 0 6px; }
.fund-done__ref { font-family: var(--font-mono); font-size: .9rem; }

/* --------------------------------------------------------------- risks -- */
.fund-risks { padding-bottom: 8px; }
.prose--risks {
  padding: 16px 18px;
  border-left: 3px solid var(--warn);
  background: var(--warn-soft);
  border-radius: 0 var(--radius) var(--radius) 0;
}

/* ------------------------------------------------------------- updates -- */
.fund-updates__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.fund-update {
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
}
.fund-update__when {
  margin: 0;
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ink-3);
}
.fund-update__title { margin: 2px 0 6px; font-size: 1.02rem; }

/* ------------------------------------------------------------- backers -- */
.fund-backers__list {
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
}
.fund-backer {
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  background: var(--surface);
  font-size: .84rem;
  color: var(--ink-2);
}

/* --------------------------------------------------------------- misc --- */
.fund-loading { margin: 22px 0; color: var(--ink-3); }
.fund-empty { margin: 22px 0; color: var(--ink-2); }

/* ======================================================================
   009 -- Funded Projects: stage, estimated vs received, honour roll.
   ====================================================================== */

/* ---------------------------------------------------------- stage pill -- */
.stage-pill {
  display: inline-block;
  padding: 2px 9px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--accent-line);
  background: var(--accent-soft);
  color: var(--accent);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
}
.stage-pill--research,
.stage-pill--design    { border-color: var(--line-2); background: var(--surface-2); color: var(--ink-2); }
.stage-pill--prototype,
.stage-pill--testing   { border-color: var(--warn); background: var(--warn-soft); color: var(--warn); }
.stage-pill--production,
.stage-pill--launched  { border-color: var(--good); background: var(--good-soft); color: var(--good); }

.tag--featured { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.fund-card__tag { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.fund-card--featured { border-color: var(--accent-line); box-shadow: var(--shadow-2); }
.fund-card__money { margin: 4px 0 0; font-size: .9rem; color: var(--ink-3); }
.fund-card__money strong { font-size: 1.12rem; color: var(--ink); }

/* --------------------------------------------------------- stage track -- */
.stage-track {
  list-style: none;
  margin: 6px 0 14px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.stage-track__step {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 6px;
  text-align: center;
}
/* The connecting rule runs from the previous dot to this one. */
.stage-track__step + .stage-track__step::before {
  content: "";
  position: absolute;
  top: 7px;
  right: 50%;
  width: 100%;
  height: 2px;
  background: var(--line-2);
}
.stage-track__step--done::before,
.stage-track__step--now::before { background: var(--accent); }
.stage-track__dot {
  position: relative;
  z-index: 1;
  width: 16px;
  height: 16px;
  border-radius: var(--radius-pill);
  border: 2px solid var(--line-2);
  background: var(--surface);
}
.stage-track__step--done .stage-track__dot { border-color: var(--accent); background: var(--accent); }
.stage-track__step--now .stage-track__dot {
  border-color: var(--accent);
  background: var(--surface);
  box-shadow: 0 0 0 4px var(--accent-soft);
}
.stage-track__step--now .stage-track__dot::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: var(--radius-pill);
  background: var(--accent);
}
.stage-track__label { font-size: .76rem; color: var(--ink-3); }
.stage-track__step--now .stage-track__label { color: var(--ink); font-weight: 700; }
.stage-track__step--done .stage-track__label { color: var(--ink-2); }

/* The card version: dots only -- the current stage is already the pill. */
.stage-track--mini { margin: 4px 0 2px; }
.stage-track--mini .stage-track__label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.stage-track--mini .stage-track__dot { width: 12px; height: 12px; }
.stage-track--mini .stage-track__step + .stage-track__step::before { top: 5px; }
.stage-track--mini .stage-track__step--now .stage-track__dot { box-shadow: 0 0 0 3px var(--accent-soft); }
.stage-track--mini .stage-track__step--now .stage-track__dot::after { inset: 2px; }

@media (max-width: 560px) {
  .stage-track__label { font-size: .64rem; }
}

/* ------------------------------------------------------------ stage log -- */
.fund-stage__none { margin: 0 0 12px; color: var(--ink-2); max-width: 72ch; }
.stage-log {
  list-style: none;
  margin: 0;
  padding: 0 0 0 16px;
  border-left: 2px solid var(--line);
  display: grid;
  gap: 16px;
}
.stage-log:empty { display: none; }
.stage-log__entry { position: relative; }
.stage-log__entry::before {
  content: "";
  position: absolute;
  left: -24px;
  top: 5px;
  width: 12px;
  height: 12px;
  border-radius: var(--radius-pill);
  background: var(--surface);
  border: 2px solid var(--accent);
}
.stage-log__head { margin: 0 0 4px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.stage-log__when { font-size: .8rem; font-weight: 600; color: var(--ink-2); }
.stage-log__note { font-size: .92rem; color: var(--ink-2); max-width: 76ch; }
.stage-log__note > :first-child { margin-top: 0; }
.stage-log__note > :last-child { margin-bottom: 0; }

/* ------------------------------------------------------ index: totals -- */
.fund-totals {
  margin: 18px 0 6px;
  padding: 14px 18px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 28px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.fund-totals__list {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, auto));
  gap: 6px 32px;
}
@media (max-width: 640px) {
  .fund-totals__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; }
}
.fund-totals__list > div { display: grid; gap: 1px; }
.fund-totals__list dt {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--ink-3);
}
.fund-totals__list dd { margin: 0; font-size: 1.18rem; font-weight: 700; }
.fund-totals__link { margin-left: auto; font-weight: 600; text-decoration: none; color: var(--accent); }
.fund-totals__link:hover { text-decoration: underline; }

/* ------------------------------------------------ index: stage filter -- */
.fund-stages { margin: 14px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.fund-chip {
  padding: 5px 12px;
  border-radius: var(--radius-pill);
  border: 1px solid var(--line-2);
  background: var(--surface);
  color: var(--ink-2);
  font: inherit;
  font-size: .84rem;
  cursor: pointer;
}
.fund-chip:hover { border-color: var(--accent-line); color: var(--ink); }
.fund-chip[aria-pressed="true"] {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--accent-ink);
  font-weight: 600;
}
.fund-chip:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

/* -------------------------------------------------- how we honour them -- */
.fund-honour-how { margin: 44px 0 0; }
.fund-honour-how__list {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.fund-honour-how__list > li {
  padding: 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-top: 3px solid var(--accent);
  border-radius: var(--radius-lg);
}
.fund-honour-how__list h3 { margin: 0 0 4px; font-size: .98rem; }
.fund-honour-how__list p { margin: 0; font-size: .88rem; color: var(--ink-2); }

/* ------------------------------------------------ detail: fund panel -- */
.fund-raise__label {
  margin: 0 0 2px;
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--ink-3);
}
.fund-raise__split {
  margin: 12px 0 0;
  padding: 10px 0 0;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 6px;
}
.fund-raise__split > div { display: flex; justify-content: space-between; gap: 10px; }
.fund-raise__split dt { font-size: .84rem; color: var(--ink-2); }
.fund-raise__split dd { margin: 0; font-weight: 700; font-size: .92rem; }

/* ------------------------------------------------ detail: funded by --- */
.fund-h3 { margin: 0 0 10px; font-size: 1.02rem; }
.fund-funders__lede { margin: 0 0 16px; color: var(--ink-2); max-width: 72ch; }
.fund-funders__cols {
  display: grid;
  gap: 22px;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  margin-bottom: 32px;
}
@media (max-width: 820px) {
  .fund-funders__cols { grid-template-columns: minmax(0, 1fr); }
}
.fund-funders__col {
  padding: 16px 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.fund-funders__col .fund-empty { margin: 4px 0 0; font-size: .9rem; }

.honour-roll { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.honour-roll:empty { display: none; }
.honour-roll__entry {
  display: grid;
  grid-template-columns: 3.4em minmax(0, 1fr) auto;
  gap: 10px;
  align-items: baseline;
  padding: 7px 4px;
  border-bottom: 1px dashed var(--line);
}
.honour-roll__entry:last-child { border-bottom: 0; }
.honour-roll__no { font-family: var(--font-mono); font-weight: 700; color: var(--accent); }
.honour-roll__name { font-weight: 600; overflow-wrap: anywhere; }
.honour-roll__tier { font-size: .8rem; color: var(--ink-3); text-align: right; }
.honour-roll__more { margin: 10px 0 0; font-size: .86rem; color: var(--ink-2); }

.contrib-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.contrib-list:empty { display: none; }
.contrib { padding: 0 0 12px; border-bottom: 1px dashed var(--line); }
.contrib:last-child { border-bottom: 0; padding-bottom: 0; }
.contrib__head { margin: 0; display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; }
.contrib__kind {
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 1px 7px;
  border-radius: 2px;
  border: 1px solid var(--line-2);
  color: var(--ink-2);
}
.contrib__kind--founder { border-color: var(--accent); color: var(--accent); }
.contrib__kind--sponsor { border-color: var(--good); color: var(--good); }
.contrib__kind--grant   { border-color: var(--warn); color: var(--warn); }
.contrib__name { font-weight: 600; overflow-wrap: anywhere; }
.contrib__private { font-style: italic; font-weight: 400; color: var(--ink-3); }
.contrib__meta { margin: 3px 0 0; font-size: .84rem; color: var(--ink-3); }
.contrib__note { margin: 3px 0 0; font-size: .86rem; color: var(--ink-2); }

/* ------------------------------------------------ the honour board page -- */
.honour-board { list-style: none; margin: 22px 0 32px; padding: 0; display: grid; gap: 22px; }
.honour-project {
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}
.honour-project__head { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 12px; }
.honour-project__title { margin: 0; font-size: 1.15rem; }
.honour-project__title a { color: inherit; text-decoration: none; }
.honour-project__title a:hover { text-decoration: underline; }
.honour-project__cols {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
}
@media (max-width: 820px) {
  .honour-project__cols { grid-template-columns: minmax(0, 1fr); }
}

/* ------------------------------------------------- detail: section bar -- */
.fund-sections {
  position: sticky;
  top: 0;
  z-index: 5;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
}
.fund-sections__in {
  display: flex;
  gap: 4px;
  /* Scrolls inside itself on a phone; the page never scrolls sideways. */
  overflow-x: auto;
  scrollbar-width: thin;
}
.fund-sections__link {
  flex: none;
  padding: 11px 12px;
  font-size: .88rem;
  font-weight: 600;
  color: var(--ink-2);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
}
.fund-sections__link:hover { color: var(--ink); border-bottom-color: var(--accent); }
.fund-sections__link:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
