@font-face {
  font-family: "Be Vietnam Pro";
  src: url("../assets/fonts/BeVietnamPro-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Be Vietnam Pro";
  src: url("../assets/fonts/BeVietnamPro-Medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Be Vietnam Pro";
  src: url("../assets/fonts/BeVietnamPro-SemiBold.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Be Vietnam Pro";
  src: url("../assets/fonts/BeVietnamPro-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Satoshi";
  src: url("../assets/fonts/Satoshi-Variable.woff2") format("woff2");
  font-weight: 400 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  src: url("../assets/fonts/JetBrainsMono-Variable.woff2") format("woff2");
  font-weight: 400 600; font-style: normal; font-display: swap;
}

/* AlphaProve docs: a quiet, three-column reading layout. */
:root {
  --md-text-font: "Satoshi";
  --md-code-font: "JetBrains Mono";
  --md-text-font-family: "Satoshi", system-ui, sans-serif;
  --md-code-font-family: "JetBrains Mono", monospace;
}
/* Sonar tokens from apps/web/DESIGN.md §2 and apps/web/src/app/globals.css.
   Dark is the default; the owner-requested docs light theme uses the app's
   existing light palette. Keep raw colors here and component rules semantic. */
[data-md-color-scheme="slate"] {
  color-scheme: dark;
  --surface-0: #010508;
  --surface-1: #060f14;
  --surface-2: #0d181e;
  --surface-3: #17242a;
  --text-primary: #eff2f5;
  --text-secondary: #bfc5c8;
  --text-muted: #909aa0;
  --border-subtle: rgba(191, 197, 200, 0.12);
  --border-medium: rgba(191, 197, 200, 0.24);
  --accent-text: #14ffec;
  --accent-ghost: rgba(13, 115, 119, 0.2);
  --focus-ring: #7ae3d6;
  --warn: oklch(0.78 0.15 70);
  --warn-ghost: oklch(0.78 0.15 70 / 0.12);
}
[data-md-color-scheme="default"] {
  color-scheme: light;
  --surface-0: #f6f6f6;
  --surface-1: #ffffff;
  --surface-2: #ffffff;
  --surface-3: #e9eef1;
  --text-primary: #0b1d26;
  --text-secondary: #33424c;
  --text-muted: #5a6b75;
  --border-subtle: rgba(11, 29, 38, 0.13);
  --border-medium: rgba(11, 29, 38, 0.26);
  --accent-text: #0b6165;
  --accent-ghost: rgba(13, 115, 119, 0.12);
  --focus-ring: #0d7377;
  --warn: #b26a00;
  --warn-ghost: rgba(178, 106, 0, 0.12);
}
[data-md-color-scheme] {
  --accent: #0d7377;
  --on-accent: #ffffff;
  --md-default-bg-color: var(--surface-0);
  --md-default-fg-color: var(--text-secondary);
  --md-default-fg-color--light: var(--text-muted);
  --md-default-fg-color--lighter: var(--text-muted);
  --md-default-fg-color--lightest: var(--border-subtle);
  --md-primary-fg-color: var(--surface-1);
  --md-primary-bg-color: var(--text-primary);
  --md-primary-bg-color--light: var(--text-secondary);
  --md-accent-fg-color: var(--accent-text);
  --md-accent-fg-color--transparent: var(--accent-ghost);
  --md-typeset-a-color: var(--accent-text);
  --md-code-bg-color: var(--surface-1);
  --md-code-fg-color: var(--text-secondary);
  --md-code-hl-color: var(--accent-ghost);
  --md-code-hl-number-color: var(--text-primary);
  --md-code-hl-string-color: var(--accent-text);
  --md-code-hl-keyword-color: var(--accent-text);
  --md-code-hl-function-color: var(--accent-text);
  --md-code-hl-constant-color: var(--text-primary);
  --md-code-hl-name-color: var(--text-secondary);
  --md-code-hl-operator-color: var(--text-muted);
  --md-code-hl-punctuation-color: var(--text-muted);
  --md-code-hl-comment-color: var(--text-muted);
  --md-code-hl-variable-color: var(--text-primary);
  --md-footer-bg-color: var(--surface-1);
  --md-footer-bg-color--dark: var(--surface-0);
  --ap-heading: var(--text-primary);
  --ap-border: var(--border-subtle);
  --ap-hover: var(--surface-3);
}
.md-grid { max-width: 80rem; }
.md-header { background: var(--surface-1); color: var(--ap-heading); box-shadow: none; border-bottom: 1px solid var(--ap-border); }
.md-header__inner { height: 3.4rem; padding: 0 1.2rem; gap: 1rem; }
.ap-brand { display: inline-flex; align-items: center; gap: .5rem; color: var(--ap-heading); font-size: 1.1rem; font-weight: 700; letter-spacing: -.04em; flex-shrink: 0; }
.ap-brand img { width: 1.35rem; height: 1.35rem; }
.ap-header-links { display: flex; align-items: center; gap: 1.4rem; margin-left: .4rem; font-size: .72rem; white-space: nowrap; }
.ap-header-links a { color: var(--md-default-fg-color--light); }
.ap-header-links a[aria-current], .ap-header-links a:hover { color: var(--accent-text); }
.ap-header-links a[aria-current] { font-weight: 600; }
.ap-header-links span { font-size: .65rem; }
.ap-header-spacer { flex: 1; }
.md-header__button { margin: 0; padding: .3rem; }
.md-header__button svg { width: 1rem; height: 1rem; }
.md-search__form { background: var(--surface-2); border: 1px solid var(--ap-border); border-radius: 2rem; color: var(--md-default-fg-color--light); }
.md-search__input { font-size: .72rem; }
.md-search__input::placeholder { color: var(--md-default-fg-color--light); }
.md-search__icon { color: var(--md-default-fg-color--light); }
.md-main__inner { margin-top: 0; }
.md-sidebar { padding-top: 1.8rem; }
.md-sidebar--primary { width: 13.5rem; }
.md-sidebar--secondary { width: 13rem; }
.md-sidebar__scrollwrap { scrollbar-width: thin; scrollbar-color: var(--ap-border) transparent; }
.md-nav { font-size: .73rem; line-height: 1.5; }
.md-nav__link { margin-top: 0; padding: .38rem .55rem; border-radius: .45rem; color: var(--md-default-fg-color--light); }
.md-nav__link:hover { color: var(--ap-heading); background: var(--ap-hover); }
.md-nav__link--active, .md-nav--primary .md-nav__item .md-nav__link--active { color: var(--on-accent); background: var(--accent); font-weight: 500; }
.md-nav--primary .md-nav__item--section > .md-nav__link { color: var(--ap-heading); font-weight: 600; font-size: .7rem; padding-bottom: .5rem; }
.md-nav--primary .md-nav__item--section { margin-top: 1.3rem; }
.md-nav--secondary { border-left: 0; }
.md-nav--secondary .md-nav__title { background: transparent; box-shadow: none; font-weight: 600; color: var(--ap-heading); padding: 0 .55rem .65rem; font-size: .7rem; }
.md-nav--secondary .md-nav__link { font-size: .7rem; background: none; }
.md-nav--secondary .md-nav__link--active { color: var(--accent-text); }
.md-content { min-width: 0; }
.md-content__inner { margin: 1.7rem 2rem 3rem; padding-top: 0; }
.md-typeset { font-size: .78rem; line-height: 1.75; }
.md-typeset h1, .md-typeset h2, .md-typeset h3, .md-typeset h4 { color: var(--ap-heading); font-weight: 600; letter-spacing: -.035em; }
.md-typeset h1 { font-size: 2.45rem; line-height: 1.15; margin: 0 0 .9rem; font-weight: 700; }
.md-typeset h2 { font-size: 1.5rem; margin: 2.2rem 0 1rem; }
.md-typeset h3 { font-size: 1.05rem; }
.md-typeset p { margin: .9rem 0; }
.md-typeset .ap-lead { color: var(--md-default-fg-color--light); font-size: 1.04rem; line-height: 1.5; margin: 0 0 1rem; }
.md-typeset a { text-underline-offset: .2em; }
.md-typeset p a, .md-typeset li a { text-decoration: underline; text-decoration-color: var(--md-default-fg-color--lighter); text-decoration-thickness: 1px; }
.md-typeset li { margin-bottom: .4rem; }
.md-typeset li strong { font-weight: 500; }
.ap-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin: 1.4rem 0 2.3rem; }
.md-typeset .ap-card { margin: 0; }
.md-typeset .ap-card a { background: var(--surface-2); display: flex; height: 100%; flex-direction: column; border: 1px solid var(--ap-border); border-radius: .55rem; padding: 1rem; color: var(--md-default-fg-color--light); font-size: .75rem; line-height: 1.5; text-decoration: none; transition: background .15s, border-color .15s; }
.md-typeset .ap-card a:hover { background: var(--ap-hover); border-color: var(--md-default-fg-color--lighter); }
.ap-card strong { display: block; font-size: .77rem; font-weight: 600; color: var(--ap-heading); margin: .6rem 0 .35rem; }
.ap-card-icon { color: var(--accent-text); font-size: 1.1rem; line-height: 1; }
.ap-card-icon svg { width: 1.15rem; height: 1.15rem; }
.md-typeset code { border-radius: .25rem; font-size: .83em; }
.md-typeset pre { border: 1px solid var(--ap-border); border-radius: .55rem; overflow: hidden; }
.md-typeset pre > code { padding: 1rem; }
.md-typeset table:not([class]) { border: 1px solid var(--ap-border); border-radius: .45rem; box-shadow: none; font-size: .73rem; }
.md-typeset table:not([class]) th { background: var(--ap-hover); color: var(--ap-heading); }
.md-typeset .admonition, .md-typeset details { background: var(--surface-1); box-shadow: none; border-radius: .5rem; font-size: .75rem; }
.ap-pagination { display: flex; gap: 1rem; margin-top: 3rem; border-top: 1px solid var(--ap-border); padding-top: 1.4rem; }
.ap-pagination a { background: var(--surface-2); flex: 1; border: 1px solid var(--ap-border); border-radius: .55rem; padding: .85rem 1rem; text-decoration: none; }
.ap-pagination a:hover { background: var(--ap-hover); }
.ap-pagination a[rel="next"] { text-align: right; margin-left: auto; }
.ap-pagination span { display: block; color: var(--md-default-fg-color--light); font-size: .65rem; }
.ap-pagination strong { color: var(--ap-heading); font-size: .78rem; font-weight: 500; }
.md-footer { border-top: 1px solid var(--ap-border); }
.md-footer-meta__inner { padding: .5rem 1.2rem; }
.md-copyright { color: var(--md-default-fg-color--light); }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
::selection { background: var(--accent); color: var(--on-accent); }
@media screen and (min-width: 60em) {
  .md-search__inner { width: 10rem; }
  .md-search__form { height: 1.9rem; }
  .md-search__input { height: 1.9rem; padding-left: 2rem; }
  .md-search__icon { top: .35rem; }
  [data-md-toggle="search"]:checked ~ .md-header .md-search__form { border-radius: .5rem .5rem 0 0; height: 2.4rem; }
  [data-md-toggle="search"]:checked ~ .md-header .md-search__input { height: 2.4rem; }
}
@media screen and (min-width: 76.25em) {
  .md-nav--primary > .md-nav__title { display: none; }
  .md-sidebar--primary { border-right: 1px solid var(--ap-border); }
  .md-sidebar--primary .md-sidebar__inner { padding: 0 .65rem; }
}
@media screen and (max-width: 76.234375em) {
  .md-sidebar--primary { width: 12.1rem; padding-top: 0; }
  .md-nav--primary > .md-nav__title { background: var(--ap-hover); color: var(--ap-heading); }
  .md-content__inner { margin-left: 1.4rem; margin-right: 1.4rem; }
}
@media screen and (max-width: 59.984375em) {
  .md-header__inner { gap: .6rem; padding: 0 .65rem; }
  .ap-header-links { gap: .8rem; }
}
@media screen and (max-width: 44.984375em) {
  .ap-header-links { display: none; }
  .md-header__inner { height: 3.2rem; gap: .15rem; padding: 0 .4rem; }
  .md-header__button { width: 2.2rem; height: 2.2rem; padding: .55rem; }
  .md-header__button svg { width: 1.1rem; height: 1.1rem; }
  .ap-brand { font-size: .95rem; gap: .35rem; }
  .ap-brand img { width: 1.2rem; height: 1.2rem; }
  .md-content__inner { margin: 1.1rem 1rem 2rem; }
  .md-typeset { font-size: .8rem; line-height: 1.65; }
  .md-typeset h1 { font-size: clamp(1.6rem, 7.5vw, 1.9rem); line-height: 1.2; }
  .md-typeset h2 { font-size: 1.3rem; }
  .md-typeset .ap-lead { font-size: .9rem; }
  .ap-cards { grid-template-columns: 1fr; gap: .6rem; margin: 1.2rem 0 1.8rem; }
  .md-typeset .ap-card a { display: grid; grid-template-columns: 1.2rem 1fr; gap: .3rem .6rem; padding: .85rem; }
  .ap-card-icon { align-self: center; }
  .ap-card strong { margin: 0; font-size: .8rem; }
  .ap-card-description { grid-column: 2; }
  .md-nav--primary .md-nav__link { min-height: 2.2rem; align-items: center; }
  .ap-pagination { gap: .6rem; }
  .ap-pagination a { min-width: 0; padding: .7rem; }
}

/* Informational callouts use the brand accent; amber remains a warning. */
.md-typeset :is(.admonition, details):is(.note, .tip, .info) { border-color: var(--accent); }
.md-typeset :is(.note, .tip, .info) > :is(.admonition-title, summary) { background: var(--accent-ghost); color: var(--text-primary); }
.md-typeset :is(.note, .tip, .info) > :is(.admonition-title, summary)::before { background-color: var(--accent-text); }
.md-typeset :is(.admonition, details):is(.warning, .caution) { border-color: var(--warn); }
.md-typeset :is(.warning, .caution) > :is(.admonition-title, summary) { background: var(--warn-ghost); color: var(--text-primary); }
.md-typeset :is(.warning, .caution) > :is(.admonition-title, summary)::before { background-color: var(--warn); }
