/* MAJOR brand for Material for MkDocs.

   Layout follows the shape of developers.cloudflare.com: one white header row
   (logo, wordmark, section links, search, theme, GitHub, CTA), a full-height
   left sidebar separated by a hairline, a fixed-width reading column with
   breadcrumbs, and an "On this page" rail with page actions on the right.
   Colours, type, radii, and motion come from touchstone/brand/foundations.md
   and tokens.css. Fonts are served from the touchstone checkout. */

/* ------------------------------------------------------------------ fonts */
@font-face {
  font-family: "Montserrat";
  src: url("../touchstone/brand/fonts/Montserrat-VariableFont.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("../touchstone/brand/fonts/Montserrat-Italic-VariableFont.woff2") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Bandit";
  src: url("../touchstone/brand/fonts/Bandit-Condensed.woff2") format("woff2");
  font-weight: 400;
  font-display: block;   /* preloaded in overrides/main.html; block avoids a fallback flash */
}

/* ----------------------------------------------------------------- tokens */
:root {
  /* brand primitives (tokens.css) */
  --major-ink: #15021B;
  --major-pink: #F73FDB;
  --major-pink-700: #D934C2;
  --major-pink-400: #FB96E7;
  --major-pink-100: #FEEAFB;
  --major-off-white: #FAFAFB;
  --major-neutral-50: #F3F2F3;
  --major-neutral-100: #ECEBEC;
  --major-neutral-200: #DCD9DE;
  --major-neutral-300: #C6C1C8;
  --major-neutral-500: #8F8793;
  --major-neutral-700: #4F4757;
  --major-teal: #50C9CE;
  --major-blue: #304BAE;
  --major-green: #AAD922;

  /* layout */
  --major-header-h: 3.2rem;      /* 64px */
  --major-sidebar-w: 15rem;      /* 300px */
  --major-toc-w: 12.5rem;        /* 250px */
  --major-content-w: 46rem;      /* 920px reading column */
  --major-radius-sm: 6px;
  --major-radius: 8px;
  --major-radius-lg: 12px;
  --major-ease: cubic-bezier(0.2, 0.8, 0.2, 1);

  --md-text-font: "Montserrat", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --md-code-font: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

[data-md-color-scheme="default"] {
  --md-default-bg-color: #FFFFFF;
  --md-default-fg-color: var(--major-ink);
  --md-default-fg-color--light: var(--major-neutral-700);
  --md-default-fg-color--lighter: var(--major-neutral-500);
  --md-default-fg-color--lightest: var(--major-neutral-100);

  /* header chrome is drawn on the page colour, so "primary" is the page */
  --md-primary-fg-color: #FFFFFF;
  --md-primary-fg-color--light: var(--major-neutral-50);
  --md-primary-fg-color--dark: var(--major-neutral-100);
  --md-primary-bg-color: var(--major-ink);
  --md-primary-bg-color--light: var(--major-neutral-500);
  --md-accent-fg-color: var(--major-pink-700);
  --md-accent-fg-color--transparent: rgba(247, 63, 219, 0.1);

  --md-typeset-a-color: #8A0F79;
  --md-typeset-mark-color: var(--major-pink-100);
  --md-typeset-kbd-color: var(--major-neutral-50);
  --md-typeset-kbd-accent-color: #FFFFFF;
  --md-typeset-kbd-border-color: var(--major-neutral-300);
  --md-typeset-table-color: var(--major-neutral-200);
  --md-typeset-table-color--light: var(--major-neutral-50);
  --md-code-bg-color: var(--major-neutral-50);
  --md-code-fg-color: var(--major-ink);
  --md-footer-bg-color: var(--major-off-white);
  --md-footer-bg-color--dark: var(--major-off-white);
  --md-footer-fg-color: var(--major-ink);
  --md-footer-fg-color--light: var(--major-neutral-700);
  --md-footer-fg-color--lighter: var(--major-neutral-500);

  --major-border: var(--major-neutral-200);
  --major-surface: var(--major-neutral-50);
  --major-surface-hover: var(--major-neutral-100);
  --major-link-hover: var(--major-pink-700);
}

[data-md-color-scheme="slate"] {
  --md-hue: 290;
  --md-default-bg-color: #120315;
  --md-default-fg-color: var(--major-neutral-50);
  --md-default-fg-color--light: var(--major-neutral-300);
  --md-default-fg-color--lighter: var(--major-neutral-500);
  --md-default-fg-color--lightest: rgba(255, 255, 255, 0.08);

  --md-primary-fg-color: #120315;
  --md-primary-fg-color--light: #1C0A20;
  --md-primary-fg-color--dark: #0C010F;
  --md-primary-bg-color: var(--major-neutral-50);
  --md-primary-bg-color--light: var(--major-neutral-500);
  --md-accent-fg-color: var(--major-pink);
  --md-accent-fg-color--transparent: rgba(247, 63, 219, 0.15);

  --md-typeset-a-color: var(--major-pink-400);
  --md-typeset-mark-color: rgba(247, 63, 219, 0.3);
  --md-typeset-kbd-color: #1C0A20;
  --md-typeset-kbd-accent-color: #2A1230;
  --md-typeset-kbd-border-color: rgba(255, 255, 255, 0.16);
  --md-typeset-table-color: rgba(255, 255, 255, 0.12);
  --md-typeset-table-color--light: rgba(255, 255, 255, 0.04);
  --md-code-bg-color: #1C0A20;
  --md-code-fg-color: var(--major-neutral-100);
  --md-footer-bg-color: #0C010F;
  --md-footer-bg-color--dark: #0C010F;
  --md-footer-fg-color: var(--major-neutral-50);
  --md-footer-fg-color--light: var(--major-neutral-300);
  --md-footer-fg-color--lighter: var(--major-neutral-500);

  --major-border: rgba(255, 255, 255, 0.12);
  --major-surface: #1C0A20;
  --major-surface-hover: #26112B;
  --major-link-hover: var(--major-pink);
}

/* ------------------------------------------------------------------ shell */
.md-grid { max-width: none; }
.md-main { display: flex; flex-direction: column; }
.md-main__inner { margin-top: 0; position: relative; flex-grow: 1; }

body { -webkit-font-smoothing: antialiased; }

/* ----------------------------------------------------------------- header */
.md-header,
.md-header--shadow {
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
  border-bottom: 1px solid var(--major-border);
  box-shadow: none;
  transition: none;
}
.md-header__inner {
  height: var(--major-header-h);
  padding: 0 1rem 0 0.8rem;
  gap: 0.1rem;
}
.md-tabs { display: none !important; }

/* logo, one per scheme */
.md-header__button.md-logo { margin: 0; padding: 0.3rem 0; display: flex; align-items: center; }
.md-header__button.md-logo img { height: 1.15rem; width: auto; }
.md-header__button.md-logo .major-logo--dark,
.md-nav__button.md-logo .major-logo--dark,
.major-footer__brand .major-logo--dark { display: none; }
[data-md-color-scheme="slate"] .md-logo .major-logo--light,
[data-md-color-scheme="slate"] .major-footer__brand .major-logo--light { display: none; }
[data-md-color-scheme="slate"] .md-logo .major-logo--dark,
[data-md-color-scheme="slate"] .major-footer__brand .major-logo--dark { display: block; }

/* wordmark, separated from the logo by a hairline */
.md-header__title {
  flex-grow: 0;
  height: 1.3rem;
  line-height: 1.3rem;
  margin: 0 0 0 0.7rem;
  padding-left: 0.7rem;
  border-left: 1px solid var(--major-border);
  font-size: 0.9rem;
}
.md-header__title .md-header__topic:first-child {
  position: relative;
  z-index: auto !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
  font-family: "Bandit", var(--md-text-font);
  font-weight: 400;
  font-size: 0.95rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
}
.md-header__topic + .md-header__topic { display: none; }
.md-header__topic { transition: none; }

/* status badge (extra.status in mkdocs.yml) */
.major-status {
  display: inline-flex;
  align-items: center;
  height: 18px;
  margin-left: 0.5rem;
  padding: 0 7px;
  border: 1px solid var(--major-pink);
  border-radius: 9999px;
  color: var(--major-pink-700);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
[data-md-color-scheme="slate"] .major-status { color: var(--major-pink-400); border-color: var(--major-pink-400); }
.md-header__ellipsis { overflow: visible; }

/* section links */
.major-nav {
  display: none;
  align-items: stretch;
  gap: 0.1rem;
  flex-grow: 1;
  height: var(--major-header-h);
  margin: 0 0 0 1rem;
  padding: 0;
  list-style: none;
}
.major-nav__item { display: flex; align-items: center; position: relative; }
.major-nav__item a {
  display: block;
  padding: 0.3rem 0.6rem;
  border-radius: var(--major-radius-sm);
  color: var(--md-default-fg-color--light);
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 160ms var(--major-ease), color 160ms var(--major-ease);
}
.major-nav__item a:hover { background: var(--major-surface); color: var(--md-default-fg-color); }
.major-nav__item--active a { color: var(--md-default-fg-color); font-weight: 600; }
.major-nav__item--active::after {
  content: "";
  position: absolute;
  left: 0.6rem;
  right: 0.6rem;
  bottom: -1px;
  height: 2px;
  background: var(--major-pink);
}
@media screen and (min-width: 76.25em) { .major-nav { display: flex; } }

/* mobile: menu button top right, drawer from the right, no second logo in the drawer */
@media screen and (max-width: 76.234375em) {
  .md-header__inner .md-header__button[for="__search"] { margin-left: auto; }   /* search, theme, menu group on the right */
  .md-header__button[for="__drawer"] { order: 10; margin: 0.1rem 0 0.1rem 0.1rem; }
  .md-header__inner { padding-right: 0.45rem; }  /* icon's edge lines up with the logo's left edge */
  [dir="ltr"] .md-sidebar--primary { left: auto; right: 0; width: 100%; transform: translateX(100%); }
  [data-md-toggle="drawer"]:checked ~ .md-container .md-sidebar--primary { transform: translateX(0); box-shadow: none; }
  .md-nav--primary .md-nav__title[for="__drawer"] ~ .md-nav__list,
  .md-nav--primary .md-nav__list { padding-bottom: 1rem; }
  .md-nav--primary .md-nav__title .md-logo { display: none; }
  .md-nav--primary .md-nav__source { display: none; }   /* repo links live in the page rail */
  .md-nav--primary > .md-nav__title[for="__drawer"] {
    height: auto;
    padding: 0.9rem 0.8rem 0.7rem;
    line-height: 1.3;
    font-family: "Bandit", var(--md-text-font);
    font-weight: 400;
    font-size: 0.95rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--md-default-fg-color);
    background: var(--md-default-bg-color);
    border-bottom: 1px solid var(--major-border);
  }
}

/* header icons */
.md-header__button.md-icon { padding: 0.35rem; margin: 0.1rem; border-radius: var(--major-radius-sm); }
.md-header__button.md-icon:hover { background: var(--major-surface); opacity: 1; }
.md-header__button.md-icon svg { width: 1.05rem; height: 1.05rem; }
.md-header__option { margin-left: 0.2rem; }

/* CTA pill */
.major-cta {
  display: none;
  align-items: center;
  height: 1.6rem;
  margin-left: 0.5rem;
  padding: 0 0.8rem;
  border-radius: 9999px;
  background: var(--major-pink);
  color: #FFFFFF;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 160ms var(--major-ease);
}
.major-cta:hover { background: var(--major-pink-700); color: #FFFFFF; }
/* with five section links, the pill only fits from 1440px up */
@media screen and (min-width: 90em) { .major-cta { display: inline-flex; } }

/* search: bordered pill, dropdown card */
@media screen and (min-width: 60em) {
  /* the field keeps a fixed slot in the header; when focused it expands leftwards over the
     section links instead of pushing them (Material would widen the flex item to 34rem) */
  .md-search { padding: 0; margin-left: auto; width: 9rem; height: 1.7rem; position: relative; }
  .md-search__inner { position: absolute; top: 0; right: 0; float: none; width: 9rem; }
  [data-md-toggle="search"]:checked ~ .md-header .md-search__inner { width: 30rem; }
  .md-search__form {
    height: 1.7rem;
    border: 1px solid var(--major-border);
    border-radius: 9999px;
    background: var(--md-default-bg-color);
    box-shadow: none;
    color: var(--md-default-fg-color);
    transition: border-color 160ms var(--major-ease);
  }
  .md-search__form:hover { border-color: var(--major-neutral-300); }
  .md-search__form::after {
    content: "/";
    position: absolute;
    right: 0.55rem;
    top: 50%;
    transform: translateY(-50%);
    padding: 0.05rem 0.28rem;
    border: 1px solid var(--major-border);
    border-radius: 4px;
    font: 500 0.55rem/1.2 var(--md-text-font);
    color: var(--md-default-fg-color--lighter);
    pointer-events: none;
  }
  /* the suggest layer (search.suggest) sits behind the input and completes the typed
     word, so it must share the input's type and inset exactly. Material sets padding-left
     with [dir=ltr], which outranks a bare class: match that specificity */
  .md-search__input { height: 1.6rem; }
  [dir="ltr"] .md-search__input,
  [dir="ltr"] .md-search__suggest {
    font-size: 0.7rem;
    padding-left: 1.9rem;
  }
  .md-search__input::placeholder { color: var(--md-default-fg-color--lighter); }
  .md-search__icon[for="__search"] { top: 0.3rem; left: 0.45rem; }
  .md-search__icon svg { width: 1rem; height: 1rem; }
  .md-search__options { top: 0.3rem; }
  [data-md-toggle="search"]:checked ~ .md-header .md-search__form {
    border-color: var(--major-pink);
    border-radius: var(--major-radius) var(--major-radius) 0 0;
    background: var(--md-default-bg-color);
    box-shadow: none;
  }
  [data-md-toggle="search"]:checked ~ .md-header .md-search__form::after { display: none; }
  [data-md-toggle="search"]:checked ~ .md-header .md-search__output {
    border: 1px solid var(--major-border);
    border-top: 0;
    border-radius: 0 0 var(--major-radius) var(--major-radius);
    box-shadow: 0 12px 16px -4px rgba(16, 24, 40, 0.08), 0 4px 6px -2px rgba(16, 24, 40, 0.03);
  }
}
@media screen and (min-width: 90em) { .md-search, .md-search__inner { width: 11rem; } }
@media screen and (min-width: 60em) { .md-search__output { top: 1.7rem; } }   /* desktop pill height */
/* mobile overlay: Material's full-height layout, with a hairline under the input */
@media screen and (max-width: 59.9375em) {
  .md-search__form { box-shadow: none; border-bottom: 1px solid var(--major-border); }
  .md-search__output { box-shadow: none; }
}
.md-search-result__meta { font-size: 0.6rem; background: var(--major-surface); }

/* ---------------------------------------------------------------- sidebar */
.md-sidebar { top: var(--major-header-h); padding: 1.2rem 0; }
.md-nav { font-size: 0.7rem; line-height: 20px; }
.md-nav__link {
  margin: 1px 0;
  padding: 6px 0.5rem;
  border-radius: var(--major-radius-sm);
  color: var(--md-default-fg-color--light);
  transition: background-color 125ms var(--major-ease), color 125ms var(--major-ease);
}
.md-nav__link:hover { background: var(--major-surface); color: var(--md-default-fg-color); }
.md-nav__item .md-nav__link--active,
.md-nav__item .md-nav__link--active code {
  background: var(--major-surface-hover);
  color: var(--md-default-fg-color);
  font-weight: 600;
}
.md-nav__link .md-nav__icon { color: var(--md-default-fg-color--lighter); }

@media screen and (min-width: 76.25em) {
  .md-sidebar--primary { width: var(--major-sidebar-w); }
  .md-sidebar--primary .md-sidebar__inner { padding: 0 0.7rem 0 0.8rem; }
  /* the hairline between sidebar and content runs the full page height */
  .md-main__inner:has(> .md-sidebar--primary:not([hidden]))::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--major-sidebar-w);
    border-left: 1px solid var(--major-border);
  }
  .md-nav__link.md-nav__container { padding: 0; margin: 0; background: transparent; }
  .md-nav__link.md-nav__container:hover { background: transparent; }
  /* section label above the tree (a plain link, or a container holding link + toggle) */
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link,
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__container > .md-nav__link {
    margin: 0 0 0 -0.1rem;         /* the nested list below sits .6rem left, its links pad .5rem */
    padding: 0 0.5rem 10px 0;
    font-size: 0.55rem;
    line-height: 16px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--md-default-fg-color--lighter);
    background: transparent;
    box-shadow: none;
    height: auto;
  }
  /* the outer element is the one Material makes sticky: it needs the page colour so the
     tree scrolls underneath rather than through it */
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link {
    margin: 0 0 12px;                  /* room for the fade below, so it never covers the first item at rest */
    padding: 2px 0 6px;
    background: var(--md-default-bg-color);
    box-shadow: 0 0.3rem 0.3rem 0 var(--md-default-bg-color);
  }
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link.md-nav__container { padding: 2px 0 6px; }
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__container > .md-nav__link { padding-bottom: 0; }
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link:not(.md-nav__container) { margin-left: -0.1rem; }
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__container > label.md-nav__link { display: none; }
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__link:hover,
  .md-nav--lifted > .md-nav__list > .md-nav__item--active > .md-nav__container > .md-nav__link:hover { background: transparent; color: var(--md-default-fg-color); }
  /* nested groups hang off a rail. Drawn as a pseudo-element rather than a border:
     Material pads every list .4rem at the bottom and pulls the next row up by the
     same amount, so a border would run into the row below the last child */
  .md-nav--primary .md-nav__item--nested > .md-nav > .md-nav__list {
    position: relative;
    margin-left: 0.6rem;
    padding-left: 0.4rem;
  }
  .md-nav--primary .md-nav__item--nested > .md-nav > .md-nav__list::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0.4rem;
    left: 0;
    width: 1px;
    background: var(--major-border);
  }
  .md-nav--primary .md-nav__item--section > .md-nav > .md-nav__list { margin-left: 0; padding-left: 0; }
  .md-nav--primary .md-nav__item--section > .md-nav > .md-nav__list::before { display: none; }
}

/* on this page rail */
@media screen and (min-width: 60em) {
  .md-sidebar--secondary { width: var(--major-toc-w); }
  .md-sidebar--secondary .md-sidebar__inner { padding: 0 0.8rem 0 0.4rem; }
}
.md-nav--secondary .md-nav__title {
  padding: 0 0 10px 0.7rem;
  font-size: 0.65rem;
  line-height: 20px;
  font-weight: 600;
  color: var(--md-default-fg-color);
  background: transparent;
  box-shadow: none;
}
.md-nav--secondary > .md-nav__list { border-left: 1px solid var(--major-border); }
.md-nav--secondary .md-nav__link {
  margin: 0;
  margin-left: -1px;
  padding: 4px 0.7rem;
  border-left: 2px solid transparent;
  border-radius: 0;
  font-size: 0.65rem;
  line-height: 18px;
  color: var(--md-default-fg-color--light);
}
.md-nav--secondary .md-nav__link:hover { background: transparent; color: var(--md-default-fg-color); }
/* Active state changes colour only: a weight change alters text width and makes the
   rail re-wrap (and jump) every time the active heading changes while scrolling. */
.md-nav--secondary .md-nav__item .md-nav__link--active {
  background: transparent;
  border-left-color: var(--major-pink);
  color: var(--md-default-fg-color);
  font-weight: inherit;
}
.md-nav--secondary .md-nav__link--passed { color: var(--md-default-fg-color--lighter); }
.md-nav--secondary .md-nav .md-nav__list { padding-left: 0.6rem; }

.major-page-actions {
  margin: 1.2rem 0 0 0.7rem;
  padding-top: 1rem;
  border-top: 1px solid var(--major-border);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.major-page-actions a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.65rem;
  color: var(--md-default-fg-color--light);
  text-decoration: none;
  transition: color 160ms var(--major-ease);
}
.major-page-actions a:hover { color: var(--md-default-fg-color); }
.major-page-actions svg { width: 0.8rem; height: 0.8rem; fill: currentcolor; flex: none; }
.md-nav--primary .major-page-actions { display: none; }

/* ---------------------------------------------------------------- content */
.md-content__inner {
  max-width: var(--major-content-w);
  margin: 0 auto;
  padding: 1.6rem 2.4rem 3rem;
}
.md-content__inner::before { display: none; }
@media screen and (max-width: 59.9375em) { .md-content__inner { padding: 1.2rem 1rem 2.4rem; } }
.md-content__inner:has(.major-hero) { max-width: 64rem; }

.md-typeset { font-size: 0.8rem; line-height: 1.65; }
.md-typeset h1, .md-typeset h2, .md-typeset h3, .md-typeset h4 {
  font-family: var(--md-text-font);
  color: var(--md-default-fg-color);
}
.md-typeset h1 {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  margin: 0 0 1.2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--major-border);
}
.md-typeset h2 { font-size: 1.3rem; font-weight: 700; letter-spacing: -0.015em; line-height: 1.25; margin: 2.2em 0 0.7em; }
.md-typeset h3 { font-size: 1rem; font-weight: 600; letter-spacing: -0.01em; margin: 1.8em 0 0.6em; }
.md-typeset h4 { font-size: 0.85rem; font-weight: 600; margin: 1.5em 0 0.5em; }
.md-typeset h5, .md-typeset h6 { font-weight: 600; color: var(--md-default-fg-color--light); }
.md-typeset a { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; transition: color 160ms var(--major-ease); }
.md-typeset a:hover { color: var(--major-link-hover); }
.md-typeset .headerlink { text-decoration: none; }
.md-typeset a code { color: inherit; }

.md-typeset code {
  font-size: 0.78em;
  border: 1px solid var(--major-border);
  border-radius: 4px;
  padding: 0.1em 0.35em;
}
.md-typeset pre > code {
  border-radius: var(--major-radius);
  border: 1px solid var(--major-border);
  padding: 0.9em 1.1em;
  font-size: 0.72em;
  line-height: 1.6;
}
.md-typeset .highlight span.filename { border-radius: var(--major-radius) var(--major-radius) 0 0; }
.md-typeset .highlight span.filename + pre > code { border-radius: 0 0 var(--major-radius) var(--major-radius); }
.md-typeset .md-clipboard { color: var(--md-default-fg-color--lighter); }

.md-typeset blockquote {
  border-left: 3px solid var(--major-pink);
  color: var(--md-default-fg-color--light);
  padding-left: 0.9rem;
}

.md-typeset table:not([class]) {
  font-size: 0.7rem;
  border: 1px solid var(--major-border);
  border-radius: var(--major-radius);
  box-shadow: none;
}
.md-typeset table:not([class]) th {
  background: var(--major-surface);
  font-weight: 600;
  color: var(--md-default-fg-color);
}
.md-typeset table:not([class]) td, .md-typeset table:not([class]) th { border-color: var(--major-border); }

.md-typeset .admonition, .md-typeset details {
  font-size: 0.7rem;
  border-width: 0 0 0 3px;
  border-radius: var(--major-radius);
  box-shadow: none;
  background: var(--major-surface);
}
.md-typeset .admonition-title, .md-typeset summary { font-weight: 600; }

.md-typeset hr { border-color: var(--major-border); }
.md-typeset kbd { font-size: 0.7em; }
.md-typeset .task-list-control .task-list-indicator::before { background: var(--md-default-fg-color--lighter); }
.md-typeset [type="checkbox"]:checked + .task-list-indicator::before { background: var(--major-pink-700); }

/* breadcrumbs */
.md-typeset .major-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin: 0 0 1.4rem;
  padding: 0;
  list-style: none;
  font-size: 0.65rem;
  color: var(--md-default-fg-color--lighter);
}
.md-typeset .major-breadcrumbs ol > li { margin: 0; display: flex; align-items: center; gap: 0.25rem; }
.md-typeset .major-breadcrumbs li + li::before { content: "\203A"; margin: 0 0.15rem 0 0.05rem; color: var(--md-default-fg-color--lighter); }
.md-typeset .major-breadcrumbs a { color: var(--md-default-fg-color--light); text-decoration: none; }
.md-typeset .major-breadcrumbs a:hover { color: var(--md-default-fg-color); }
.md-typeset .major-breadcrumbs [aria-current] { color: var(--md-default-fg-color); }

/* previous / next */
.md-typeset .major-pagination {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.8rem;
  margin-top: 3rem;
  padding-top: 1.6rem;
  border-top: 1px solid var(--major-border);
}
.md-typeset .major-pagination__link {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.7rem 0.9rem;
  border: 1px solid var(--major-border);
  border-radius: var(--major-radius);
  color: var(--md-default-fg-color);
  text-decoration: none;
  transition: border-color 160ms var(--major-ease);
}
.md-typeset .major-pagination__link:hover { border-color: var(--major-pink); color: var(--md-default-fg-color); }
.md-typeset .major-pagination__link--next { text-align: right; }
.major-pagination__direction { font-size: 0.6rem; color: var(--md-default-fg-color--lighter); }
.major-pagination__title { font-size: 0.72rem; font-weight: 600; }
@media screen and (max-width: 44.9375em) { .md-typeset .major-pagination { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------------ footer */
.md-footer { background: transparent; }
.md-footer-meta { border-top: 1px solid var(--major-border); background: var(--md-footer-bg-color); }
.md-footer-meta.md-typeset { font-size: 0.65rem; }
.major-footer {
  display: grid;
  grid-template-columns: minmax(12rem, 1.4fr) repeat(var(--major-footer-cols, 3), minmax(8rem, 1fr));
  gap: 2rem 2.4rem;
  padding: 2.4rem 1.2rem 2rem;
}
.major-footer__brand img { height: 1.1rem; width: auto; display: block; margin-bottom: 0.8rem; }
.md-typeset .major-footer__brand p { margin: 0; max-width: 18rem; font-size: 0.65rem; line-height: 1.55; color: var(--md-footer-fg-color--light); }
.md-typeset .major-footer__col h4 {
  margin: 0 0 0.7rem;
  font-size: 0.55rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--md-footer-fg-color--lighter);
}
.md-typeset .major-footer__col ul { list-style: none; margin: 0; padding: 0; }
.md-typeset .major-footer__col ul > li { margin: 0 0 0.45rem; }
.md-typeset .major-footer__col a {
  color: var(--md-footer-fg-color--light);
  text-decoration: none;
  transition: color 160ms var(--major-ease);
}
.md-typeset .major-footer__col a:hover { color: var(--md-footer-fg-color); }
.major-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem 1.6rem;
  padding: 0.8rem 1.2rem;
  border-top: 1px solid var(--major-border);
  font-size: 0.6rem;
  color: var(--md-footer-fg-color--light);
}
.major-footer__bottom .md-copyright { font-size: inherit; color: inherit; margin: 0; padding: 0; }
.major-footer__bottom .md-copyright__highlight { color: inherit; }
.md-typeset ul.major-footer__legal { display: flex; flex-wrap: wrap; flex-shrink: 0; gap: 1.2rem; list-style: none; margin: 0; padding: 0; }
.md-typeset ul.major-footer__legal > li { margin: 0; white-space: nowrap; }
.md-typeset .major-footer__legal a { color: inherit; text-decoration: none; }
.md-typeset .major-footer__legal a:hover { color: var(--md-footer-fg-color); }
.md-social { padding: 0; }
.md-social__link { color: var(--md-footer-fg-color--light); }
@media screen and (max-width: 59.9375em) {
  .major-footer { grid-template-columns: 1fr 1fr; padding: 1.6rem 1rem; }
  .major-footer__brand { grid-column: 1 / -1; }
}

/* back to top */
.md-top {
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
  border: 1px solid var(--major-border);
  box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1);
}
.md-top:hover { background: var(--major-surface); color: var(--md-default-fg-color); }

/* focus */
:focus-visible { outline: 2px solid var(--major-pink); outline-offset: 2px; }

/* ------------------------------------------------------------ landing page */
.major-hero { padding: 2rem 0 1.4rem; }
.md-typeset .major-hero h1 {
  font-family: "Bandit", var(--md-text-font);
  font-weight: 400;
  font-size: clamp(3.4rem, 8vw, 4.8rem);
  line-height: 0.92;
  letter-spacing: 0;
  text-transform: uppercase;
  border: 0;
  padding: 0;
  margin: 0 0 0.8rem;
}
.md-typeset .major-hero h1 em { font-style: normal; color: var(--major-pink); }
.md-typeset .major-hero .major-lead {
  max-width: 34rem;
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--md-default-fg-color--light);
  margin: 0 0 1.4rem;
}
.md-typeset .major-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0; }
.md-typeset .major-btn {
  display: inline-flex;
  align-items: center;
  height: 2rem;
  padding: 0 1.1rem;
  border-radius: 9999px;
  font-size: 0.7rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 160ms var(--major-ease), border-color 160ms var(--major-ease);
}
.md-typeset .major-btn--primary { background: var(--major-pink); color: #FFFFFF; }
.md-typeset .major-btn--primary:hover { background: var(--major-pink-700); color: #FFFFFF; }
.md-typeset .major-btn--secondary { border: 1px solid var(--md-default-fg-color); color: var(--md-default-fg-color); }
.md-typeset .major-btn--secondary:hover { background: var(--major-surface); color: var(--md-default-fg-color); }

.md-typeset .major-section-title {
  margin: 2.4rem 0 0.9rem;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.md-typeset .major-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  gap: 0.8rem;
  margin: 0;
}
.md-typeset .major-card {
  --card-accent: var(--major-pink);
  display: flex;
  flex-direction: column;
  padding: 1.2rem 1.2rem 1.1rem;
  border: 1px solid var(--major-border);
  border-radius: var(--major-radius-lg);
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
  text-decoration: none;
  transition: border-color 160ms var(--major-ease);
}
.md-typeset .major-card:hover { border-color: var(--card-accent); color: var(--md-default-fg-color); }
.md-typeset .major-card--performance { --card-accent: var(--major-pink); }
.md-typeset .major-card--engineering { --card-accent: var(--major-teal); }
.md-typeset .major-card--design { --card-accent: var(--major-blue); }
.md-typeset .major-card--strategy { --card-accent: var(--major-green); }
.md-typeset .major-card__chip { width: 0.7rem; height: 0.7rem; border-radius: 3px; background: var(--card-accent); margin-bottom: 0.9rem; }
.md-typeset .major-card h3 { margin: 0 0 0.35rem; font-size: 0.9rem; font-weight: 700; letter-spacing: -0.01em; }
.md-typeset .major-card p { margin: 0 0 1rem; font-size: 0.7rem; line-height: 1.55; color: var(--md-default-fg-color--light); flex-grow: 1; }
.md-typeset .major-card__cta { font-size: 0.68rem; font-weight: 600; }
.md-typeset .major-card--soon { border-style: dashed; }
.md-typeset .major-card--soon:hover { border-color: var(--major-border); }
.md-typeset .major-card__badge {
  align-self: flex-start;
  margin-bottom: 0.9rem;
  padding: 0.1rem 0.5rem;
  border-radius: 9999px;
  background: var(--major-surface);
  font-size: 0.55rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
}
.md-typeset .major-note {
  margin: 2.4rem 0 0;
  padding-top: 1.2rem;
  border-top: 1px solid var(--major-border);
  font-size: 0.7rem;
  color: var(--md-default-fg-color--light);
}