/* Manual: a printed hardware manual. Paper, numbered sections, monospace labels, thin rules, one orange. */
/* paper by day, a printed-on-black manual by night; the site follows the system setting (toggle in the header) */
[data-md-color-scheme="default"] {
  --mn-paper: #f3f1ec;
  --mn-ink: #141414;
  --mn-text: #262626;
  --mn-grey: #6b6b6b;
  --mn-rule: #d6d2c9;
  --mn-field: #e6e2d9;
  --mn-code: #e8e5de;
  --mn-orange: #ff5a1f;
  --mn-logo: grayscale(1) brightness(0);
}
[data-md-color-scheme="slate"] {
  --mn-paper: #121212;
  --mn-ink: #ece9e2;
  --mn-text: #cfcbc3;
  --mn-grey: #8f8b84;
  --mn-rule: #2c2b29;
  --mn-field: #1d1c1b;
  --mn-code: #1a1a19;
  --mn-orange: #ff6a33;
  --mn-logo: grayscale(1) brightness(2.2);
}
[data-md-color-scheme] {
  --md-default-bg-color: var(--mn-paper);
  --md-default-fg-color: var(--mn-ink);
  --md-default-fg-color--light: var(--mn-grey);
  --md-default-fg-color--lighter: var(--mn-rule);
  --md-typeset-color: var(--mn-text);
  --md-primary-fg-color: var(--mn-paper);
  --md-primary-bg-color: var(--mn-ink);
  --md-accent-fg-color: var(--mn-orange);
  --md-typeset-a-color: var(--mn-ink);
  --md-code-bg-color: var(--mn-code);
  --md-code-fg-color: var(--mn-ink);
  --md-footer-bg-color: #0b0b0b;
  --md-footer-fg-color: #ece9e2;
}
body { background: var(--mn-paper); }
.md-header { background: var(--mn-paper); color: var(--mn-ink); box-shadow: none; border-bottom: 2px solid var(--mn-ink); }
.md-header__title { font-family: var(--md-code-font-family); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.md-header__button.md-logo img { filter: var(--mn-logo); }
.md-tabs { background: var(--mn-paper); color: var(--mn-ink); }

.md-typeset { counter-reset: sec; font-size: .8rem; line-height: 1.65; }
.md-typeset h1 { font-weight: 800; font-size: 2.6rem; letter-spacing: -.03em; line-height: 1.05; color: var(--mn-ink); margin-bottom: 1.4rem; }
.md-typeset h2 { counter-increment: sec; font-weight: 700; font-size: 1.15rem; letter-spacing: -.01em; color: var(--mn-ink);
  border-top: 2px solid var(--mn-ink); padding-top: .9rem; margin-top: 2.6rem; }
.md-typeset h2::before { content: counter(sec, decimal-leading-zero); font-family: var(--md-code-font-family); font-weight: 400;
  color: var(--mn-orange); margin-right: 1rem; font-size: .8rem; vertical-align: middle; }
.md-typeset a { color: var(--mn-ink); text-decoration: underline; text-decoration-color: var(--mn-orange); text-underline-offset: 3px; }
.md-typeset a:hover { color: var(--mn-orange); }
.md-typeset strong { font-weight: 700; }

.md-typeset table:not([class]) { border: none; border-top: 2px solid var(--mn-ink); border-radius: 0; background: transparent; box-shadow: none; font-size: .72rem; }
.md-typeset table:not([class]) th { background: transparent; font-family: var(--md-code-font-family); font-weight: 400; text-transform: uppercase;
  letter-spacing: .06em; font-size: .62rem; color: var(--mn-grey); border-bottom: 1px solid var(--mn-rule); }
.md-typeset table:not([class]) td { border-top: 1px solid var(--mn-rule); }
.md-typeset table:not([class]) td:first-child strong, .md-typeset table:not([class]) td:first-child code {
  font-family: var(--md-code-font-family); font-weight: 500; }

.md-typeset pre > code { border-radius: 0; border-left: 3px solid var(--mn-ink); }
.md-typeset img, .md-typeset video { display: block; margin: 1.6rem 0; max-width: 100%; border-radius: 2px; }
.md-typeset video.hero { width: 100%; margin-top: 0; }

.md-typeset .md-button { border-radius: 0; border: 2px solid var(--mn-ink); color: var(--mn-ink); font-family: var(--md-code-font-family);
  text-transform: uppercase; letter-spacing: .08em; font-size: .7rem; text-decoration: none; padding: .55em 1.4em; }
.md-typeset .md-button--primary { background: var(--mn-orange); border-color: var(--mn-orange); color: #fff; }
.md-typeset .md-button:hover { background: var(--mn-ink); border-color: var(--mn-ink); color: var(--mn-paper); }

.md-typeset .features ul { list-style: none; padding: 0; margin: 2rem 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  gap: 0; border-top: 2px solid var(--mn-ink); counter-reset: feat; }
.md-typeset .features li { counter-increment: feat; margin: 0; padding: .9rem 1.1rem .9rem 0; border-bottom: 1px solid var(--mn-rule); font-size: .74rem; }
.md-typeset .features li::before { content: counter(feat, upper-alpha); display: block; font-family: var(--md-code-font-family); color: var(--mn-orange); font-size: .7rem; margin-bottom: .3rem; }

.md-typeset .admonition, .md-typeset details { border: 1px solid var(--mn-ink); border-radius: 0; box-shadow: none; background: transparent; }
.md-typeset .admonition-title, .md-typeset summary { background: var(--mn-ink) !important; color: var(--mn-paper); font-family: var(--md-code-font-family);
  text-transform: uppercase; letter-spacing: .08em; font-size: .62rem; }
.md-typeset .admonition-title::before, .md-typeset summary::before { background-color: var(--mn-orange) !important; }

.md-nav { font-size: .68rem; }
.md-nav__title, .md-nav__item--section > .md-nav__link { font-family: var(--md-code-font-family); text-transform: uppercase; letter-spacing: .08em; color: var(--mn-grey); }
.md-nav__link--active { color: var(--mn-orange) !important; }
.md-footer { background: #0b0b0b; }
.md-header__option .md-icon, .md-header__button { color: var(--mn-ink); }
.md-search__input { background: var(--mn-field); color: var(--mn-ink); border-radius: 0; }
.md-search__input::placeholder, .md-search__icon { color: var(--mn-grey); }

/* embedded video (the trailer on YouTube): full width, 16:9 */
.md-typeset .embed { position: relative; aspect-ratio: 16 / 9; margin: 1.2rem 0; background: #000; }
.md-typeset .embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
