/* ------------------------------------------------------------------ */
/* Tokens: one sequential ramp (the "legend") does the visual work.    */
/* ------------------------------------------------------------------ */
:root {
  --sdc-ink: #14233a;
  --sdc-paper: #f6f8fa;
  --sdc-text: #1b2430;
  --sdc-text-on-ink: #e6ecf2;
  --sdc-ramp-1: #cff0e5;
  --sdc-ramp-2: #7fd1b9;
  --sdc-ramp-3: #2fa48e;
  --sdc-ramp-4: #1f6f8b;
  --sdc-ramp-5: #1d4f7a;
  --sdc-ramp-6: #14233a;
  --sdc-signal: #e8a33d;

  /* Material theme hooks (palette: primary/accent = custom). */
  --md-primary-fg-color: var(--sdc-ink);
  --md-primary-fg-color--light: var(--sdc-ramp-2);
  --md-primary-fg-color--dark: #0e1829;
  --md-primary-bg-color: var(--sdc-text-on-ink);
  --md-primary-bg-color--light: rgba(230, 236, 242, 0.7);
  --md-accent-fg-color: var(--sdc-ramp-3);
  --md-accent-fg-color--transparent: rgba(47, 164, 142, 0.12);
  --md-accent-bg-color: #fff;
  --md-accent-bg-color--light: rgba(255, 255, 255, 0.7);

  --sdc-link: var(--sdc-ramp-4);
  --sdc-heading: var(--sdc-ink);
  --sdc-rule: rgba(20, 35, 58, 0.14);
  --sdc-muted: #5b6878;
}

[data-md-color-scheme="default"] {
  --md-default-bg-color: var(--sdc-paper);
  --md-default-fg-color: var(--sdc-text);
  --md-typeset-a-color: var(--sdc-link);
  --md-code-bg-color: #eceff3;
  --md-footer-bg-color: var(--sdc-ink);
  --md-footer-bg-color--dark: #0e1829;
}

[data-md-color-scheme="slate"] {
  --md-default-bg-color: #0f1a2b;
  --md-default-fg-color: var(--sdc-text-on-ink);
  --md-default-fg-color--light: #b4c0cf;
  --md-default-fg-color--lighter: #7f8ea1;
  --md-default-fg-color--lightest: rgba(230, 236, 242, 0.12);
  --md-typeset-a-color: var(--sdc-ramp-2);
  --md-code-bg-color: #16233a;
  --md-footer-bg-color: #0a1220;
  --md-footer-bg-color--dark: #060b14;
  --sdc-link: var(--sdc-ramp-2);
  --sdc-heading: #f2f6fa;
  --sdc-rule: rgba(230, 236, 242, 0.14);
  --sdc-muted: #9aa8b8;
  --md-primary-fg-color: #0a1220;
}

/* ------------------------------------------------------------------ */
/* Type                                                                 */
/* ------------------------------------------------------------------ */
.md-typeset {
  font-size: 0.78rem;
  line-height: 1.65;
}
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4 {
  color: var(--sdc-heading);
  font-weight: 600;
  letter-spacing: -0.01em;
}
.md-typeset h1 { font-size: 2rem; line-height: 1.15; margin-bottom: 1.2rem; }
.md-typeset h2 { font-size: 1.35rem; line-height: 1.25; margin-top: 2.2em; }
.md-typeset h3 { font-size: 1.05rem; }
.md-typeset h2::after {
  /* A short ramp tick under each section heading: the legend motif, not a decorative rule. */
  content: "";
  display: block;
  width: 2.2rem;
  height: 0.18rem;
  margin-top: 0.45rem;
  background: linear-gradient(90deg, var(--sdc-ramp-2), var(--sdc-ramp-4));
  border-radius: 1px;
}
.md-typeset a { text-underline-offset: 0.15em; }
.md-typeset code { font-size: 0.82em; }
.md-typeset table:not([class]) { font-size: 0.72rem; }
.md-typeset table:not([class]) th { background: var(--md-code-bg-color); color: var(--sdc-heading); }

/* ------------------------------------------------------------------ */
/* Header and tabs                                                      */
/* ------------------------------------------------------------------ */
.md-header { box-shadow: none; }
.md-header__title { font-weight: 600; letter-spacing: -0.01em; }
.md-tabs {
  background: var(--md-primary-fg-color);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.md-tabs__link {
  font-size: 0.72rem;
  font-weight: 500;
  opacity: 0.75;
  margin-top: 0.6rem;
  padding-bottom: 0.45rem;
  border-bottom: 3px solid transparent;
  transition: none;
}
.md-tabs__link:is(:hover, :focus-visible) { opacity: 1; }
.md-tabs__link--active {
  opacity: 1;
  border-bottom-color: var(--sdc-ramp-2);
}
.md-search__form { background: rgba(255, 255, 255, 0.1); border-radius: 0.2rem; }
.md-search__input::placeholder { color: rgba(230, 236, 242, 0.6); }

/* ------------------------------------------------------------------ */
/* Sidebars                                                             */
/* ------------------------------------------------------------------ */
/* Hide the left menu when the active top-level item has nothing under it
   (Home, Dashboards, Data inventory): the tabs already cover that navigation. */
@media screen and (min-width: 76.25em) {
  .md-sidebar--primary:has(.md-nav--primary > .md-nav__list > .md-nav__item--active:not(.md-nav__item--nested)) {
    display: none;
  }
}

.md-nav--primary .md-nav__item--section > .md-nav__link,
.md-nav--primary .md-nav__item--section > label.md-nav__link,
.md-nav--primary .md-nav__item--section > .md-nav__container > .md-nav__link,
[data-md-color-scheme="default"] .md-nav--primary .md-nav__item--section > .md-nav__link,
[data-md-color-scheme="default"] .md-nav--primary .md-nav__item--section > label.md-nav__link,
[data-md-color-scheme="default"] .md-nav--primary .md-nav__item--section > .md-nav__container > .md-nav__link {
  color: var(--sdc-ramp-4);
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: 1.25em;
  padding-bottom: 0.25em;
  border-bottom: 1px solid var(--sdc-rule);
}
.md-nav--primary > .md-nav__list > .md-nav__item--section:first-child > .md-nav__link { margin-top: 0; }
.md-nav--primary .md-nav__item--section .md-nav__item--nested:not(.md-nav__item--section) > .md-nav__container > .md-nav__link,
.md-nav--primary .md-nav__item--section .md-nav__item--nested:not(.md-nav__item--section) > label.md-nav__link {
  font-weight: 600;
  color: var(--md-default-fg-color--light);
}
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__item--section > .md-nav__link,
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__item--section > label.md-nav__link,
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__item--section > .md-nav__container > .md-nav__link {
  color: var(--sdc-ramp-2);
}
.md-nav__link--active, .md-nav__link:is(:hover, :focus-visible) { color: var(--sdc-link); }
.md-nav__item .md-nav__link--active { font-weight: 600; }

/* ------------------------------------------------------------------ */
/* Home: hero, counts strip, section blocks                              */
/* ------------------------------------------------------------------ */
.sdc-hero {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 2.5rem;
  align-items: center;
  margin: 0.5rem 0 1.5rem;
}
.sdc-hero h1 {
  font-size: 2.4rem;
  line-height: 1.1;
  margin: 0 0 1rem;
  max-width: 22ch;
}
.sdc-hero p { font-size: 0.95rem; color: var(--sdc-muted); max-width: 48ch; margin: 0 0 1.4rem; }
.sdc-hero__actions { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.sdc-hero__actions .md-button { margin: 0; border-width: 2px; }
.sdc-hero__actions .md-button--primary { background: var(--sdc-ramp-4); border-color: var(--sdc-ramp-4); color: #fff; }
.sdc-hero__actions .md-button--primary:is(:hover, :focus-visible) { background: var(--sdc-ramp-5); border-color: var(--sdc-ramp-5); }
.sdc-hero__actions .md-button:not(.md-button--primary) { border-color: var(--sdc-ramp-4); color: var(--sdc-link); }
.sdc-hero__actions .md-button:not(.md-button--primary):is(:hover, :focus-visible) { background: var(--md-accent-fg-color--transparent); }
.sdc-hero__map { margin: 0; }
.sdc-hero__map img { display: block; width: 100%; height: auto; }
.sdc-hero__map figcaption { font-size: 0.62rem; color: var(--sdc-muted); margin-top: 0.4rem; }

.sdc-legend {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  margin: 0 0 0.6rem;
}
.sdc-legend span { height: 0.55rem; flex: 1; }
.sdc-legend span:first-child { border-radius: 2px 0 0 2px; }
.sdc-legend span:last-child { border-radius: 0 2px 2px 0; }

.sdc-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 2rem;
  padding: 0.9rem 0;
  border-top: 1px solid var(--sdc-rule);
  border-bottom: 1px solid var(--sdc-rule);
  margin: 0 0 2rem;
  font-size: 0.78rem;
  color: var(--sdc-muted);
}
.sdc-counts b { color: var(--sdc-heading); font-weight: 600; font-variant-numeric: tabular-nums; }

.sdc-blocks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2.5rem;
  margin: 0 0 1rem;
}
.sdc-block {
  padding: 1.1rem 0 1.2rem;
  border-top: 1px solid var(--sdc-rule);
}
.sdc-block h2 {
  font-size: 1rem;
  margin: 0 0 0.4rem;
  display: flex;
  align-items: center;
  gap: 0.55rem;
}
.sdc-block h2::after { display: none; }
.sdc-block h2::before {
  content: "";
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 2px;
  background: var(--swatch, var(--sdc-ramp-3));
  flex: none;
}
.sdc-block p { margin: 0 0 0.6rem; color: var(--md-default-fg-color--light); }
.sdc-block a.sdc-block__link { font-weight: 600; }

@media screen and (max-width: 59.9375em) {
  .sdc-hero { grid-template-columns: 1fr; gap: 1.5rem; }
  .sdc-hero h1 { font-size: 1.9rem; }
  .sdc-hero__map { max-width: 22rem; }
  .sdc-blocks { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------------ */
/* Dashboard screenshots                                                */
/* ------------------------------------------------------------------ */
.md-typeset img[src*="dashboard.png"] {
  border: 1px solid var(--sdc-rule);
  border-radius: 0.25rem;
}

/* ------------------------------------------------------------------ */
/* Data inventory table                                                 */
/* ------------------------------------------------------------------ */
.inventory-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1rem;
  align-items: center;
  margin: 1rem 0 0.6rem;
}
.inventory-controls input[type="search"],
.inventory-controls select {
  font: inherit;
  font-size: 0.75rem;
  padding: 0.35rem 0.55rem;
  border: 1px solid var(--md-default-fg-color--lighter);
  border-radius: 0.2rem;
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
}
.inventory-controls input[type="search"] { min-width: 16rem; flex: 1 1 16rem; }
.inventory-controls :is(input, select):focus-visible { outline: 2px solid var(--sdc-signal); outline-offset: 1px; }
.inventory-sites { display: flex; gap: 0.75rem; font-size: 0.75rem; white-space: nowrap; }
.inventory-sites label { cursor: pointer; }
.inventory-sites input { accent-color: var(--sdc-ramp-4); }
.inventory-count { font-size: 0.7rem; color: var(--sdc-muted); white-space: nowrap; }
.inventory-scroll { overflow: auto; max-height: 75vh; border: 1px solid var(--sdc-rule); border-radius: 0.2rem; }
.inventory-table { border-collapse: collapse; font-size: 0.68rem; width: 100%; margin: 0; }
.inventory-table th, .inventory-table td { padding: 0.3rem 0.5rem; border-bottom: 1px solid var(--sdc-rule); vertical-align: top; }
.inventory-table thead th { position: sticky; background: var(--md-default-bg-color); z-index: 1; text-align: left; font-weight: 600; color: var(--sdc-heading); }
.inventory-table thead tr:first-child th { top: 0; }
.inventory-table thead tr:last-child th { top: 2.1rem; font-weight: 500; color: var(--md-default-fg-color--light); }
.inventory-table th.inv-site { text-align: center; color: var(--sdc-link); text-transform: uppercase; letter-spacing: 0.05em; font-size: 0.62rem; border-left: 2px solid var(--sdc-rule); }
.inventory-table th.inv-level { text-align: center; font-size: 0.6rem; height: 5.5rem; width: 1.6rem; padding: 0.3rem 0.1rem; vertical-align: bottom; }
.inventory-table th.inv-level > span { writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; display: inline-block; }
.inventory-table td.inv-cat { max-width: 7rem; color: var(--md-default-fg-color--light); line-height: 1.2; }
.inventory-table td.inv-measure { min-width: 14rem; }
.inventory-table td.inv-years { white-space: nowrap; font-variant-numeric: tabular-nums; }
.inventory-table td.inv-check { text-align: center; padding: 0.3rem 0.1rem; width: 1.6rem; color: var(--sdc-ramp-4); font-weight: 700; }
.inventory-table tr.inv-child td.inv-measure { padding-left: 1.6rem; }
.inventory-table tr.inv-child td { color: var(--md-default-fg-color--light); background: var(--md-code-bg-color); }
.inventory-table td.inv-empty { text-align: center; padding: 1.5rem; color: var(--sdc-muted); }
.inv-toggle { font: inherit; font-size: 0.62rem; color: var(--sdc-link); background: none; border: 1px solid var(--sdc-ramp-4); border-radius: 0.2rem; padding: 0 0.35rem; margin-right: 0.3rem; cursor: pointer; }
.inv-toggle:focus-visible { outline: 2px solid var(--sdc-signal); outline-offset: 1px; }
.inv-geo10 { font-size: 0.55rem; vertical-align: super; color: var(--sdc-signal); font-weight: 700; }
.inventory-foot { font-size: 0.7rem; color: var(--sdc-muted); margin-top: 0.6rem; }
[data-md-color-scheme="slate"] .inventory-table td.inv-check { color: var(--sdc-ramp-2); }
[data-md-color-scheme="slate"] .inv-toggle { border-color: var(--sdc-ramp-2); }

/* ------------------------------------------------------------------ */
/* Footer, motion, focus                                                */
/* ------------------------------------------------------------------ */
.md-footer-meta { font-size: 0.62rem; }
:is(a, button, input, select):focus-visible { outline-color: var(--sdc-signal); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ------------------------------------------------------------------ */
/* Data stories index                                                   */
/* ------------------------------------------------------------------ */
.sdc-stories { margin: 1.5rem 0 2rem; border-top: 1px solid var(--sdc-rule); }
.sdc-story {
  padding: 1.4rem 0;
  border-bottom: 1px solid var(--sdc-rule);
}
.sdc-story::after { content: ""; display: block; clear: both; }
.sdc-story__thumb {
  float: left;
  width: 7.5rem;
  margin: 0.25rem 1.4rem 0.6rem 0;
}
.sdc-story--flip .sdc-story__thumb { float: right; margin: 0.25rem 0 0.6rem 1.4rem; }
.sdc-story__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border: 1px solid var(--sdc-rule);
  border-radius: 0.25rem;
}
.sdc-story__body h2 { font-size: 1.25rem; line-height: 1.25; margin: 0 0 0.3rem; }
.sdc-story__body h2::after { display: none; }
.sdc-story__body h2 a { color: var(--sdc-heading); }
.sdc-story__body h2 a:is(:hover, :focus-visible) { color: var(--sdc-link); }
.sdc-story__where { font-size: 0.72rem; color: var(--sdc-muted); margin: 0 0 0.8rem; }
[dir] .md-typeset .sdc-story__measures {
  list-style: none;
  margin: 0 0 0.8rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 1.1rem;
  font-size: 0.72rem;
  color: var(--md-default-fg-color--light);
}
[dir] .md-typeset .sdc-story__measures li { margin: 0; padding: 0; display: flex; align-items: center; gap: 0.4rem; }
.sdc-story__measures i {
  display: inline-block;
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 2px;
  background: var(--swatch);
  flex: none;
}
.sdc-story__finding { margin: 0 0 0.6rem; }
.sdc-story__link { font-weight: 600; }
@media screen and (max-width: 44.9375em) {
  .sdc-story__thumb, .sdc-story--flip .sdc-story__thumb { width: 6rem; }
}

/* ------------------------------------------------------------------ */
/* About pages: floated figures, swatch lists, steps, domain grid       */
/* ------------------------------------------------------------------ */
.md-typeset .sdc-float {
  float: left;
  width: 12rem;
  max-width: 45%;
  margin: 0.3rem 1.5rem 0.8rem 0;
  text-align: left;
}
.md-typeset .sdc-float--right { float: right; margin: 0.3rem 0 0.8rem 1.5rem; }
.md-typeset .sdc-float--wide { width: 19.5rem; max-width: 60%; }
.sdc-float svg, .sdc-float img { display: block; width: 100%; height: auto; }
.sdc-float img { border: 1px solid var(--sdc-rule); border-radius: 0.25rem; }
.md-typeset .sdc-float figcaption { font-size: 0.62rem; color: var(--sdc-muted); margin: 0.4rem 0 0; line-height: 1.4; }

/* CLD3 wheel colours follow the scheme so the ink ring stays visible on dark. */
:root { --sdc-wheel-outer: var(--sdc-ink); }
[data-md-color-scheme="slate"] { --sdc-wheel-outer: #2c4164; }
.cld3-outer { fill: var(--sdc-wheel-outer); }
.cld3-inner { fill: var(--md-default-bg-color); stroke: var(--sdc-heading); }
.cld3-inner-text { fill: var(--sdc-heading); }
.sdc-swatch--hollow { background: var(--md-default-bg-color) !important; box-shadow: inset 0 0 0 1.5px var(--sdc-heading); }
.md-typeset > h2 { clear: both; }

[dir] .md-typeset .sdc-swatch-list { list-style: none; margin: 0.6rem 0 1.2rem; padding: 0; }
[dir] .md-typeset .sdc-swatch-list li { margin: 0 0 0.45rem; padding: 0 0 0 1.35rem; position: relative; }
.sdc-swatch-list i {
  position: absolute;
  left: 0;
  top: 0.42em;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 2px;
  background: var(--swatch);
}

.sdc-projects {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem 2.5rem;
  margin: 1.4rem 0 0.5rem;
}
.sdc-project__thumb { display: block; margin: 0 0 0.6rem; }
.sdc-project__thumb img { display: block; width: 100%; height: auto; border: 1px solid var(--sdc-rule); border-radius: 0.25rem; }
.sdc-project h3 { font-size: 0.95rem; line-height: 1.3; margin: 0 0 0.2rem; }
.sdc-project h3 a { color: var(--sdc-heading); }
.sdc-project h3 a:is(:hover, :focus-visible) { color: var(--sdc-link); }
.sdc-project__meta { font-size: 0.7rem; color: var(--sdc-muted); margin: 0 0 0.4rem; }
.sdc-project p { margin: 0; }

.sdc-blocks--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 2rem; }
.sdc-blocks--3 .sdc-block p em { color: var(--sdc-muted); }

[dir] .md-typeset .sdc-steps { list-style: none; margin: 1.2rem 0 1.5rem; padding: 0; counter-reset: sdc-step; }
[dir] .md-typeset .sdc-steps > li {
  margin: 0;
  padding: 0.9rem 0 0.9rem 2.6rem;
  position: relative;
  border-top: 1px solid var(--sdc-rule);
  counter-increment: sdc-step;
}
.sdc-steps > li::before {
  content: counter(sdc-step);
  position: absolute;
  left: 0;
  top: 0.95rem;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 0.25rem;
  background: var(--swatch);
  color: var(--sdc-paper);
  font-weight: 700;
  font-size: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sdc-steps > li:nth-child(-n+2)::before { color: var(--sdc-ink); }
.sdc-steps h3 { font-size: 1rem; margin: 0 0 0.3rem; }
.sdc-steps p { margin: 0; }

.sdc-domains {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem 1.5rem;
  margin: 1rem 0 1.5rem;
  font-size: 0.74rem;
  color: var(--md-default-fg-color--light);
}
.sdc-domains > div { padding-left: 1rem; position: relative; line-height: 1.5; }
.sdc-domains > div::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 2px;
  background: var(--swatch);
}
.sdc-domains b { color: var(--sdc-heading); font-weight: 600; margin-right: 0.3rem; }
.sdc-domains b::after { content: " ·"; color: var(--sdc-muted); font-weight: 400; }

@media screen and (max-width: 59.9375em) {
  .sdc-projects, .sdc-blocks--3, .sdc-domains { grid-template-columns: 1fr; }
  .sdc-float, .sdc-float--right { width: 9rem; }
  .md-typeset .sdc-float--wide, .md-typeset .sdc-float--wide.sdc-float--right { float: none; width: 100%; max-width: 22rem; margin: 0.3rem auto 1.2rem; }
}

/* ------------------------------------------------------------------ */
/* Guides index: story rows plus a compact chapter list and citation   */
/* ------------------------------------------------------------------ */
.sdc-guide__meta { font-size: 0.72rem; color: var(--sdc-muted); margin: 0 0 0.8rem; }
.sdc-guide__meta a { color: inherit; }
[dir] .md-typeset .sdc-chapters {
  list-style: none;
  margin: 0.8rem 0 1rem;
  padding: 0;
  columns: 2;
  column-gap: 2rem;
  font-size: 0.72rem;
  counter-reset: sdc-ch;
}
[dir] .md-typeset .sdc-chapters li {
  margin: 0 0 0.3rem;
  padding: 0 0 0 1.6rem;
  position: relative;
  break-inside: avoid;
  counter-increment: sdc-ch;
}
.sdc-chapters li::before {
  content: counter(sdc-ch);
  position: absolute;
  left: 0;
  top: 0.05em;
  width: 1.15rem;
  text-align: right;
  color: var(--sdc-muted);
  font-variant-numeric: tabular-nums;
}
.sdc-chapters li.sdc-chapters__appendix::before { content: ""; counter-increment: none; }
[dir] .md-typeset .sdc-chapters li.sdc-chapters__appendix { counter-increment: none; }
.sdc-cite {
  font-size: 0.68rem;
  color: var(--sdc-muted);
  border-left: 3px solid var(--sdc-ramp-2);
  padding: 0.3rem 0 0.3rem 0.8rem;
  margin: 0.6rem 0 0.8rem;
  clear: both;
}
@media screen and (max-width: 44.9375em) {
  [dir] .md-typeset .sdc-chapters { columns: 1; }
}
