/* m7kni.io fleet brand — the shared visual layer for every m7kni docs site.
 *
 * ┌─ DESIGN SEAM ───────────────────────────────────────────────────────────┐
 * │ SOURCE OF TRUTH: the m7kni design system, the repo `m7kni/design-system`  │
 * │ (checked out at ~/repos/design-system-v2), published at                   │
 * │ https://design.m7kni.io - `tokens.css` for the values, `FOUNDATIONS.md`   │
 * │ for the frozen constitution behind them, `brand/` for the marks. It is a  │
 * │ real repository now, not the read-only Claude Design project the earlier  │
 * │ version of this comment named; DesignSync and `guidelines/docs-sites.md`  │
 * │ are v1 archaeology and no longer describe anything live.                  │
 * │                                                                          │
 * │ This file is that system applied. When the system moves, edit it there    │
 * │ first and port the change here - never the other way round.               │
 * │                                                                          │
 * │ It must keep expressing itself as Material/Zensical custom properties    │
 * │ (--md-*) plus `.m7-*` classes. Zensical renders Material's HTML and we   │
 * │ do not control that markup, so the system's React component library      │
 * │ (packages/ui) cannot drop in here - it targets product surfaces.         │
 * │                                                                          │
 * │ The system's own `tokens.css` is deliberately NOT vendored beside this   │
 * │ file. Adding a second stylesheet to the injected set would mean changing │
 * │ the CI copy steps and every generated child config; the values below are │
 * │ the tokens this layer actually uses, inlined, exactly as v1 inlined its  │
 * │ own. The four marketing sites vendor tokens.css because they consume far │
 * │ more of it.                                                              │
 * └──────────────────────────────────────────────────────────────────────────┘
 *
 * OWNED BY THE HUB. Copied into each child clone at build time, and into the
 * hub's own docs/stylesheets/ — a repo must not keep a tracked copy.
 *
 * LOAD ORDER: first, before the repo's own project.css. Under the inverted
 * model a project stylesheet carries components only and never branding, so
 * brand goes first and per-project components build on these tokens.
 *
 * DELIBERATELY RESTRAINED, and the restraint is the design system's own
 * instruction, not our caution: unify colour and type, then stop. Body size,
 * line-height, nav, TOC, admonition shapes, table styling and search stay as
 * the theme ships them - the theme has spent years on those and this system
 * has no opinion that beats them. v2 does not repeal this. These are eleven
 * reference sites, not marketing pages.
 *
 * FONTS ARE SELF-HOSTED, and they have to be. The obvious route is
 * `theme.font.text = "Hanken Grotesk"`, which makes Zensical emit a Google
 * Fonts link, plus the privacy plugin to pull those files local at build time.
 * That does not work here: ZENSICAL DOES NOT IMPLEMENT THE PRIVACY PLUGIN
 * (zensical/backlog#35, still open). Configuring it is silently inert — the
 * fleet carried `[project.plugins.privacy]` through the whole migration and
 * every built page still linked fonts.gstatic.com. Measured on a real build,
 * not assumed. So `theme.font = false` turns the Google link off entirely and
 * the faces below are served from the site's own origin.
 *
 * The woff2 files are the design system's own, copied verbatim so re-vendoring
 * stays a `cp` and not a rebuild. Hanken Grotesk ships as two subsets (latin,
 * latin-ext) because that is how the system publishes it; both are variable,
 * weight 100-900. Only the latin subset is preloaded in main.html - latin-ext
 * is a rounding error of the traffic and preloading it would cost every reader
 * bytes they will not use. JetBrains Mono stays the single unsubsetted file
 * this fleet has always shipped. Both families are SIL Open Font License 1.1;
 * the licence texts sit beside them in shared/fonts/.
 */

@font-face {
  font-family: "Hanken Grotesk";
  src: url("../fonts/hanken-grotesk-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Hanken Grotesk";
  src: url("../fonts/hanken-grotesk-latin-ext.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("../fonts/JetBrainsMono-Variable.woff2") format("woff2-variations");
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Accent - the one colour that means "interactive". Petrol, the system's
   * only non-semantic hue: --color-bg-accent light, --color-accent-hover for
   * the pressed/hover end. The three status colours are deliberately absent;
   * they mean something, and this layer has no status to express. */
  --md-primary-fg-color: #1d6a8a;
  --md-primary-fg-color--light: #66aecb;
  --md-primary-fg-color--dark: #175874;
  --md-accent-fg-color: #175874;

  /* Surfaces - petrol-tinted neutrals, the system's "Tinted chrome" decision.
   * Every neutral carries the accent hue (227) at low chroma, so the canvas
   * and the accent are the same family rather than warm paper under a cool
   * accent. v1 tinted the canvas at hue 85 and kept text greys at 260; that
   * pairing is gone. --md-default-bg-color is --color-bg-raised (pure white,
   * the page a docs body reads on), the code surface is --color-bg-hover and
   * the table rule is --color-border-default. */
  --md-default-bg-color: #ffffff;
  --md-code-bg-color: oklch(0.945 0.009 227);
  --md-typeset-table-color: oklch(0.9 0.008 227);

  /* Hanken Grotesk for everything, JetBrains Mono for machine text. Set as
   * variables rather than font-family, which is what preserves the system
   * fallback. */
  --md-text-font: "Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;
  --md-code-font: "JetBrains Mono", ui-monospace, monospace;
}

[data-md-color-scheme="slate"] {
  /* The dark accent is LIGHTER than the light one, and the system requires it
   * take dark ink rather than white - a light accent fill with white text
   * fails AA on dark. Nothing here paints a label on the accent, but anything
   * that starts to must read that rule first. */
  --md-primary-fg-color: #66aecb;
  --md-primary-fg-color--light: #7cbcd6;
  --md-primary-fg-color--dark: #1d6a8a;
  --md-accent-fg-color: #7cbcd6;

  /* Dark surfaces lift rather than invert, and they are the same hue-227
   * ramp: canvas 0.195 → surface 0.225. */
  --md-default-bg-color: oklch(0.225 0.011 227);
  --md-code-bg-color: oklch(0.195 0.01 227);
  --md-typeset-table-color: oklch(0.31 0.012 227);
}

/* ROOT-SIZE CORRECTION, unchanged by v2 and re-checked against it. The system's
 * type tokens are still authored against a 16px root - 13.5px body, 12.5px mono
 * and Material still sets `html { font-size: 125% }`, so every --text-* and
 * rem line-height would render 1.25x, silently, on a clean build.
 * tokens/typography.css multiplies by this basis, defaulting to 1, so 16px-root
 * consumers are untouched. Type only: spacing, radius and shadow should scale
 * with the theme's larger root, and shrinking them would leave correctly-sized
 * text in cramped gutters. */
:root { --m7-root-basis: 0.8; }   /* exactly 16/20 */

/* Brand-tint links so the accent reads consistently with the hub, without
 * altering spacing or type.
 *
 * `:not(.md-button)` is load-bearing. Material paints a filled button's
 * background with --md-primary-fg-color, so tinting its label the same
 * variable makes the text invisible against its own background. The rule
 * cannot be undone downstream either: it ends in a type selector and scores
 * (0,2,1), which the obvious `.md-typeset .md-button--primary` override
 * (0,2,0) loses to however late it loads. Excluding buttons at source is the
 * only fix that is not a specificity arms race.
 *
 * `.m7-btn` is excluded for the same reason and is NOT optional. The hub's
 * landing page paints its primary button with the same accent, and it used to
 * survive on load order alone: this rule was (0,2,1), the page's
 * `.md-typeset a.m7-btn--primary` was also (0,2,1), and extra.css loads
 * second. Adding `:not(.md-button)` raised this rule to (0,3,1) — enough to
 * win outright - and the button's label went accent-on-accent, invisible.
 * Caught on a light-mode screenshot; the build was clean and dark mode looked
 * fine. Any future `:not()` added here raises the specificity again, so
 * re-check the landing page's buttons when you touch this selector. */
[data-md-color-scheme="default"] .md-typeset a:not(.md-button):not(.m7-btn) {
  color: var(--md-primary-fg-color);
}

/* Corners follow the system's radius scale: 3px controls, 6px overlays, 0px
 * containers. The radius personality is *precise* - v1's 6px control and 12px
 * card are both gone, and "no rounded cards" is on the system's ban list. An
 * inline code span is a control, an admonition is a container. */
.md-typeset code {
  border-radius: 3px;
}

.md-typeset .admonition,
.md-typeset details {
  border-radius: 0;
}