/* Generated by scripts/build-docs.mjs from site/styles.css (tokens, fonts) and scripts/docs/docs.css. */
@font-face {
  font-family: 'Alata';
  src: url('fonts/alata-latin-ext.woff2') format('woff2');
  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: 'Alata';
  src: url('fonts/alata-latin.woff2') format('woff2');
  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;
}
:root {
  --gr-gold: #E4B912;
  --gr-gold-light: #F1DC88;
  --gr-gold-lighter: #FBE8A0;
  --gr-gold-dark: #B8920D;
  --gr-gold-darker: #8A6D09;
  --gr-gold-alpha-10: rgba(228,185,18,.10);
  --gr-gold-alpha-15: rgba(228,185,18,.15);
  --gr-gold-alpha-30: rgba(228,185,18,.30);
  --gr-green: #0C6E3C;
  --gr-green-dark: #04391F;
  --gr-green-light: #14A05A;
  --gr-green-alpha-15: rgba(20,160,90,.15);
  --gr-logo-gold-light: #feedac;
  --gr-logo-gold-dark: #a06c2e;
  --gr-logo-green-light: #366841;
  --gr-logo-green-dark: #03110d;
  --gr-status-error: #E05252;
  --gr-status-error-light: #F0A3A3;
  --gr-input-bg: #6E6854;
  --gr-bg-base: #1D1D1D;
  --gr-bg-raised: #252525;
  --gr-bg-card: #2E2E2E;
  --gr-bg-card-hover: #363636;
  --gr-bg-overlay: rgba(0,0,0,.72);
  --gr-surface-low: #3A3A3A;
  --gr-surface-mid: #484848;
  --gr-surface-high: #595959;
  --gr-text-primary: #FFFFFF;
  --gr-text-secondary: #FFF6CF;
  --gr-text-muted: #C0B68A;
  --gr-text-on-gold: #1D1D1D;
  --gr-text-disabled: #7A7060;
  --gr-border: rgba(228,185,18,.15);
  --gr-border-strong: rgba(228,185,18,.35);
  --gr-border-subtle: rgba(255,255,255,.08);
  --gr-gradient-gold: linear-gradient(180deg, #FFFFFF 0%, #F1DC88 9%, #E4B912 52%, #B8920D 100%);
  --gr-gradient-surface: linear-gradient(180deg, #363636 0%, #1D1D1D 100%);
  --gr-gradient-gold-soft: linear-gradient(135deg, #F1DC88 0%, #E4B912 55%, #B8920D 100%);
  --gr-gradient-green: linear-gradient(180deg, #0C6E3C 0%, #04391F 100%);
  --gr-gradient-text: linear-gradient(180deg, #FBE8A0 0%, #E4B912 60%, #B8920D 100%);
  --gr-font-primary: 'Alata', system-ui, -apple-system, sans-serif;
  --gr-font-mono: ui-monospace, 'Cascadia Code', 'SF Mono', Consolas, monospace;
  --gr-text-xs: .75rem;
  --gr-text-sm: .875rem;
  --gr-text-base: 1rem;
  --gr-text-lg: 1.125rem;
  --gr-text-xl: 1.25rem;
  --gr-text-2xl: 1.5rem;
  --gr-text-3xl: 1.875rem;
  --gr-display-sm: clamp(1.5rem, 1.1rem + 2vw, 2.25rem);
  --gr-display-md: clamp(2rem, 1.4rem + 3vw, 3.25rem);
  --gr-display-lg: clamp(2.5rem, 1.6rem + 4.5vw, 4.5rem);
  --gr-space-1: 4px; --gr-space-2: 8px; --gr-space-3: 12px; --gr-space-4: 16px;
  --gr-space-5: 20px; --gr-space-6: 24px; --gr-space-8: 32px; --gr-space-10: 40px;
  --gr-space-12: 48px; --gr-space-16: 64px; --gr-space-20: 80px; --gr-space-24: 96px;
  --gr-radius-sm: 6px; --gr-radius-md: 10px; --gr-radius-lg: 16px; --gr-radius-xl: 24px; --gr-radius-pill: 999px;
  --gr-container: 1180px;
  --gr-container-narrow: 760px;
  --gr-container-wide: 1320px;
  --gr-shadow-sm: 0 2px 8px rgba(0,0,0,.40);
  --gr-shadow-md: 0 4px 24px rgba(0,0,0,.50);
  --gr-shadow-lg: 0 8px 40px rgba(0,0,0,.65);
  --gr-shadow-gold: 0 0 0 2px rgba(228,185,18,.35);
  --gr-glow-gold: 0 0 48px rgba(228,185,18,.28);
  --gr-glow-green: 0 0 48px rgba(20,160,90,.22);
  --gr-transition: 180ms ease;
  --gr-transition-slow: 320ms ease;
  --gr-z-header: 100;
  --gr-z-overlay: 200;
  --gr-header-height: 72px;
  --gr-motion-quick: 180ms;
  --gr-motion-base: 320ms;
  --gr-motion-slow: 640ms;
  --gr-motion-scene: 1200ms;
  --gr-ease-standard: cubic-bezier(.2,0,0,1);
  --gr-ease-entrance: cubic-bezier(.16,1,.3,1);
  --gr-ease-exit: cubic-bezier(.7,0,.84,0);
  --gr-ease-emphasis: cubic-bezier(.34,1.4,.64,1);
  --gr-touch-target-min: 44px;
  --gr-section-gap: clamp(3.5rem, 2rem + 6vw, 7rem);
  --nav-h: var(--gr-header-height);
  color-scheme: dark;
}
/* Docs site (MI-095 plan-03). build-docs.mjs puts the homepage's @font-face rules and :root tokens above this file. */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 88px; }
body {
  margin: 0; min-height: 100vh; display: flex; flex-direction: column;
  background: var(--gr-bg-base); color: var(--gr-text-secondary);
  font: 400 var(--gr-text-base)/1.65 var(--gr-font-primary);
}
img, video, svg { display: block; max-width: 100%; }
a { color: var(--gr-gold); text-underline-offset: 3px; }
a:hover { color: var(--gr-gold-light); }
:focus-visible { outline: 2px solid var(--gr-gold); outline-offset: 2px; border-radius: 4px; }
.skip { position: absolute; left: var(--gr-space-4); top: -60px; z-index: 30; padding: var(--gr-space-2) var(--gr-space-4); background: var(--gr-gold); color: var(--gr-text-on-gold); border-radius: var(--gr-radius-sm); }
.skip:focus { top: var(--gr-space-3); }

/* ---------- header: every control in the row is 36px high ---------- */
.dh { position: sticky; top: 0; z-index: 20; background: rgba(29,29,29,.92); border-bottom: 1px solid var(--gr-border-subtle); }
@supports (backdrop-filter: blur(1px)) { .dh { background: rgba(29,29,29,.72); backdrop-filter: blur(14px) saturate(1.2); } }
.dh__in { display: flex; align-items: center; gap: var(--gr-space-4); width: min(100% - 2 * var(--gr-space-8), var(--gr-container-wide)); margin-inline: auto; min-height: 64px; }
.dh__logo img { width: 112px; height: auto; }
.dh__docs { color: var(--gr-text-primary); text-decoration: none; font-size: var(--gr-text-lg); padding-left: var(--gr-space-4); border-left: 1px solid var(--gr-border-strong); line-height: 1.3; }
.dh__docs:hover { color: var(--gr-gold); }
.dh__search { position: relative; flex: 1; max-width: 420px; margin-left: auto; }
.dh__glass { position: absolute; left: 12px; top: 10px; fill: none; stroke: var(--gr-text-muted); stroke-width: 2; stroke-linecap: round; pointer-events: none; }
.dh__search input {
  width: 100%; height: 36px; padding: 0 var(--gr-space-3) 0 36px; border: 1px solid var(--gr-border); border-radius: var(--gr-radius-pill);
  background: var(--gr-bg-raised); color: var(--gr-text-primary); font: inherit; font-size: var(--gr-text-sm);
}
.dh__search input::placeholder { color: var(--gr-text-muted); }
.dh__search input:focus { outline: 0; border-color: var(--gr-gold); box-shadow: var(--gr-shadow-gold); }
.dh__search input::-webkit-search-cancel-button { filter: grayscale(1) brightness(2); }
.dh__results {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 25; margin: 0; padding: var(--gr-space-1); list-style: none;
  max-height: min(70vh, 480px); overflow-y: auto; background: var(--gr-bg-raised); border: 1px solid var(--gr-border-strong); border-radius: var(--gr-radius-md); box-shadow: var(--gr-shadow-md);
}
.dh__results a { display: block; padding: var(--gr-space-2) var(--gr-space-3); border-radius: var(--gr-radius-sm); text-decoration: none; color: var(--gr-text-primary); }
.dh__results a small { display: block; color: var(--gr-text-muted); font-size: var(--gr-text-xs); line-height: 1.45; }
.dh__results a mark { background: none; color: var(--gr-gold); }
.dh__results [aria-selected='true'] a, .dh__results a:hover { background: var(--gr-gold-alpha-10); }
.dh__results .is-empty { padding: var(--gr-space-3); color: var(--gr-text-muted); font-size: var(--gr-text-sm); }
.lang { display: flex; height: 36px; border-radius: var(--gr-radius-pill); box-shadow: inset 0 0 0 1px var(--gr-border); overflow: hidden; }
.lang a { display: grid; place-items: center; min-width: 40px; padding: 0 var(--gr-space-2); color: var(--gr-text-muted); text-decoration: none; font-size: var(--gr-text-xs); letter-spacing: .06em; }
.lang a[aria-current] { background: var(--gr-gold-alpha-15); color: var(--gr-gold); }
.lang a:hover { color: var(--gr-text-primary); }
.dh__app { display: inline-flex; align-items: center; height: 36px; padding: 0 var(--gr-space-4); border: 1px solid var(--gr-border-strong); border-radius: var(--gr-radius-pill); color: var(--gr-text-primary); text-decoration: none; font-size: var(--gr-text-sm); white-space: nowrap; }
.dh__app:hover { border-color: var(--gr-gold); color: var(--gr-gold); }
.dh__menu { display: none; align-items: center; gap: var(--gr-space-2); height: 36px; padding: 0 var(--gr-space-3); border: 1px solid var(--gr-border-strong); border-radius: var(--gr-radius-pill); background: transparent; color: var(--gr-text-primary); font: inherit; font-size: var(--gr-text-sm); cursor: pointer; }
.dh__menu svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.dh__menu[aria-expanded='true'] { border-color: var(--gr-gold); color: var(--gr-gold); }

/* ---------- layout ---------- */
.dw { flex: 1; display: grid; grid-template-columns: 248px minmax(0, 1fr); gap: var(--gr-space-12); width: min(100% - 2 * var(--gr-space-8), var(--gr-container-wide)); margin-inline: auto; }
.toc { position: sticky; top: 64px; align-self: start; max-height: calc(100vh - 64px); overflow-y: auto; padding: var(--gr-space-8) 0 var(--gr-space-12); }
.toc__h { margin: var(--gr-space-6) 0 var(--gr-space-2); color: var(--gr-text-muted); font-size: var(--gr-text-xs); letter-spacing: .08em; text-transform: uppercase; }
.toc__h:first-child { margin-top: 0; }
.toc ul { margin: 0; padding: 0; list-style: none; }
.toc a { display: block; padding: 6px var(--gr-space-3); margin-left: calc(-1 * var(--gr-space-3)); border-left: 2px solid transparent; color: var(--gr-text-secondary); text-decoration: none; font-size: var(--gr-text-sm); line-height: 1.4; }
.toc a:hover { color: var(--gr-gold); }
.toc a[aria-current] { color: var(--gr-gold); border-left-color: var(--gr-gold); background: var(--gr-gold-alpha-10); }

.doc { min-width: 0; max-width: var(--gr-container-narrow); padding: var(--gr-space-10) 0 var(--gr-space-16); }
.doc h1 { margin: 0 0 var(--gr-space-6); color: var(--gr-text-primary); font-size: var(--gr-display-sm); font-weight: 400; line-height: 1.2; }
.doc__app { margin: calc(-1 * var(--gr-space-2)) 0 var(--gr-space-8); }
.btn { display: inline-flex; align-items: center; gap: var(--gr-space-2); min-height: 40px; padding: 0 var(--gr-space-5); border-radius: var(--gr-radius-pill); font-size: var(--gr-text-sm); text-decoration: none; }
.btn svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.btn--ghost { border: 1px solid var(--gr-border-strong); color: var(--gr-gold-light); }
.btn--ghost:hover { border-color: var(--gr-gold); color: var(--gr-gold); background: var(--gr-gold-alpha-10); }

.prose > :first-child { margin-top: 0; }
.prose p, .prose ul, .prose ol { margin: 0 0 var(--gr-space-4); }
.prose ul, .prose ol { padding-left: 1.4em; }
.prose li { margin-bottom: var(--gr-space-2); padding-left: var(--gr-space-1); }
.prose li > ul, .prose li > ol { margin: var(--gr-space-2) 0 0; }
.prose ol > li::marker { color: var(--gr-gold); }
.prose ul > li::marker { color: var(--gr-gold-dark); }
.prose h2 { margin: var(--gr-space-10) 0 var(--gr-space-3); color: var(--gr-text-primary); font-size: var(--gr-text-2xl); font-weight: 400; line-height: 1.3; }
.prose h3 { margin: var(--gr-space-8) 0 var(--gr-space-2); color: var(--gr-text-primary); font-size: var(--gr-text-xl); font-weight: 400; }
.prose strong { color: var(--gr-text-primary); font-weight: 400; background: var(--gr-gold-alpha-10); padding: 0 .25em; border-radius: 4px; }
.prose code { font-family: var(--gr-font-mono); font-size: .88em; padding: .1em .35em; border-radius: 4px; background: var(--gr-bg-card); color: var(--gr-text-primary); }
.prose pre { position: relative; margin: 0 0 var(--gr-space-5); padding: var(--gr-space-4) var(--gr-space-5); padding-right: 88px; overflow-x: auto; background: var(--gr-bg-raised); border: 1px solid var(--gr-border); border-radius: var(--gr-radius-md); }
.prose pre code { padding: 0; background: none; font-size: var(--gr-text-sm); line-height: 1.6; white-space: pre-wrap; word-break: break-word; }
.copy { position: absolute; top: var(--gr-space-2); right: var(--gr-space-2); height: 32px; padding: 0 var(--gr-space-3); border: 1px solid var(--gr-border-strong); border-radius: var(--gr-radius-pill); background: var(--gr-bg-base); color: var(--gr-text-secondary); font: inherit; font-size: var(--gr-text-xs); cursor: pointer; }
.copy:hover, .copy.is-done { border-color: var(--gr-gold); color: var(--gr-gold); }
.tbl { margin: 0 0 var(--gr-space-5); overflow-x: auto; border: 1px solid var(--gr-border); border-radius: var(--gr-radius-md); }
.tbl table { width: 100%; border-collapse: collapse; font-size: var(--gr-text-sm); }
.tbl th, .tbl td { padding: var(--gr-space-3) var(--gr-space-4); text-align: left; vertical-align: top; border-bottom: 1px solid var(--gr-border-subtle); }
.tbl th { color: var(--gr-text-primary); font-weight: 400; background: var(--gr-bg-raised); }
.tbl tr:last-child td { border-bottom: 0; }
.clip { margin: 0 0 var(--gr-space-6); }
.clip video { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: contain; background: var(--gr-bg-raised); border: 1px solid var(--gr-border); border-radius: var(--gr-radius-md); }

.pn { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gr-space-4); margin-top: var(--gr-space-12); padding-top: var(--gr-space-6); border-top: 1px solid var(--gr-border-subtle); }
.pn a { display: block; padding: var(--gr-space-3) var(--gr-space-4); border: 1px solid var(--gr-border); border-radius: var(--gr-radius-md); color: var(--gr-text-primary); text-decoration: none; }
.pn a:hover { border-color: var(--gr-gold); background: var(--gr-gold-alpha-10); }
.pn small { display: block; color: var(--gr-text-muted); font-size: var(--gr-text-xs); }
.pn__next { text-align: right; }

.df { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--gr-space-2) var(--gr-space-6); width: min(100% - 2 * var(--gr-space-8), var(--gr-container-wide)); margin-inline: auto; padding: var(--gr-space-6) 0 var(--gr-space-8); border-top: 1px solid var(--gr-border-subtle); color: var(--gr-text-muted); font-size: var(--gr-text-xs); }
.df p { margin: 0; }
.df a { color: var(--gr-text-secondary); margin-right: var(--gr-space-4); }
.df a:hover { color: var(--gr-gold); }

/* ---------- tablet and phone: the contents open from the header ---------- */
@media (max-width: 960px) {
  .dw { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .js .dh__menu { display: inline-flex; }
  .js .toc { display: none; }
  .js .toc.is-open {
    display: block; position: fixed; top: var(--dh-h, 64px); left: 0; right: 0; bottom: 0; z-index: 15; max-height: none; align-self: auto;
    padding: var(--gr-space-6) var(--gr-space-6) var(--gr-space-12); background: var(--gr-bg-base); border-top: 1px solid var(--gr-border-subtle);
  }
  .toc { position: static; max-height: none; padding-bottom: 0; }
  .toc a { margin-left: 0; padding-block: 10px; }
  .doc { margin-inline: auto; width: 100%; }
}
@media (max-width: 640px) {
  .dh__in { flex-wrap: wrap; gap: var(--gr-space-3); width: calc(100% - 2 * var(--gr-space-4)); padding: var(--gr-space-3) 0; min-height: 0; }
  .dh__logo img { width: 96px; }
  .dh__docs { padding-left: var(--gr-space-3); font-size: var(--gr-text-base); }
  .dh__app { display: none; }
  .lang { margin-left: auto; }
  .dh__search { order: 10; flex-basis: 100%; max-width: none; margin-left: 0; }
  .dw, .df { width: calc(100% - 2 * var(--gr-space-4)); }
  .doc { padding-top: var(--gr-space-6); }
  .prose pre { padding: var(--gr-space-3) var(--gr-space-4); }
  .pn { grid-template-columns: 1fr; }
  .pn__next { text-align: left; }
  .dh__menu span { display: none; }
  /* phone: 44px touch targets, still one height across the row */
  .dh__menu { width: 44px; height: 44px; justify-content: center; padding: 0; }
  .lang, .dh__search input { height: 44px; }
  .lang a { min-width: 44px; }
  .dh__glass { top: 14px; }
  .prose pre { padding-top: 60px; }
  .copy { height: 44px; padding: 0 var(--gr-space-4); }
  .pn a, .btn { min-height: 44px; }
  .toc a { min-height: 44px; display: flex; align-items: center; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }
