/* Assumption: serif headings only, keeping Material's body font and a plain
   light cream background; underline content links, keeping navigation uncluttered.
   Use system fonts so no additional font downloads are needed. */
:root {
  --md-default-bg-color: #fdfbf6;
  --md-primary-fg-color: #10264d;
  --md-primary-fg-color--light: #263e65;
  --md-primary-fg-color--dark: #091830;
  --md-accent-fg-color: #981e32;
  --md-typeset-a-color: #10264d;
}

.md-header {
  border-bottom: 4px solid var(--md-accent-fg-color);
}

.md-typeset :is(h1, h2, h3, h4, h5, h6) {
  font-family: Georgia, "Times New Roman", serif;
  color: var(--md-primary-fg-color);
}

.md-typeset :is(h1, h2) {
  text-decoration-line: underline;
  text-decoration-color: var(--md-accent-fg-color);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.2em;
}

.md-typeset a:not(.headerlink):not(.md-button) {
  color: var(--md-typeset-a-color);
  text-decoration-line: underline;
  text-decoration-color: var(--md-accent-fg-color);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.15em;
}

/* Header link to the live explorer (added by javascripts/explorer-link.js):
   a square box centred in the header bar. */
.md-header__inner {
  position: relative;
}

.md-header .tapestry-explorer-link {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  transform: translate(-50%, -50%);
  padding: 0.25rem 0.7rem;
  border: 2px solid var(--md-accent-fg-color);
  border-radius: 0;
  color: var(--md-primary-bg-color);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  white-space: nowrap;
}

.md-header .tapestry-explorer-link:hover,
.md-header .tapestry-explorer-link:focus-visible {
  background-color: var(--md-accent-fg-color);
  color: var(--md-primary-bg-color);
  text-decoration: none;
}

/* Narrow screens: keep it in the flow so it never covers the title or search. */
@media screen and (max-width: 59.984em) {
  .md-header .tapestry-explorer-link {
    position: static;
    margin: 0 0.4rem;
    transform: none;
  }
}
