/* --- brand: navy header to match the TableCurve 3D splash screen --- */
/* the logo PNG has a #0a1040 navy background -> the header must be the SAME navy
   or the logo shows as a box. force it directly (Material's palette CSS beats a
   bare :root var override). */
.md-header, .md-tabs { background-color: #0a1040; }
:root, [data-md-color-scheme="slate"] {
  --md-primary-fg-color:        #0a1040;
  --md-primary-fg-color--light: #2a386a;
  --md-primary-fg-color--dark:  #060a2c;
}
.md-header__button.md-logo img { height: 1.7rem; width: auto; }   /* a touch larger than default */
/* logo already reads "TableCurve 3D" -> drop the redundant site-name text,
   keep the page-title that appears in the bar on scroll */
.md-header__title .md-header__topic:not([data-md-component]) { display: none; }

/* --- heading hierarchy: make the levels visually distinct --- */
.md-typeset h1 {
  font-weight: 800;
  color: var(--md-default-fg-color);
}
.md-typeset h2 {                       /* major section */
  font-weight: 700;
  font-size: 1.45rem;
  color: var(--md-default-fg-color);
  margin: 1.8em 0 .6em;
  padding-bottom: .25em;
  border-bottom: 2px solid var(--md-primary-fg-color);
}
.md-typeset h1 + h2 { margin-top: .8em; }   /* no big gap right under the page title */
.md-typeset h3 {                       /* sub-section: lighter + coloured, no rule */
  font-weight: 600;
  font-size: 1.1rem;
  color: var(--md-primary-fg-color);
  margin: 1.5em 0 .4em;
  border: 0;
}
.md-typeset h4 {                       /* minor label: small caps, muted */
  font-weight: 700;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--md-default-fg-color--light);
  margin: 1.4em 0 .3em;
}
.md-typeset :is(h1,h2,h3,h4) + p { margin-top: .3em; }

/* the permalink pilcrow (the "paragraph mark" next to headings) confuses readers.
   hide the glyph; the heading keeps its id so deep links still work. */
.md-typeset .headerlink { display: none; }

/* screenshots: framed, not full-bleed */
.md-typeset img {
  max-width: 100%; height: auto;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 3px;
}
.md-typeset p > img:only-child { display: block; margin: 1.2em 0; }  /* stand-alone figure */

/* --- toolbar / menu icons: unframed inline glyphs, sharp on hi-DPI --- */
.md-typeset img.tc-icon {
  display: inline-block; max-width: none;
  height: 1.15em; width: auto; vertical-align: -0.22em; margin: 0 .14em 0 0;
  border: 0; border-radius: 0; background: none; box-shadow: none;
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}
.md-typeset a:has(> img.tc-icon) { background: none; border: 0; }
.md-typeset h1 + p > a > img.tc-icon,
.md-typeset h1 + p > img.tc-icon { height: 1.3em; margin-right: .28em; }
[data-md-color-scheme="slate"] .md-typeset img.tc-icon {
  background: #d9d9d9; border-radius: 2px; padding: 1px; box-sizing: content-box;
}

/* --- right-hand "On this page" TOC: readable two-level hierarchy --- */
.md-sidebar--secondary .md-nav__title {
  font-size: .8rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
}
.md-nav--secondary .md-nav__link {
  font-size: .76rem; line-height: 1.45;
  margin-top: .5em; margin-bottom: .5em;
}
/* top-level entries: dark, medium weight */
.md-sidebar--secondary > .md-nav > .md-nav__list > .md-nav__item > .md-nav__link {
  font-weight: 600;
  color: var(--md-default-fg-color);
}
/* nested entries: sit under a guide line, lighter and clearly indented */
.md-nav--secondary .md-nav__item .md-nav__item {
  border-left: 1px solid var(--md-default-fg-color--lightest);
  margin-left: .4rem;
  padding-left: .6rem;
}
.md-nav--secondary .md-nav__item .md-nav__item > .md-nav__link {
  font-weight: 400;
  color: var(--md-default-fg-color--light);
}
.md-nav--secondary .md-nav__link--active,
.md-nav--secondary .md-nav__link--active > .md-nav__link {
  color: var(--md-primary-fg-color) !important;
  font-weight: 700;
}

/* --- left-hand nav: give nested topics a visible indent + guide line --- */
.md-nav--primary .md-nav__item .md-nav__item {
  border-left: 1px solid var(--md-default-fg-color--lightest);
}
.md-nav--primary .md-nav__link { line-height: 1.4; }