/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-826e5f20.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-ede05a2d.woff2") format('woff2');
  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;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-89c3b5dc.woff2") format('woff2');
  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;
}
/* vietnamese */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url("/fonts/font-7d46dc5e.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url("/fonts/font-4ca08741.woff2") format('woff2');
  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;
}
/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url("/fonts/font-ea65ac56.woff2") format('woff2');
  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;
}
/* vietnamese */
@font-face {
  font-family: 'Public Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-ee31427d.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Public Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-0f838987.woff2") format('woff2');
  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;
}
/* latin */
@font-face {
  font-family: 'Public Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-39652046.woff2") format('woff2');
  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;
}
/* vietnamese */
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("/fonts/font-4c5b74e9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("/fonts/font-b2f4e0b9.woff2") format('woff2');
  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;
}
/* latin */
@font-face {
  font-family: 'Public Sans';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("/fonts/font-5ee7582b.woff2") format('woff2');
  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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-b6baa237.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-d0055aa8.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-ddebb415.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-9e7af7ca.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-050ea8c3.woff2") format('woff2');
  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;
}
/* latin */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/font-1b3caba1.woff2") format('woff2');
  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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/font-b6baa237.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/font-d0055aa8.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/font-ddebb415.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/font-9e7af7ca.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/font-050ea8c3.woff2") format('woff2');
  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;
}
/* latin */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/font-1b3caba1.woff2") format('woff2');
  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;
}

/* ===========================================================================
   Tokens — hue values come from the mockups' CSS vars (--bgh, --axh).
   ======================================================================== */
:root {
  --bgh: 255; /* background hue (dark blue family) */
  --axh: 75;  /* accent hue (gold family) */
}

/* No global box-sizing reset: the mockups render with the browser default
   (content-box), and their max-width/padding geometry depends on it. */

body {
  margin: 0;
  font-family: "Public Sans", Helvetica, sans-serif;
  color: oklch(0.24 0.02 var(--bgh));
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

.wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding-left: 32px;
  padding-right: 32px;
}

.btn-primary {
  background: oklch(0.56 0.18 var(--axh));
  color: oklch(0.99 0.01 var(--axh));
  font-weight: 600;
  border-radius: 999px;
  text-decoration: none;
  display: inline-block;
}
.btn-primary:hover,
.btn-primary:focus-visible { background: oklch(0.50 0.18 var(--axh)); }

.mono-label {
  font-family: "Roboto Mono", ui-monospace, monospace;
  text-transform: uppercase;
}

/* ===========================================================================
   Global rules from the mockups' shared style block (verbatim, tokenized).
   ======================================================================== */
:root {
  --secpad: 72px;   /* section padding (mockup "Standard" density) */
  --cardpad: 26px;  /* card padding (mockup "Standard" density) */
  --texture-op: 0.35; /* grid texture opacity (mockup "Full" graphics) */
}
body { background: oklch(0.99 0.006 var(--bgh)); }
[data-texture] { opacity: var(--texture-op); }
a { color: oklch(0.45 0.13 var(--bgh)); text-decoration: none; }
/* Unclassed links only. In the mockups every styled link carried an inline
   colour that this rule could never override; as classes they lose to
   `a:hover` (0,1,1 beats 0,1,0), which would paint CTA text gold on gold.
   Restricting the selector reproduces the mockup behaviour exactly. */
a:not([class]):hover,
a:not([class]):focus-visible { color: oklch(0.56 0.18 var(--axh)); }

/* Keyboard focus indicator, from the mockups' own accessibility layer (their
   applyA11y appended this rule unconditionally). Kept in CSS rather than
   injected by JS so it exists before any script runs. */
:focus-visible {
  outline: 3px solid oklch(0.62 0.17 var(--axh)) !important;
  outline-offset: 3px !important;
}

/* ===========================================================================
   Shared chrome: logo mark, navs, footers.
   ======================================================================== */
/* The app's logo (#664): ring icon plus "leanox.ai". The image carries
   the name, so there is no separate wordmark; height sets the size. */
.brand-logo { display: block; height: 40px; width: auto; }

.band-dark { background: oklch(0.30 0.07 var(--bgh)); color: oklch(0.97 0.01 var(--bgh)); }

.nav-landing {
  position: relative; max-width: 1120px; margin: 0 auto; padding: 22px 32px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
}
.nav-landing-brand { display: flex; align-items: center; gap: 12px; }
.nav-links { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.nav-landing .nav-links > a:not(.btn-primary) { color: oklch(0.85 0.04 var(--bgh)); font-size: 16px; }
.btn-nav { font-size: 16px; padding: 9px 18px; }

.nav-legal {
  max-width: 1080px; margin: 0 auto; padding: 20px 32px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap;
}
.nav-legal-logo { color: oklch(0.97 0.01 var(--bgh)); display: flex; align-items: center; gap: 10px; }
.nav-legal-logo:hover { color: oklch(0.97 0.01 var(--bgh)); }
.nav-legal-logo .brand-logo { height: 34px; }
.nav-legal .nav-links > a:not(.btn-primary) { color: oklch(0.85 0.04 var(--bgh)); font-size: 14px; }
.btn-nav-sm { font-size: 14px; padding: 9px 18px; }

.footer-landing {
  max-width: 1120px; margin: 0 auto; padding: 26px 32px 88px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap; font-size: 15px; color: oklch(0.50 0.02 var(--bgh));
}
.footer-legal {
  max-width: 1080px; margin: 48px auto 0; padding: 40px 32px 92px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; flex-wrap: wrap; font-size: 13px; color: oklch(0.50 0.02 var(--bgh));
  border-top: 1px solid oklch(0.90 0.02 var(--bgh));
}
.footer-brand { display: flex; align-items: center; gap: 10px; }
.footer-landing .brand-logo { height: 28px; }
.footer-legal .brand-logo { height: 24px; }
.footer-links {
  font-family: "Roboto Mono", ui-monospace, monospace; letter-spacing: 0.08em;
  display: flex; gap: 18px; flex-wrap: wrap; align-items: center;
}
.cookie-settings-btn {
  font-family: "Roboto Mono", ui-monospace, monospace; letter-spacing: 0.08em;
  background: none; border: none; padding: 0; cursor: pointer;
  color: oklch(0.45 0.13 var(--bgh));
}
.footer-landing .cookie-settings-btn { font-size: 15px; }
.footer-legal .cookie-settings-btn { font-size: 13px; }
.cookie-settings-btn:hover,
.cookie-settings-btn:focus-visible { color: oklch(0.56 0.18 var(--axh)); }

/* ===========================================================================
   Cookie consent card (mockup #om-cookie, verbatim styles).
   ======================================================================== */
.cookie-card {
  position: fixed; bottom: 82px; left: 22px; z-index: 61;
  width: min(380px, calc(100vw - 44px));
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid oklch(0.86 0.03 var(--bgh));
  border-radius: 16px; box-shadow: 0 12px 36px oklch(0.24 0.04 var(--bgh) / 0.22);
  font-family: "Public Sans", Helvetica, sans-serif; overflow: hidden;
}
.cookie-card[hidden] { display: none; }
.cookie-view { display: flex; flex-direction: column; gap: 14px; padding: 20px; }
.cookie-view[hidden] { display: none; }
.cookie-title { font-size: 16px; font-weight: 700; color: oklch(0.30 0.07 var(--bgh)); }
.cookie-text { margin: 0; font-size: 14.5px; line-height: 1.55; color: oklch(0.36 0.02 var(--bgh)); }
.cookie-btn-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cookie-btn-row-divided { border-top: 1px solid oklch(0.92 0.02 var(--bgh)); padding-top: 12px; }
.cookie-btn-primary {
  background: oklch(0.56 0.18 var(--axh)); color: oklch(0.99 0.01 var(--axh));
  border: 1px solid oklch(0.56 0.18 var(--axh)); border-radius: 9px;
  padding: 12px 10px; font-size: 14.5px; font-weight: 700; cursor: pointer;
  font-family: "Public Sans", Helvetica, sans-serif;
}
.cookie-btn-secondary {
  background: oklch(0.95 0.01 var(--bgh)); color: oklch(0.30 0.04 var(--bgh));
  border: 1px solid oklch(0.86 0.03 var(--bgh)); border-radius: 9px;
  padding: 12px 10px; font-size: 14.5px; font-weight: 700; cursor: pointer;
  font-family: "Public Sans", Helvetica, sans-serif;
}
.cookie-link-btn {
  background: none; border: none; padding: 0; font-size: 14px; cursor: pointer;
  color: oklch(0.45 0.13 var(--bgh)); text-align: left;
  font-family: "Public Sans", Helvetica, sans-serif;
}
.cookie-link-btn:hover,
.cookie-link-btn:focus-visible { color: oklch(0.56 0.18 var(--axh)); }
.cookie-row { display: flex; flex-direction: column; gap: 6px; border-top: 1px solid oklch(0.92 0.02 var(--bgh)); padding-top: 12px; }
.cookie-row-toggle { gap: 8px; }
.cookie-row-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cookie-row-name { font-size: 14.5px; font-weight: 700; color: oklch(0.32 0.04 var(--bgh)); }
.cookie-always {
  font-family: "Roboto Mono", ui-monospace, monospace; font-size: 12px;
  letter-spacing: 0.08em; text-transform: uppercase; color: oklch(0.50 0.04 var(--bgh));
}
.cookie-row-desc { margin: 0; font-size: 13.5px; line-height: 1.5; color: oklch(0.42 0.02 var(--bgh)); }
.cookie-toggle {
  background: oklch(0.95 0.01 var(--bgh)); color: oklch(0.30 0.04 var(--bgh));
  border: 1px solid oklch(0.86 0.03 var(--bgh)); border-radius: 999px;
  padding: 7px 16px; font-size: 13px; font-weight: 700; cursor: pointer;
  min-width: 62px; font-family: "Public Sans", Helvetica, sans-serif;
}
.cookie-toggle.is-on { background: oklch(0.56 0.18 var(--axh)); color: oklch(0.99 0.01 var(--axh)); }
.cookie-note { margin: 0; font-size: 13px; color: oklch(0.48 0.02 var(--bgh)); }

/* ===========================================================================
   Accessibility widget (mockup fixed button + RTL panel, verbatim styles).
   ======================================================================== */
.a11y-fab {
  position: fixed; bottom: 22px; left: 22px; z-index: 60; border-radius: 999px;
  border: 2px solid oklch(0.99 0.01 var(--axh)); background: oklch(0.30 0.07 var(--bgh));
  color: oklch(0.99 0.01 var(--axh)); font-size: 15px; font-weight: 700;
  letter-spacing: 0.02em; cursor: pointer; display: flex; align-items: center;
  gap: 9px; padding: 12px 20px; box-shadow: 0 6px 20px oklch(0.24 0.04 var(--bgh) / 0.35);
  font-family: "Public Sans", Helvetica, sans-serif;
}
.a11y-fab:hover,
.a11y-fab:focus-visible { background: oklch(0.56 0.18 var(--axh)); }
.a11y-panel {
  position: fixed; bottom: calc(90px + var(--cookie-h, 0px)); left: 22px; z-index: 60;
  width: 286px; box-sizing: border-box;
  max-height: calc(100vh - 106px - var(--cookie-h, 0px)); overflow-y: auto;
  display: flex; flex-direction: column; gap: 16px; background: #fff;
  border: 1px solid oklch(0.86 0.03 var(--bgh)); border-radius: 16px; padding: 20px;
  box-shadow: 0 12px 36px oklch(0.24 0.04 var(--bgh) / 0.22);
  direction: rtl; text-align: right;
  font-family: "Public Sans", Helvetica, sans-serif;
}
.a11y-panel[hidden] { display: none; }
.a11y-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.a11y-title { font-size: 17px; font-weight: 700; color: oklch(0.30 0.07 var(--bgh)); }
.a11y-close {
  background: none; border: none; font-size: 20px; line-height: 1; cursor: pointer;
  color: oklch(0.45 0.04 var(--bgh)); padding: 2px 4px;
}
.a11y-group { display: flex; flex-direction: column; gap: 8px; }
.a11y-label { font-size: 13.5px; font-weight: 700; letter-spacing: 0.04em; color: oklch(0.45 0.04 var(--bgh)); }
.a11y-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.a11y-step-btn {
  background: oklch(0.95 0.01 var(--bgh)); color: oklch(0.30 0.04 var(--bgh));
  border: 1px solid oklch(0.88 0.03 var(--bgh)); border-radius: 9px; padding: 11px 0;
  font-size: 15px; font-weight: 700; cursor: pointer;
  font-family: "Public Sans", Helvetica, sans-serif;
}
.a11y-toggle-btn {
  background: oklch(0.95 0.01 var(--bgh)); color: oklch(0.30 0.04 var(--bgh));
  border: 1px solid oklch(0.88 0.03 var(--bgh)); border-radius: 9px; padding: 12px 14px;
  font-size: 15px; font-weight: 600; cursor: pointer; text-align: right;
  font-family: "Public Sans", Helvetica, sans-serif;
}
.a11y-step-btn.is-on,
.a11y-toggle-btn.is-on { background: oklch(0.56 0.18 var(--axh)); color: oklch(0.99 0.01 var(--axh)); }
.a11y-footer { display: flex; flex-direction: column; gap: 10px; border-top: 1px solid oklch(0.90 0.02 var(--bgh)); padding-top: 14px; }
.a11y-reset {
  background: none; border: 1px solid oklch(0.82 0.03 var(--bgh)); border-radius: 9px;
  padding: 10px 14px; font-size: 14.5px; font-weight: 600; cursor: pointer;
  color: oklch(0.35 0.04 var(--bgh)); text-align: right;
  font-family: "Public Sans", Helvetica, sans-serif;
}
/* generated from mockup by convert.py — prefix lp */
.lp-1 { background:oklch(0.30 0.07 var(--bgh));color:oklch(0.97 0.01 var(--bgh));position:relative;overflow:hidden; }
.lp-2 { position:absolute;inset:0;background-image:repeating-linear-gradient(90deg,oklch(0.36 0.06 var(--bgh)) 0 1px,transparent 1px 72px),repeating-linear-gradient(0deg,oklch(0.36 0.06 var(--bgh)) 0 1px,transparent 1px 72px);pointer-events:none; }
.lp-3 { position:absolute;top:-180px;right:-140px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,oklch(0.56 0.18 var(--axh) / 0.30),transparent 68%);pointer-events:none; }
.lp-4 { position:relative;max-width:1120px;margin:0 auto;padding:22px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap; }
.lp-5 { display:flex;align-items:center;gap:12px; }
.lp-6 { width:16px;height:16px;border-radius:4px;background:oklch(0.56 0.18 var(--axh));display:block; }
.lp-7 { font-size:20px;font-weight:800;letter-spacing:0.14em; }
.lp-8 { display:flex;align-items:center;gap:22px;flex-wrap:wrap; }
.lp-9 { color:oklch(0.85 0.04 var(--bgh));font-size:16px; }
.lp-10 { background:oklch(0.56 0.18 var(--axh));color:oklch(0.99 0.01 var(--axh));font-size:16px;font-weight:600;padding:9px 18px;border-radius:999px; }
.lp-11 { position:relative;max-width:1120px;margin:0 auto;padding:64px 32px 40px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px;align-items:center; }
.lp-12 { display:flex;flex-direction:column;gap:22px; }
.lp-13 { font-family:'Roboto Mono',ui-monospace,monospace;font-size:13px;letter-spacing:0.2em;text-transform:uppercase;color:oklch(0.78 0.09 var(--bgh)); }
.lp-14 { margin:0;font-family:Newsreader,Georgia,serif;font-size:clamp(38px,5.2vw,62px);line-height:1.06;font-weight:400;color:oklch(0.99 0.02 var(--bgh));text-wrap:balance; }
.lp-15 { margin:0;font-size:18px;line-height:1.65;color:oklch(0.90 0.03 var(--bgh));max-width:60ch; }
.lp-16 { display:flex;gap:12px;flex-wrap:wrap;margin-top:4px; }
.lp-17 { background:oklch(0.56 0.18 var(--axh));color:oklch(0.99 0.01 var(--axh));font-size:17px;font-weight:600;padding:13px 26px;border-radius:999px; }
.lp-17:hover, .lp-17:focus-visible { background:oklch(0.50 0.18 var(--axh)); }
.lp-18 { border:1px solid oklch(0.52 0.06 var(--bgh));color:oklch(0.93 0.03 var(--bgh));font-size:17px;font-weight:600;padding:13px 26px;border-radius:999px; }
.lp-18:hover, .lp-18:focus-visible { border-color:oklch(0.75 0.08 var(--bgh));color:#fff; }
.lp-19 { display:flex;flex-direction:column;gap:18px;min-width:0; }
.lp-20 { background:oklch(0.25 0.05 var(--bgh));border:1px solid oklch(0.38 0.06 var(--bgh));border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:14px;min-width:0; }
.lp-21 { font-family:'Roboto Mono',ui-monospace,monospace;font-size:12.5px;letter-spacing:0.18em;text-transform:uppercase;color:oklch(0.72 0.08 var(--bgh)); }
.lp-22 { margin:0;font-family:'Roboto Mono',ui-monospace,monospace;font-size:15px;line-height:1.8;color:oklch(0.92 0.03 var(--bgh));white-space:pre-wrap;word-break:break-word; }
.lp-23 { color:oklch(0.78 0.13 var(--bgh)); }
.lp-24 { color:oklch(0.80 0.13 var(--axh)); }
.lp-25 { display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:10px;font-family:'Roboto Mono',ui-monospace,monospace;font-size:11.5px;letter-spacing:0.08em;text-transform:uppercase; }
.lp-26 { border:1px solid oklch(0.45 0.06 var(--bgh));border-radius:10px;padding:14px 8px;text-align:center;color:oklch(0.88 0.03 var(--bgh)); }
.lp-27 { color:oklch(0.70 0.12 var(--axh));font-size:16px; }
.lp-28 { background:oklch(0.56 0.18 var(--axh));color:oklch(0.99 0.01 var(--axh));border-radius:10px;padding:14px 8px;text-align:center;font-weight:700; }
.lp-29 { border:1px solid oklch(0.45 0.06 var(--bgh));border-radius:10px;padding:14px 8px;text-align:center;color:oklch(0.88 0.03 var(--bgh));line-height:1.5; }
.lp-30 { position:relative;max-width:1120px;margin:0 auto;padding:12px 32px 64px; }
.lp-31 { border-top:1px solid oklch(0.40 0.06 var(--bgh));padding-top:28px;display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:40px;align-items:center; }
.lp-32 { display:flex;flex-direction:column;gap:6px; }
.lp-33 { font-family:'Roboto Mono',ui-monospace,monospace;font-size:11.5px;letter-spacing:0.2em;text-transform:uppercase;color:oklch(0.78 0.09 var(--bgh)); }
.lp-34 { font-family:Newsreader,Georgia,serif;font-size:44px;line-height:1;color:oklch(0.99 0.02 var(--bgh)); }
.lp-35 { display:flex;flex-direction:column;gap:12px; }
.lp-36 { display:grid;grid-template-columns:110px 1fr;gap:14px;align-items:center; }
.lp-37 { font-family:'Roboto Mono',ui-monospace,monospace;font-size:11.5px;letter-spacing:0.08em;text-transform:uppercase;color:oklch(0.80 0.04 var(--bgh)); }
.lp-38 { height:22px;border-radius:4px;background:oklch(0.52 0.07 var(--bgh));display:block; }
.lp-39 { display:block; }
.lp-40 { height:22px;width:10%;min-width:24px;border-radius:4px;background:oklch(0.62 0.17 var(--axh));display:block; }
.lp-41 { background:oklch(0.955 0.016 var(--bgh));border-bottom:1px solid oklch(0.90 0.02 var(--bgh)); }
.lp-42 { max-width:1120px;margin:0 auto;padding:var(--secpad,72px) 32px 8px;display:flex;flex-direction:column;gap:34px; }
.lp-43 { margin:0;font-family:Newsreader,Georgia,serif;font-size:34px;font-weight:500;color:oklch(0.32 0.08 var(--bgh));text-wrap:balance; }
.lp-44 { display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px; }
.lp-45 { background:#fff;border:1px solid oklch(0.90 0.02 var(--bgh));border-radius:14px;padding:var(--cardpad,26px);display:flex;flex-direction:column;gap:14px; }
.lp-46 { display:flex;gap:6px;align-items:flex-end;height:40px; }
.lp-47 { width:16px;height:14px;border-radius:3px;background:oklch(0.86 0.04 var(--bgh));display:block; }
.lp-48 { width:16px;height:34px;border-radius:3px;background:oklch(0.56 0.18 var(--axh));display:block; }
.lp-49 { width:16px;height:26px;border-radius:3px;background:oklch(0.56 0.18 var(--axh));display:block; }
.lp-50 { margin:0;font-size:19px;font-weight:700;color:oklch(0.32 0.08 var(--bgh)); }
.lp-51 { margin:0;font-size:16.5px;color:oklch(0.36 0.02 var(--bgh)); }
.lp-52 { display:flex;flex-direction:column;justify-content:center;gap:8px;height:40px; }
.lp-53 { height:10px;border-radius:5px;background:oklch(0.88 0.03 var(--bgh));overflow:hidden; }
.lp-54 { display:block;height:100%;width:38%;border-radius:5px;background:oklch(0.80 0.06 var(--bgh)); }
.lp-55 { display:block;height:100%;width:76%;border-radius:5px;background:oklch(0.56 0.18 var(--axh)); }
.lp-56 { display:flex;gap:8px;align-items:center;height:40px; }
.lp-57 { width:40px;height:40px;border-radius:50%;border:4px solid oklch(0.56 0.18 var(--axh));border-right-color:oklch(0.88 0.03 var(--bgh));border-bottom-color:oklch(0.88 0.03 var(--bgh));display:block; }
.lp-58 { font-family:'Roboto Mono',ui-monospace,monospace;font-size:13px;letter-spacing:0.08em;color:oklch(0.45 0.05 var(--bgh)); }
.lp-59 { max-width:1120px;margin:0 auto;padding:var(--secpad,64px) 32px 8px;display:flex;flex-direction:column;gap:30px; }
.lp-60 { margin:0;font-family:Newsreader,Georgia,serif;font-size:34px;font-weight:500;color:oklch(0.32 0.08 var(--bgh)); }
.lp-61 { background:#fff;border:1px solid oklch(0.90 0.02 var(--bgh));border-radius:14px;padding:var(--cardpad,26px);display:flex;flex-direction:column;gap:14px;position:relative; }
.lp-62 { width:36px;height:36px;border-radius:50%;background:oklch(0.56 0.18 var(--axh));color:#fff;font-size:17px;font-weight:700;display:flex;align-items:center;justify-content:center; }
.lp-63 { flex:1;height:2px;background:repeating-linear-gradient(90deg,oklch(0.85 0.04 var(--bgh)) 0 8px,transparent 8px 14px);display:block; }
.lp-64 { margin:0;font-size:16.5px;color:oklch(0.30 0.03 var(--bgh)); }
.lp-65 { flex:1;height:2px;background:oklch(0.56 0.18 var(--axh));opacity:0.35;display:block; }
.lp-66 { max-width:1120px;margin:0 auto;padding:var(--secpad,64px) 32px 8px;display:flex;flex-direction:column;gap:18px; }
.lp-67 { margin:0;font-size:17px;color:oklch(0.36 0.02 var(--bgh));max-width:70ch; }
.lp-68 { display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:8px; }
.lp-69 { border:1px solid oklch(0.88 0.03 var(--bgh));border-radius:14px;padding:var(--cardpad,22px);display:flex;flex-direction:column;gap:10px;background:#fff; }
.lp-70 { display:flex;align-items:center;justify-content:space-between;gap:10px; }
.lp-71 { font-size:18px;font-weight:700;color:oklch(0.30 0.07 var(--bgh)); }
.lp-72 { display:flex;gap:4px; }
.lp-73 { width:9px;height:9px;border-radius:50%;background:oklch(0.56 0.18 var(--axh));display:block; }
.lp-74 { height:4px;border-radius:2px;background:oklch(0.56 0.18 var(--axh)); }
.lp-75 { font-size:14px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:oklch(0.45 0.14 var(--bgh)); }
.lp-76 { margin:0;font-size:16px;color:oklch(0.38 0.02 var(--bgh)); }
.lp-77 { width:9px;height:9px;border-radius:50%;border:1px solid oklch(0.80 0.04 var(--bgh));display:block; }
.lp-78 { height:4px;border-radius:2px;background:linear-gradient(90deg,oklch(0.60 0.15 var(--axh)) 60%,oklch(0.90 0.02 var(--bgh)) 60%); }
.lp-79 { font-size:14px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:oklch(0.50 0.16 var(--axh)); }
.lp-80 { height:4px;border-radius:2px;background:linear-gradient(90deg,oklch(0.60 0.15 var(--axh)) 35%,oklch(0.90 0.02 var(--bgh)) 35%); }
.lp-81 { height:72px; }
.lp-82 { background:oklch(0.56 0.18 var(--axh));color:oklch(0.99 0.01 var(--axh));position:relative;overflow:hidden; }
.lp-83 { position:absolute;inset:0;background-image:repeating-linear-gradient(135deg,oklch(0.99 0.01 var(--axh) / 0.10) 0 1px,transparent 1px 16px);pointer-events:none; }
.lp-84 { position:relative;max-width:1120px;margin:0 auto;padding:56px 32px;display:flex;align-items:center;justify-content:space-between;gap:36px;flex-wrap:wrap; }
.lp-85 { display:flex;flex-direction:column;gap:10px;min-width:280px;flex:1; }
.lp-86 { margin:0;font-size:21px;max-width:62ch;display:flex;flex-direction:column;gap:4px; }
.lp-87 { background:oklch(0.99 0.01 var(--axh));color:oklch(0.45 0.18 var(--axh));font-size:18px;font-weight:700;padding:15px 30px;border-radius:999px;white-space:nowrap; }
.lp-87:hover, .lp-87:focus-visible { background:oklch(0.95 0.03 var(--axh)); }

/* ===========================================================================
   Responsive rules (ours — the mockups define desktop only; issue #337 §10).
   Landing: hero 2-col -> 1-col; savings bar 2-col -> 1-col; tighter padding.
   ======================================================================== */
@media (max-width: 1024px) {
  .lp-11 { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 768px) {
  .lp-11 { padding: 48px 20px 32px; }
  .lp-30 { padding: 12px 20px 48px; }
  .lp-31 { grid-template-columns: 1fr; gap: 24px; }
  .lp-42, .lp-59, .lp-66 { padding-left: 20px; padding-right: 20px; }
  .lp-84 { padding: 44px 20px; }
  .nav-landing { padding: 18px 20px; }
  .footer-landing { padding: 26px 20px 88px; }
}
@media (max-width: 480px) {
  .nav-landing .nav-links { gap: 14px; }
  .lp-16 { flex-direction: column; align-items: stretch; }
  .lp-16 a { text-align: center; }
  .lp-25 { gap: 6px; font-size: 10.5px; }
  .lp-86 { font-size: 18px; }
}
/* generated from mockups by convert.py — prefix legal */
.legal-1 { background:oklch(0.30 0.07 255);color:oklch(0.97 0.01 255); }
.legal-2 { max-width:1080px;margin:0 auto;padding:20px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap; }
.legal-3 { color:oklch(0.97 0.01 255);display:flex;align-items:center;gap:10px; }
.legal-4 { width:14px;height:14px;border-radius:4px;background:oklch(0.56 0.18 75);display:block; }
.legal-5 { font-size:18px;font-weight:800;letter-spacing:0.14em; }
.legal-6 { display:flex;align-items:center;gap:22px;flex-wrap:wrap; }
.legal-7 { color:oklch(0.85 0.04 255);font-size:14px; }
.legal-8 { background:oklch(0.56 0.18 75);color:oklch(0.99 0.01 75);font-size:14px;font-weight:600;padding:9px 18px;border-radius:999px; }
.legal-9 { max-width:1080px;margin:0 auto;padding:48px 32px 56px;display:flex;flex-direction:column;gap:14px; }
.legal-10 { margin:0;font-family:Newsreader,Georgia,serif;font-size:clamp(34px,4.6vw,52px);line-height:1.1;font-weight:400;color:oklch(0.99 0.02 255); }
.legal-11 { font-size:16px;color:oklch(0.88 0.03 255); }
.legal-12 { font-family:'Roboto Mono',ui-monospace,monospace;font-size:13px;letter-spacing:0.1em;text-transform:uppercase;color:oklch(0.78 0.09 255); }
.legal-13 { max-width:760px;margin:0 auto;padding:56px 32px 24px;display:flex;flex-direction:column;gap:40px;font-size:16px; }
.legal-14 { display:flex;flex-direction:column;gap:12px; }
.legal-15 { margin:0;font-family:Newsreader,Georgia,serif;font-size:26px;font-weight:600;color:oklch(0.32 0.08 255); }
.legal-16 { margin:0; }
.legal-17 { margin:8px 0 0;font-size:17px;font-weight:700;color:oklch(0.32 0.08 255); }
.legal-18 { margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px; }
.legal-19 { margin:0;background:oklch(0.965 0.012 255);border-left:4px solid oklch(0.58 0.16 255);padding:18px 20px; }
.legal-20 { margin:0;background:oklch(0.965 0.012 255);border-left:4px solid oklch(0.58 0.16 255);padding:18px 20px;font-size:14.5px;line-height:1.6; }
.legal-21 { margin:0;padding-left:22px;display:flex;flex-direction:column;gap:8px; }

/* Legal pages: the mockups' #om-content wrapper sets line-height 1.65. */
.legal-lh { line-height: 1.65; }

/* Legal pages responsive (ours — mockups are desktop-only; issue #337 §10). */
@media (max-width: 768px) {
  .nav-legal { padding: 18px 20px; }
  /* Direct child only: the legal pages' content <main>. The 404's <main>
     sits inside the dark band and keeps that band's own padding. */
  .legal-lh > main { padding-left: 20px; padding-right: 20px; }
  .footer-legal { padding: 40px 20px 92px; }
}

/* ===========================================================================
   Team page (issue #618). No mockup for this one — it reuses the legal
   masthead (legal-1/9/10/11) and only the card grid below is new.
   Wider than the legal 760px reading column because three cards sit abreast.
   ======================================================================== */
.team-grid {
  max-width: 1020px; margin: 0 auto; padding: 48px 32px 56px;
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
  /* stretch, not start: Eran's bio is much longer than Yotam's, and equal
     card heights keep the row from going ragged. */
  align-items: stretch;
}
.team-card {
  background: #fff;
  border: 1px solid oklch(0.88 0.025 var(--bgh));
  border-radius: 14px;
  padding: 24px;
  display: flex; flex-direction: column; align-items: center;
  gap: 11px; text-align: center;
}
.team-photo {
  width: 140px; height: 140px; border-radius: 999px;
  /* The files are square 280px crops, but object-fit guards against a
     future replacement photo that is not. */
  object-fit: cover; object-position: center top;
  border: 1px solid oklch(0.88 0.03 var(--bgh));
}
.team-name {
  margin: 0; font-family: Newsreader, Georgia, serif;
  font-size: 20px; font-weight: 600; color: oklch(0.32 0.08 var(--bgh));
}
/* Gold on white measures 4.75:1 against the card — over the 4.5 AA floor for
   body-size text, but not by much, so contrast.spec.ts pins it. */
.team-role {
  font-family: 'Roboto Mono', ui-monospace, monospace;
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
  color: oklch(0.56 0.14 var(--axh));
}
.team-bio {
  margin: 0; font-size: 14px; line-height: 1.62;
  color: oklch(0.34 0.02 var(--bgh)); text-align: left;
}
.team-lede { color: oklch(0.28 0.04 var(--bgh)); font-weight: 600; }

@media (max-width: 768px) {
  .team-grid {
    grid-template-columns: 1fr; gap: 16px;
    padding-top: 32px; padding-bottom: 40px;
  }
}

/* User guide (/guide/, #567): reuses the legal page shell; these cover the
   parts a legal page never needed — contents, code samples, tables and
   screenshot slots. Colours follow the legal palette (hue 255) and the
   landing page's dark code card (.lp-20/.lp-22). */
.guide-toc { background:oklch(0.965 0.012 255);border-radius:14px;padding:20px 24px; }
.guide-toc-title { font-family:'Roboto Mono',ui-monospace,monospace;font-size:12.5px;letter-spacing:0.18em;text-transform:uppercase;color:oklch(0.45 0.08 255);margin-bottom:8px; }
.guide-toc ol { margin:0;padding-left:22px;display:flex;flex-direction:column;gap:4px; }
.legal-13 code { font-family:'Roboto Mono',ui-monospace,monospace;font-size:0.88em;background:oklch(0.955 0.015 255);padding:1px 5px;border-radius:4px;overflow-wrap:anywhere; }
.guide-table { width:100%;border-collapse:collapse;font-size:15px; }
.guide-table th, .guide-table td { text-align:left;vertical-align:top;padding:8px 10px;border-bottom:1px solid oklch(0.90 0.02 255); }
.guide-table th { font-weight:700;color:oklch(0.32 0.08 255);border-bottom-width:2px; }
@media (max-width: 768px) {
  .guide-table { font-size:14px; }
  .guide-table th, .guide-table td { padding:6px; }
}

/* Guide landing cards, section bar and previous/next links. */
.guide-crumb a { color:inherit;text-decoration:none; }
.guide-crumb a:hover { text-decoration:underline; }
/* min(): below 300px of room (320px phones, zoom) one column fills what there is. */
.guide-cards { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:16px; }
.guide-card { display:flex;flex-direction:column;gap:6px;padding:22px 24px;border:1px solid oklch(0.88 0.02 255);border-radius:14px;background:oklch(0.99 0.004 255);color:inherit;text-decoration:none;transition:border-color .15s,box-shadow .15s; }
.guide-card:hover { border-color:oklch(0.58 0.16 255);box-shadow:0 4px 18px oklch(0.30 0.07 255 / 0.10); }
.guide-card-title { font-family:Newsreader,Georgia,serif;font-size:22px;font-weight:600;color:oklch(0.32 0.08 255); }
.guide-card-text { font-size:15px;color:oklch(0.42 0.04 255); }
.guide-sections { display:flex;flex-wrap:wrap;gap:8px; }
.guide-sections a { font-size:14px;padding:6px 14px;border-radius:999px;border:1px solid oklch(0.88 0.02 255);color:oklch(0.32 0.08 255);text-decoration:none; }
.guide-sections a[aria-current="page"] { background:oklch(0.30 0.07 255);border-color:oklch(0.30 0.07 255);color:oklch(0.99 0.01 255); }
.guide-pager { display:flex;justify-content:space-between;gap:16px;border-top:1px solid oklch(0.90 0.02 255);padding-top:24px; }
.guide-pager a { display:flex;flex-direction:column;gap:2px;font-weight:600;color:oklch(0.32 0.08 255);text-decoration:none; }
.guide-pager a span { font-family:'Roboto Mono',ui-monospace,monospace;font-size:12px;font-weight:400;letter-spacing:0.12em;text-transform:uppercase;color:oklch(0.50 0.06 255); }
.guide-pager-next { margin-left:auto;text-align:right; }

/* Code samples (Google Cloud docs style): tab bar with a copy button over a
   light code well. Unenhanced, each panel shows its own label instead. */
.code-sample { border:1px solid oklch(0.88 0.02 255);border-radius:10px;overflow:hidden;background:oklch(0.975 0.006 255);min-width:0; }
.code-sample-bar { display:flex;align-items:flex-end;justify-content:space-between;gap:8px;border-bottom:1px solid oklch(0.88 0.02 255);background:oklch(0.99 0.004 255);padding:0 8px 0 4px; }
.code-sample-tabs { display:flex;flex-wrap:wrap; }
.code-sample-tab { font:inherit;font-size:14px;background:none;border:0;border-bottom:2px solid transparent;padding:10px 14px 8px;color:oklch(0.45 0.04 255);cursor:pointer; }
.code-sample-tab:hover { color:oklch(0.32 0.08 255); }
.code-sample-tab[aria-selected="true"] { color:oklch(0.45 0.16 255);border-bottom-color:oklch(0.52 0.17 255);font-weight:600; }
.code-sample-copy { font:inherit;font-size:13px;align-self:center;background:none;border:1px solid oklch(0.85 0.02 255);border-radius:6px;padding:4px 10px;color:oklch(0.40 0.06 255);cursor:pointer; }
.code-sample-copy:hover { background:oklch(0.95 0.01 255); }
.code-sample-panel::before { content:attr(data-label);display:block;padding:8px 16px 0;font-family:'Roboto Mono',ui-monospace,monospace;font-size:12px;letter-spacing:0.1em;text-transform:uppercase;color:oklch(0.50 0.06 255); }
.code-sample.is-enhanced .code-sample-panel::before { content:none; }
.code-sample-panel + .code-sample-panel { border-top:1px solid oklch(0.90 0.02 255); }
.code-sample.is-enhanced .code-sample-panel + .code-sample-panel { border-top:0; }
.code-sample pre { margin:0;padding:14px 16px;overflow-x:auto; }
.code-sample pre:focus-visible { outline:2px solid oklch(0.52 0.17 255);outline-offset:-2px; }
.code-sample pre code { background:none;padding:0;font-size:13.5px;line-height:1.65;color:oklch(0.25 0.03 255);overflow-wrap:normal;tab-size:4; }
.tok-keyword { color:oklch(0.45 0.18 300); }
.tok-string { color:oklch(0.48 0.13 150); }
.tok-comment { color:oklch(0.55 0.02 255);font-style:italic; }
.tok-number { color:oklch(0.52 0.15 40); }
.tok-flag { color:oklch(0.45 0.14 255); }

/* Provider picker: level one of the "Send your first request" examples. Enhanced, it is a tab row
   in the same style as the language tabs, stacked directly on top of the
   chosen sample so the two levels read as one box; each option's own heading
   is hidden. Unenhanced, every option shows with its heading. */
.provider-tabs { display:flex;flex-wrap:wrap;border:1px solid oklch(0.88 0.02 255);border-bottom:0;border-radius:10px 10px 0 0;background:oklch(0.99 0.004 255);padding:0 4px; }
.provider-tab { font:inherit;font-size:14px;background:none;border:0;border-bottom:2px solid transparent;padding:10px 14px 8px;color:oklch(0.45 0.04 255);cursor:pointer; }
.provider-tab:hover { color:oklch(0.32 0.08 255); }
.provider-tab[aria-selected="true"] { color:oklch(0.45 0.16 255);border-bottom-color:oklch(0.52 0.17 255);font-weight:600; }
.provider-option { display:flex;flex-direction:column;gap:12px; }
.provider-option + .provider-option { margin-top:24px; }
.provider-picker.is-enhanced .provider-option { margin-top:0; }
.provider-picker.is-enhanced .provider-option > h3 { display:none; }
.provider-picker.is-enhanced .code-sample { border-top-left-radius:0;border-top-right-radius:0; }
.provider-option[hidden] { display:none; }

/* Guide screenshots: the dashboard captured at 2x, framed like a window. */
.guide-figure { margin:4px 0;display:flex;flex-direction:column;gap:8px; }
.guide-figure img { display:block;max-width:100%;height:auto;border:1px solid oklch(0.88 0.02 255);border-radius:10px;box-shadow:0 6px 24px oklch(0.30 0.07 255 / 0.08);background:oklch(0.98 0.006 255); }
.guide-figure figcaption { font-size:14px;color:oklch(0.45 0.04 255); }

/* The shared Contact us pop-up (#669), in the site's own colours and type. */
leanox-contact-form {
  --lcf-font: "Public Sans", Helvetica, sans-serif;
  --lcf-text: oklch(0.24 0.02 var(--bgh));
  --lcf-muted: oklch(0.42 0.03 var(--bgh));
  --lcf-label: oklch(0.32 0.08 var(--bgh));
  --lcf-border: oklch(0.85 0.03 var(--bgh));
  --lcf-bg: oklch(0.99 0.006 var(--bgh));
  --lcf-field-bg: #fff;
  --lcf-accent: oklch(0.56 0.18 var(--axh));
  --lcf-accent-text: oklch(0.99 0.01 var(--axh));
  --lcf-focus: oklch(0.52 0.17 var(--bgh));
  --lcf-radius: 10px;
  --lcf-title-font: Newsreader, Georgia, serif;
  --lcf-title-color: oklch(0.32 0.08 var(--bgh));
  --lcf-title-size: 28px;
  --lcf-backdrop: oklch(0.20 0.04 var(--bgh) / 0.55);
}

/* #669: /contact/ without JavaScript, where the pop-up cannot open. */
.contact-noscript { margin:0;padding:14px 20px;text-align:center;font-size:16px;background:oklch(0.97 0.03 var(--axh));color:oklch(0.24 0.02 var(--bgh)); }