/**
 * root Design System - documentation styles: theme tokens
 *
 * Linked by `scripts/_docs-shell.mjs` on every page. The docs' own color and layout
 * tokens, aliased onto the root foundations - the seam every other shell stylesheet
 * spends from. Same constraints as the rest of the shell: zero CSS classes - element,
 * `[data-part]` and attribute selectors only - zero inline styles, and every value a
 * root foundation token.
 */

/* ── Theme tokens (derived from root foundations) ───────────────────────── */
@view-transition {
  navigation: auto;
}

:root {
  /* Aliased onto the role ramps, which are the only seam left: retiring the
     semantic color layer and deleted `foundations/_semantic-colors.css`, so every
     `--root-c--surface*` / `--root-c--on-surface*` / `--root-c--brand*` alias this
     file used had been undefined since - taking the whole docs palette with it,
     silently, because a custom property that fails to resolve is not an error.

     The ramps mirror across schemes on their own, so each token below points straight at
     one and never wraps it in a second `light-dark()`: re-wrapping an already scheme-aware
     value double-resolves it and breaks dark mode.

     These six are the only color names this file still declares, and they are not
     shorthands - they are the seam the two preview columns turn (ADR-014, and
     `_live-preview.css`): a custom property is computed where it is *declared*, so the
     `light-dark()` inside `--root-c--color` freezes to the scheme `:root` had, and a
     column that pins `color-scheme` has to be handed the other pole by hand. Everything
     that was only a second name for a ramp step - the accent, the radius, the focus pair,
     the elevation, nine spacing steps - is gone, and the rules spend the foundation token
     directly. */
  /* Ground and text are the palette's own base pair, unmixed: the site shows what
     the tokens are, so tinting its ground with a ramp step would document a color
     the design system does not have. Raised surfaces still mix towards the neutral
     ramp - that is a card lifting off the page, not the page. Both inputs mirror
     across schemes, so the mix does too. */
  --docs-bg: var(--root-c--background-color);
  --docs-surface: var(--root-c--background-color);
  --docs-elevated: color-mix(
    in srgb,
    light-dark(var(--root-c--neutral-200--light), var(--root-c--default-800--dark)) 55%,
    var(--root-c--background-color)
  );
  --docs-text: var(--root-c--color);
  --docs-muted: light-dark(var(--root-c--default-700--light), var(--root-c--neutral-200--dark));
  --docs-border: light-dark(var(--root-c--neutral-300--light), var(--root-c--neutral-700--dark));
  /* A translucent wash rather than a ramp step: a fixed pale tint is right for a
     badge and wrong for a full-bleed nav highlight, which would render as a stark
     pale block on a dark page. */
  --docs-accent-weak: color-mix(
    in srgb,
    light-dark(var(--root-c--default-400--light), var(--root-c--default-300--dark)) 14%,
    transparent
  );
  /* There was a `--docs-accent-faint` here, half of weak, for the branches leading to the
     current entry. The trail is a color now and nothing is painted behind it, so the token
     had no readers left and is gone rather than kept for a rule that might want it. */

  --docs-sidebar-w: 30rem;
  --docs-toc-w: 26rem;
  --docs-content-w: 88rem;
  /* The focus ring is the foundations', spent by name wherever it is drawn - there used to
     be a `--docs-focus-w` / `--docs-focus-offset` pair in front of it, which is a second
     name for a value that already has one. The sum is not: `--docs-focus-room` is what
     anything leaving space outside a border box reads - the sticky search row, and the
     sticky offset of every row under it - and a sum of two tokens is a value the token set
     does not publish. */
  --docs-focus-room: calc(var(--root-f--outline-width) + var(--root-f--outline-offset));

  /* The line that separates one region of the layout from another - the sidebar from the
     content, the content from the table of contents, the page from the footer. Lighter
     than `--docs-border`, which frames a thing: a rule that says "this is a different
     column" does not have to be as loud as one that says "this is a card". Mixed toward
     the page's own ground rather than picked a step down the ramp, so it stays a
     separation in both schemes instead of becoming a shadow in one of them. */
  --docs-rule: color-mix(in srgb, var(--docs-border) 55%, var(--docs-bg));
  --docs-rule-width: 1px;
}