/* Wood Blocks Brand Kit — tokens.css (generated from tokens.json) */
/* Set <html data-theme="dark"> or "light". Fonts: Unbounded 700, Figtree 400/500/700 from Google Fonts. */
/* Brand fonts, self-hosted (assets/fonts): Unbounded 700 and Figtree 400/500/700, Latin and Latin Extended.
 * Browsers only download the file for the characters a page actually uses. */
/* Figtree 400, latin-ext */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/figtree-latin-ext.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
/* Figtree 400, latin */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/figtree-latin.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; }
/* Figtree 500, latin-ext */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 500; font-display: swap; src: url('/assets/fonts/figtree-latin-ext.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
/* Figtree 500, latin */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 500; font-display: swap; src: url('/assets/fonts/figtree-latin.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; }
/* Figtree 700, latin-ext */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/figtree-latin-ext.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
/* Figtree 700, latin */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/figtree-latin.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; }
/* Unbounded 700, latin-ext */
@font-face { font-family: 'Unbounded'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/unbounded-latin-ext.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
/* Unbounded 700, latin */
@font-face { font-family: 'Unbounded'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/unbounded-latin.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; }

:root, [data-theme="dark"] {
  --bg: #161A17;
  --surface-1: #1E231F;
  --surface-2: #262C27;
  --surface-3: #30382F;
  --surface-brand: #232A24;
  --border: #3A4436;
  --border-strong: #5F6B59;
  --border-on-brand: #6B7864;
  --ink: #E7EDE0;
  --ink-muted: #B9C4AF;
  --ink-subtle: #8E9886;
  --ink-on-brand: #E7EDE0;
  --ink-on-brand-muted: #B9C4AF;
  --accent: #F2A33A;
  --accent-hover: #F7B65E;
  --accent-ink: #F2A33A;
  --on-accent: #161A17;
  --lime: #9DBF5A;
  --lime-ink: #9DBF5A;
  --focus: #F2A33A;
  --success: #9DBF5A;
  --warning: #F2C94C;
  --danger: #F08A6E;
  --info: #8FC1D8;
  --cat-1: #F2A33A;
  --cat-2: #9DBF5A;
  --cat-3: #7DB8D6;
  --cat-4: #E8846A;
  --cat-5: #D9C38E;
  --cat-6: #6FB38A;
  --cat-7: #5FC2B8;
  --cat-8: #C49AD6;
  --cat-9: #E59AAE;
  --cat-10: #B9C4AF;
  --shadow-1: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-2: 0 12px 32px rgba(0,0,0,0.5);
  color-scheme: dark;
}

[data-theme="light"] {
  --bg: #F6F4EE;
  --surface-1: #FFFFFF;
  --surface-2: #EEEBE2;
  --surface-3: #E3DFD3;
  --surface-brand: #161A17;
  --border: #DCD8CC;
  --border-strong: #8C8A7E;
  --ink: #161A17;
  --ink-muted: #48513F;
  --ink-subtle: #646C5E;
  --accent-hover: #E0912A;
  --accent-ink: #9A5608;
  --lime-ink: #4A6B1A;
  --focus: #9A5608;
  --success: #3F6B1F;
  --warning: #8A6100;
  --danger: #B23A1E;
  --info: #2D6585;
  --cat-1: #B8670C;
  --cat-2: #557A1F;
  --cat-3: #2A6A8C;
  --cat-4: #B4502F;
  --cat-5: #8A6D2A;
  --cat-6: #2F7A4E;
  --cat-7: #1F7A71;
  --cat-8: #7A4A8F;
  --cat-9: #A8455F;
  --cat-10: #6B7362;
  --shadow-1: 0 1px 2px rgba(22,26,23,0.08);
  --shadow-2: 0 12px 32px rgba(22,26,23,0.14);
  color-scheme: light;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-xs: 4px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;
  --stroke-1: 1px;
  --stroke-2: 2px;
  --stroke-focus: 3px;
  --size-container: 1200px;
  --size-measure: 680px;
  --size-header: 72px;
  --size-target: 44px;
  --size-icon: 20px;
  --size-mark-min: 20px;
  --bp-sm: 480px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
  --font-display: Unbounded, "Arial Black", system-ui, sans-serif;
  --font-sans: Figtree, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.display-xl { font-family: var(--font-display); font-size: 64px; line-height: 68px; font-weight: 700; letter-spacing: -0.02em; }
.display-l { font-family: var(--font-display); font-size: 48px; line-height: 54px; font-weight: 700; letter-spacing: -0.02em; }
.h1 { font-family: var(--font-display); font-size: 40px; line-height: 46px; font-weight: 700; letter-spacing: -0.01em; }
.h2 { font-family: var(--font-display); font-size: 30px; line-height: 38px; font-weight: 700; }
.stat { font-family: var(--font-display); font-size: 48px; line-height: 52px; font-weight: 700; }
.h3 { font-family: var(--font-sans); font-size: 22px; line-height: 30px; font-weight: 700; }
.h4 { font-family: var(--font-sans); font-size: 18px; line-height: 26px; font-weight: 700; }
.body-l { font-family: var(--font-sans); font-size: 19px; line-height: 31px; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.body-s { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 400; }
.caption { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 500; }
.overline { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.button { font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 700; }
.nav { font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 500; }
