Skip to content

[Tokens]: Update non-universal platform tokens from Figma#1333

Open
aguscruiz wants to merge 7 commits into
mainfrom
non-universal-tokens-update
Open

[Tokens]: Update non-universal platform tokens from Figma#1333
aguscruiz wants to merge 7 commits into
mainfrom
non-universal-tokens-update

Conversation

@aguscruiz
Copy link
Copy Markdown
Collaborator

@aguscruiz aguscruiz commented Mar 5, 2026

Resolves #1332

Summary

  • Syncs non-universal design tokens from Figma for Android, iOS, browser, marketing, search, newtab, and AI platforms.
  • Android tokens restructured: font tokens flattened from size-based grouping (heading/large/default/small/x-small/monospace) to component-specific styles (top app bar). Shadow effects added.
  • iOS & marketing tokens updated with revised token hierarchies and values.
  • AI tokens: minor gradient color adjustments (two stops shifted from #697ee1 to #7686ec).
  • Search tokens: removed deprecated tokens and updated variables.
  • New file: marketing.variables.json added for marketing typography variables.
  • Storybook fix: browserFontTokens.stories.svelte had stories referencing large/default/small/xSmall font sub-groups that no longer exist after the token sync. Removed invalid stories and added a null guard in FontTokenSwatchGroup.svelte to prevent Object.entries(undefined) crashes.

Test plan

  • Run token build pipeline and verify generated output files are correct
  • Verify Storybook loads without errors (npm run storybook)
  • Confirm browser font token stories render correctly
  • Spot-check Android, iOS, marketing, and search generated token outputs

Made with Cursor

Sync latest token definitions for Android, iOS, browser, marketing,
search, newtab, and AI. Adds marketing.variables.json. Major structural
changes include flattened Android font tokens (removed size-based
grouping), updated iOS and marketing token hierarchies, and minor AI
gradient color adjustments.

Made-with: Cursor
Browser font tokens no longer have large/default/small/xSmall sub-groups
after the Figma sync. Remove the invalid stories from
browserFontTokens.stories and add a null guard in FontTokenSwatchGroup
so getTokens returns an empty array instead of throwing when tokens
are undefined.

Made-with: Cursor
The Figma token source uses SF Pro (Apple fonts) for all platforms.
The web pipeline already maps these to system-ui, but the Android
formatter was emitting them as-is, producing invalid @font/sf_pro_text
references.

Add androidFontFamily() to fontHelper.ts that maps:
- SF Pro variants -> Google Sans Flex
- SF Mono -> Google Sans Code

Use it in the Android fontStyle formatter so generated styles.xml
references the correct Android font resources.

Made-with: Cursor
The web font resolver mapped SF Pro to a system-ui stack but left
SF Mono as-is, which only resolves on macOS. Add a cross-platform
monospace fallback: 'SF Mono', ui-monospace, 'Cascadia Code',
'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace.

Made-with: Cursor
@fallaciousreasoning
Copy link
Copy Markdown
Collaborator

can you run npm run format @aguscruiz and commit the results?

@aguscruiz
Copy link
Copy Markdown
Collaborator Author

can you run npm run format @aguscruiz and commit the results?

Done!

@github-actions
Copy link
Copy Markdown
Contributor

[puLL-Merge] - brave/leo@1333

Description

This PR is a major design token update for the Brave Leo design system. It restructures and updates font/typography tokens across multiple platforms (Android, iOS, browser, marketing, new tab, search), updates color values in AI and search tokens, fixes a null-safety issue in the font token story helper, and adds a monospace font stack fallback. Key changes include:

  • Android tokens: Replaced the full 🤖 android font hierarchy (heading, large, default, small, x-small, monospace) with a minimal top app bar definition using "SF Pro Text", and added a bottom sheet shadow effect.
  • Browser tokens: Replaced the full 💻 browser font hierarchy with a single desktop.browser-menu-item token using "SF Pro Text", removed several shadow effects (url bar shadow, active tab shadow), and changed a browser frame shadow color.
  • iOS tokens: Completely restructured from 🍎 ios hierarchy (heading, large, default, small, x-small, monospace) to Apple's native iOS typography scale (large title, title1-3, headline, body, callout, subheadline, footnote, caption1-2) with regular/emphasized/italic variants, using "SF Pro" instead of "SF Pro Text/Display".
  • Marketing tokens: Restructured from marketing.💻 desktop/📱 mobile hierarchy to 🪩 marketing with a flattened structure. Changed primary font from "Poppins" to "Inter Variable", added new heading/body text size tiers, added a new marketing.variables.json for responsive font-size/line-height variables, and added monospace tokens.
  • New tab tokens: Changed font family from "Poppins" to "SF Pro Display", adjusted progress font size/line height, removed the ntp-overlay gradient.
  • Search tokens: Removed text.small, heading.h5, and heading.serpresult font tokens. Updated numerous color values across the palette. Restructured container-interactive to interactive.normal and interactive.pale.
  • Font helper: Added isSFMono detection and a monospace CSS font stack. Added androidFontFamily helper to map SF Pro → Google Sans Flex and SF Mono → Google Sans Code.
  • Storybook: Fixed null-safety in FontTokenSwatchGroup, removed browser font sub-stories, removed the new tab gradient stories file.

Possible Issues

  1. Breaking changes for consumers: This is a massively breaking change. All existing token references like font.🤖 android.heading.h1, font.💻 browser.large.regular, font.🍎 ios.default.regular, etc. are completely removed and replaced with incompatible new structures. Any downstream code consuming these tokens will break.

  2. Android tokens using SF Pro Text: The new android.tokens.json defines top app bar fonts with fontFamily: "SF Pro Text" — an Apple font that doesn't exist on Android. While the androidFontFamily helper maps this to "Google Sans Flex", this only works through the transformation pipeline. The raw token file could confuse developers reading it directly.

  3. Drastic reduction in Android and browser tokens: The Android tokens went from a comprehensive type scale (headings, body text at multiple sizes, monospace) to just 2 app bar styles. The browser tokens went from a full type scale to a single menu item style. This suggests either the rest of the tokens were moved elsewhere (not shown in this diff) or these platforms have lost their design token coverage.

  4. Missing mobile marketing display tokens in marketing.tokens.json: The old file had complete 📱 mobile primary and secondary display font definitions. The new file has a marketing.variables.json with font-size/line-height numbers for mobile, but the actual font definitions in marketing.tokens.json only cover desktop-sized display tokens. The mobile responsive behavior now relies on variable overrides rather than complete token definitions.

  5. Typo in iOS tokens: subheadline.emphaized italic should be emphasized italic (missing 's'). This appears in both the font and typography sections.

  6. Search token divider.strong value changed semantically: Changed from neutral.50 (#5e5e62, dark gray) to neutral.20 (#e4e4e5, light gray) in dark mode — this appears to be a significant visual change that could reduce contrast.

Changes

Changes

src/storyHelpers/FontTokenSwatchGroup.svelte

  • Added null-check for obj parameter in getTokens, returning empty array for null/undefined inputs

src/tokens/ai.tokens.json

  • Updated two AI gradient color stops from #697ee1ff to #7686ecff

src/tokens/android.tokens.json

  • Replaced entire 🤖 android font/typography hierarchy with minimal top app bar (default + large) using SF Pro Text
  • Added bottom sheet shadow effect with two drop shadows

src/tokens/browser.tokens.json

  • Replaced 💻 browser font/typography hierarchy with single desktop.browser-menu-item token (SF Pro Text, 13px)
  • Removed url bar shadow and active tab shadow effects
  • Changed browser frame inner shadow color from #ffffff52 to #ffffff33

src/tokens/browserFontTokens.stories.svelte

  • Removed individual story entries for Large, Default, Small, and Extra Small font groups

src/tokens/ios.tokens.json

  • Replaced 🍎 ios hierarchy with Apple's native type scale (large title through caption2)
  • Changed font family from SF Pro Text/Display to unified "SF Pro"
  • Added italic and "emphasized italic" variants throughout

src/tokens/marketing.tokens.json

  • Restructured from marketing.💻 desktop/📱 mobile to 🪩 marketing flat structure
  • Changed primary display font from Poppins to Inter Variable
  • Added heading tier (display1-3, h1-h4), x-large tier, and monospace tokens (SF Mono)
  • Adjusted letter spacing values throughout
  • Added paragraphSpacing: 8 to many tokens

src/tokens/marketing.variables.json (new file)

  • Responsive font-size and line-height variables for desktop/mobile, primary/secondary typefaces

src/tokens/newtab.tokens.json

  • Changed font family from Poppins to SF Pro Display
  • Changed progress fontSize from 24→22, lineHeight from 24→22
  • Removed ntp-overlay gradient

src/tokens/newtabGradientTokens.stories.svelte (deleted)

src/tokens/search.tokens.json

  • Removed text.small (regular/bold/link), heading.h5, and heading.serpresult font/typography tokens

src/tokens/search.variables.json

  • Updated multiple color values across palettes (primary, red, orange, yellow, green, teal, blue, purple, pink, tor-window)
  • Restructured container-interactiveinteractive.normal + interactive.pale
  • Changed divider.interactive and divider.strong color values

src/tokens/transformation/android/formats/fontStyle.js

  • Imported and used androidFontFamily helper for font family resolution

src/tokens/transformation/common/fontHelper.ts

  • Added MONOSPACE_STACK constant
  • Exported isSFPro and added isSFMono detection
  • Updated fontFamily to also resolve SF Mono to monospace stack
  • Added androidFontFamily mapping SF Pro → Google Sans Flex, SF Mono → Google Sans Code
sequenceDiagram
    participant Figma as Figma Design Tool
    participant Tokens as Token JSON Files
    participant Helper as fontHelper.ts
    participant Android as Android Format
    participant CSS as CSS Output

    Figma->>Tokens: Export updated design tokens
    Note over Tokens: android.tokens.json<br/>ios.tokens.json<br/>browser.tokens.json<br/>marketing.tokens.json<br/>newtab.tokens.json<br/>search.tokens/variables.json

    Tokens->>Helper: Font family resolution
    Helper->>Helper: isSFPro() → system-ui stack
    Helper->>Helper: isSFMono() → monospace stack
    Helper->>Helper: androidFontFamily() → Google Sans Flex/Code

    Tokens->>Android: Android style dictionary build
    Android->>Helper: androidFontFamily(value)
    Helper-->>Android: "Google Sans Flex" / "Google Sans Code"
    Android->>Android: Generate XML resources

    Tokens->>CSS: CSS style dictionary build
    CSS->>Helper: fontFamily(value)
    Helper-->>CSS: system-ui stack / monospace stack
    CSS->>CSS: Generate CSS variables
Loading

@github-actions
Copy link
Copy Markdown
Contributor

👋 Thanks for Submitting! This PR is available for preview at the link below.

✅ PR tip preview: https://1333.pr.nala.bravesoftware.com/
✅ Commit preview: https://1333.pr.nala.bravesoftware.com/commit-08f03dc665c939bc3b6f03a8c2b813a83d599f94/

- ./tokens/css/variables-android.old.css: 7390 bytes
+ ./tokens/css/variables-android.css: 1850 bytes
---
- ./tokens/css/variables-browser.old.css: 6644 bytes
+ ./tokens/css/variables-browser.css: 1438 bytes
---
- ./tokens/css/variables-ios.old.css: 8180 bytes
+ ./tokens/css/variables-ios.css: 16941 bytes
---
- ./tokens/css/variables-marketing.old.css: 13501 bytes
+ ./tokens/css/variables-marketing.css: 21083 bytes
---
- ./tokens/css/variables-news.old.css: 526 bytes
+ ./tokens/css/variables-news.css: 526 bytes
---
- ./tokens/css/variables-newtab.old.css: 1933 bytes
+ ./tokens/css/variables-newtab.css: 2119 bytes
---
- ./tokens/css/variables-search.old.css: 28568 bytes
+ ./tokens/css/variables-search.css: 26939 bytes
---
- ./tokens/css/variables-web3.old.css: 893 bytes
+ ./tokens/css/variables-web3.css: 893 bytes
---
- ./tokens/css/variables.old.css: 126006 bytes
+ ./tokens/css/variables.css: 126306 bytes
Variables Diff: variables-android.diff
--- ./tokens/css/variables-android.old.css	2026-03-11 20:30:36.092681172 +0000
+++ ./tokens/css/variables-android.css	2026-03-11 20:30:00.385031541 +0000
@@ -1,126 +1,45 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-android-default-regular: 400 14px/20px Roboto;
-  --leo-font-android-default-semibold: 600 14px/20px Roboto;
-  --leo-font-android-heading-display1: 500 45px/52px Roboto;
-  --leo-font-android-heading-display2: 500 36px/44px Roboto;
-  --leo-font-android-heading-h1: 500 32px/40px Roboto;
-  --leo-font-android-heading-h2: 500 28px/36px Roboto;
-  --leo-font-android-heading-h3: 500 22px/28px Roboto;
-  --leo-font-android-heading-h4: 600 16px/24px Roboto;
-  --leo-font-android-large-regular: 400 16px/24px Roboto;
-  --leo-font-android-large-semibold: 600 16px/24px Roboto;
-  --leo-font-android-monospace-default: 400 14px/20px Roboto Mono;
-  --leo-font-android-monospace-large: 400 16px/24px Roboto Mono;
-  --leo-font-android-monospace-small: 400 12px/16px Roboto Mono;
-  --leo-font-android-small-regular: 400 12px/16px Roboto;
-  --leo-font-android-small-semibold: 600 12px/16px Roboto;
-  --leo-font-android-x-small-regular: 400 11px/16px Roboto;
-  --leo-font-android-x-small-semibold: 600 11px/16px Roboto;
-  --leo-typography-android-default-regular-font-size: 14px;
-  --leo-typography-android-default-regular-font-weight: 400;
-  --leo-typography-android-default-regular-letter-spacing: -0.2px;
-  --leo-typography-android-default-regular-line-height: 20px;
-  --leo-typography-android-default-regular-paragraph-indent: 0;
-  --leo-typography-android-default-regular-paragraph-spacing: 0;
-  --leo-typography-android-default-semibold-font-size: 14px;
-  --leo-typography-android-default-semibold-font-weight: 600;
-  --leo-typography-android-default-semibold-letter-spacing: -0.2px;
-  --leo-typography-android-default-semibold-line-height: 20px;
-  --leo-typography-android-default-semibold-paragraph-indent: 0;
-  --leo-typography-android-default-semibold-paragraph-spacing: 0;
-  --leo-typography-android-heading-display1-font-size: 45px;
-  --leo-typography-android-heading-display1-font-weight: 500;
-  --leo-typography-android-heading-display1-letter-spacing: 0;
-  --leo-typography-android-heading-display1-line-height: 52px;
-  --leo-typography-android-heading-display1-paragraph-indent: 0;
-  --leo-typography-android-heading-display1-paragraph-spacing: 0;
-  --leo-typography-android-heading-display2-font-size: 36px;
-  --leo-typography-android-heading-display2-font-weight: 500;
-  --leo-typography-android-heading-display2-letter-spacing: 0;
-  --leo-typography-android-heading-display2-line-height: 44px;
-  --leo-typography-android-heading-display2-paragraph-indent: 0;
-  --leo-typography-android-heading-display2-paragraph-spacing: 0;
-  --leo-typography-android-heading-h1-font-size: 32px;
-  --leo-typography-android-heading-h1-font-weight: 500;
-  --leo-typography-android-heading-h1-letter-spacing: 0;
-  --leo-typography-android-heading-h1-line-height: 40px;
-  --leo-typography-android-heading-h1-paragraph-indent: 0;
-  --leo-typography-android-heading-h1-paragraph-spacing: 0;
-  --leo-typography-android-heading-h2-font-size: 28px;
-  --leo-typography-android-heading-h2-font-weight: 500;
-  --leo-typography-android-heading-h2-letter-spacing: 0;
-  --leo-typography-android-heading-h2-line-height: 36px;
-  --leo-typography-android-heading-h2-paragraph-indent: 0;
-  --leo-typography-android-heading-h2-paragraph-spacing: 0;
-  --leo-typography-android-heading-h3-font-size: 22px;
-  --leo-typography-android-heading-h3-font-weight: 500;
-  --leo-typography-android-heading-h3-letter-spacing: 0;
-  --leo-typography-android-heading-h3-line-height: 28px;
-  --leo-typography-android-heading-h3-paragraph-indent: 0;
-  --leo-typography-android-heading-h3-paragraph-spacing: 0;
-  --leo-typography-android-heading-h4-font-size: 16px;
-  --leo-typography-android-heading-h4-font-weight: 600;
-  --leo-typography-android-heading-h4-letter-spacing: 0;
-  --leo-typography-android-heading-h4-line-height: 24px;
-  --leo-typography-android-heading-h4-paragraph-indent: 0;
-  --leo-typography-android-heading-h4-paragraph-spacing: 0;
-  --leo-typography-android-large-regular-font-size: 16px;
-  --leo-typography-android-large-regular-font-weight: 400;
-  --leo-typography-android-large-regular-letter-spacing: -0.2px;
-  --leo-typography-android-large-regular-line-height: 24px;
-  --leo-typography-android-large-regular-paragraph-indent: 0;
-  --leo-typography-android-large-regular-paragraph-spacing: 0;
-  --leo-typography-android-large-semibold-font-size: 16px;
-  --leo-typography-android-large-semibold-font-weight: 600;
-  --leo-typography-android-large-semibold-letter-spacing: 0;
-  --leo-typography-android-large-semibold-line-height: 24px;
-  --leo-typography-android-large-semibold-paragraph-indent: 0;
-  --leo-typography-android-large-semibold-paragraph-spacing: 0;
-  --leo-typography-android-monospace-default-font-size: 14px;
-  --leo-typography-android-monospace-default-font-weight: 400;
-  --leo-typography-android-monospace-default-letter-spacing: 0;
-  --leo-typography-android-monospace-default-line-height: 20px;
-  --leo-typography-android-monospace-default-paragraph-indent: 0;
-  --leo-typography-android-monospace-default-paragraph-spacing: 0;
-  --leo-typography-android-monospace-large-font-size: 16px;
-  --leo-typography-android-monospace-large-font-weight: 400;
-  --leo-typography-android-monospace-large-letter-spacing: 0;
-  --leo-typography-android-monospace-large-line-height: 24px;
-  --leo-typography-android-monospace-large-paragraph-indent: 0;
-  --leo-typography-android-monospace-large-paragraph-spacing: 0;
-  --leo-typography-android-monospace-small-font-size: 12px;
-  --leo-typography-android-monospace-small-font-weight: 400;
-  --leo-typography-android-monospace-small-letter-spacing: 0;
-  --leo-typography-android-monospace-small-line-height: 16px;
-  --leo-typography-android-monospace-small-paragraph-indent: 0;
-  --leo-typography-android-monospace-small-paragraph-spacing: 0;
-  --leo-typography-android-small-regular-font-size: 12px;
-  --leo-typography-android-small-regular-font-weight: 400;
-  --leo-typography-android-small-regular-letter-spacing: 0;
-  --leo-typography-android-small-regular-line-height: 16px;
-  --leo-typography-android-small-regular-paragraph-indent: 0;
-  --leo-typography-android-small-regular-paragraph-spacing: 0;
-  --leo-typography-android-small-semibold-font-size: 12px;
-  --leo-typography-android-small-semibold-font-weight: 600;
-  --leo-typography-android-small-semibold-letter-spacing: 0;
-  --leo-typography-android-small-semibold-line-height: 16px;
-  --leo-typography-android-small-semibold-paragraph-indent: 0;
-  --leo-typography-android-small-semibold-paragraph-spacing: 0;
-  --leo-typography-android-x-small-regular-font-size: 11px;
-  --leo-typography-android-x-small-regular-font-weight: 400;
-  --leo-typography-android-x-small-regular-letter-spacing: 0;
-  --leo-typography-android-x-small-regular-line-height: 16px;
-  --leo-typography-android-x-small-regular-paragraph-indent: 0;
-  --leo-typography-android-x-small-regular-paragraph-spacing: 0;
-  --leo-typography-android-x-small-semibold-font-size: 11px;
-  --leo-typography-android-x-small-semibold-font-weight: 600;
-  --leo-typography-android-x-small-semibold-letter-spacing: 0;
-  --leo-typography-android-x-small-semibold-line-height: 16px;
-  --leo-typography-android-x-small-semibold-paragraph-indent: 0;
-  --leo-typography-android-x-small-semibold-paragraph-spacing: 0;
+  --leo-font-top-app-bar-default: 400 20px/26px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-top-app-bar-large: 400 22px/28px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-typography-top-app-bar-default-font-size: 20px;
+  --leo-typography-top-app-bar-default-font-weight: 400;
+  --leo-typography-top-app-bar-default-letter-spacing: 0;
+  --leo-typography-top-app-bar-default-line-height: 26px;
+  --leo-typography-top-app-bar-default-paragraph-indent: 0;
+  --leo-typography-top-app-bar-default-paragraph-spacing: 0;
+  --leo-typography-top-app-bar-large-font-size: 22px;
+  --leo-typography-top-app-bar-large-font-weight: 400;
+  --leo-typography-top-app-bar-large-letter-spacing: 0;
+  --leo-typography-top-app-bar-large-line-height: 28px;
+  --leo-typography-top-app-bar-large-paragraph-indent: 0;
+  --leo-typography-top-app-bar-large-paragraph-spacing: 0;
+}
+
+@media (prefers-color-scheme: light) {
+ :root {
+  --leo-effect-shadow-bottom-sheet-0: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
+  --leo-effect-shadow-bottom-sheet-1: 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
+ }
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+  --leo-effect-shadow-bottom-sheet-0: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
+  --leo-effect-shadow-bottom-sheet-1: 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
+ }
+}
+
+[data-theme="light"] {
+  --leo-effect-shadow-bottom-sheet-0: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
+  --leo-effect-shadow-bottom-sheet-1: 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
+}
+
+[data-theme="dark"] {
+  --leo-effect-shadow-bottom-sheet-0: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
+  --leo-effect-shadow-bottom-sheet-1: 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
 }
Variables Diff: variables-browser.diff
--- ./tokens/css/variables-browser.old.css	2026-03-11 20:30:36.396222851 +0000
+++ ./tokens/css/variables-browser.css	2026-03-11 20:30:00.379031553 +0000
@@ -1,130 +1,38 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-default-link: 400 14px/16.8px Inter Variable;
-  --leo-font-default-regular: 400 14px/16.8px Inter Variable;
-  --leo-font-default-semibold: 600 14px/16.8px Inter Variable;
-  --leo-font-large-link: 400 16px/19.2px Inter Variable;
-  --leo-font-large-regular: 400 16px/19.2px Inter Variable;
-  --leo-font-large-semibold: 600 16px/19.2px Inter Variable;
-  --leo-font-sidebar-product-title: 600 19px/19px Poppins;
-  --leo-font-small-link: 400 13px/15.6px Inter Variable;
-  --leo-font-small-regular: 400 13px/15.6px Inter Variable;
-  --leo-font-small-semibold: 600 13px/15.6px Inter Variable;
-  --leo-font-x-small-link: 400 12px/14.4px Inter Variable;
-  --leo-font-x-small-regular: 400 12px/14.4px Inter Variable;
-  --leo-font-x-small-semibold: 600 12px/14.4px Inter Variable;
-  --leo-typography-default-link-font-size: 14px;
-  --leo-typography-default-link-font-weight: 400;
-  --leo-typography-default-link-letter-spacing: 0;
-  --leo-typography-default-link-line-height: 16.8px;
-  --leo-typography-default-link-paragraph-indent: 0;
-  --leo-typography-default-link-paragraph-spacing: 0;
-  --leo-typography-default-regular-font-size: 14px;
-  --leo-typography-default-regular-font-weight: 400;
-  --leo-typography-default-regular-letter-spacing: -0.1px;
-  --leo-typography-default-regular-line-height: 16.8px;
-  --leo-typography-default-regular-paragraph-indent: 0;
-  --leo-typography-default-regular-paragraph-spacing: 0;
-  --leo-typography-default-semibold-font-size: 14px;
-  --leo-typography-default-semibold-font-weight: 600;
-  --leo-typography-default-semibold-letter-spacing: -0.1px;
-  --leo-typography-default-semibold-line-height: 16.8px;
-  --leo-typography-default-semibold-paragraph-indent: 0;
-  --leo-typography-default-semibold-paragraph-spacing: 0;
-  --leo-typography-large-link-font-size: 16px;
-  --leo-typography-large-link-font-weight: 400;
-  --leo-typography-large-link-letter-spacing: 0;
-  --leo-typography-large-link-line-height: 19.2px;
-  --leo-typography-large-link-paragraph-indent: 0;
-  --leo-typography-large-link-paragraph-spacing: 0;
-  --leo-typography-large-regular-font-size: 16px;
-  --leo-typography-large-regular-font-weight: 400;
-  --leo-typography-large-regular-letter-spacing: -0.2px;
-  --leo-typography-large-regular-line-height: 19.2px;
-  --leo-typography-large-regular-paragraph-indent: 0;
-  --leo-typography-large-regular-paragraph-spacing: 0;
-  --leo-typography-large-semibold-font-size: 16px;
-  --leo-typography-large-semibold-font-weight: 600;
-  --leo-typography-large-semibold-letter-spacing: -0.2px;
-  --leo-typography-large-semibold-line-height: 19.2px;
-  --leo-typography-large-semibold-paragraph-indent: 0;
-  --leo-typography-large-semibold-paragraph-spacing: 0;
-  --leo-typography-sidebar-product-title-font-size: 19px;
-  --leo-typography-sidebar-product-title-font-weight: 600;
-  --leo-typography-sidebar-product-title-letter-spacing: -0.285px;
-  --leo-typography-sidebar-product-title-line-height: 19px;
-  --leo-typography-sidebar-product-title-paragraph-indent: 0;
-  --leo-typography-sidebar-product-title-paragraph-spacing: 0;
-  --leo-typography-small-link-font-size: 13px;
-  --leo-typography-small-link-font-weight: 400;
-  --leo-typography-small-link-letter-spacing: 0;
-  --leo-typography-small-link-line-height: 15.6px;
-  --leo-typography-small-link-paragraph-indent: 0;
-  --leo-typography-small-link-paragraph-spacing: 0;
-  --leo-typography-small-regular-font-size: 13px;
-  --leo-typography-small-regular-font-weight: 400;
-  --leo-typography-small-regular-letter-spacing: 0;
-  --leo-typography-small-regular-line-height: 15.6px;
-  --leo-typography-small-regular-paragraph-indent: 0;
-  --leo-typography-small-regular-paragraph-spacing: 0;
-  --leo-typography-small-semibold-font-size: 13px;
-  --leo-typography-small-semibold-font-weight: 600;
-  --leo-typography-small-semibold-letter-spacing: 0;
-  --leo-typography-small-semibold-line-height: 15.6px;
-  --leo-typography-small-semibold-paragraph-indent: 0;
-  --leo-typography-small-semibold-paragraph-spacing: 0;
-  --leo-typography-x-small-link-font-size: 12px;
-  --leo-typography-x-small-link-font-weight: 400;
-  --leo-typography-x-small-link-letter-spacing: 0;
-  --leo-typography-x-small-link-line-height: 14.4px;
-  --leo-typography-x-small-link-paragraph-indent: 0;
-  --leo-typography-x-small-link-paragraph-spacing: 0;
-  --leo-typography-x-small-regular-font-size: 12px;
-  --leo-typography-x-small-regular-font-weight: 400;
-  --leo-typography-x-small-regular-letter-spacing: 0;
-  --leo-typography-x-small-regular-line-height: 14.4px;
-  --leo-typography-x-small-regular-paragraph-indent: 0;
-  --leo-typography-x-small-regular-paragraph-spacing: 0;
-  --leo-typography-x-small-semibold-font-size: 12px;
-  --leo-typography-x-small-semibold-font-weight: 600;
-  --leo-typography-x-small-semibold-letter-spacing: 0;
-  --leo-typography-x-small-semibold-line-height: 14.4px;
-  --leo-typography-x-small-semibold-paragraph-indent: 0;
-  --leo-typography-x-small-semibold-paragraph-spacing: 0;
+  --leo-font-browser-menu-item: 400 13px/15.6px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-typography-browser-menu-item-font-size: 13px;
+  --leo-typography-browser-menu-item-font-weight: 400;
+  --leo-typography-browser-menu-item-letter-spacing: -0.23px;
+  --leo-typography-browser-menu-item-line-height: 15.6px;
+  --leo-typography-browser-menu-item-paragraph-indent: 0;
+  --leo-typography-browser-menu-item-paragraph-spacing: 0;
 }
 
 @media (prefers-color-scheme: light) {
  :root {
-  --leo-effect-active-tab-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   --leo-effect-browser-frame-shadow-0: 0px 0px 0px 0.75px rgba(6, 6, 5, 0.2);
-  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.32);
-  --leo-effect-url-bar-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.1), 0px 4px 8px -2px rgba(0, 0, 0, 0.1);
+  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.2);
  }
 }
 
 @media (prefers-color-scheme: dark) {
  :root {
-  --leo-effect-active-tab-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   --leo-effect-browser-frame-shadow-0: 0px 0px 0px 0.75px rgba(6, 6, 5, 0.2);
-  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.32);
-  --leo-effect-url-bar-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.1), 0px 4px 8px -2px rgba(0, 0, 0, 0.1);
+  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.2);
  }
 }
 
 [data-theme="light"] {
-  --leo-effect-active-tab-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   --leo-effect-browser-frame-shadow-0: 0px 0px 0px 0.75px rgba(6, 6, 5, 0.2);
-  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.32);
-  --leo-effect-url-bar-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.1), 0px 4px 8px -2px rgba(0, 0, 0, 0.1);
+  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.2);
 }
 
 [data-theme="dark"] {
-  --leo-effect-active-tab-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   --leo-effect-browser-frame-shadow-0: 0px 0px 0px 0.75px rgba(6, 6, 5, 0.2);
-  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.32);
-  --leo-effect-url-bar-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.1), 0px 4px 8px -2px rgba(0, 0, 0, 0.1);
+  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.2);
 }
Variables Diff: variables-ios.diff
--- ./tokens/css/variables-ios.old.css	2026-03-11 20:30:36.741551624 +0000
+++ ./tokens/css/variables-ios.css	2026-03-11 20:30:00.401031512 +0000
@@ -1,126 +1,245 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-ios-default-regular: 400 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-default-semibold: 600 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-display1: 500 44px/52px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-display2: 500 36px/44px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-h1: 500 32px/40px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-h2: 500 28px/34px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-h3: 500 22px/28px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-h4: 500 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-large-regular: 400 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-large-semibold: 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-monospace-default: 400 15px/20px SF Mono;
-  --leo-font-ios-monospace-large: 400 17px/22px SF Mono;
-  --leo-font-ios-monospace-small: 400 13px/18px SF Mono;
-  --leo-font-ios-small-regular: 400 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-small-semibold: 600 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-x-small-regular: 400 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-x-small-semibold: 600 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-typography-ios-default-regular-font-size: 15px;
-  --leo-typography-ios-default-regular-font-weight: 400;
-  --leo-typography-ios-default-regular-letter-spacing: -0.2px;
-  --leo-typography-ios-default-regular-line-height: 20px;
-  --leo-typography-ios-default-regular-paragraph-indent: 0;
-  --leo-typography-ios-default-regular-paragraph-spacing: 0;
-  --leo-typography-ios-default-semibold-font-size: 15px;
-  --leo-typography-ios-default-semibold-font-weight: 600;
-  --leo-typography-ios-default-semibold-letter-spacing: -0.2px;
-  --leo-typography-ios-default-semibold-line-height: 20px;
-  --leo-typography-ios-default-semibold-paragraph-indent: 0;
-  --leo-typography-ios-default-semibold-paragraph-spacing: 0;
-  --leo-typography-ios-heading-display1-font-size: 44px;
-  --leo-typography-ios-heading-display1-font-weight: 500;
-  --leo-typography-ios-heading-display1-letter-spacing: 0;
-  --leo-typography-ios-heading-display1-line-height: 52px;
-  --leo-typography-ios-heading-display1-paragraph-indent: 0;
-  --leo-typography-ios-heading-display1-paragraph-spacing: 0;
-  --leo-typography-ios-heading-display2-font-size: 36px;
-  --leo-typography-ios-heading-display2-font-weight: 500;
-  --leo-typography-ios-heading-display2-letter-spacing: 0;
-  --leo-typography-ios-heading-display2-line-height: 44px;
-  --leo-typography-ios-heading-display2-paragraph-indent: 0;
-  --leo-typography-ios-heading-display2-paragraph-spacing: 0;
-  --leo-typography-ios-heading-h1-font-size: 32px;
-  --leo-typography-ios-heading-h1-font-weight: 500;
-  --leo-typography-ios-heading-h1-letter-spacing: 0.37px;
-  --leo-typography-ios-heading-h1-line-height: 40px;
-  --leo-typography-ios-heading-h1-paragraph-indent: 0;
-  --leo-typography-ios-heading-h1-paragraph-spacing: 0;
-  --leo-typography-ios-heading-h2-font-size: 28px;
-  --leo-typography-ios-heading-h2-font-weight: 500;
-  --leo-typography-ios-heading-h2-letter-spacing: 0.36px;
-  --leo-typography-ios-heading-h2-line-height: 34px;
-  --leo-typography-ios-heading-h2-paragraph-indent: 0;
-  --leo-typography-ios-heading-h2-paragraph-spacing: 0;
-  --leo-typography-ios-heading-h3-font-size: 22px;
-  --leo-typography-ios-heading-h3-font-weight: 500;
-  --leo-typography-ios-heading-h3-letter-spacing: 0.35px;
-  --leo-typography-ios-heading-h3-line-height: 28px;
-  --leo-typography-ios-heading-h3-paragraph-indent: 0;
-  --leo-typography-ios-heading-h3-paragraph-spacing: 0;
-  --leo-typography-ios-heading-h4-font-size: 17px;
-  --leo-typography-ios-heading-h4-font-weight: 500;
-  --leo-typography-ios-heading-h4-letter-spacing: -0.41px;
-  --leo-typography-ios-heading-h4-line-height: 22px;
-  --leo-typography-ios-heading-h4-paragraph-indent: 0;
-  --leo-typography-ios-heading-h4-paragraph-spacing: 0;
-  --leo-typography-ios-large-regular-font-size: 17px;
-  --leo-typography-ios-large-regular-font-weight: 400;
-  --leo-typography-ios-large-regular-letter-spacing: -0.2px;
-  --leo-typography-ios-large-regular-line-height: 22px;
-  --leo-typography-ios-large-regular-paragraph-indent: 0;
-  --leo-typography-ios-large-regular-paragraph-spacing: 0;
-  --leo-typography-ios-large-semibold-font-size: 17px;
-  --leo-typography-ios-large-semibold-font-weight: 600;
-  --leo-typography-ios-large-semibold-letter-spacing: -0.2px;
-  --leo-typography-ios-large-semibold-line-height: 22px;
-  --leo-typography-ios-large-semibold-paragraph-indent: 0;
-  --leo-typography-ios-large-semibold-paragraph-spacing: 0;
-  --leo-typography-ios-monospace-default-font-size: 15px;
-  --leo-typography-ios-monospace-default-font-weight: 400;
-  --leo-typography-ios-monospace-default-letter-spacing: 0;
-  --leo-typography-ios-monospace-default-line-height: 20px;
-  --leo-typography-ios-monospace-default-paragraph-indent: 0;
-  --leo-typography-ios-monospace-default-paragraph-spacing: 0;
-  --leo-typography-ios-monospace-large-font-size: 17px;
-  --leo-typography-ios-monospace-large-font-weight: 400;
-  --leo-typography-ios-monospace-large-letter-spacing: 0;
-  --leo-typography-ios-monospace-large-line-height: 22px;
-  --leo-typography-ios-monospace-large-paragraph-indent: 0;
-  --leo-typography-ios-monospace-large-paragraph-spacing: 0;
-  --leo-typography-ios-monospace-small-font-size: 13px;
-  --leo-typography-ios-monospace-small-font-weight: 400;
-  --leo-typography-ios-monospace-small-letter-spacing: 0;
-  --leo-typography-ios-monospace-small-line-height: 18px;
-  --leo-typography-ios-monospace-small-paragraph-indent: 0;
-  --leo-typography-ios-monospace-small-paragraph-spacing: 0;
-  --leo-typography-ios-small-regular-font-size: 13px;
-  --leo-typography-ios-small-regular-font-weight: 400;
-  --leo-typography-ios-small-regular-letter-spacing: -0.2px;
-  --leo-typography-ios-small-regular-line-height: 18px;
-  --leo-typography-ios-small-regular-paragraph-indent: 0;
-  --leo-typography-ios-small-regular-paragraph-spacing: 0;
-  --leo-typography-ios-small-semibold-font-size: 13px;
-  --leo-typography-ios-small-semibold-font-weight: 600;
-  --leo-typography-ios-small-semibold-letter-spacing: -0.2px;
-  --leo-typography-ios-small-semibold-line-height: 18px;
-  --leo-typography-ios-small-semibold-paragraph-indent: 0;
-  --leo-typography-ios-small-semibold-paragraph-spacing: 0;
-  --leo-typography-ios-x-small-regular-font-size: 11px;
-  --leo-typography-ios-x-small-regular-font-weight: 400;
-  --leo-typography-ios-x-small-regular-letter-spacing: 0.07px;
-  --leo-typography-ios-x-small-regular-line-height: 13px;
-  --leo-typography-ios-x-small-regular-paragraph-indent: 0;
-  --leo-typography-ios-x-small-regular-paragraph-spacing: 0;
-  --leo-typography-ios-x-small-semibold-font-size: 11px;
-  --leo-typography-ios-x-small-semibold-font-weight: 600;
-  --leo-typography-ios-x-small-semibold-letter-spacing: 0.07px;
-  --leo-typography-ios-x-small-semibold-line-height: 13px;
-  --leo-typography-ios-x-small-semibold-paragraph-indent: 0;
-  --leo-typography-ios-x-small-semibold-paragraph-spacing: 0;
+  --leo-font-body-emphasized: 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-body-emphasized-italic: italic 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-body-italic: italic 400 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-body-regular: 400 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-callout-emphasized: 600 16px/21px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-callout-emphasized-italic: italic 600 16px/21px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-callout-italic: italic 400 16px/21px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-callout-regular: 400 16px/21px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption1-emphasized: 500 12px/16px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption1-emphasized-italic: italic 500 12px/16px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption1-italic: italic 400 12px/16px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption1-regular: 400 12px/16px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption2-emphasized: 600 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption2-emphasized-italic: italic 600 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption2-italic: italic 400 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption2-regular: 400 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-footnote-emphasized: 600 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-footnote-emphasized-italic: italic 600 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-footnote-italic: italic 400 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-footnote-regular: 400 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-headline-italic: italic 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-headline-regular: 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-large-title-emphasized: 700 34px/41px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-large-title-regular: 400 34px/41px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-subheadline-emphaized-italic: italic 600 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-subheadline-emphasized: 600 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-subheadline-italic: italic 400 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-subheadline-regular: 400 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title1-emphasized: 700 28px/34px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title1-regular: 400 28px/34px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title2-emphasized: 700 22px/28px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title2-regular: 400 22px/28px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title3-emphasized: 600 20px/25px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title3-regular: 400 20px/25px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-typography-body-emphasized-font-size: 17px;
+  --leo-typography-body-emphasized-font-weight: 600;
+  --leo-typography-body-emphasized-italic-font-size: 17px;
+  --leo-typography-body-emphasized-italic-font-weight: 600;
+  --leo-typography-body-emphasized-italic-letter-spacing: -0.43px;
+  --leo-typography-body-emphasized-italic-line-height: 22px;
+  --leo-typography-body-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-body-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-body-emphasized-letter-spacing: -0.43px;
+  --leo-typography-body-emphasized-line-height: 22px;
+  --leo-typography-body-emphasized-paragraph-indent: 0;
+  --leo-typography-body-emphasized-paragraph-spacing: 0;
+  --leo-typography-body-italic-font-size: 17px;
+  --leo-typography-body-italic-font-weight: 400;
+  --leo-typography-body-italic-letter-spacing: -0.43px;
+  --leo-typography-body-italic-line-height: 22px;
+  --leo-typography-body-italic-paragraph-indent: 0;
+  --leo-typography-body-italic-paragraph-spacing: 0;
+  --leo-typography-body-regular-font-size: 17px;
+  --leo-typography-body-regular-font-weight: 400;
+  --leo-typography-body-regular-letter-spacing: -0.43px;
+  --leo-typography-body-regular-line-height: 22px;
+  --leo-typography-body-regular-paragraph-indent: 0;
+  --leo-typography-body-regular-paragraph-spacing: 0;
+  --leo-typography-callout-emphasized-font-size: 16px;
+  --leo-typography-callout-emphasized-font-weight: 600;
+  --leo-typography-callout-emphasized-italic-font-size: 16px;
+  --leo-typography-callout-emphasized-italic-font-weight: 600;
+  --leo-typography-callout-emphasized-italic-letter-spacing: -0.31px;
+  --leo-typography-callout-emphasized-italic-line-height: 21px;
+  --leo-typography-callout-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-callout-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-callout-emphasized-letter-spacing: -0.31px;
+  --leo-typography-callout-emphasized-line-height: 21px;
+  --leo-typography-callout-emphasized-paragraph-indent: 0;
+  --leo-typography-callout-emphasized-paragraph-spacing: 0;
+  --leo-typography-callout-italic-font-size: 16px;
+  --leo-typography-callout-italic-font-weight: 400;
+  --leo-typography-callout-italic-letter-spacing: -0.31px;
+  --leo-typography-callout-italic-line-height: 21px;
+  --leo-typography-callout-italic-paragraph-indent: 0;
+  --leo-typography-callout-italic-paragraph-spacing: 0;
+  --leo-typography-callout-regular-font-size: 16px;
+  --leo-typography-callout-regular-font-weight: 400;
+  --leo-typography-callout-regular-letter-spacing: -0.31px;
+  --leo-typography-callout-regular-line-height: 21px;
+  --leo-typography-callout-regular-paragraph-indent: 0;
+  --leo-typography-callout-regular-paragraph-spacing: 0;
+  --leo-typography-caption1-emphasized-font-size: 12px;
+  --leo-typography-caption1-emphasized-font-weight: 500;
+  --leo-typography-caption1-emphasized-italic-font-size: 12px;
+  --leo-typography-caption1-emphasized-italic-font-weight: 500;
+  --leo-typography-caption1-emphasized-italic-letter-spacing: 0;
+  --leo-typography-caption1-emphasized-italic-line-height: 16px;
+  --leo-typography-caption1-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-caption1-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-caption1-emphasized-letter-spacing: 0;
+  --leo-typography-caption1-emphasized-line-height: 16px;
+  --leo-typography-caption1-emphasized-paragraph-indent: 0;
+  --leo-typography-caption1-emphasized-paragraph-spacing: 0;
+  --leo-typography-caption1-italic-font-size: 12px;
+  --leo-typography-caption1-italic-font-weight: 400;
+  --leo-typography-caption1-italic-letter-spacing: 0;
+  --leo-typography-caption1-italic-line-height: 16px;
+  --leo-typography-caption1-italic-paragraph-indent: 0;
+  --leo-typography-caption1-italic-paragraph-spacing: 0;
+  --leo-typography-caption1-regular-font-size: 12px;
+  --leo-typography-caption1-regular-font-weight: 400;
+  --leo-typography-caption1-regular-letter-spacing: 0;
+  --leo-typography-caption1-regular-line-height: 16px;
+  --leo-typography-caption1-regular-paragraph-indent: 0;
+  --leo-typography-caption1-regular-paragraph-spacing: 0;
+  --leo-typography-caption2-emphasized-font-size: 11px;
+  --leo-typography-caption2-emphasized-font-weight: 600;
+  --leo-typography-caption2-emphasized-italic-font-size: 11px;
+  --leo-typography-caption2-emphasized-italic-font-weight: 600;
+  --leo-typography-caption2-emphasized-italic-letter-spacing: 0.06px;
+  --leo-typography-caption2-emphasized-italic-line-height: 13px;
+  --leo-typography-caption2-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-caption2-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-caption2-emphasized-letter-spacing: 0.06px;
+  --leo-typography-caption2-emphasized-line-height: 13px;
+  --leo-typography-caption2-emphasized-paragraph-indent: 0;
+  --leo-typography-caption2-emphasized-paragraph-spacing: 0;
+  --leo-typography-caption2-italic-font-size: 11px;
+  --leo-typography-caption2-italic-font-weight: 400;
+  --leo-typography-caption2-italic-letter-spacing: 0.06px;
+  --leo-typography-caption2-italic-line-height: 13px;
+  --leo-typography-caption2-italic-paragraph-indent: 0;
+  --leo-typography-caption2-italic-paragraph-spacing: 0;
+  --leo-typography-caption2-regular-font-size: 11px;
+  --leo-typography-caption2-regular-font-weight: 400;
+  --leo-typography-caption2-regular-letter-spacing: 0.06px;
+  --leo-typography-caption2-regular-line-height: 13px;
+  --leo-typography-caption2-regular-paragraph-indent: 0;
+  --leo-typography-caption2-regular-paragraph-spacing: 0;
+  --leo-typography-footnote-emphasized-font-size: 13px;
+  --leo-typography-footnote-emphasized-font-weight: 600;
+  --leo-typography-footnote-emphasized-italic-font-size: 13px;
+  --leo-typography-footnote-emphasized-italic-font-weight: 600;
+  --leo-typography-footnote-emphasized-italic-letter-spacing: -0.08px;
+  --leo-typography-footnote-emphasized-italic-line-height: 18px;
+  --leo-typography-footnote-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-footnote-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-footnote-emphasized-letter-spacing: -0.08px;
+  --leo-typography-footnote-emphasized-line-height: 18px;
+  --leo-typography-footnote-emphasized-paragraph-indent: 0;
+  --leo-typography-footnote-emphasized-paragraph-spacing: 0;
+  --leo-typography-footnote-italic-font-size: 13px;
+  --leo-typography-footnote-italic-font-weight: 400;
+  --leo-typography-footnote-italic-letter-spacing: -0.08px;
+  --leo-typography-footnote-italic-line-height: 18px;
+  --leo-typography-footnote-italic-paragraph-indent: 0;
+  --leo-typography-footnote-italic-paragraph-spacing: 0;
+  --leo-typography-footnote-regular-font-size: 13px;
+  --leo-typography-footnote-regular-font-weight: 400;
+  --leo-typography-footnote-regular-letter-spacing: -0.08px;
+  --leo-typography-footnote-regular-line-height: 18px;
+  --leo-typography-footnote-regular-paragraph-indent: 0;
+  --leo-typography-footnote-regular-paragraph-spacing: 0;
+  --leo-typography-headline-italic-font-size: 17px;
+  --leo-typography-headline-italic-font-weight: 600;
+  --leo-typography-headline-italic-letter-spacing: -0.43px;
+  --leo-typography-headline-italic-line-height: 22px;
+  --leo-typography-headline-italic-paragraph-indent: 0;
+  --leo-typography-headline-italic-paragraph-spacing: 0;
+  --leo-typography-headline-regular-font-size: 17px;
+  --leo-typography-headline-regular-font-weight: 600;
+  --leo-typography-headline-regular-letter-spacing: -0.43px;
+  --leo-typography-headline-regular-line-height: 22px;
+  --leo-typography-headline-regular-paragraph-indent: 0;
+  --leo-typography-headline-regular-paragraph-spacing: 0;
+  --leo-typography-large-title-emphasized-font-size: 34px;
+  --leo-typography-large-title-emphasized-font-weight: 700;
+  --leo-typography-large-title-emphasized-letter-spacing: 0.4px;
+  --leo-typography-large-title-emphasized-line-height: 41px;
+  --leo-typography-large-title-emphasized-paragraph-indent: 0;
+  --leo-typography-large-title-emphasized-paragraph-spacing: 0;
+  --leo-typography-large-title-regular-font-size: 34px;
+  --leo-typography-large-title-regular-font-weight: 400;
+  --leo-typography-large-title-regular-letter-spacing: 0.4px;
+  --leo-typography-large-title-regular-line-height: 41px;
+  --leo-typography-large-title-regular-paragraph-indent: 0;
+  --leo-typography-large-title-regular-paragraph-spacing: 0;
+  --leo-typography-subheadline-emphaized-italic-font-size: 15px;
+  --leo-typography-subheadline-emphaized-italic-font-weight: 600;
+  --leo-typography-subheadline-emphaized-italic-letter-spacing: -0.23px;
+  --leo-typography-subheadline-emphaized-italic-line-height: 20px;
+  --leo-typography-subheadline-emphaized-italic-paragraph-indent: 0;
+  --leo-typography-subheadline-emphaized-italic-paragraph-spacing: 0;
+  --leo-typography-subheadline-emphasized-font-size: 15px;
+  --leo-typography-subheadline-emphasized-font-weight: 600;
+  --leo-typography-subheadline-emphasized-letter-spacing: -0.23px;
+  --leo-typography-subheadline-emphasized-line-height: 20px;
+  --leo-typography-subheadline-emphasized-paragraph-indent: 0;
+  --leo-typography-subheadline-emphasized-paragraph-spacing: 0;
+  --leo-typography-subheadline-italic-font-size: 15px;
+  --leo-typography-subheadline-italic-font-weight: 400;
+  --leo-typography-subheadline-italic-letter-spacing: -0.23px;
+  --leo-typography-subheadline-italic-line-height: 20px;
+  --leo-typography-subheadline-italic-paragraph-indent: 0;
+  --leo-typography-subheadline-italic-paragraph-spacing: 0;
+  --leo-typography-subheadline-regular-font-size: 15px;
+  --leo-typography-subheadline-regular-font-weight: 400;
+  --leo-typography-subheadline-regular-letter-spacing: -0.23px;
+  --leo-typography-subheadline-regular-line-height: 20px;
+  --leo-typography-subheadline-regular-paragraph-indent: 0;
+  --leo-typography-subheadline-regular-paragraph-spacing: 0;
+  --leo-typography-title1-emphasized-font-size: 28px;
+  --leo-typography-title1-emphasized-font-weight: 700;
+  --leo-typography-title1-emphasized-letter-spacing: 0.38px;
+  --leo-typography-title1-emphasized-line-height: 34px;
+  --leo-typography-title1-emphasized-paragraph-indent: 0;
+  --leo-typography-title1-emphasized-paragraph-spacing: 0;
+  --leo-typography-title1-regular-font-size: 28px;
+  --leo-typography-title1-regular-font-weight: 400;
+  --leo-typography-title1-regular-letter-spacing: 0.38px;
+  --leo-typography-title1-regular-line-height: 34px;
+  --leo-typography-title1-regular-paragraph-indent: 0;
+  --leo-typography-title1-regular-paragraph-spacing: 0;
+  --leo-typography-title2-emphasized-font-size: 22px;
+  --leo-typography-title2-emphasized-font-weight: 700;
+  --leo-typography-title2-emphasized-letter-spacing: -0.26px;
+  --leo-typography-title2-emphasized-line-height: 28px;
+  --leo-typography-title2-emphasized-paragraph-indent: 0;
+  --leo-typography-title2-emphasized-paragraph-spacing: 0;
+  --leo-typography-title2-regular-font-size: 22px;
+  --leo-typography-title2-regular-font-weight: 400;
+  --leo-typography-title2-regular-letter-spacing: -0.26px;
+  --leo-typography-title2-regular-line-height: 28px;
+  --leo-typography-title2-regular-paragraph-indent: 0;
+  --leo-typography-title2-regular-paragraph-spacing: 0;
+  --leo-typography-title3-emphasized-font-size: 20px;
+  --leo-typography-title3-emphasized-font-weight: 600;
+  --leo-typography-title3-emphasized-letter-spacing: -0.45px;
+  --leo-typography-title3-emphasized-line-height: 25px;
+  --leo-typography-title3-emphasized-paragraph-indent: 0;
+  --leo-typography-title3-emphasized-paragraph-spacing: 0;
+  --leo-typography-title3-regular-font-size: 20px;
+  --leo-typography-title3-regular-font-weight: 400;
+  --leo-typography-title3-regular-letter-spacing: -0.45px;
+  --leo-typography-title3-regular-line-height: 25px;
+  --leo-typography-title3-regular-paragraph-indent: 0;
+  --leo-typography-title3-regular-paragraph-spacing: 0;
 }
Variables Diff: variables-marketing.diff
--- ./tokens/css/variables-marketing.old.css	2026-03-11 20:30:37.030625234 +0000
+++ ./tokens/css/variables-marketing.css	2026-03-11 20:30:00.450031421 +0000
@@ -1,219 +1,361 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-desktop-primary-blockquote: 600 20px/30px Poppins;
-  --leo-font-desktop-primary-h1: 600 80px/100px Poppins;
-  --leo-font-desktop-primary-h2: 600 70px/90px Poppins;
-  --leo-font-desktop-primary-h3: 600 40px/44px Poppins;
-  --leo-font-desktop-primary-h4: 600 30px/40px Poppins;
-  --leo-font-desktop-primary-h5: 600 24px/30px Poppins;
-  --leo-font-desktop-primary-hero: 600 120px/130px Poppins;
-  --leo-font-desktop-primary-text-default: 400 20px/30px Poppins;
-  --leo-font-desktop-primary-text-small: 700 15px/20px Poppins;
-  --leo-font-desktop-secondary-h1: 500 100px/95px Flecha M;
-  --leo-font-desktop-secondary-h2: 500 80px/75px Flecha M;
-  --leo-font-desktop-secondary-h3: 500 70px/75px Flecha M;
-  --leo-font-desktop-secondary-h4: 500 40px/45px Flecha M;
-  --leo-font-desktop-secondary-h5: 500 30px/40px Flecha M;
-  --leo-font-desktop-secondary-hero: 500 120px/103px Flecha M;
-  --leo-font-mobile-primary-blockquote: 600 20px/28px Poppins;
-  --leo-font-mobile-primary-h1: 600 36px/45px Poppins;
-  --leo-font-mobile-primary-h2: 600 30px/40px Poppins;
-  --leo-font-mobile-primary-h3: 600 24px/35px Poppins;
-  --leo-font-mobile-primary-h4: 600 20px/25px Poppins;
-  --leo-font-mobile-primary-h5: 600 18px/20px Poppins;
-  --leo-font-mobile-primary-hero: 600 54px/65px Poppins;
-  --leo-font-mobile-primary-text-default: 400 18px/28px Poppins;
-  --leo-font-mobile-primary-text-small: 700 15px/20px Poppins;
-  --leo-font-mobile-secondary-h1: 500 40px/45px Flecha M;
-  --leo-font-mobile-secondary-h2: 500 36px/40px Flecha M;
-  --leo-font-mobile-secondary-h3: 500 30px/30px Flecha M;
-  --leo-font-mobile-secondary-h4: 500 24px/30px Flecha M;
-  --leo-font-mobile-secondary-h5: 500 20px/25px Flecha M;
-  --leo-font-mobile-secondary-hero: 500 54px/50px Flecha M;
-  --leo-typography-desktop-primary-blockquote-font-size: 20px;
-  --leo-typography-desktop-primary-blockquote-font-weight: 600;
-  --leo-typography-desktop-primary-blockquote-letter-spacing: -0.4px;
-  --leo-typography-desktop-primary-blockquote-line-height: 30px;
-  --leo-typography-desktop-primary-blockquote-paragraph-indent: 0;
-  --leo-typography-desktop-primary-blockquote-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h1-font-size: 80px;
-  --leo-typography-desktop-primary-h1-font-weight: 600;
-  --leo-typography-desktop-primary-h1-letter-spacing: -3.2px;
-  --leo-typography-desktop-primary-h1-line-height: 100px;
-  --leo-typography-desktop-primary-h1-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h1-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h2-font-size: 70px;
-  --leo-typography-desktop-primary-h2-font-weight: 600;
-  --leo-typography-desktop-primary-h2-letter-spacing: -2.8px;
-  --leo-typography-desktop-primary-h2-line-height: 90px;
-  --leo-typography-desktop-primary-h2-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h2-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h3-font-size: 40px;
-  --leo-typography-desktop-primary-h3-font-weight: 600;
-  --leo-typography-desktop-primary-h3-letter-spacing: -1.6px;
-  --leo-typography-desktop-primary-h3-line-height: 44px;
-  --leo-typography-desktop-primary-h3-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h3-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h4-font-size: 30px;
-  --leo-typography-desktop-primary-h4-font-weight: 600;
-  --leo-typography-desktop-primary-h4-letter-spacing: -1.2px;
-  --leo-typography-desktop-primary-h4-line-height: 40px;
-  --leo-typography-desktop-primary-h4-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h4-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h5-font-size: 24px;
-  --leo-typography-desktop-primary-h5-font-weight: 600;
-  --leo-typography-desktop-primary-h5-letter-spacing: -0.48px;
-  --leo-typography-desktop-primary-h5-line-height: 30px;
-  --leo-typography-desktop-primary-h5-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h5-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-hero-font-size: 120px;
-  --leo-typography-desktop-primary-hero-font-weight: 600;
-  --leo-typography-desktop-primary-hero-letter-spacing: -4.8px;
-  --leo-typography-desktop-primary-hero-line-height: 130px;
-  --leo-typography-desktop-primary-hero-paragraph-indent: 0;
-  --leo-typography-desktop-primary-hero-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-text-default-font-size: 20px;
-  --leo-typography-desktop-primary-text-default-font-weight: 400;
-  --leo-typography-desktop-primary-text-default-letter-spacing: 0;
-  --leo-typography-desktop-primary-text-default-line-height: 30px;
-  --leo-typography-desktop-primary-text-default-paragraph-indent: 0;
-  --leo-typography-desktop-primary-text-default-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-text-small-font-size: 15px;
-  --leo-typography-desktop-primary-text-small-font-weight: 700;
-  --leo-typography-desktop-primary-text-small-letter-spacing: -0.45px;
-  --leo-typography-desktop-primary-text-small-line-height: 20px;
-  --leo-typography-desktop-primary-text-small-paragraph-indent: 0;
-  --leo-typography-desktop-primary-text-small-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h1-font-size: 100px;
-  --leo-typography-desktop-secondary-h1-font-weight: 500;
-  --leo-typography-desktop-secondary-h1-letter-spacing: -2px;
-  --leo-typography-desktop-secondary-h1-line-height: 95px;
-  --leo-typography-desktop-secondary-h1-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h1-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h2-font-size: 80px;
-  --leo-typography-desktop-secondary-h2-font-weight: 500;
-  --leo-typography-desktop-secondary-h2-letter-spacing: -1.6px;
-  --leo-typography-desktop-secondary-h2-line-height: 75px;
-  --leo-typography-desktop-secondary-h2-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h2-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h3-font-size: 70px;
-  --leo-typography-desktop-secondary-h3-font-weight: 500;
-  --leo-typography-desktop-secondary-h3-letter-spacing: -1.4px;
-  --leo-typography-desktop-secondary-h3-line-height: 75px;
-  --leo-typography-desktop-secondary-h3-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h3-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h4-font-size: 40px;
-  --leo-typography-desktop-secondary-h4-font-weight: 500;
-  --leo-typography-desktop-secondary-h4-letter-spacing: -0.8px;
-  --leo-typography-desktop-secondary-h4-line-height: 45px;
-  --leo-typography-desktop-secondary-h4-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h4-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h5-font-size: 30px;
-  --leo-typography-desktop-secondary-h5-font-weight: 500;
-  --leo-typography-desktop-secondary-h5-letter-spacing: -0.6px;
-  --leo-typography-desktop-secondary-h5-line-height: 40px;
-  --leo-typography-desktop-secondary-h5-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h5-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-hero-font-size: 120px;
-  --leo-typography-desktop-secondary-hero-font-weight: 500;
-  --leo-typography-desktop-secondary-hero-letter-spacing: -2.4px;
-  --leo-typography-desktop-secondary-hero-line-height: 103px;
-  --leo-typography-desktop-secondary-hero-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-hero-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-blockquote-font-size: 20px;
-  --leo-typography-mobile-primary-blockquote-font-weight: 600;
-  --leo-typography-mobile-primary-blockquote-letter-spacing: -0.4px;
-  --leo-typography-mobile-primary-blockquote-line-height: 28px;
-  --leo-typography-mobile-primary-blockquote-paragraph-indent: 0;
-  --leo-typography-mobile-primary-blockquote-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h1-font-size: 36px;
-  --leo-typography-mobile-primary-h1-font-weight: 600;
-  --leo-typography-mobile-primary-h1-letter-spacing: -1.44px;
-  --leo-typography-mobile-primary-h1-line-height: 45px;
-  --leo-typography-mobile-primary-h1-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h1-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h2-font-size: 30px;
-  --leo-typography-mobile-primary-h2-font-weight: 600;
-  --leo-typography-mobile-primary-h2-letter-spacing: -1.2px;
-  --leo-typography-mobile-primary-h2-line-height: 40px;
-  --leo-typography-mobile-primary-h2-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h2-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h3-font-size: 24px;
-  --leo-typography-mobile-primary-h3-font-weight: 600;
-  --leo-typography-mobile-primary-h3-letter-spacing: -0.96px;
-  --leo-typography-mobile-primary-h3-line-height: 35px;
-  --leo-typography-mobile-primary-h3-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h3-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h4-font-size: 20px;
-  --leo-typography-mobile-primary-h4-font-weight: 600;
-  --leo-typography-mobile-primary-h4-letter-spacing: -0.8px;
-  --leo-typography-mobile-primary-h4-line-height: 25px;
-  --leo-typography-mobile-primary-h4-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h4-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h5-font-size: 18px;
-  --leo-typography-mobile-primary-h5-font-weight: 600;
-  --leo-typography-mobile-primary-h5-letter-spacing: -0.72px;
-  --leo-typography-mobile-primary-h5-line-height: 20px;
-  --leo-typography-mobile-primary-h5-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h5-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-hero-font-size: 54px;
-  --leo-typography-mobile-primary-hero-font-weight: 600;
-  --leo-typography-mobile-primary-hero-letter-spacing: -2.16px;
-  --leo-typography-mobile-primary-hero-line-height: 65px;
-  --leo-typography-mobile-primary-hero-paragraph-indent: 0;
-  --leo-typography-mobile-primary-hero-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-text-default-font-size: 18px;
-  --leo-typography-mobile-primary-text-default-font-weight: 400;
-  --leo-typography-mobile-primary-text-default-letter-spacing: 0;
-  --leo-typography-mobile-primary-text-default-line-height: 28px;
-  --leo-typography-mobile-primary-text-default-paragraph-indent: 0;
-  --leo-typography-mobile-primary-text-default-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-text-small-font-size: 15px;
-  --leo-typography-mobile-primary-text-small-font-weight: 700;
-  --leo-typography-mobile-primary-text-small-letter-spacing: 0;
-  --leo-typography-mobile-primary-text-small-line-height: 20px;
-  --leo-typography-mobile-primary-text-small-paragraph-indent: 0;
-  --leo-typography-mobile-primary-text-small-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h1-font-size: 40px;
-  --leo-typography-mobile-secondary-h1-font-weight: 500;
-  --leo-typography-mobile-secondary-h1-letter-spacing: -0.8px;
-  --leo-typography-mobile-secondary-h1-line-height: 45px;
-  --leo-typography-mobile-secondary-h1-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h1-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h2-font-size: 36px;
-  --leo-typography-mobile-secondary-h2-font-weight: 500;
-  --leo-typography-mobile-secondary-h2-letter-spacing: -0.72px;
-  --leo-typography-mobile-secondary-h2-line-height: 40px;
-  --leo-typography-mobile-secondary-h2-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h2-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h3-font-size: 30px;
-  --leo-typography-mobile-secondary-h3-font-weight: 500;
-  --leo-typography-mobile-secondary-h3-letter-spacing: -0.6px;
-  --leo-typography-mobile-secondary-h3-line-height: 30px;
-  --leo-typography-mobile-secondary-h3-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h3-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h4-font-size: 24px;
-  --leo-typography-mobile-secondary-h4-font-weight: 500;
-  --leo-typography-mobile-secondary-h4-letter-spacing: -0.48px;
-  --leo-typography-mobile-secondary-h4-line-height: 30px;
-  --leo-typography-mobile-secondary-h4-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h4-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h5-font-size: 20px;
-  --leo-typography-mobile-secondary-h5-font-weight: 500;
-  --leo-typography-mobile-secondary-h5-letter-spacing: -0.4px;
-  --leo-typography-mobile-secondary-h5-line-height: 25px;
-  --leo-typography-mobile-secondary-h5-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h5-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-hero-font-size: 54px;
-  --leo-typography-mobile-secondary-hero-font-weight: 500;
-  --leo-typography-mobile-secondary-hero-letter-spacing: -1.08px;
-  --leo-typography-mobile-secondary-hero-line-height: 50px;
-  --leo-typography-mobile-secondary-hero-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-hero-paragraph-spacing: 0;
+  --leo-font-default-link: 400 14px/22px Inter Variable;
+  --leo-font-default-regular: 400 14px/22px Inter Variable;
+  --leo-font-default-semibold: 600 14px/22px Inter Variable;
+  --leo-font-display-primary-blockquote: 600 20px/30px Inter Variable;
+  --leo-font-display-primary-h1: 600 80px/100px Inter Variable;
+  --leo-font-display-primary-h2: 600 70px/90px Inter Variable;
+  --leo-font-display-primary-h3: 600 40px/70px Inter Variable;
+  --leo-font-display-primary-h4: 600 30px/40px Inter Variable;
+  --leo-font-display-primary-h5: 600 24px/30px Inter Variable;
+  --leo-font-display-primary-hero: 600 120px/130px Inter Variable;
+  --leo-font-display-primary-text-default: 400 20px/30px Inter Variable;
+  --leo-font-display-primary-text-small: 700 15px/20px Inter Variable;
+  --leo-font-display-secondary-h1: 500 100px/95px Flecha M;
+  --leo-font-display-secondary-h2: 500 80px/75px Flecha M;
+  --leo-font-display-secondary-h3: 500 70px/75px Flecha M;
+  --leo-font-display-secondary-h4: 500 40px/45px Flecha M;
+  --leo-font-display-secondary-h5: 500 30px/40px Flecha M;
+  --leo-font-display-secondary-hero: 500 120px/103px Flecha M;
+  --leo-font-heading-display1: 600 46px/54px Inter Variable;
+  --leo-font-heading-display2: 600 40px/48px Inter Variable;
+  --leo-font-heading-display3: 600 34px/40px Inter Variable;
+  --leo-font-heading-h1: 600 28px/34px Inter Variable;
+  --leo-font-heading-h2: 600 22px/28px Inter Variable;
+  --leo-font-heading-h3: 600 20px/26px Inter Variable;
+  --leo-font-heading-h4: 600 16px/24px Inter Variable;
+  --leo-font-large-link: 400 16px/24px Inter Variable;
+  --leo-font-large-regular: 400 16px/24px Inter Variable;
+  --leo-font-large-semibold: 600 16px/24px Inter Variable;
+  --leo-font-monospace-default: 400 14px/22px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-monospace-large: 400 16px/24px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-monospace-small: 400 12px/18px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-small-link: 400 12px/18px Inter Variable;
+  --leo-font-small-regular: 400 12px/18px Inter Variable;
+  --leo-font-small-semibold: 600 12px/18px Inter Variable;
+  --leo-font-x-large-link: 400 20px/30px Inter Variable;
+  --leo-font-x-large-regular: 400 20px/30px Inter Variable;
+  --leo-font-x-large-semibold: 600 20px/30px Inter Variable;
+  --leo-font-x-small-link: 400 11px/16px Inter Variable;
+  --leo-font-x-small-regular: 400 11px/16px Inter Variable;
+  --leo-font-x-small-semibold: 600 11px/16px Inter Variable;
+  --leo-typography-default-link-font-size: 14px;
+  --leo-typography-default-link-font-weight: 400;
+  --leo-typography-default-link-letter-spacing: -0.23px;
+  --leo-typography-default-link-line-height: 22px;
+  --leo-typography-default-link-paragraph-indent: 0;
+  --leo-typography-default-link-paragraph-spacing: 8px;
+  --leo-typography-default-regular-font-size: 14px;
+  --leo-typography-default-regular-font-weight: 400;
+  --leo-typography-default-regular-letter-spacing: -0.23px;
+  --leo-typography-default-regular-line-height: 22px;
+  --leo-typography-default-regular-paragraph-indent: 0;
+  --leo-typography-default-regular-paragraph-spacing: 8px;
+  --leo-typography-default-semibold-font-size: 14px;
+  --leo-typography-default-semibold-font-weight: 600;
+  --leo-typography-default-semibold-letter-spacing: -0.23px;
+  --leo-typography-default-semibold-line-height: 22px;
+  --leo-typography-default-semibold-paragraph-indent: 0;
+  --leo-typography-default-semibold-paragraph-spacing: 8px;
+  --leo-typography-display-primary-blockquote-font-size: 20px;
+  --leo-typography-display-primary-blockquote-font-weight: 600;
+  --leo-typography-display-primary-blockquote-letter-spacing: -0.4px;
+  --leo-typography-display-primary-blockquote-line-height: 30px;
+  --leo-typography-display-primary-blockquote-paragraph-indent: 0;
+  --leo-typography-display-primary-blockquote-paragraph-spacing: 8px;
+  --leo-typography-display-primary-h1-font-size: 80px;
+  --leo-typography-display-primary-h1-font-weight: 600;
+  --leo-typography-display-primary-h1-letter-spacing: -1.6px;
+  --leo-typography-display-primary-h1-line-height: 100px;
+  --leo-typography-display-primary-h1-paragraph-indent: 0;
+  --leo-typography-display-primary-h1-paragraph-spacing: 0;
+  --leo-typography-display-primary-h2-font-size: 70px;
+  --leo-typography-display-primary-h2-font-weight: 600;
+  --leo-typography-display-primary-h2-letter-spacing: -1.4px;
+  --leo-typography-display-primary-h2-line-height: 90px;
+  --leo-typography-display-primary-h2-paragraph-indent: 0;
+  --leo-typography-display-primary-h2-paragraph-spacing: 0;
+  --leo-typography-display-primary-h3-font-size: 40px;
+  --leo-typography-display-primary-h3-font-weight: 600;
+  --leo-typography-display-primary-h3-letter-spacing: -0.8px;
+  --leo-typography-display-primary-h3-line-height: 70px;
+  --leo-typography-display-primary-h3-paragraph-indent: 0;
+  --leo-typography-display-primary-h3-paragraph-spacing: 0;
+  --leo-typography-display-primary-h4-font-size: 30px;
+  --leo-typography-display-primary-h4-font-weight: 600;
+  --leo-typography-display-primary-h4-letter-spacing: -0.6px;
+  --leo-typography-display-primary-h4-line-height: 40px;
+  --leo-typography-display-primary-h4-paragraph-indent: 0;
+  --leo-typography-display-primary-h4-paragraph-spacing: 0;
+  --leo-typography-display-primary-h5-font-size: 24px;
+  --leo-typography-display-primary-h5-font-weight: 600;
+  --leo-typography-display-primary-h5-letter-spacing: -0.48px;
+  --leo-typography-display-primary-h5-line-height: 30px;
+  --leo-typography-display-primary-h5-paragraph-indent: 0;
+  --leo-typography-display-primary-h5-paragraph-spacing: 0;
+  --leo-typography-display-primary-hero-font-size: 120px;
+  --leo-typography-display-primary-hero-font-weight: 600;
+  --leo-typography-display-primary-hero-letter-spacing: -2.4px;
+  --leo-typography-display-primary-hero-line-height: 130px;
+  --leo-typography-display-primary-hero-paragraph-indent: 0;
+  --leo-typography-display-primary-hero-paragraph-spacing: 0;
+  --leo-typography-display-primary-text-default-font-size: 20px;
+  --leo-typography-display-primary-text-default-font-weight: 400;
+  --leo-typography-display-primary-text-default-letter-spacing: -0.4px;
+  --leo-typography-display-primary-text-default-line-height: 30px;
+  --leo-typography-display-primary-text-default-paragraph-indent: 0;
+  --leo-typography-display-primary-text-default-paragraph-spacing: 8px;
+  --leo-typography-display-primary-text-small-font-size: 15px;
+  --leo-typography-display-primary-text-small-font-weight: 700;
+  --leo-typography-display-primary-text-small-letter-spacing: -0.3px;
+  --leo-typography-display-primary-text-small-line-height: 20px;
+  --leo-typography-display-primary-text-small-paragraph-indent: 0;
+  --leo-typography-display-primary-text-small-paragraph-spacing: 8px;
+  --leo-typography-display-secondary-h1-font-size: 100px;
+  --leo-typography-display-secondary-h1-font-weight: 500;
+  --leo-typography-display-secondary-h1-letter-spacing: -2px;
+  --leo-typography-display-secondary-h1-line-height: 95px;
+  --leo-typography-display-secondary-h1-paragraph-indent: 0;
+  --leo-typography-display-secondary-h1-paragraph-spacing: 0;
+  --leo-typography-display-secondary-h2-font-size: 80px;
+  --leo-typography-display-secondary-h2-font-weight: 500;
+  --leo-typography-display-secondary-h2-letter-spacing: -1.6px;
+  --leo-typography-display-secondary-h2-line-height: 75px;
+  --leo-typography-display-secondary-h2-paragraph-indent: 0;
+  --leo-typography-display-secondary-h2-paragraph-spacing: 0;
+  --leo-typography-display-secondary-h3-font-size: 70px;
+  --leo-typography-display-secondary-h3-font-weight: 500;
+  --leo-typography-display-secondary-h3-letter-spacing: -1.4px;
+  --leo-typography-display-secondary-h3-line-height: 75px;
+  --leo-typography-display-secondary-h3-paragraph-indent: 0;
+  --leo-typography-display-secondary-h3-paragraph-spacing: 0;
+  --leo-typography-display-secondary-h4-font-size: 40px;
+  --leo-typography-display-secondary-h4-font-weight: 500;
+  --leo-typography-display-secondary-h4-letter-spacing: -0.8px;
+  --leo-typography-display-secondary-h4-line-height: 45px;
+  --leo-typography-display-secondary-h4-paragraph-indent: 0;
+  --leo-typography-display-secondary-h4-paragraph-spacing: 0;
+  --leo-typography-display-secondary-h5-font-size: 30px;
+  --leo-typography-display-secondary-h5-font-weight: 500;
+  --leo-typography-display-secondary-h5-letter-spacing: -0.6px;
+  --leo-typography-display-secondary-h5-line-height: 40px;
+  --leo-typography-display-secondary-h5-paragraph-indent: 0;
+  --leo-typography-display-secondary-h5-paragraph-spacing: 0;
+  --leo-typography-display-secondary-hero-font-size: 120px;
+  --leo-typography-display-secondary-hero-font-weight: 500;
+  --leo-typography-display-secondary-hero-letter-spacing: -2.4px;
+  --leo-typography-display-secondary-hero-line-height: 103px;
+  --leo-typography-display-secondary-hero-paragraph-indent: 0;
+  --leo-typography-display-secondary-hero-paragraph-spacing: 0;
+  --leo-typography-font-size-primary-blockquote: 20px;
+  --leo-typography-font-size-primary-default: 20px;
+  --leo-typography-font-size-primary-h1: 80px;
+  --leo-typography-font-size-primary-h2: 70px;
+  --leo-typography-font-size-primary-h3: 40px;
+  --leo-typography-font-size-primary-h4: 30px;
+  --leo-typography-font-size-primary-h5: 24px;
+  --leo-typography-font-size-primary-hero: 120px;
+  --leo-typography-font-size-primary-small: 15px;
+  --leo-typography-font-size-secondary-blockquote: 20px;
+  --leo-typography-font-size-secondary-default: 20px;
+  --leo-typography-font-size-secondary-h1: 100px;
+  --leo-typography-font-size-secondary-h2: 80px;
+  --leo-typography-font-size-secondary-h3: 70px;
+  --leo-typography-font-size-secondary-h4: 40px;
+  --leo-typography-font-size-secondary-h5: 30px;
+  --leo-typography-font-size-secondary-hero: 120px;
+  --leo-typography-font-size-secondary-small: 15px;
+  --leo-typography-heading-display1-font-size: 46px;
+  --leo-typography-heading-display1-font-weight: 600;
+  --leo-typography-heading-display1-letter-spacing: -0.5px;
+  --leo-typography-heading-display1-line-height: 54px;
+  --leo-typography-heading-display1-paragraph-indent: 0;
+  --leo-typography-heading-display1-paragraph-spacing: 8px;
+  --leo-typography-heading-display2-font-size: 40px;
+  --leo-typography-heading-display2-font-weight: 600;
+  --leo-typography-heading-display2-letter-spacing: -0.5px;
+  --leo-typography-heading-display2-line-height: 48px;
+  --leo-typography-heading-display2-paragraph-indent: 0;
+  --leo-typography-heading-display2-paragraph-spacing: 8px;
+  --leo-typography-heading-display3-font-size: 34px;
+  --leo-typography-heading-display3-font-weight: 600;
+  --leo-typography-heading-display3-letter-spacing: -0.5px;
+  --leo-typography-heading-display3-line-height: 40px;
+  --leo-typography-heading-display3-paragraph-indent: 0;
+  --leo-typography-heading-display3-paragraph-spacing: 8px;
+  --leo-typography-heading-h1-font-size: 28px;
+  --leo-typography-heading-h1-font-weight: 600;
+  --leo-typography-heading-h1-letter-spacing: -0.5px;
+  --leo-typography-heading-h1-line-height: 34px;
+  --leo-typography-heading-h1-paragraph-indent: 0;
+  --leo-typography-heading-h1-paragraph-spacing: 8px;
+  --leo-typography-heading-h2-font-size: 22px;
+  --leo-typography-heading-h2-font-weight: 600;
+  --leo-typography-heading-h2-letter-spacing: -0.5px;
+  --leo-typography-heading-h2-line-height: 28px;
+  --leo-typography-heading-h2-paragraph-indent: 0;
+  --leo-typography-heading-h2-paragraph-spacing: 8px;
+  --leo-typography-heading-h3-font-size: 20px;
+  --leo-typography-heading-h3-font-weight: 600;
+  --leo-typography-heading-h3-letter-spacing: -0.5px;
+  --leo-typography-heading-h3-line-height: 26px;
+  --leo-typography-heading-h3-paragraph-indent: 0;
+  --leo-typography-heading-h3-paragraph-spacing: 8px;
+  --leo-typography-heading-h4-font-size: 16px;
+  --leo-typography-heading-h4-font-weight: 600;
+  --leo-typography-heading-h4-letter-spacing: -0.23px;
+  --leo-typography-heading-h4-line-height: 24px;
+  --leo-typography-heading-h4-paragraph-indent: 0;
+  --leo-typography-heading-h4-paragraph-spacing: 8px;
+  --leo-typography-large-link-font-size: 16px;
+  --leo-typography-large-link-font-weight: 400;
+  --leo-typography-large-link-letter-spacing: -0.23px;
+  --leo-typography-large-link-line-height: 24px;
+  --leo-typography-large-link-paragraph-indent: 0;
+  --leo-typography-large-link-paragraph-spacing: 8px;
+  --leo-typography-large-regular-font-size: 16px;
+  --leo-typography-large-regular-font-weight: 400;
+  --leo-typography-large-regular-letter-spacing: -0.23px;
+  --leo-typography-large-regular-line-height: 24px;
+  --leo-typography-large-regular-paragraph-indent: 0;
+  --leo-typography-large-regular-paragraph-spacing: 8px;
+  --leo-typography-large-semibold-font-size: 16px;
+  --leo-typography-large-semibold-font-weight: 600;
+  --leo-typography-large-semibold-letter-spacing: -0.23px;
+  --leo-typography-large-semibold-line-height: 24px;
+  --leo-typography-large-semibold-paragraph-indent: 0;
+  --leo-typography-large-semibold-paragraph-spacing: 8px;
+  --leo-typography-line-height-primary-blockquote: 30px;
+  --leo-typography-line-height-primary-default: 30px;
+  --leo-typography-line-height-primary-h1: 100px;
+  --leo-typography-line-height-primary-h2: 90px;
+  --leo-typography-line-height-primary-h3: 44px;
+  --leo-typography-line-height-primary-h4: 40px;
+  --leo-typography-line-height-primary-h5: 30px;
+  --leo-typography-line-height-primary-hero: 130px;
+  --leo-typography-line-height-primary-small: 20px;
+  --leo-typography-line-height-secondary-blockquote: 20px;
+  --leo-typography-line-height-secondary-default: 20px;
+  --leo-typography-line-height-secondary-h1: 95px;
+  --leo-typography-line-height-secondary-h2: 75px;
+  --leo-typography-line-height-secondary-h3: 75px;
+  --leo-typography-line-height-secondary-h4: 45px;
+  --leo-typography-line-height-secondary-h5: 40px;
+  --leo-typography-line-height-secondary-hero: 103px;
+  --leo-typography-line-height-secondary-small: 15px;
+  --leo-typography-mobile-font-size-primary-blockquote: 20px;
+  --leo-typography-mobile-font-size-primary-default: 18px;
+  --leo-typography-mobile-font-size-primary-h1: 36px;
+  --leo-typography-mobile-font-size-primary-h2: 30px;
+  --leo-typography-mobile-font-size-primary-h3: 24px;
+  --leo-typography-mobile-font-size-primary-h4: 20px;
+  --leo-typography-mobile-font-size-primary-h5: 18px;
+  --leo-typography-mobile-font-size-primary-hero: 54px;
+  --leo-typography-mobile-font-size-primary-small: 18px;
+  --leo-typography-mobile-font-size-secondary-blockquote: 20px;
+  --leo-typography-mobile-font-size-secondary-default: 18px;
+  --leo-typography-mobile-font-size-secondary-h1: 36px;
+  --leo-typography-mobile-font-size-secondary-h2: 36px;
+  --leo-typography-mobile-font-size-secondary-h3: 30px;
+  --leo-typography-mobile-font-size-secondary-h4: 24px;
+  --leo-typography-mobile-font-size-secondary-h5: 20px;
+  --leo-typography-mobile-font-size-secondary-hero: 54px;
+  --leo-typography-mobile-font-size-secondary-small: 18px;
+  --leo-typography-mobile-line-height-primary-blockquote: 28px;
+  --leo-typography-mobile-line-height-primary-default: 28px;
+  --leo-typography-mobile-line-height-primary-h1: 45px;
+  --leo-typography-mobile-line-height-primary-h2: 40px;
+  --leo-typography-mobile-line-height-primary-h3: 35px;
+  --leo-typography-mobile-line-height-primary-h4: 25px;
+  --leo-typography-mobile-line-height-primary-h5: 20px;
+  --leo-typography-mobile-line-height-primary-hero: 65px;
+  --leo-typography-mobile-line-height-primary-small: 20px;
+  --leo-typography-mobile-line-height-secondary-blockquote: 20px;
+  --leo-typography-mobile-line-height-secondary-default: 18px;
+  --leo-typography-mobile-line-height-secondary-h1: 45px;
+  --leo-typography-mobile-line-height-secondary-h2: 40px;
+  --leo-typography-mobile-line-height-secondary-h3: 30px;
+  --leo-typography-mobile-line-height-secondary-h4: 30px;
+  --leo-typography-mobile-line-height-secondary-h5: 25px;
+  --leo-typography-mobile-line-height-secondary-hero: 50px;
+  --leo-typography-mobile-line-height-secondary-small: 18px;
+  --leo-typography-monospace-default-font-size: 14px;
+  --leo-typography-monospace-default-font-weight: 400;
+  --leo-typography-monospace-default-letter-spacing: 0;
+  --leo-typography-monospace-default-line-height: 22px;
+  --leo-typography-monospace-default-paragraph-indent: 0;
+  --leo-typography-monospace-default-paragraph-spacing: 8px;
+  --leo-typography-monospace-large-font-size: 16px;
+  --leo-typography-monospace-large-font-weight: 400;
+  --leo-typography-monospace-large-letter-spacing: 0;
+  --leo-typography-monospace-large-line-height: 24px;
+  --leo-typography-monospace-large-paragraph-indent: 0;
+  --leo-typography-monospace-large-paragraph-spacing: 8px;
+  --leo-typography-monospace-small-font-size: 12px;
+  --leo-typography-monospace-small-font-weight: 400;
+  --leo-typography-monospace-small-letter-spacing: 0;
+  --leo-typography-monospace-small-line-height: 18px;
+  --leo-typography-monospace-small-paragraph-indent: 0;
+  --leo-typography-monospace-small-paragraph-spacing: 8px;
+  --leo-typography-small-link-font-size: 12px;
+  --leo-typography-small-link-font-weight: 400;
+  --leo-typography-small-link-letter-spacing: -0.08px;
+  --leo-typography-small-link-line-height: 18px;
+  --leo-typography-small-link-paragraph-indent: 0;
+  --leo-typography-small-link-paragraph-spacing: 8px;
+  --leo-typography-small-regular-font-size: 12px;
+  --leo-typography-small-regular-font-weight: 400;
+  --leo-typography-small-regular-letter-spacing: -0.08px;
+  --leo-typography-small-regular-line-height: 18px;
+  --leo-typography-small-regular-paragraph-indent: 0;
+  --leo-typography-small-regular-paragraph-spacing: 8px;
+  --leo-typography-small-semibold-font-size: 12px;
+  --leo-typography-small-semibold-font-weight: 600;
+  --leo-typography-small-semibold-letter-spacing: -0.08px;
+  --leo-typography-small-semibold-line-height: 18px;
+  --leo-typography-small-semibold-paragraph-indent: 0;
+  --leo-typography-small-semibold-paragraph-spacing: 8px;
+  --leo-typography-x-large-link-font-size: 20px;
+  --leo-typography-x-large-link-font-weight: 400;
+  --leo-typography-x-large-link-letter-spacing: -0.23px;
+  --leo-typography-x-large-link-line-height: 30px;
+  --leo-typography-x-large-link-paragraph-indent: 0;
+  --leo-typography-x-large-link-paragraph-spacing: 8px;
+  --leo-typography-x-large-regular-font-size: 20px;
+  --leo-typography-x-large-regular-font-weight: 400;
+  --leo-typography-x-large-regular-letter-spacing: -0.23px;
+  --leo-typography-x-large-regular-line-height: 30px;
+  --leo-typography-x-large-regular-paragraph-indent: 0;
+  --leo-typography-x-large-regular-paragraph-spacing: 8px;
+  --leo-typography-x-large-semibold-font-size: 20px;
+  --leo-typography-x-large-semibold-font-weight: 600;
+  --leo-typography-x-large-semibold-letter-spacing: -0.23px;
+  --leo-typography-x-large-semibold-line-height: 30px;
+  --leo-typography-x-large-semibold-paragraph-indent: 0;
+  --leo-typography-x-large-semibold-paragraph-spacing: 8px;
+  --leo-typography-x-small-link-font-size: 11px;
+  --leo-typography-x-small-link-font-weight: 400;
+  --leo-typography-x-small-link-letter-spacing: -0.08px;
+  --leo-typography-x-small-link-line-height: 16px;
+  --leo-typography-x-small-link-paragraph-indent: 0;
+  --leo-typography-x-small-link-paragraph-spacing: 8px;
+  --leo-typography-x-small-regular-font-size: 11px;
+  --leo-typography-x-small-regular-font-weight: 400;
+  --leo-typography-x-small-regular-letter-spacing: -0.08px;
+  --leo-typography-x-small-regular-line-height: 16px;
+  --leo-typography-x-small-regular-paragraph-indent: 0;
+  --leo-typography-x-small-regular-paragraph-spacing: 8px;
+  --leo-typography-x-small-semibold-font-size: 11px;
+  --leo-typography-x-small-semibold-font-weight: 600;
+  --leo-typography-x-small-semibold-letter-spacing: -0.08px;
+  --leo-typography-x-small-semibold-line-height: 16px;
+  --leo-typography-x-small-semibold-paragraph-indent: 0;
+  --leo-typography-x-small-semibold-paragraph-spacing: 8px;
 }
 
 @media (prefers-color-scheme: light) {
Variables Diff: variables-news.diff
--- ./tokens/css/variables-news.old.css	2026-03-11 20:30:37.330094934 +0000
+++ ./tokens/css/variables-news.css	2026-03-11 20:30:00.502031325 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-newtab.diff
--- ./tokens/css/variables-newtab.old.css	2026-03-11 20:30:37.499528924 +0000
+++ ./tokens/css/variables-newtab.css	2026-03-11 20:30:00.511031308 +0000
@@ -1,18 +1,17 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-brave-rewards-widget-progress: 400 24px/24px Poppins;
-  --leo-font-brave-rewards-widget-token-balance: 400 36px/36px Poppins;
-  --leo-font-stats-h2: 400 40px/40px Poppins;
-  --leo-font-stats-h3: 500 20px/24px Poppins;
-  --leo-gradient-ntp-overlay: linear-gradient(359.99997954866785deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.5) 100%);
-  --leo-typography-brave-rewards-widget-progress-font-size: 24px;
+  --leo-font-brave-rewards-widget-progress: 400 22px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-brave-rewards-widget-token-balance: 400 36px/36px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-stats-h2: 400 40px/40px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-stats-h3: 500 20px/24px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-typography-brave-rewards-widget-progress-font-size: 22px;
   --leo-typography-brave-rewards-widget-progress-font-weight: 400;
   --leo-typography-brave-rewards-widget-progress-letter-spacing: 0;
-  --leo-typography-brave-rewards-widget-progress-line-height: 24px;
+  --leo-typography-brave-rewards-widget-progress-line-height: 22px;
   --leo-typography-brave-rewards-widget-progress-paragraph-indent: 0;
   --leo-typography-brave-rewards-widget-progress-paragraph-spacing: 0;
   --leo-typography-brave-rewards-widget-token-balance-font-size: 36px;
Variables Diff: variables-search.diff
--- ./tokens/css/variables-search.old.css	2026-03-11 20:30:37.859942855 +0000
+++ ./tokens/css/variables-search.css	2026-03-11 20:30:00.482031362 +0000
@@ -1,63 +1,29 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-heading-h5: 600 20px/26px Inter Variable;
-  --leo-font-heading-serpresult: 400 18px/26px Inter Variable;
   --leo-font-search-snippet-title: 500 18px/26px Inter Variable;
-  --leo-font-text-small-bold: 600 13px/21px Inter Variable;
-  --leo-font-text-small-link: 600 13px/21px Inter Variable;
-  --leo-font-text-small-regular: 400 13px/21px Inter Variable;
   --leo-gradient-content-fade-dark: linear-gradient(180deg, rgba(23, 25, 30, 0) 37%, rgb(23, 25, 30) 92%);
   --leo-gradient-content-fade-light: linear-gradient(180deg, rgba(255, 255, 255, 0) 37%, rgb(255, 255, 255) 92%);
   --leo-gradient-search-navigation: linear-gradient(307.16553222317134deg, rgb(191, 20, 162) 0%, rgb(247, 58, 28) 100%);
-  --leo-typography-heading-h5-font-size: 20px;
-  --leo-typography-heading-h5-font-weight: 600;
-  --leo-typography-heading-h5-letter-spacing: -0.5px;
-  --leo-typography-heading-h5-line-height: 26px;
-  --leo-typography-heading-h5-paragraph-indent: 0;
-  --leo-typography-heading-h5-paragraph-spacing: 0;
-  --leo-typography-heading-serpresult-font-size: 18px;
-  --leo-typography-heading-serpresult-font-weight: 400;
-  --leo-typography-heading-serpresult-letter-spacing: 0;
-  --leo-typography-heading-serpresult-line-height: 26px;
-  --leo-typography-heading-serpresult-paragraph-indent: 0;
-  --leo-typography-heading-serpresult-paragraph-spacing: 0;
   --leo-typography-search-snippet-title-font-size: 18px;
   --leo-typography-search-snippet-title-font-weight: 500;
   --leo-typography-search-snippet-title-letter-spacing: 0;
   --leo-typography-search-snippet-title-line-height: 26px;
   --leo-typography-search-snippet-title-paragraph-indent: 0;
   --leo-typography-search-snippet-title-paragraph-spacing: 0;
-  --leo-typography-text-small-bold-font-size: 13px;
-  --leo-typography-text-small-bold-font-weight: 600;
-  --leo-typography-text-small-bold-letter-spacing: -0.2px;
-  --leo-typography-text-small-bold-line-height: 21px;
-  --leo-typography-text-small-bold-paragraph-indent: 0;
-  --leo-typography-text-small-bold-paragraph-spacing: 0;
-  --leo-typography-text-small-link-font-size: 13px;
-  --leo-typography-text-small-link-font-weight: 600;
-  --leo-typography-text-small-link-letter-spacing: -0.2px;
-  --leo-typography-text-small-link-line-height: 21px;
-  --leo-typography-text-small-link-paragraph-indent: 0;
-  --leo-typography-text-small-link-paragraph-spacing: 0;
-  --leo-typography-text-small-regular-font-size: 13px;
-  --leo-typography-text-small-regular-font-weight: 400;
-  --leo-typography-text-small-regular-letter-spacing: -0.2px;
-  --leo-typography-text-small-regular-line-height: 21px;
-  --leo-typography-text-small-regular-paragraph-indent: 0;
-  --leo-typography-text-small-regular-paragraph-spacing: 0;
 }
 
 @media (prefers-color-scheme: light) {
  :root {
   --leo-color-search-background-ask-input-field: var(--leo-color-schemes-surface-container-lowest);
   --leo-color-search-background-container: var(--leo-color-schemes-surface-container-lowest);
-  --leo-color-search-background-container-interactive: var(--leo-color-primary-10);
   --leo-color-search-background-enrichment-cards: var(--leo-color-neutral-5);
   --leo-color-search-background-highlight: var(--leo-color-neutral-10);
+  --leo-color-search-background-interactive-normal: var(--leo-color-primary-10);
+  --leo-color-search-background-interactive-pale: var(--leo-color-primary-5);
   --leo-color-search-background-landing-page: #eef2f6;
   --leo-color-search-background-page: var(--leo-color-schemes-surface-container-lowest);
   --leo-color-search-background-search-bar: var(--leo-color-schemes-surface-container-lowest);
@@ -169,9 +135,10 @@
  :root {
   --leo-color-search-background-ask-input-field: var(--leo-color-schemes-surface-container-highest);
   --leo-color-search-background-container: var(--leo-color-schemes-surface-container);
-  --leo-color-search-background-container-interactive: var(--leo-color-search-primary-10);
   --leo-color-search-background-enrichment-cards: var(--leo-color-neutral-10);
   --leo-color-search-background-highlight: var(--leo-color-neutral-20);
+  --leo-color-search-background-interactive-normal: var(--leo-color-primitive-primary-25);
+  --leo-color-search-background-interactive-pale: var(--leo-color-primitive-primary-30);
   --leo-color-search-background-landing-page: #1e2028;
   --leo-color-search-background-page: var(--leo-color-primitive-neutral-10);
   --leo-color-search-background-search-bar: var(--leo-color-schemes-surface-container-highest);
@@ -196,7 +163,7 @@
   --leo-color-search-button-pale-background-normal: var(--leo-color-search-primary-10);
   --leo-color-search-divider-ask-input-field: var(--leo-color-divider-strong);
   --leo-color-search-divider-interactive: rgba(124, 145, 255, 0.3);
-  --leo-color-search-divider-strong: var(--leo-color-neutral-50);
+  --leo-color-search-divider-strong: var(--leo-color-neutral-20);
   --leo-color-search-divider-subtle: var(--leo-color-primitive-neutral-20);
   --leo-color-search-divider-subtle-container: var(--leo-color-neutral-20);
   --leo-color-search-fade-semi-transparent: rgba(31, 31, 35, 0.85);
@@ -282,9 +249,10 @@
 [data-theme="light"] {
   --leo-color-search-background-ask-input-field: var(--leo-color-schemes-surface-container-lowest);
   --leo-color-search-background-container: var(--leo-color-schemes-surface-container-lowest);
-  --leo-color-search-background-container-interactive: var(--leo-color-primary-10);
   --leo-color-search-background-enrichment-cards: var(--leo-color-neutral-5);
   --leo-color-search-background-highlight: var(--leo-color-neutral-10);
+  --leo-color-search-background-interactive-normal: var(--leo-color-primary-10);
+  --leo-color-search-background-interactive-pale: var(--leo-color-primary-5);
   --leo-color-search-background-landing-page: #eef2f6;
   --leo-color-search-background-page: var(--leo-color-schemes-surface-container-lowest);
   --leo-color-search-background-search-bar: var(--leo-color-schemes-surface-container-lowest);
@@ -394,9 +362,10 @@
 [data-theme="dark"] {
   --leo-color-search-background-ask-input-field: var(--leo-color-schemes-surface-container-highest);
   --leo-color-search-background-container: var(--leo-color-schemes-surface-container);
-  --leo-color-search-background-container-interactive: var(--leo-color-search-primary-10);
   --leo-color-search-background-enrichment-cards: var(--leo-color-neutral-10);
   --leo-color-search-background-highlight: var(--leo-color-neutral-20);
+  --leo-color-search-background-interactive-normal: var(--leo-color-primitive-primary-25);
+  --leo-color-search-background-interactive-pale: var(--leo-color-primitive-primary-30);
   --leo-color-search-background-landing-page: #1e2028;
   --leo-color-search-background-page: var(--leo-color-primitive-neutral-10);
   --leo-color-search-background-search-bar: var(--leo-color-schemes-surface-container-highest);
@@ -421,7 +390,7 @@
   --leo-color-search-button-pale-background-normal: var(--leo-color-search-primary-10);
   --leo-color-search-divider-ask-input-field: var(--leo-color-divider-strong);
   --leo-color-search-divider-interactive: rgba(124, 145, 255, 0.3);
-  --leo-color-search-divider-strong: var(--leo-color-neutral-50);
+  --leo-color-search-divider-strong: var(--leo-color-neutral-20);
   --leo-color-search-divider-subtle: var(--leo-color-primitive-neutral-20);
   --leo-color-search-divider-subtle-container: var(--leo-color-neutral-20);
   --leo-color-search-fade-semi-transparent: rgba(31, 31, 35, 0.85);
Variables Diff: variables-web3.diff
--- ./tokens/css/variables-web3.old.css	2026-03-11 20:30:38.167964022 +0000
+++ ./tokens/css/variables-web3.css	2026-03-11 20:30:00.515031301 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 @media (prefers-color-scheme: light) {
Variables Diff: variables.diff
--- ./tokens/css/variables.old.css	2026-03-11 20:30:38.426941588 +0000
+++ ./tokens/css/variables.css	2026-03-11 20:30:00.260031773 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:30:00 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
@@ -338,9 +338,9 @@
   --leo-font-large-link: 400 16px/24px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
   --leo-font-large-regular: 400 16px/24px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
   --leo-font-large-semibold: 600 16px/24px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-monospace-default: 400 14px/16.8px SF Mono;
-  --leo-font-monospace-large: 400 16px/19.2px SF Mono;
-  --leo-font-monospace-small: 400 12px/14.4px SF Mono;
+  --leo-font-monospace-default: 400 14px/16.8px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-monospace-large: 400 16px/19.2px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-monospace-small: 400 12px/14.4px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
   --leo-font-small-link: 400 12px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
   --leo-font-small-regular: 400 12px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
   --leo-font-small-semibold: 600 12px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

@github-actions
Copy link
Copy Markdown
Contributor

👋 Thanks for Submitting! This PR is available for preview at the link below.

✅ PR tip preview: https://1333.pr.nala.bravesoftware.com/
✅ Commit preview: https://1333.pr.nala.bravesoftware.com/commit-6df395d9cd976433085c70bbc3c75ec3738745c9/

- ./tokens/css/variables-android.old.css: 7390 bytes
+ ./tokens/css/variables-android.css: 1850 bytes
---
- ./tokens/css/variables-browser.old.css: 6644 bytes
+ ./tokens/css/variables-browser.css: 1438 bytes
---
- ./tokens/css/variables-ios.old.css: 8180 bytes
+ ./tokens/css/variables-ios.css: 16941 bytes
---
- ./tokens/css/variables-marketing.old.css: 13501 bytes
+ ./tokens/css/variables-marketing.css: 21083 bytes
---
- ./tokens/css/variables-news.old.css: 526 bytes
+ ./tokens/css/variables-news.css: 526 bytes
---
- ./tokens/css/variables-newtab.old.css: 1933 bytes
+ ./tokens/css/variables-newtab.css: 2119 bytes
---
- ./tokens/css/variables-search.old.css: 28568 bytes
+ ./tokens/css/variables-search.css: 26939 bytes
---
- ./tokens/css/variables-web3.old.css: 893 bytes
+ ./tokens/css/variables-web3.css: 893 bytes
---
- ./tokens/css/variables.old.css: 126006 bytes
+ ./tokens/css/variables.css: 126306 bytes
Variables Diff: variables-android.diff
--- ./tokens/css/variables-android.old.css	2026-03-11 20:34:38.893706405 +0000
+++ ./tokens/css/variables-android.css	2026-03-11 20:34:03.516826274 +0000
@@ -1,126 +1,45 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-android-default-regular: 400 14px/20px Roboto;
-  --leo-font-android-default-semibold: 600 14px/20px Roboto;
-  --leo-font-android-heading-display1: 500 45px/52px Roboto;
-  --leo-font-android-heading-display2: 500 36px/44px Roboto;
-  --leo-font-android-heading-h1: 500 32px/40px Roboto;
-  --leo-font-android-heading-h2: 500 28px/36px Roboto;
-  --leo-font-android-heading-h3: 500 22px/28px Roboto;
-  --leo-font-android-heading-h4: 600 16px/24px Roboto;
-  --leo-font-android-large-regular: 400 16px/24px Roboto;
-  --leo-font-android-large-semibold: 600 16px/24px Roboto;
-  --leo-font-android-monospace-default: 400 14px/20px Roboto Mono;
-  --leo-font-android-monospace-large: 400 16px/24px Roboto Mono;
-  --leo-font-android-monospace-small: 400 12px/16px Roboto Mono;
-  --leo-font-android-small-regular: 400 12px/16px Roboto;
-  --leo-font-android-small-semibold: 600 12px/16px Roboto;
-  --leo-font-android-x-small-regular: 400 11px/16px Roboto;
-  --leo-font-android-x-small-semibold: 600 11px/16px Roboto;
-  --leo-typography-android-default-regular-font-size: 14px;
-  --leo-typography-android-default-regular-font-weight: 400;
-  --leo-typography-android-default-regular-letter-spacing: -0.2px;
-  --leo-typography-android-default-regular-line-height: 20px;
-  --leo-typography-android-default-regular-paragraph-indent: 0;
-  --leo-typography-android-default-regular-paragraph-spacing: 0;
-  --leo-typography-android-default-semibold-font-size: 14px;
-  --leo-typography-android-default-semibold-font-weight: 600;
-  --leo-typography-android-default-semibold-letter-spacing: -0.2px;
-  --leo-typography-android-default-semibold-line-height: 20px;
-  --leo-typography-android-default-semibold-paragraph-indent: 0;
-  --leo-typography-android-default-semibold-paragraph-spacing: 0;
-  --leo-typography-android-heading-display1-font-size: 45px;
-  --leo-typography-android-heading-display1-font-weight: 500;
-  --leo-typography-android-heading-display1-letter-spacing: 0;
-  --leo-typography-android-heading-display1-line-height: 52px;
-  --leo-typography-android-heading-display1-paragraph-indent: 0;
-  --leo-typography-android-heading-display1-paragraph-spacing: 0;
-  --leo-typography-android-heading-display2-font-size: 36px;
-  --leo-typography-android-heading-display2-font-weight: 500;
-  --leo-typography-android-heading-display2-letter-spacing: 0;
-  --leo-typography-android-heading-display2-line-height: 44px;
-  --leo-typography-android-heading-display2-paragraph-indent: 0;
-  --leo-typography-android-heading-display2-paragraph-spacing: 0;
-  --leo-typography-android-heading-h1-font-size: 32px;
-  --leo-typography-android-heading-h1-font-weight: 500;
-  --leo-typography-android-heading-h1-letter-spacing: 0;
-  --leo-typography-android-heading-h1-line-height: 40px;
-  --leo-typography-android-heading-h1-paragraph-indent: 0;
-  --leo-typography-android-heading-h1-paragraph-spacing: 0;
-  --leo-typography-android-heading-h2-font-size: 28px;
-  --leo-typography-android-heading-h2-font-weight: 500;
-  --leo-typography-android-heading-h2-letter-spacing: 0;
-  --leo-typography-android-heading-h2-line-height: 36px;
-  --leo-typography-android-heading-h2-paragraph-indent: 0;
-  --leo-typography-android-heading-h2-paragraph-spacing: 0;
-  --leo-typography-android-heading-h3-font-size: 22px;
-  --leo-typography-android-heading-h3-font-weight: 500;
-  --leo-typography-android-heading-h3-letter-spacing: 0;
-  --leo-typography-android-heading-h3-line-height: 28px;
-  --leo-typography-android-heading-h3-paragraph-indent: 0;
-  --leo-typography-android-heading-h3-paragraph-spacing: 0;
-  --leo-typography-android-heading-h4-font-size: 16px;
-  --leo-typography-android-heading-h4-font-weight: 600;
-  --leo-typography-android-heading-h4-letter-spacing: 0;
-  --leo-typography-android-heading-h4-line-height: 24px;
-  --leo-typography-android-heading-h4-paragraph-indent: 0;
-  --leo-typography-android-heading-h4-paragraph-spacing: 0;
-  --leo-typography-android-large-regular-font-size: 16px;
-  --leo-typography-android-large-regular-font-weight: 400;
-  --leo-typography-android-large-regular-letter-spacing: -0.2px;
-  --leo-typography-android-large-regular-line-height: 24px;
-  --leo-typography-android-large-regular-paragraph-indent: 0;
-  --leo-typography-android-large-regular-paragraph-spacing: 0;
-  --leo-typography-android-large-semibold-font-size: 16px;
-  --leo-typography-android-large-semibold-font-weight: 600;
-  --leo-typography-android-large-semibold-letter-spacing: 0;
-  --leo-typography-android-large-semibold-line-height: 24px;
-  --leo-typography-android-large-semibold-paragraph-indent: 0;
-  --leo-typography-android-large-semibold-paragraph-spacing: 0;
-  --leo-typography-android-monospace-default-font-size: 14px;
-  --leo-typography-android-monospace-default-font-weight: 400;
-  --leo-typography-android-monospace-default-letter-spacing: 0;
-  --leo-typography-android-monospace-default-line-height: 20px;
-  --leo-typography-android-monospace-default-paragraph-indent: 0;
-  --leo-typography-android-monospace-default-paragraph-spacing: 0;
-  --leo-typography-android-monospace-large-font-size: 16px;
-  --leo-typography-android-monospace-large-font-weight: 400;
-  --leo-typography-android-monospace-large-letter-spacing: 0;
-  --leo-typography-android-monospace-large-line-height: 24px;
-  --leo-typography-android-monospace-large-paragraph-indent: 0;
-  --leo-typography-android-monospace-large-paragraph-spacing: 0;
-  --leo-typography-android-monospace-small-font-size: 12px;
-  --leo-typography-android-monospace-small-font-weight: 400;
-  --leo-typography-android-monospace-small-letter-spacing: 0;
-  --leo-typography-android-monospace-small-line-height: 16px;
-  --leo-typography-android-monospace-small-paragraph-indent: 0;
-  --leo-typography-android-monospace-small-paragraph-spacing: 0;
-  --leo-typography-android-small-regular-font-size: 12px;
-  --leo-typography-android-small-regular-font-weight: 400;
-  --leo-typography-android-small-regular-letter-spacing: 0;
-  --leo-typography-android-small-regular-line-height: 16px;
-  --leo-typography-android-small-regular-paragraph-indent: 0;
-  --leo-typography-android-small-regular-paragraph-spacing: 0;
-  --leo-typography-android-small-semibold-font-size: 12px;
-  --leo-typography-android-small-semibold-font-weight: 600;
-  --leo-typography-android-small-semibold-letter-spacing: 0;
-  --leo-typography-android-small-semibold-line-height: 16px;
-  --leo-typography-android-small-semibold-paragraph-indent: 0;
-  --leo-typography-android-small-semibold-paragraph-spacing: 0;
-  --leo-typography-android-x-small-regular-font-size: 11px;
-  --leo-typography-android-x-small-regular-font-weight: 400;
-  --leo-typography-android-x-small-regular-letter-spacing: 0;
-  --leo-typography-android-x-small-regular-line-height: 16px;
-  --leo-typography-android-x-small-regular-paragraph-indent: 0;
-  --leo-typography-android-x-small-regular-paragraph-spacing: 0;
-  --leo-typography-android-x-small-semibold-font-size: 11px;
-  --leo-typography-android-x-small-semibold-font-weight: 600;
-  --leo-typography-android-x-small-semibold-letter-spacing: 0;
-  --leo-typography-android-x-small-semibold-line-height: 16px;
-  --leo-typography-android-x-small-semibold-paragraph-indent: 0;
-  --leo-typography-android-x-small-semibold-paragraph-spacing: 0;
+  --leo-font-top-app-bar-default: 400 20px/26px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-top-app-bar-large: 400 22px/28px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-typography-top-app-bar-default-font-size: 20px;
+  --leo-typography-top-app-bar-default-font-weight: 400;
+  --leo-typography-top-app-bar-default-letter-spacing: 0;
+  --leo-typography-top-app-bar-default-line-height: 26px;
+  --leo-typography-top-app-bar-default-paragraph-indent: 0;
+  --leo-typography-top-app-bar-default-paragraph-spacing: 0;
+  --leo-typography-top-app-bar-large-font-size: 22px;
+  --leo-typography-top-app-bar-large-font-weight: 400;
+  --leo-typography-top-app-bar-large-letter-spacing: 0;
+  --leo-typography-top-app-bar-large-line-height: 28px;
+  --leo-typography-top-app-bar-large-paragraph-indent: 0;
+  --leo-typography-top-app-bar-large-paragraph-spacing: 0;
+}
+
+@media (prefers-color-scheme: light) {
+ :root {
+  --leo-effect-shadow-bottom-sheet-0: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
+  --leo-effect-shadow-bottom-sheet-1: 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
+ }
+}
+
+@media (prefers-color-scheme: dark) {
+ :root {
+  --leo-effect-shadow-bottom-sheet-0: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
+  --leo-effect-shadow-bottom-sheet-1: 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
+ }
+}
+
+[data-theme="light"] {
+  --leo-effect-shadow-bottom-sheet-0: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
+  --leo-effect-shadow-bottom-sheet-1: 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
+}
+
+[data-theme="dark"] {
+  --leo-effect-shadow-bottom-sheet-0: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);
+  --leo-effect-shadow-bottom-sheet-1: 0px 4px 8px 3px rgba(0, 0, 0, 0.15);
 }
Variables Diff: variables-browser.diff
--- ./tokens/css/variables-browser.old.css	2026-03-11 20:34:39.139010242 +0000
+++ ./tokens/css/variables-browser.css	2026-03-11 20:34:03.509826139 +0000
@@ -1,130 +1,38 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-default-link: 400 14px/16.8px Inter Variable;
-  --leo-font-default-regular: 400 14px/16.8px Inter Variable;
-  --leo-font-default-semibold: 600 14px/16.8px Inter Variable;
-  --leo-font-large-link: 400 16px/19.2px Inter Variable;
-  --leo-font-large-regular: 400 16px/19.2px Inter Variable;
-  --leo-font-large-semibold: 600 16px/19.2px Inter Variable;
-  --leo-font-sidebar-product-title: 600 19px/19px Poppins;
-  --leo-font-small-link: 400 13px/15.6px Inter Variable;
-  --leo-font-small-regular: 400 13px/15.6px Inter Variable;
-  --leo-font-small-semibold: 600 13px/15.6px Inter Variable;
-  --leo-font-x-small-link: 400 12px/14.4px Inter Variable;
-  --leo-font-x-small-regular: 400 12px/14.4px Inter Variable;
-  --leo-font-x-small-semibold: 600 12px/14.4px Inter Variable;
-  --leo-typography-default-link-font-size: 14px;
-  --leo-typography-default-link-font-weight: 400;
-  --leo-typography-default-link-letter-spacing: 0;
-  --leo-typography-default-link-line-height: 16.8px;
-  --leo-typography-default-link-paragraph-indent: 0;
-  --leo-typography-default-link-paragraph-spacing: 0;
-  --leo-typography-default-regular-font-size: 14px;
-  --leo-typography-default-regular-font-weight: 400;
-  --leo-typography-default-regular-letter-spacing: -0.1px;
-  --leo-typography-default-regular-line-height: 16.8px;
-  --leo-typography-default-regular-paragraph-indent: 0;
-  --leo-typography-default-regular-paragraph-spacing: 0;
-  --leo-typography-default-semibold-font-size: 14px;
-  --leo-typography-default-semibold-font-weight: 600;
-  --leo-typography-default-semibold-letter-spacing: -0.1px;
-  --leo-typography-default-semibold-line-height: 16.8px;
-  --leo-typography-default-semibold-paragraph-indent: 0;
-  --leo-typography-default-semibold-paragraph-spacing: 0;
-  --leo-typography-large-link-font-size: 16px;
-  --leo-typography-large-link-font-weight: 400;
-  --leo-typography-large-link-letter-spacing: 0;
-  --leo-typography-large-link-line-height: 19.2px;
-  --leo-typography-large-link-paragraph-indent: 0;
-  --leo-typography-large-link-paragraph-spacing: 0;
-  --leo-typography-large-regular-font-size: 16px;
-  --leo-typography-large-regular-font-weight: 400;
-  --leo-typography-large-regular-letter-spacing: -0.2px;
-  --leo-typography-large-regular-line-height: 19.2px;
-  --leo-typography-large-regular-paragraph-indent: 0;
-  --leo-typography-large-regular-paragraph-spacing: 0;
-  --leo-typography-large-semibold-font-size: 16px;
-  --leo-typography-large-semibold-font-weight: 600;
-  --leo-typography-large-semibold-letter-spacing: -0.2px;
-  --leo-typography-large-semibold-line-height: 19.2px;
-  --leo-typography-large-semibold-paragraph-indent: 0;
-  --leo-typography-large-semibold-paragraph-spacing: 0;
-  --leo-typography-sidebar-product-title-font-size: 19px;
-  --leo-typography-sidebar-product-title-font-weight: 600;
-  --leo-typography-sidebar-product-title-letter-spacing: -0.285px;
-  --leo-typography-sidebar-product-title-line-height: 19px;
-  --leo-typography-sidebar-product-title-paragraph-indent: 0;
-  --leo-typography-sidebar-product-title-paragraph-spacing: 0;
-  --leo-typography-small-link-font-size: 13px;
-  --leo-typography-small-link-font-weight: 400;
-  --leo-typography-small-link-letter-spacing: 0;
-  --leo-typography-small-link-line-height: 15.6px;
-  --leo-typography-small-link-paragraph-indent: 0;
-  --leo-typography-small-link-paragraph-spacing: 0;
-  --leo-typography-small-regular-font-size: 13px;
-  --leo-typography-small-regular-font-weight: 400;
-  --leo-typography-small-regular-letter-spacing: 0;
-  --leo-typography-small-regular-line-height: 15.6px;
-  --leo-typography-small-regular-paragraph-indent: 0;
-  --leo-typography-small-regular-paragraph-spacing: 0;
-  --leo-typography-small-semibold-font-size: 13px;
-  --leo-typography-small-semibold-font-weight: 600;
-  --leo-typography-small-semibold-letter-spacing: 0;
-  --leo-typography-small-semibold-line-height: 15.6px;
-  --leo-typography-small-semibold-paragraph-indent: 0;
-  --leo-typography-small-semibold-paragraph-spacing: 0;
-  --leo-typography-x-small-link-font-size: 12px;
-  --leo-typography-x-small-link-font-weight: 400;
-  --leo-typography-x-small-link-letter-spacing: 0;
-  --leo-typography-x-small-link-line-height: 14.4px;
-  --leo-typography-x-small-link-paragraph-indent: 0;
-  --leo-typography-x-small-link-paragraph-spacing: 0;
-  --leo-typography-x-small-regular-font-size: 12px;
-  --leo-typography-x-small-regular-font-weight: 400;
-  --leo-typography-x-small-regular-letter-spacing: 0;
-  --leo-typography-x-small-regular-line-height: 14.4px;
-  --leo-typography-x-small-regular-paragraph-indent: 0;
-  --leo-typography-x-small-regular-paragraph-spacing: 0;
-  --leo-typography-x-small-semibold-font-size: 12px;
-  --leo-typography-x-small-semibold-font-weight: 600;
-  --leo-typography-x-small-semibold-letter-spacing: 0;
-  --leo-typography-x-small-semibold-line-height: 14.4px;
-  --leo-typography-x-small-semibold-paragraph-indent: 0;
-  --leo-typography-x-small-semibold-paragraph-spacing: 0;
+  --leo-font-browser-menu-item: 400 13px/15.6px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-typography-browser-menu-item-font-size: 13px;
+  --leo-typography-browser-menu-item-font-weight: 400;
+  --leo-typography-browser-menu-item-letter-spacing: -0.23px;
+  --leo-typography-browser-menu-item-line-height: 15.6px;
+  --leo-typography-browser-menu-item-paragraph-indent: 0;
+  --leo-typography-browser-menu-item-paragraph-spacing: 0;
 }
 
 @media (prefers-color-scheme: light) {
  :root {
-  --leo-effect-active-tab-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   --leo-effect-browser-frame-shadow-0: 0px 0px 0px 0.75px rgba(6, 6, 5, 0.2);
-  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.32);
-  --leo-effect-url-bar-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.1), 0px 4px 8px -2px rgba(0, 0, 0, 0.1);
+  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.2);
  }
 }
 
 @media (prefers-color-scheme: dark) {
  :root {
-  --leo-effect-active-tab-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   --leo-effect-browser-frame-shadow-0: 0px 0px 0px 0.75px rgba(6, 6, 5, 0.2);
-  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.32);
-  --leo-effect-url-bar-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.1), 0px 4px 8px -2px rgba(0, 0, 0, 0.1);
+  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.2);
  }
 }
 
 [data-theme="light"] {
-  --leo-effect-active-tab-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   --leo-effect-browser-frame-shadow-0: 0px 0px 0px 0.75px rgba(6, 6, 5, 0.2);
-  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.32);
-  --leo-effect-url-bar-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.1), 0px 4px 8px -2px rgba(0, 0, 0, 0.1);
+  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.2);
 }
 
 [data-theme="dark"] {
-  --leo-effect-active-tab-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
   --leo-effect-browser-frame-shadow-0: 0px 0px 0px 0.75px rgba(6, 6, 5, 0.2);
-  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.32);
-  --leo-effect-url-bar-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.1), 0px 4px 8px -2px rgba(0, 0, 0, 0.1);
+  --leo-effect-browser-frame-shadow-1: inset 0px 1px 0.5px 0px rgba(255, 255, 255, 0.2);
 }
Variables Diff: variables-ios.diff
--- ./tokens/css/variables-ios.old.css	2026-03-11 20:34:39.374366177 +0000
+++ ./tokens/css/variables-ios.css	2026-03-11 20:34:03.531826565 +0000
@@ -1,126 +1,245 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-ios-default-regular: 400 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-default-semibold: 600 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-display1: 500 44px/52px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-display2: 500 36px/44px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-h1: 500 32px/40px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-h2: 500 28px/34px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-h3: 500 22px/28px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-heading-h4: 500 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-large-regular: 400 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-large-semibold: 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-monospace-default: 400 15px/20px SF Mono;
-  --leo-font-ios-monospace-large: 400 17px/22px SF Mono;
-  --leo-font-ios-monospace-small: 400 13px/18px SF Mono;
-  --leo-font-ios-small-regular: 400 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-small-semibold: 600 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-x-small-regular: 400 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-ios-x-small-semibold: 600 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-typography-ios-default-regular-font-size: 15px;
-  --leo-typography-ios-default-regular-font-weight: 400;
-  --leo-typography-ios-default-regular-letter-spacing: -0.2px;
-  --leo-typography-ios-default-regular-line-height: 20px;
-  --leo-typography-ios-default-regular-paragraph-indent: 0;
-  --leo-typography-ios-default-regular-paragraph-spacing: 0;
-  --leo-typography-ios-default-semibold-font-size: 15px;
-  --leo-typography-ios-default-semibold-font-weight: 600;
-  --leo-typography-ios-default-semibold-letter-spacing: -0.2px;
-  --leo-typography-ios-default-semibold-line-height: 20px;
-  --leo-typography-ios-default-semibold-paragraph-indent: 0;
-  --leo-typography-ios-default-semibold-paragraph-spacing: 0;
-  --leo-typography-ios-heading-display1-font-size: 44px;
-  --leo-typography-ios-heading-display1-font-weight: 500;
-  --leo-typography-ios-heading-display1-letter-spacing: 0;
-  --leo-typography-ios-heading-display1-line-height: 52px;
-  --leo-typography-ios-heading-display1-paragraph-indent: 0;
-  --leo-typography-ios-heading-display1-paragraph-spacing: 0;
-  --leo-typography-ios-heading-display2-font-size: 36px;
-  --leo-typography-ios-heading-display2-font-weight: 500;
-  --leo-typography-ios-heading-display2-letter-spacing: 0;
-  --leo-typography-ios-heading-display2-line-height: 44px;
-  --leo-typography-ios-heading-display2-paragraph-indent: 0;
-  --leo-typography-ios-heading-display2-paragraph-spacing: 0;
-  --leo-typography-ios-heading-h1-font-size: 32px;
-  --leo-typography-ios-heading-h1-font-weight: 500;
-  --leo-typography-ios-heading-h1-letter-spacing: 0.37px;
-  --leo-typography-ios-heading-h1-line-height: 40px;
-  --leo-typography-ios-heading-h1-paragraph-indent: 0;
-  --leo-typography-ios-heading-h1-paragraph-spacing: 0;
-  --leo-typography-ios-heading-h2-font-size: 28px;
-  --leo-typography-ios-heading-h2-font-weight: 500;
-  --leo-typography-ios-heading-h2-letter-spacing: 0.36px;
-  --leo-typography-ios-heading-h2-line-height: 34px;
-  --leo-typography-ios-heading-h2-paragraph-indent: 0;
-  --leo-typography-ios-heading-h2-paragraph-spacing: 0;
-  --leo-typography-ios-heading-h3-font-size: 22px;
-  --leo-typography-ios-heading-h3-font-weight: 500;
-  --leo-typography-ios-heading-h3-letter-spacing: 0.35px;
-  --leo-typography-ios-heading-h3-line-height: 28px;
-  --leo-typography-ios-heading-h3-paragraph-indent: 0;
-  --leo-typography-ios-heading-h3-paragraph-spacing: 0;
-  --leo-typography-ios-heading-h4-font-size: 17px;
-  --leo-typography-ios-heading-h4-font-weight: 500;
-  --leo-typography-ios-heading-h4-letter-spacing: -0.41px;
-  --leo-typography-ios-heading-h4-line-height: 22px;
-  --leo-typography-ios-heading-h4-paragraph-indent: 0;
-  --leo-typography-ios-heading-h4-paragraph-spacing: 0;
-  --leo-typography-ios-large-regular-font-size: 17px;
-  --leo-typography-ios-large-regular-font-weight: 400;
-  --leo-typography-ios-large-regular-letter-spacing: -0.2px;
-  --leo-typography-ios-large-regular-line-height: 22px;
-  --leo-typography-ios-large-regular-paragraph-indent: 0;
-  --leo-typography-ios-large-regular-paragraph-spacing: 0;
-  --leo-typography-ios-large-semibold-font-size: 17px;
-  --leo-typography-ios-large-semibold-font-weight: 600;
-  --leo-typography-ios-large-semibold-letter-spacing: -0.2px;
-  --leo-typography-ios-large-semibold-line-height: 22px;
-  --leo-typography-ios-large-semibold-paragraph-indent: 0;
-  --leo-typography-ios-large-semibold-paragraph-spacing: 0;
-  --leo-typography-ios-monospace-default-font-size: 15px;
-  --leo-typography-ios-monospace-default-font-weight: 400;
-  --leo-typography-ios-monospace-default-letter-spacing: 0;
-  --leo-typography-ios-monospace-default-line-height: 20px;
-  --leo-typography-ios-monospace-default-paragraph-indent: 0;
-  --leo-typography-ios-monospace-default-paragraph-spacing: 0;
-  --leo-typography-ios-monospace-large-font-size: 17px;
-  --leo-typography-ios-monospace-large-font-weight: 400;
-  --leo-typography-ios-monospace-large-letter-spacing: 0;
-  --leo-typography-ios-monospace-large-line-height: 22px;
-  --leo-typography-ios-monospace-large-paragraph-indent: 0;
-  --leo-typography-ios-monospace-large-paragraph-spacing: 0;
-  --leo-typography-ios-monospace-small-font-size: 13px;
-  --leo-typography-ios-monospace-small-font-weight: 400;
-  --leo-typography-ios-monospace-small-letter-spacing: 0;
-  --leo-typography-ios-monospace-small-line-height: 18px;
-  --leo-typography-ios-monospace-small-paragraph-indent: 0;
-  --leo-typography-ios-monospace-small-paragraph-spacing: 0;
-  --leo-typography-ios-small-regular-font-size: 13px;
-  --leo-typography-ios-small-regular-font-weight: 400;
-  --leo-typography-ios-small-regular-letter-spacing: -0.2px;
-  --leo-typography-ios-small-regular-line-height: 18px;
-  --leo-typography-ios-small-regular-paragraph-indent: 0;
-  --leo-typography-ios-small-regular-paragraph-spacing: 0;
-  --leo-typography-ios-small-semibold-font-size: 13px;
-  --leo-typography-ios-small-semibold-font-weight: 600;
-  --leo-typography-ios-small-semibold-letter-spacing: -0.2px;
-  --leo-typography-ios-small-semibold-line-height: 18px;
-  --leo-typography-ios-small-semibold-paragraph-indent: 0;
-  --leo-typography-ios-small-semibold-paragraph-spacing: 0;
-  --leo-typography-ios-x-small-regular-font-size: 11px;
-  --leo-typography-ios-x-small-regular-font-weight: 400;
-  --leo-typography-ios-x-small-regular-letter-spacing: 0.07px;
-  --leo-typography-ios-x-small-regular-line-height: 13px;
-  --leo-typography-ios-x-small-regular-paragraph-indent: 0;
-  --leo-typography-ios-x-small-regular-paragraph-spacing: 0;
-  --leo-typography-ios-x-small-semibold-font-size: 11px;
-  --leo-typography-ios-x-small-semibold-font-weight: 600;
-  --leo-typography-ios-x-small-semibold-letter-spacing: 0.07px;
-  --leo-typography-ios-x-small-semibold-line-height: 13px;
-  --leo-typography-ios-x-small-semibold-paragraph-indent: 0;
-  --leo-typography-ios-x-small-semibold-paragraph-spacing: 0;
+  --leo-font-body-emphasized: 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-body-emphasized-italic: italic 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-body-italic: italic 400 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-body-regular: 400 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-callout-emphasized: 600 16px/21px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-callout-emphasized-italic: italic 600 16px/21px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-callout-italic: italic 400 16px/21px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-callout-regular: 400 16px/21px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption1-emphasized: 500 12px/16px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption1-emphasized-italic: italic 500 12px/16px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption1-italic: italic 400 12px/16px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption1-regular: 400 12px/16px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption2-emphasized: 600 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption2-emphasized-italic: italic 600 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption2-italic: italic 400 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-caption2-regular: 400 11px/13px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-footnote-emphasized: 600 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-footnote-emphasized-italic: italic 600 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-footnote-italic: italic 400 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-footnote-regular: 400 13px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-headline-italic: italic 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-headline-regular: 600 17px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-large-title-emphasized: 700 34px/41px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-large-title-regular: 400 34px/41px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-subheadline-emphaized-italic: italic 600 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-subheadline-emphasized: 600 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-subheadline-italic: italic 400 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-subheadline-regular: 400 15px/20px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title1-emphasized: 700 28px/34px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title1-regular: 400 28px/34px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title2-emphasized: 700 22px/28px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title2-regular: 400 22px/28px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title3-emphasized: 600 20px/25px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-title3-regular: 400 20px/25px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-typography-body-emphasized-font-size: 17px;
+  --leo-typography-body-emphasized-font-weight: 600;
+  --leo-typography-body-emphasized-italic-font-size: 17px;
+  --leo-typography-body-emphasized-italic-font-weight: 600;
+  --leo-typography-body-emphasized-italic-letter-spacing: -0.43px;
+  --leo-typography-body-emphasized-italic-line-height: 22px;
+  --leo-typography-body-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-body-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-body-emphasized-letter-spacing: -0.43px;
+  --leo-typography-body-emphasized-line-height: 22px;
+  --leo-typography-body-emphasized-paragraph-indent: 0;
+  --leo-typography-body-emphasized-paragraph-spacing: 0;
+  --leo-typography-body-italic-font-size: 17px;
+  --leo-typography-body-italic-font-weight: 400;
+  --leo-typography-body-italic-letter-spacing: -0.43px;
+  --leo-typography-body-italic-line-height: 22px;
+  --leo-typography-body-italic-paragraph-indent: 0;
+  --leo-typography-body-italic-paragraph-spacing: 0;
+  --leo-typography-body-regular-font-size: 17px;
+  --leo-typography-body-regular-font-weight: 400;
+  --leo-typography-body-regular-letter-spacing: -0.43px;
+  --leo-typography-body-regular-line-height: 22px;
+  --leo-typography-body-regular-paragraph-indent: 0;
+  --leo-typography-body-regular-paragraph-spacing: 0;
+  --leo-typography-callout-emphasized-font-size: 16px;
+  --leo-typography-callout-emphasized-font-weight: 600;
+  --leo-typography-callout-emphasized-italic-font-size: 16px;
+  --leo-typography-callout-emphasized-italic-font-weight: 600;
+  --leo-typography-callout-emphasized-italic-letter-spacing: -0.31px;
+  --leo-typography-callout-emphasized-italic-line-height: 21px;
+  --leo-typography-callout-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-callout-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-callout-emphasized-letter-spacing: -0.31px;
+  --leo-typography-callout-emphasized-line-height: 21px;
+  --leo-typography-callout-emphasized-paragraph-indent: 0;
+  --leo-typography-callout-emphasized-paragraph-spacing: 0;
+  --leo-typography-callout-italic-font-size: 16px;
+  --leo-typography-callout-italic-font-weight: 400;
+  --leo-typography-callout-italic-letter-spacing: -0.31px;
+  --leo-typography-callout-italic-line-height: 21px;
+  --leo-typography-callout-italic-paragraph-indent: 0;
+  --leo-typography-callout-italic-paragraph-spacing: 0;
+  --leo-typography-callout-regular-font-size: 16px;
+  --leo-typography-callout-regular-font-weight: 400;
+  --leo-typography-callout-regular-letter-spacing: -0.31px;
+  --leo-typography-callout-regular-line-height: 21px;
+  --leo-typography-callout-regular-paragraph-indent: 0;
+  --leo-typography-callout-regular-paragraph-spacing: 0;
+  --leo-typography-caption1-emphasized-font-size: 12px;
+  --leo-typography-caption1-emphasized-font-weight: 500;
+  --leo-typography-caption1-emphasized-italic-font-size: 12px;
+  --leo-typography-caption1-emphasized-italic-font-weight: 500;
+  --leo-typography-caption1-emphasized-italic-letter-spacing: 0;
+  --leo-typography-caption1-emphasized-italic-line-height: 16px;
+  --leo-typography-caption1-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-caption1-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-caption1-emphasized-letter-spacing: 0;
+  --leo-typography-caption1-emphasized-line-height: 16px;
+  --leo-typography-caption1-emphasized-paragraph-indent: 0;
+  --leo-typography-caption1-emphasized-paragraph-spacing: 0;
+  --leo-typography-caption1-italic-font-size: 12px;
+  --leo-typography-caption1-italic-font-weight: 400;
+  --leo-typography-caption1-italic-letter-spacing: 0;
+  --leo-typography-caption1-italic-line-height: 16px;
+  --leo-typography-caption1-italic-paragraph-indent: 0;
+  --leo-typography-caption1-italic-paragraph-spacing: 0;
+  --leo-typography-caption1-regular-font-size: 12px;
+  --leo-typography-caption1-regular-font-weight: 400;
+  --leo-typography-caption1-regular-letter-spacing: 0;
+  --leo-typography-caption1-regular-line-height: 16px;
+  --leo-typography-caption1-regular-paragraph-indent: 0;
+  --leo-typography-caption1-regular-paragraph-spacing: 0;
+  --leo-typography-caption2-emphasized-font-size: 11px;
+  --leo-typography-caption2-emphasized-font-weight: 600;
+  --leo-typography-caption2-emphasized-italic-font-size: 11px;
+  --leo-typography-caption2-emphasized-italic-font-weight: 600;
+  --leo-typography-caption2-emphasized-italic-letter-spacing: 0.06px;
+  --leo-typography-caption2-emphasized-italic-line-height: 13px;
+  --leo-typography-caption2-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-caption2-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-caption2-emphasized-letter-spacing: 0.06px;
+  --leo-typography-caption2-emphasized-line-height: 13px;
+  --leo-typography-caption2-emphasized-paragraph-indent: 0;
+  --leo-typography-caption2-emphasized-paragraph-spacing: 0;
+  --leo-typography-caption2-italic-font-size: 11px;
+  --leo-typography-caption2-italic-font-weight: 400;
+  --leo-typography-caption2-italic-letter-spacing: 0.06px;
+  --leo-typography-caption2-italic-line-height: 13px;
+  --leo-typography-caption2-italic-paragraph-indent: 0;
+  --leo-typography-caption2-italic-paragraph-spacing: 0;
+  --leo-typography-caption2-regular-font-size: 11px;
+  --leo-typography-caption2-regular-font-weight: 400;
+  --leo-typography-caption2-regular-letter-spacing: 0.06px;
+  --leo-typography-caption2-regular-line-height: 13px;
+  --leo-typography-caption2-regular-paragraph-indent: 0;
+  --leo-typography-caption2-regular-paragraph-spacing: 0;
+  --leo-typography-footnote-emphasized-font-size: 13px;
+  --leo-typography-footnote-emphasized-font-weight: 600;
+  --leo-typography-footnote-emphasized-italic-font-size: 13px;
+  --leo-typography-footnote-emphasized-italic-font-weight: 600;
+  --leo-typography-footnote-emphasized-italic-letter-spacing: -0.08px;
+  --leo-typography-footnote-emphasized-italic-line-height: 18px;
+  --leo-typography-footnote-emphasized-italic-paragraph-indent: 0;
+  --leo-typography-footnote-emphasized-italic-paragraph-spacing: 0;
+  --leo-typography-footnote-emphasized-letter-spacing: -0.08px;
+  --leo-typography-footnote-emphasized-line-height: 18px;
+  --leo-typography-footnote-emphasized-paragraph-indent: 0;
+  --leo-typography-footnote-emphasized-paragraph-spacing: 0;
+  --leo-typography-footnote-italic-font-size: 13px;
+  --leo-typography-footnote-italic-font-weight: 400;
+  --leo-typography-footnote-italic-letter-spacing: -0.08px;
+  --leo-typography-footnote-italic-line-height: 18px;
+  --leo-typography-footnote-italic-paragraph-indent: 0;
+  --leo-typography-footnote-italic-paragraph-spacing: 0;
+  --leo-typography-footnote-regular-font-size: 13px;
+  --leo-typography-footnote-regular-font-weight: 400;
+  --leo-typography-footnote-regular-letter-spacing: -0.08px;
+  --leo-typography-footnote-regular-line-height: 18px;
+  --leo-typography-footnote-regular-paragraph-indent: 0;
+  --leo-typography-footnote-regular-paragraph-spacing: 0;
+  --leo-typography-headline-italic-font-size: 17px;
+  --leo-typography-headline-italic-font-weight: 600;
+  --leo-typography-headline-italic-letter-spacing: -0.43px;
+  --leo-typography-headline-italic-line-height: 22px;
+  --leo-typography-headline-italic-paragraph-indent: 0;
+  --leo-typography-headline-italic-paragraph-spacing: 0;
+  --leo-typography-headline-regular-font-size: 17px;
+  --leo-typography-headline-regular-font-weight: 600;
+  --leo-typography-headline-regular-letter-spacing: -0.43px;
+  --leo-typography-headline-regular-line-height: 22px;
+  --leo-typography-headline-regular-paragraph-indent: 0;
+  --leo-typography-headline-regular-paragraph-spacing: 0;
+  --leo-typography-large-title-emphasized-font-size: 34px;
+  --leo-typography-large-title-emphasized-font-weight: 700;
+  --leo-typography-large-title-emphasized-letter-spacing: 0.4px;
+  --leo-typography-large-title-emphasized-line-height: 41px;
+  --leo-typography-large-title-emphasized-paragraph-indent: 0;
+  --leo-typography-large-title-emphasized-paragraph-spacing: 0;
+  --leo-typography-large-title-regular-font-size: 34px;
+  --leo-typography-large-title-regular-font-weight: 400;
+  --leo-typography-large-title-regular-letter-spacing: 0.4px;
+  --leo-typography-large-title-regular-line-height: 41px;
+  --leo-typography-large-title-regular-paragraph-indent: 0;
+  --leo-typography-large-title-regular-paragraph-spacing: 0;
+  --leo-typography-subheadline-emphaized-italic-font-size: 15px;
+  --leo-typography-subheadline-emphaized-italic-font-weight: 600;
+  --leo-typography-subheadline-emphaized-italic-letter-spacing: -0.23px;
+  --leo-typography-subheadline-emphaized-italic-line-height: 20px;
+  --leo-typography-subheadline-emphaized-italic-paragraph-indent: 0;
+  --leo-typography-subheadline-emphaized-italic-paragraph-spacing: 0;
+  --leo-typography-subheadline-emphasized-font-size: 15px;
+  --leo-typography-subheadline-emphasized-font-weight: 600;
+  --leo-typography-subheadline-emphasized-letter-spacing: -0.23px;
+  --leo-typography-subheadline-emphasized-line-height: 20px;
+  --leo-typography-subheadline-emphasized-paragraph-indent: 0;
+  --leo-typography-subheadline-emphasized-paragraph-spacing: 0;
+  --leo-typography-subheadline-italic-font-size: 15px;
+  --leo-typography-subheadline-italic-font-weight: 400;
+  --leo-typography-subheadline-italic-letter-spacing: -0.23px;
+  --leo-typography-subheadline-italic-line-height: 20px;
+  --leo-typography-subheadline-italic-paragraph-indent: 0;
+  --leo-typography-subheadline-italic-paragraph-spacing: 0;
+  --leo-typography-subheadline-regular-font-size: 15px;
+  --leo-typography-subheadline-regular-font-weight: 400;
+  --leo-typography-subheadline-regular-letter-spacing: -0.23px;
+  --leo-typography-subheadline-regular-line-height: 20px;
+  --leo-typography-subheadline-regular-paragraph-indent: 0;
+  --leo-typography-subheadline-regular-paragraph-spacing: 0;
+  --leo-typography-title1-emphasized-font-size: 28px;
+  --leo-typography-title1-emphasized-font-weight: 700;
+  --leo-typography-title1-emphasized-letter-spacing: 0.38px;
+  --leo-typography-title1-emphasized-line-height: 34px;
+  --leo-typography-title1-emphasized-paragraph-indent: 0;
+  --leo-typography-title1-emphasized-paragraph-spacing: 0;
+  --leo-typography-title1-regular-font-size: 28px;
+  --leo-typography-title1-regular-font-weight: 400;
+  --leo-typography-title1-regular-letter-spacing: 0.38px;
+  --leo-typography-title1-regular-line-height: 34px;
+  --leo-typography-title1-regular-paragraph-indent: 0;
+  --leo-typography-title1-regular-paragraph-spacing: 0;
+  --leo-typography-title2-emphasized-font-size: 22px;
+  --leo-typography-title2-emphasized-font-weight: 700;
+  --leo-typography-title2-emphasized-letter-spacing: -0.26px;
+  --leo-typography-title2-emphasized-line-height: 28px;
+  --leo-typography-title2-emphasized-paragraph-indent: 0;
+  --leo-typography-title2-emphasized-paragraph-spacing: 0;
+  --leo-typography-title2-regular-font-size: 22px;
+  --leo-typography-title2-regular-font-weight: 400;
+  --leo-typography-title2-regular-letter-spacing: -0.26px;
+  --leo-typography-title2-regular-line-height: 28px;
+  --leo-typography-title2-regular-paragraph-indent: 0;
+  --leo-typography-title2-regular-paragraph-spacing: 0;
+  --leo-typography-title3-emphasized-font-size: 20px;
+  --leo-typography-title3-emphasized-font-weight: 600;
+  --leo-typography-title3-emphasized-letter-spacing: -0.45px;
+  --leo-typography-title3-emphasized-line-height: 25px;
+  --leo-typography-title3-emphasized-paragraph-indent: 0;
+  --leo-typography-title3-emphasized-paragraph-spacing: 0;
+  --leo-typography-title3-regular-font-size: 20px;
+  --leo-typography-title3-regular-font-weight: 400;
+  --leo-typography-title3-regular-letter-spacing: -0.45px;
+  --leo-typography-title3-regular-line-height: 25px;
+  --leo-typography-title3-regular-paragraph-indent: 0;
+  --leo-typography-title3-regular-paragraph-spacing: 0;
 }
Variables Diff: variables-marketing.diff
--- ./tokens/css/variables-marketing.old.css	2026-03-11 20:34:39.634877677 +0000
+++ ./tokens/css/variables-marketing.css	2026-03-11 20:34:03.563827186 +0000
@@ -1,219 +1,361 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-desktop-primary-blockquote: 600 20px/30px Poppins;
-  --leo-font-desktop-primary-h1: 600 80px/100px Poppins;
-  --leo-font-desktop-primary-h2: 600 70px/90px Poppins;
-  --leo-font-desktop-primary-h3: 600 40px/44px Poppins;
-  --leo-font-desktop-primary-h4: 600 30px/40px Poppins;
-  --leo-font-desktop-primary-h5: 600 24px/30px Poppins;
-  --leo-font-desktop-primary-hero: 600 120px/130px Poppins;
-  --leo-font-desktop-primary-text-default: 400 20px/30px Poppins;
-  --leo-font-desktop-primary-text-small: 700 15px/20px Poppins;
-  --leo-font-desktop-secondary-h1: 500 100px/95px Flecha M;
-  --leo-font-desktop-secondary-h2: 500 80px/75px Flecha M;
-  --leo-font-desktop-secondary-h3: 500 70px/75px Flecha M;
-  --leo-font-desktop-secondary-h4: 500 40px/45px Flecha M;
-  --leo-font-desktop-secondary-h5: 500 30px/40px Flecha M;
-  --leo-font-desktop-secondary-hero: 500 120px/103px Flecha M;
-  --leo-font-mobile-primary-blockquote: 600 20px/28px Poppins;
-  --leo-font-mobile-primary-h1: 600 36px/45px Poppins;
-  --leo-font-mobile-primary-h2: 600 30px/40px Poppins;
-  --leo-font-mobile-primary-h3: 600 24px/35px Poppins;
-  --leo-font-mobile-primary-h4: 600 20px/25px Poppins;
-  --leo-font-mobile-primary-h5: 600 18px/20px Poppins;
-  --leo-font-mobile-primary-hero: 600 54px/65px Poppins;
-  --leo-font-mobile-primary-text-default: 400 18px/28px Poppins;
-  --leo-font-mobile-primary-text-small: 700 15px/20px Poppins;
-  --leo-font-mobile-secondary-h1: 500 40px/45px Flecha M;
-  --leo-font-mobile-secondary-h2: 500 36px/40px Flecha M;
-  --leo-font-mobile-secondary-h3: 500 30px/30px Flecha M;
-  --leo-font-mobile-secondary-h4: 500 24px/30px Flecha M;
-  --leo-font-mobile-secondary-h5: 500 20px/25px Flecha M;
-  --leo-font-mobile-secondary-hero: 500 54px/50px Flecha M;
-  --leo-typography-desktop-primary-blockquote-font-size: 20px;
-  --leo-typography-desktop-primary-blockquote-font-weight: 600;
-  --leo-typography-desktop-primary-blockquote-letter-spacing: -0.4px;
-  --leo-typography-desktop-primary-blockquote-line-height: 30px;
-  --leo-typography-desktop-primary-blockquote-paragraph-indent: 0;
-  --leo-typography-desktop-primary-blockquote-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h1-font-size: 80px;
-  --leo-typography-desktop-primary-h1-font-weight: 600;
-  --leo-typography-desktop-primary-h1-letter-spacing: -3.2px;
-  --leo-typography-desktop-primary-h1-line-height: 100px;
-  --leo-typography-desktop-primary-h1-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h1-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h2-font-size: 70px;
-  --leo-typography-desktop-primary-h2-font-weight: 600;
-  --leo-typography-desktop-primary-h2-letter-spacing: -2.8px;
-  --leo-typography-desktop-primary-h2-line-height: 90px;
-  --leo-typography-desktop-primary-h2-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h2-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h3-font-size: 40px;
-  --leo-typography-desktop-primary-h3-font-weight: 600;
-  --leo-typography-desktop-primary-h3-letter-spacing: -1.6px;
-  --leo-typography-desktop-primary-h3-line-height: 44px;
-  --leo-typography-desktop-primary-h3-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h3-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h4-font-size: 30px;
-  --leo-typography-desktop-primary-h4-font-weight: 600;
-  --leo-typography-desktop-primary-h4-letter-spacing: -1.2px;
-  --leo-typography-desktop-primary-h4-line-height: 40px;
-  --leo-typography-desktop-primary-h4-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h4-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-h5-font-size: 24px;
-  --leo-typography-desktop-primary-h5-font-weight: 600;
-  --leo-typography-desktop-primary-h5-letter-spacing: -0.48px;
-  --leo-typography-desktop-primary-h5-line-height: 30px;
-  --leo-typography-desktop-primary-h5-paragraph-indent: 0;
-  --leo-typography-desktop-primary-h5-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-hero-font-size: 120px;
-  --leo-typography-desktop-primary-hero-font-weight: 600;
-  --leo-typography-desktop-primary-hero-letter-spacing: -4.8px;
-  --leo-typography-desktop-primary-hero-line-height: 130px;
-  --leo-typography-desktop-primary-hero-paragraph-indent: 0;
-  --leo-typography-desktop-primary-hero-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-text-default-font-size: 20px;
-  --leo-typography-desktop-primary-text-default-font-weight: 400;
-  --leo-typography-desktop-primary-text-default-letter-spacing: 0;
-  --leo-typography-desktop-primary-text-default-line-height: 30px;
-  --leo-typography-desktop-primary-text-default-paragraph-indent: 0;
-  --leo-typography-desktop-primary-text-default-paragraph-spacing: 0;
-  --leo-typography-desktop-primary-text-small-font-size: 15px;
-  --leo-typography-desktop-primary-text-small-font-weight: 700;
-  --leo-typography-desktop-primary-text-small-letter-spacing: -0.45px;
-  --leo-typography-desktop-primary-text-small-line-height: 20px;
-  --leo-typography-desktop-primary-text-small-paragraph-indent: 0;
-  --leo-typography-desktop-primary-text-small-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h1-font-size: 100px;
-  --leo-typography-desktop-secondary-h1-font-weight: 500;
-  --leo-typography-desktop-secondary-h1-letter-spacing: -2px;
-  --leo-typography-desktop-secondary-h1-line-height: 95px;
-  --leo-typography-desktop-secondary-h1-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h1-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h2-font-size: 80px;
-  --leo-typography-desktop-secondary-h2-font-weight: 500;
-  --leo-typography-desktop-secondary-h2-letter-spacing: -1.6px;
-  --leo-typography-desktop-secondary-h2-line-height: 75px;
-  --leo-typography-desktop-secondary-h2-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h2-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h3-font-size: 70px;
-  --leo-typography-desktop-secondary-h3-font-weight: 500;
-  --leo-typography-desktop-secondary-h3-letter-spacing: -1.4px;
-  --leo-typography-desktop-secondary-h3-line-height: 75px;
-  --leo-typography-desktop-secondary-h3-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h3-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h4-font-size: 40px;
-  --leo-typography-desktop-secondary-h4-font-weight: 500;
-  --leo-typography-desktop-secondary-h4-letter-spacing: -0.8px;
-  --leo-typography-desktop-secondary-h4-line-height: 45px;
-  --leo-typography-desktop-secondary-h4-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h4-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-h5-font-size: 30px;
-  --leo-typography-desktop-secondary-h5-font-weight: 500;
-  --leo-typography-desktop-secondary-h5-letter-spacing: -0.6px;
-  --leo-typography-desktop-secondary-h5-line-height: 40px;
-  --leo-typography-desktop-secondary-h5-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-h5-paragraph-spacing: 0;
-  --leo-typography-desktop-secondary-hero-font-size: 120px;
-  --leo-typography-desktop-secondary-hero-font-weight: 500;
-  --leo-typography-desktop-secondary-hero-letter-spacing: -2.4px;
-  --leo-typography-desktop-secondary-hero-line-height: 103px;
-  --leo-typography-desktop-secondary-hero-paragraph-indent: 0;
-  --leo-typography-desktop-secondary-hero-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-blockquote-font-size: 20px;
-  --leo-typography-mobile-primary-blockquote-font-weight: 600;
-  --leo-typography-mobile-primary-blockquote-letter-spacing: -0.4px;
-  --leo-typography-mobile-primary-blockquote-line-height: 28px;
-  --leo-typography-mobile-primary-blockquote-paragraph-indent: 0;
-  --leo-typography-mobile-primary-blockquote-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h1-font-size: 36px;
-  --leo-typography-mobile-primary-h1-font-weight: 600;
-  --leo-typography-mobile-primary-h1-letter-spacing: -1.44px;
-  --leo-typography-mobile-primary-h1-line-height: 45px;
-  --leo-typography-mobile-primary-h1-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h1-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h2-font-size: 30px;
-  --leo-typography-mobile-primary-h2-font-weight: 600;
-  --leo-typography-mobile-primary-h2-letter-spacing: -1.2px;
-  --leo-typography-mobile-primary-h2-line-height: 40px;
-  --leo-typography-mobile-primary-h2-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h2-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h3-font-size: 24px;
-  --leo-typography-mobile-primary-h3-font-weight: 600;
-  --leo-typography-mobile-primary-h3-letter-spacing: -0.96px;
-  --leo-typography-mobile-primary-h3-line-height: 35px;
-  --leo-typography-mobile-primary-h3-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h3-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h4-font-size: 20px;
-  --leo-typography-mobile-primary-h4-font-weight: 600;
-  --leo-typography-mobile-primary-h4-letter-spacing: -0.8px;
-  --leo-typography-mobile-primary-h4-line-height: 25px;
-  --leo-typography-mobile-primary-h4-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h4-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-h5-font-size: 18px;
-  --leo-typography-mobile-primary-h5-font-weight: 600;
-  --leo-typography-mobile-primary-h5-letter-spacing: -0.72px;
-  --leo-typography-mobile-primary-h5-line-height: 20px;
-  --leo-typography-mobile-primary-h5-paragraph-indent: 0;
-  --leo-typography-mobile-primary-h5-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-hero-font-size: 54px;
-  --leo-typography-mobile-primary-hero-font-weight: 600;
-  --leo-typography-mobile-primary-hero-letter-spacing: -2.16px;
-  --leo-typography-mobile-primary-hero-line-height: 65px;
-  --leo-typography-mobile-primary-hero-paragraph-indent: 0;
-  --leo-typography-mobile-primary-hero-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-text-default-font-size: 18px;
-  --leo-typography-mobile-primary-text-default-font-weight: 400;
-  --leo-typography-mobile-primary-text-default-letter-spacing: 0;
-  --leo-typography-mobile-primary-text-default-line-height: 28px;
-  --leo-typography-mobile-primary-text-default-paragraph-indent: 0;
-  --leo-typography-mobile-primary-text-default-paragraph-spacing: 0;
-  --leo-typography-mobile-primary-text-small-font-size: 15px;
-  --leo-typography-mobile-primary-text-small-font-weight: 700;
-  --leo-typography-mobile-primary-text-small-letter-spacing: 0;
-  --leo-typography-mobile-primary-text-small-line-height: 20px;
-  --leo-typography-mobile-primary-text-small-paragraph-indent: 0;
-  --leo-typography-mobile-primary-text-small-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h1-font-size: 40px;
-  --leo-typography-mobile-secondary-h1-font-weight: 500;
-  --leo-typography-mobile-secondary-h1-letter-spacing: -0.8px;
-  --leo-typography-mobile-secondary-h1-line-height: 45px;
-  --leo-typography-mobile-secondary-h1-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h1-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h2-font-size: 36px;
-  --leo-typography-mobile-secondary-h2-font-weight: 500;
-  --leo-typography-mobile-secondary-h2-letter-spacing: -0.72px;
-  --leo-typography-mobile-secondary-h2-line-height: 40px;
-  --leo-typography-mobile-secondary-h2-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h2-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h3-font-size: 30px;
-  --leo-typography-mobile-secondary-h3-font-weight: 500;
-  --leo-typography-mobile-secondary-h3-letter-spacing: -0.6px;
-  --leo-typography-mobile-secondary-h3-line-height: 30px;
-  --leo-typography-mobile-secondary-h3-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h3-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h4-font-size: 24px;
-  --leo-typography-mobile-secondary-h4-font-weight: 500;
-  --leo-typography-mobile-secondary-h4-letter-spacing: -0.48px;
-  --leo-typography-mobile-secondary-h4-line-height: 30px;
-  --leo-typography-mobile-secondary-h4-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h4-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-h5-font-size: 20px;
-  --leo-typography-mobile-secondary-h5-font-weight: 500;
-  --leo-typography-mobile-secondary-h5-letter-spacing: -0.4px;
-  --leo-typography-mobile-secondary-h5-line-height: 25px;
-  --leo-typography-mobile-secondary-h5-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-h5-paragraph-spacing: 0;
-  --leo-typography-mobile-secondary-hero-font-size: 54px;
-  --leo-typography-mobile-secondary-hero-font-weight: 500;
-  --leo-typography-mobile-secondary-hero-letter-spacing: -1.08px;
-  --leo-typography-mobile-secondary-hero-line-height: 50px;
-  --leo-typography-mobile-secondary-hero-paragraph-indent: 0;
-  --leo-typography-mobile-secondary-hero-paragraph-spacing: 0;
+  --leo-font-default-link: 400 14px/22px Inter Variable;
+  --leo-font-default-regular: 400 14px/22px Inter Variable;
+  --leo-font-default-semibold: 600 14px/22px Inter Variable;
+  --leo-font-display-primary-blockquote: 600 20px/30px Inter Variable;
+  --leo-font-display-primary-h1: 600 80px/100px Inter Variable;
+  --leo-font-display-primary-h2: 600 70px/90px Inter Variable;
+  --leo-font-display-primary-h3: 600 40px/70px Inter Variable;
+  --leo-font-display-primary-h4: 600 30px/40px Inter Variable;
+  --leo-font-display-primary-h5: 600 24px/30px Inter Variable;
+  --leo-font-display-primary-hero: 600 120px/130px Inter Variable;
+  --leo-font-display-primary-text-default: 400 20px/30px Inter Variable;
+  --leo-font-display-primary-text-small: 700 15px/20px Inter Variable;
+  --leo-font-display-secondary-h1: 500 100px/95px Flecha M;
+  --leo-font-display-secondary-h2: 500 80px/75px Flecha M;
+  --leo-font-display-secondary-h3: 500 70px/75px Flecha M;
+  --leo-font-display-secondary-h4: 500 40px/45px Flecha M;
+  --leo-font-display-secondary-h5: 500 30px/40px Flecha M;
+  --leo-font-display-secondary-hero: 500 120px/103px Flecha M;
+  --leo-font-heading-display1: 600 46px/54px Inter Variable;
+  --leo-font-heading-display2: 600 40px/48px Inter Variable;
+  --leo-font-heading-display3: 600 34px/40px Inter Variable;
+  --leo-font-heading-h1: 600 28px/34px Inter Variable;
+  --leo-font-heading-h2: 600 22px/28px Inter Variable;
+  --leo-font-heading-h3: 600 20px/26px Inter Variable;
+  --leo-font-heading-h4: 600 16px/24px Inter Variable;
+  --leo-font-large-link: 400 16px/24px Inter Variable;
+  --leo-font-large-regular: 400 16px/24px Inter Variable;
+  --leo-font-large-semibold: 600 16px/24px Inter Variable;
+  --leo-font-monospace-default: 400 14px/22px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-monospace-large: 400 16px/24px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-monospace-small: 400 12px/18px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-small-link: 400 12px/18px Inter Variable;
+  --leo-font-small-regular: 400 12px/18px Inter Variable;
+  --leo-font-small-semibold: 600 12px/18px Inter Variable;
+  --leo-font-x-large-link: 400 20px/30px Inter Variable;
+  --leo-font-x-large-regular: 400 20px/30px Inter Variable;
+  --leo-font-x-large-semibold: 600 20px/30px Inter Variable;
+  --leo-font-x-small-link: 400 11px/16px Inter Variable;
+  --leo-font-x-small-regular: 400 11px/16px Inter Variable;
+  --leo-font-x-small-semibold: 600 11px/16px Inter Variable;
+  --leo-typography-default-link-font-size: 14px;
+  --leo-typography-default-link-font-weight: 400;
+  --leo-typography-default-link-letter-spacing: -0.23px;
+  --leo-typography-default-link-line-height: 22px;
+  --leo-typography-default-link-paragraph-indent: 0;
+  --leo-typography-default-link-paragraph-spacing: 8px;
+  --leo-typography-default-regular-font-size: 14px;
+  --leo-typography-default-regular-font-weight: 400;
+  --leo-typography-default-regular-letter-spacing: -0.23px;
+  --leo-typography-default-regular-line-height: 22px;
+  --leo-typography-default-regular-paragraph-indent: 0;
+  --leo-typography-default-regular-paragraph-spacing: 8px;
+  --leo-typography-default-semibold-font-size: 14px;
+  --leo-typography-default-semibold-font-weight: 600;
+  --leo-typography-default-semibold-letter-spacing: -0.23px;
+  --leo-typography-default-semibold-line-height: 22px;
+  --leo-typography-default-semibold-paragraph-indent: 0;
+  --leo-typography-default-semibold-paragraph-spacing: 8px;
+  --leo-typography-display-primary-blockquote-font-size: 20px;
+  --leo-typography-display-primary-blockquote-font-weight: 600;
+  --leo-typography-display-primary-blockquote-letter-spacing: -0.4px;
+  --leo-typography-display-primary-blockquote-line-height: 30px;
+  --leo-typography-display-primary-blockquote-paragraph-indent: 0;
+  --leo-typography-display-primary-blockquote-paragraph-spacing: 8px;
+  --leo-typography-display-primary-h1-font-size: 80px;
+  --leo-typography-display-primary-h1-font-weight: 600;
+  --leo-typography-display-primary-h1-letter-spacing: -1.6px;
+  --leo-typography-display-primary-h1-line-height: 100px;
+  --leo-typography-display-primary-h1-paragraph-indent: 0;
+  --leo-typography-display-primary-h1-paragraph-spacing: 0;
+  --leo-typography-display-primary-h2-font-size: 70px;
+  --leo-typography-display-primary-h2-font-weight: 600;
+  --leo-typography-display-primary-h2-letter-spacing: -1.4px;
+  --leo-typography-display-primary-h2-line-height: 90px;
+  --leo-typography-display-primary-h2-paragraph-indent: 0;
+  --leo-typography-display-primary-h2-paragraph-spacing: 0;
+  --leo-typography-display-primary-h3-font-size: 40px;
+  --leo-typography-display-primary-h3-font-weight: 600;
+  --leo-typography-display-primary-h3-letter-spacing: -0.8px;
+  --leo-typography-display-primary-h3-line-height: 70px;
+  --leo-typography-display-primary-h3-paragraph-indent: 0;
+  --leo-typography-display-primary-h3-paragraph-spacing: 0;
+  --leo-typography-display-primary-h4-font-size: 30px;
+  --leo-typography-display-primary-h4-font-weight: 600;
+  --leo-typography-display-primary-h4-letter-spacing: -0.6px;
+  --leo-typography-display-primary-h4-line-height: 40px;
+  --leo-typography-display-primary-h4-paragraph-indent: 0;
+  --leo-typography-display-primary-h4-paragraph-spacing: 0;
+  --leo-typography-display-primary-h5-font-size: 24px;
+  --leo-typography-display-primary-h5-font-weight: 600;
+  --leo-typography-display-primary-h5-letter-spacing: -0.48px;
+  --leo-typography-display-primary-h5-line-height: 30px;
+  --leo-typography-display-primary-h5-paragraph-indent: 0;
+  --leo-typography-display-primary-h5-paragraph-spacing: 0;
+  --leo-typography-display-primary-hero-font-size: 120px;
+  --leo-typography-display-primary-hero-font-weight: 600;
+  --leo-typography-display-primary-hero-letter-spacing: -2.4px;
+  --leo-typography-display-primary-hero-line-height: 130px;
+  --leo-typography-display-primary-hero-paragraph-indent: 0;
+  --leo-typography-display-primary-hero-paragraph-spacing: 0;
+  --leo-typography-display-primary-text-default-font-size: 20px;
+  --leo-typography-display-primary-text-default-font-weight: 400;
+  --leo-typography-display-primary-text-default-letter-spacing: -0.4px;
+  --leo-typography-display-primary-text-default-line-height: 30px;
+  --leo-typography-display-primary-text-default-paragraph-indent: 0;
+  --leo-typography-display-primary-text-default-paragraph-spacing: 8px;
+  --leo-typography-display-primary-text-small-font-size: 15px;
+  --leo-typography-display-primary-text-small-font-weight: 700;
+  --leo-typography-display-primary-text-small-letter-spacing: -0.3px;
+  --leo-typography-display-primary-text-small-line-height: 20px;
+  --leo-typography-display-primary-text-small-paragraph-indent: 0;
+  --leo-typography-display-primary-text-small-paragraph-spacing: 8px;
+  --leo-typography-display-secondary-h1-font-size: 100px;
+  --leo-typography-display-secondary-h1-font-weight: 500;
+  --leo-typography-display-secondary-h1-letter-spacing: -2px;
+  --leo-typography-display-secondary-h1-line-height: 95px;
+  --leo-typography-display-secondary-h1-paragraph-indent: 0;
+  --leo-typography-display-secondary-h1-paragraph-spacing: 0;
+  --leo-typography-display-secondary-h2-font-size: 80px;
+  --leo-typography-display-secondary-h2-font-weight: 500;
+  --leo-typography-display-secondary-h2-letter-spacing: -1.6px;
+  --leo-typography-display-secondary-h2-line-height: 75px;
+  --leo-typography-display-secondary-h2-paragraph-indent: 0;
+  --leo-typography-display-secondary-h2-paragraph-spacing: 0;
+  --leo-typography-display-secondary-h3-font-size: 70px;
+  --leo-typography-display-secondary-h3-font-weight: 500;
+  --leo-typography-display-secondary-h3-letter-spacing: -1.4px;
+  --leo-typography-display-secondary-h3-line-height: 75px;
+  --leo-typography-display-secondary-h3-paragraph-indent: 0;
+  --leo-typography-display-secondary-h3-paragraph-spacing: 0;
+  --leo-typography-display-secondary-h4-font-size: 40px;
+  --leo-typography-display-secondary-h4-font-weight: 500;
+  --leo-typography-display-secondary-h4-letter-spacing: -0.8px;
+  --leo-typography-display-secondary-h4-line-height: 45px;
+  --leo-typography-display-secondary-h4-paragraph-indent: 0;
+  --leo-typography-display-secondary-h4-paragraph-spacing: 0;
+  --leo-typography-display-secondary-h5-font-size: 30px;
+  --leo-typography-display-secondary-h5-font-weight: 500;
+  --leo-typography-display-secondary-h5-letter-spacing: -0.6px;
+  --leo-typography-display-secondary-h5-line-height: 40px;
+  --leo-typography-display-secondary-h5-paragraph-indent: 0;
+  --leo-typography-display-secondary-h5-paragraph-spacing: 0;
+  --leo-typography-display-secondary-hero-font-size: 120px;
+  --leo-typography-display-secondary-hero-font-weight: 500;
+  --leo-typography-display-secondary-hero-letter-spacing: -2.4px;
+  --leo-typography-display-secondary-hero-line-height: 103px;
+  --leo-typography-display-secondary-hero-paragraph-indent: 0;
+  --leo-typography-display-secondary-hero-paragraph-spacing: 0;
+  --leo-typography-font-size-primary-blockquote: 20px;
+  --leo-typography-font-size-primary-default: 20px;
+  --leo-typography-font-size-primary-h1: 80px;
+  --leo-typography-font-size-primary-h2: 70px;
+  --leo-typography-font-size-primary-h3: 40px;
+  --leo-typography-font-size-primary-h4: 30px;
+  --leo-typography-font-size-primary-h5: 24px;
+  --leo-typography-font-size-primary-hero: 120px;
+  --leo-typography-font-size-primary-small: 15px;
+  --leo-typography-font-size-secondary-blockquote: 20px;
+  --leo-typography-font-size-secondary-default: 20px;
+  --leo-typography-font-size-secondary-h1: 100px;
+  --leo-typography-font-size-secondary-h2: 80px;
+  --leo-typography-font-size-secondary-h3: 70px;
+  --leo-typography-font-size-secondary-h4: 40px;
+  --leo-typography-font-size-secondary-h5: 30px;
+  --leo-typography-font-size-secondary-hero: 120px;
+  --leo-typography-font-size-secondary-small: 15px;
+  --leo-typography-heading-display1-font-size: 46px;
+  --leo-typography-heading-display1-font-weight: 600;
+  --leo-typography-heading-display1-letter-spacing: -0.5px;
+  --leo-typography-heading-display1-line-height: 54px;
+  --leo-typography-heading-display1-paragraph-indent: 0;
+  --leo-typography-heading-display1-paragraph-spacing: 8px;
+  --leo-typography-heading-display2-font-size: 40px;
+  --leo-typography-heading-display2-font-weight: 600;
+  --leo-typography-heading-display2-letter-spacing: -0.5px;
+  --leo-typography-heading-display2-line-height: 48px;
+  --leo-typography-heading-display2-paragraph-indent: 0;
+  --leo-typography-heading-display2-paragraph-spacing: 8px;
+  --leo-typography-heading-display3-font-size: 34px;
+  --leo-typography-heading-display3-font-weight: 600;
+  --leo-typography-heading-display3-letter-spacing: -0.5px;
+  --leo-typography-heading-display3-line-height: 40px;
+  --leo-typography-heading-display3-paragraph-indent: 0;
+  --leo-typography-heading-display3-paragraph-spacing: 8px;
+  --leo-typography-heading-h1-font-size: 28px;
+  --leo-typography-heading-h1-font-weight: 600;
+  --leo-typography-heading-h1-letter-spacing: -0.5px;
+  --leo-typography-heading-h1-line-height: 34px;
+  --leo-typography-heading-h1-paragraph-indent: 0;
+  --leo-typography-heading-h1-paragraph-spacing: 8px;
+  --leo-typography-heading-h2-font-size: 22px;
+  --leo-typography-heading-h2-font-weight: 600;
+  --leo-typography-heading-h2-letter-spacing: -0.5px;
+  --leo-typography-heading-h2-line-height: 28px;
+  --leo-typography-heading-h2-paragraph-indent: 0;
+  --leo-typography-heading-h2-paragraph-spacing: 8px;
+  --leo-typography-heading-h3-font-size: 20px;
+  --leo-typography-heading-h3-font-weight: 600;
+  --leo-typography-heading-h3-letter-spacing: -0.5px;
+  --leo-typography-heading-h3-line-height: 26px;
+  --leo-typography-heading-h3-paragraph-indent: 0;
+  --leo-typography-heading-h3-paragraph-spacing: 8px;
+  --leo-typography-heading-h4-font-size: 16px;
+  --leo-typography-heading-h4-font-weight: 600;
+  --leo-typography-heading-h4-letter-spacing: -0.23px;
+  --leo-typography-heading-h4-line-height: 24px;
+  --leo-typography-heading-h4-paragraph-indent: 0;
+  --leo-typography-heading-h4-paragraph-spacing: 8px;
+  --leo-typography-large-link-font-size: 16px;
+  --leo-typography-large-link-font-weight: 400;
+  --leo-typography-large-link-letter-spacing: -0.23px;
+  --leo-typography-large-link-line-height: 24px;
+  --leo-typography-large-link-paragraph-indent: 0;
+  --leo-typography-large-link-paragraph-spacing: 8px;
+  --leo-typography-large-regular-font-size: 16px;
+  --leo-typography-large-regular-font-weight: 400;
+  --leo-typography-large-regular-letter-spacing: -0.23px;
+  --leo-typography-large-regular-line-height: 24px;
+  --leo-typography-large-regular-paragraph-indent: 0;
+  --leo-typography-large-regular-paragraph-spacing: 8px;
+  --leo-typography-large-semibold-font-size: 16px;
+  --leo-typography-large-semibold-font-weight: 600;
+  --leo-typography-large-semibold-letter-spacing: -0.23px;
+  --leo-typography-large-semibold-line-height: 24px;
+  --leo-typography-large-semibold-paragraph-indent: 0;
+  --leo-typography-large-semibold-paragraph-spacing: 8px;
+  --leo-typography-line-height-primary-blockquote: 30px;
+  --leo-typography-line-height-primary-default: 30px;
+  --leo-typography-line-height-primary-h1: 100px;
+  --leo-typography-line-height-primary-h2: 90px;
+  --leo-typography-line-height-primary-h3: 44px;
+  --leo-typography-line-height-primary-h4: 40px;
+  --leo-typography-line-height-primary-h5: 30px;
+  --leo-typography-line-height-primary-hero: 130px;
+  --leo-typography-line-height-primary-small: 20px;
+  --leo-typography-line-height-secondary-blockquote: 20px;
+  --leo-typography-line-height-secondary-default: 20px;
+  --leo-typography-line-height-secondary-h1: 95px;
+  --leo-typography-line-height-secondary-h2: 75px;
+  --leo-typography-line-height-secondary-h3: 75px;
+  --leo-typography-line-height-secondary-h4: 45px;
+  --leo-typography-line-height-secondary-h5: 40px;
+  --leo-typography-line-height-secondary-hero: 103px;
+  --leo-typography-line-height-secondary-small: 15px;
+  --leo-typography-mobile-font-size-primary-blockquote: 20px;
+  --leo-typography-mobile-font-size-primary-default: 18px;
+  --leo-typography-mobile-font-size-primary-h1: 36px;
+  --leo-typography-mobile-font-size-primary-h2: 30px;
+  --leo-typography-mobile-font-size-primary-h3: 24px;
+  --leo-typography-mobile-font-size-primary-h4: 20px;
+  --leo-typography-mobile-font-size-primary-h5: 18px;
+  --leo-typography-mobile-font-size-primary-hero: 54px;
+  --leo-typography-mobile-font-size-primary-small: 18px;
+  --leo-typography-mobile-font-size-secondary-blockquote: 20px;
+  --leo-typography-mobile-font-size-secondary-default: 18px;
+  --leo-typography-mobile-font-size-secondary-h1: 36px;
+  --leo-typography-mobile-font-size-secondary-h2: 36px;
+  --leo-typography-mobile-font-size-secondary-h3: 30px;
+  --leo-typography-mobile-font-size-secondary-h4: 24px;
+  --leo-typography-mobile-font-size-secondary-h5: 20px;
+  --leo-typography-mobile-font-size-secondary-hero: 54px;
+  --leo-typography-mobile-font-size-secondary-small: 18px;
+  --leo-typography-mobile-line-height-primary-blockquote: 28px;
+  --leo-typography-mobile-line-height-primary-default: 28px;
+  --leo-typography-mobile-line-height-primary-h1: 45px;
+  --leo-typography-mobile-line-height-primary-h2: 40px;
+  --leo-typography-mobile-line-height-primary-h3: 35px;
+  --leo-typography-mobile-line-height-primary-h4: 25px;
+  --leo-typography-mobile-line-height-primary-h5: 20px;
+  --leo-typography-mobile-line-height-primary-hero: 65px;
+  --leo-typography-mobile-line-height-primary-small: 20px;
+  --leo-typography-mobile-line-height-secondary-blockquote: 20px;
+  --leo-typography-mobile-line-height-secondary-default: 18px;
+  --leo-typography-mobile-line-height-secondary-h1: 45px;
+  --leo-typography-mobile-line-height-secondary-h2: 40px;
+  --leo-typography-mobile-line-height-secondary-h3: 30px;
+  --leo-typography-mobile-line-height-secondary-h4: 30px;
+  --leo-typography-mobile-line-height-secondary-h5: 25px;
+  --leo-typography-mobile-line-height-secondary-hero: 50px;
+  --leo-typography-mobile-line-height-secondary-small: 18px;
+  --leo-typography-monospace-default-font-size: 14px;
+  --leo-typography-monospace-default-font-weight: 400;
+  --leo-typography-monospace-default-letter-spacing: 0;
+  --leo-typography-monospace-default-line-height: 22px;
+  --leo-typography-monospace-default-paragraph-indent: 0;
+  --leo-typography-monospace-default-paragraph-spacing: 8px;
+  --leo-typography-monospace-large-font-size: 16px;
+  --leo-typography-monospace-large-font-weight: 400;
+  --leo-typography-monospace-large-letter-spacing: 0;
+  --leo-typography-monospace-large-line-height: 24px;
+  --leo-typography-monospace-large-paragraph-indent: 0;
+  --leo-typography-monospace-large-paragraph-spacing: 8px;
+  --leo-typography-monospace-small-font-size: 12px;
+  --leo-typography-monospace-small-font-weight: 400;
+  --leo-typography-monospace-small-letter-spacing: 0;
+  --leo-typography-monospace-small-line-height: 18px;
+  --leo-typography-monospace-small-paragraph-indent: 0;
+  --leo-typography-monospace-small-paragraph-spacing: 8px;
+  --leo-typography-small-link-font-size: 12px;
+  --leo-typography-small-link-font-weight: 400;
+  --leo-typography-small-link-letter-spacing: -0.08px;
+  --leo-typography-small-link-line-height: 18px;
+  --leo-typography-small-link-paragraph-indent: 0;
+  --leo-typography-small-link-paragraph-spacing: 8px;
+  --leo-typography-small-regular-font-size: 12px;
+  --leo-typography-small-regular-font-weight: 400;
+  --leo-typography-small-regular-letter-spacing: -0.08px;
+  --leo-typography-small-regular-line-height: 18px;
+  --leo-typography-small-regular-paragraph-indent: 0;
+  --leo-typography-small-regular-paragraph-spacing: 8px;
+  --leo-typography-small-semibold-font-size: 12px;
+  --leo-typography-small-semibold-font-weight: 600;
+  --leo-typography-small-semibold-letter-spacing: -0.08px;
+  --leo-typography-small-semibold-line-height: 18px;
+  --leo-typography-small-semibold-paragraph-indent: 0;
+  --leo-typography-small-semibold-paragraph-spacing: 8px;
+  --leo-typography-x-large-link-font-size: 20px;
+  --leo-typography-x-large-link-font-weight: 400;
+  --leo-typography-x-large-link-letter-spacing: -0.23px;
+  --leo-typography-x-large-link-line-height: 30px;
+  --leo-typography-x-large-link-paragraph-indent: 0;
+  --leo-typography-x-large-link-paragraph-spacing: 8px;
+  --leo-typography-x-large-regular-font-size: 20px;
+  --leo-typography-x-large-regular-font-weight: 400;
+  --leo-typography-x-large-regular-letter-spacing: -0.23px;
+  --leo-typography-x-large-regular-line-height: 30px;
+  --leo-typography-x-large-regular-paragraph-indent: 0;
+  --leo-typography-x-large-regular-paragraph-spacing: 8px;
+  --leo-typography-x-large-semibold-font-size: 20px;
+  --leo-typography-x-large-semibold-font-weight: 600;
+  --leo-typography-x-large-semibold-letter-spacing: -0.23px;
+  --leo-typography-x-large-semibold-line-height: 30px;
+  --leo-typography-x-large-semibold-paragraph-indent: 0;
+  --leo-typography-x-large-semibold-paragraph-spacing: 8px;
+  --leo-typography-x-small-link-font-size: 11px;
+  --leo-typography-x-small-link-font-weight: 400;
+  --leo-typography-x-small-link-letter-spacing: -0.08px;
+  --leo-typography-x-small-link-line-height: 16px;
+  --leo-typography-x-small-link-paragraph-indent: 0;
+  --leo-typography-x-small-link-paragraph-spacing: 8px;
+  --leo-typography-x-small-regular-font-size: 11px;
+  --leo-typography-x-small-regular-font-weight: 400;
+  --leo-typography-x-small-regular-letter-spacing: -0.08px;
+  --leo-typography-x-small-regular-line-height: 16px;
+  --leo-typography-x-small-regular-paragraph-indent: 0;
+  --leo-typography-x-small-regular-paragraph-spacing: 8px;
+  --leo-typography-x-small-semibold-font-size: 11px;
+  --leo-typography-x-small-semibold-font-weight: 600;
+  --leo-typography-x-small-semibold-letter-spacing: -0.08px;
+  --leo-typography-x-small-semibold-line-height: 16px;
+  --leo-typography-x-small-semibold-paragraph-indent: 0;
+  --leo-typography-x-small-semibold-paragraph-spacing: 8px;
 }
 
 @media (prefers-color-scheme: light) {
Variables Diff: variables-news.diff
--- ./tokens/css/variables-news.old.css	2026-03-11 20:34:39.851643631 +0000
+++ ./tokens/css/variables-news.css	2026-03-11 20:34:03.630828486 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
Variables Diff: variables-newtab.diff
--- ./tokens/css/variables-newtab.old.css	2026-03-11 20:34:40.073276662 +0000
+++ ./tokens/css/variables-newtab.css	2026-03-11 20:34:03.639828660 +0000
@@ -1,18 +1,17 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-brave-rewards-widget-progress: 400 24px/24px Poppins;
-  --leo-font-brave-rewards-widget-token-balance: 400 36px/36px Poppins;
-  --leo-font-stats-h2: 400 40px/40px Poppins;
-  --leo-font-stats-h3: 500 20px/24px Poppins;
-  --leo-gradient-ntp-overlay: linear-gradient(359.99997954866785deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.5) 100%);
-  --leo-typography-brave-rewards-widget-progress-font-size: 24px;
+  --leo-font-brave-rewards-widget-progress: 400 22px/22px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-brave-rewards-widget-token-balance: 400 36px/36px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-stats-h2: 400 40px/40px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-font-stats-h3: 500 20px/24px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+  --leo-typography-brave-rewards-widget-progress-font-size: 22px;
   --leo-typography-brave-rewards-widget-progress-font-weight: 400;
   --leo-typography-brave-rewards-widget-progress-letter-spacing: 0;
-  --leo-typography-brave-rewards-widget-progress-line-height: 24px;
+  --leo-typography-brave-rewards-widget-progress-line-height: 22px;
   --leo-typography-brave-rewards-widget-progress-paragraph-indent: 0;
   --leo-typography-brave-rewards-widget-progress-paragraph-spacing: 0;
   --leo-typography-brave-rewards-widget-token-balance-font-size: 36px;
Variables Diff: variables-search.diff
--- ./tokens/css/variables-search.old.css	2026-03-11 20:34:40.210115080 +0000
+++ ./tokens/css/variables-search.css	2026-03-11 20:34:03.607828039 +0000
@@ -1,63 +1,29 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
-  --leo-font-heading-h5: 600 20px/26px Inter Variable;
-  --leo-font-heading-serpresult: 400 18px/26px Inter Variable;
   --leo-font-search-snippet-title: 500 18px/26px Inter Variable;
-  --leo-font-text-small-bold: 600 13px/21px Inter Variable;
-  --leo-font-text-small-link: 600 13px/21px Inter Variable;
-  --leo-font-text-small-regular: 400 13px/21px Inter Variable;
   --leo-gradient-content-fade-dark: linear-gradient(180deg, rgba(23, 25, 30, 0) 37%, rgb(23, 25, 30) 92%);
   --leo-gradient-content-fade-light: linear-gradient(180deg, rgba(255, 255, 255, 0) 37%, rgb(255, 255, 255) 92%);
   --leo-gradient-search-navigation: linear-gradient(307.16553222317134deg, rgb(191, 20, 162) 0%, rgb(247, 58, 28) 100%);
-  --leo-typography-heading-h5-font-size: 20px;
-  --leo-typography-heading-h5-font-weight: 600;
-  --leo-typography-heading-h5-letter-spacing: -0.5px;
-  --leo-typography-heading-h5-line-height: 26px;
-  --leo-typography-heading-h5-paragraph-indent: 0;
-  --leo-typography-heading-h5-paragraph-spacing: 0;
-  --leo-typography-heading-serpresult-font-size: 18px;
-  --leo-typography-heading-serpresult-font-weight: 400;
-  --leo-typography-heading-serpresult-letter-spacing: 0;
-  --leo-typography-heading-serpresult-line-height: 26px;
-  --leo-typography-heading-serpresult-paragraph-indent: 0;
-  --leo-typography-heading-serpresult-paragraph-spacing: 0;
   --leo-typography-search-snippet-title-font-size: 18px;
   --leo-typography-search-snippet-title-font-weight: 500;
   --leo-typography-search-snippet-title-letter-spacing: 0;
   --leo-typography-search-snippet-title-line-height: 26px;
   --leo-typography-search-snippet-title-paragraph-indent: 0;
   --leo-typography-search-snippet-title-paragraph-spacing: 0;
-  --leo-typography-text-small-bold-font-size: 13px;
-  --leo-typography-text-small-bold-font-weight: 600;
-  --leo-typography-text-small-bold-letter-spacing: -0.2px;
-  --leo-typography-text-small-bold-line-height: 21px;
-  --leo-typography-text-small-bold-paragraph-indent: 0;
-  --leo-typography-text-small-bold-paragraph-spacing: 0;
-  --leo-typography-text-small-link-font-size: 13px;
-  --leo-typography-text-small-link-font-weight: 600;
-  --leo-typography-text-small-link-letter-spacing: -0.2px;
-  --leo-typography-text-small-link-line-height: 21px;
-  --leo-typography-text-small-link-paragraph-indent: 0;
-  --leo-typography-text-small-link-paragraph-spacing: 0;
-  --leo-typography-text-small-regular-font-size: 13px;
-  --leo-typography-text-small-regular-font-weight: 400;
-  --leo-typography-text-small-regular-letter-spacing: -0.2px;
-  --leo-typography-text-small-regular-line-height: 21px;
-  --leo-typography-text-small-regular-paragraph-indent: 0;
-  --leo-typography-text-small-regular-paragraph-spacing: 0;
 }
 
 @media (prefers-color-scheme: light) {
  :root {
   --leo-color-search-background-ask-input-field: var(--leo-color-schemes-surface-container-lowest);
   --leo-color-search-background-container: var(--leo-color-schemes-surface-container-lowest);
-  --leo-color-search-background-container-interactive: var(--leo-color-primary-10);
   --leo-color-search-background-enrichment-cards: var(--leo-color-neutral-5);
   --leo-color-search-background-highlight: var(--leo-color-neutral-10);
+  --leo-color-search-background-interactive-normal: var(--leo-color-primary-10);
+  --leo-color-search-background-interactive-pale: var(--leo-color-primary-5);
   --leo-color-search-background-landing-page: #eef2f6;
   --leo-color-search-background-page: var(--leo-color-schemes-surface-container-lowest);
   --leo-color-search-background-search-bar: var(--leo-color-schemes-surface-container-lowest);
@@ -169,9 +135,10 @@
  :root {
   --leo-color-search-background-ask-input-field: var(--leo-color-schemes-surface-container-highest);
   --leo-color-search-background-container: var(--leo-color-schemes-surface-container);
-  --leo-color-search-background-container-interactive: var(--leo-color-search-primary-10);
   --leo-color-search-background-enrichment-cards: var(--leo-color-neutral-10);
   --leo-color-search-background-highlight: var(--leo-color-neutral-20);
+  --leo-color-search-background-interactive-normal: var(--leo-color-primitive-primary-25);
+  --leo-color-search-background-interactive-pale: var(--leo-color-primitive-primary-30);
   --leo-color-search-background-landing-page: #1e2028;
   --leo-color-search-background-page: var(--leo-color-primitive-neutral-10);
   --leo-color-search-background-search-bar: var(--leo-color-schemes-surface-container-highest);
@@ -196,7 +163,7 @@
   --leo-color-search-button-pale-background-normal: var(--leo-color-search-primary-10);
   --leo-color-search-divider-ask-input-field: var(--leo-color-divider-strong);
   --leo-color-search-divider-interactive: rgba(124, 145, 255, 0.3);
-  --leo-color-search-divider-strong: var(--leo-color-neutral-50);
+  --leo-color-search-divider-strong: var(--leo-color-neutral-20);
   --leo-color-search-divider-subtle: var(--leo-color-primitive-neutral-20);
   --leo-color-search-divider-subtle-container: var(--leo-color-neutral-20);
   --leo-color-search-fade-semi-transparent: rgba(31, 31, 35, 0.85);
@@ -282,9 +249,10 @@
 [data-theme="light"] {
   --leo-color-search-background-ask-input-field: var(--leo-color-schemes-surface-container-lowest);
   --leo-color-search-background-container: var(--leo-color-schemes-surface-container-lowest);
-  --leo-color-search-background-container-interactive: var(--leo-color-primary-10);
   --leo-color-search-background-enrichment-cards: var(--leo-color-neutral-5);
   --leo-color-search-background-highlight: var(--leo-color-neutral-10);
+  --leo-color-search-background-interactive-normal: var(--leo-color-primary-10);
+  --leo-color-search-background-interactive-pale: var(--leo-color-primary-5);
   --leo-color-search-background-landing-page: #eef2f6;
   --leo-color-search-background-page: var(--leo-color-schemes-surface-container-lowest);
   --leo-color-search-background-search-bar: var(--leo-color-schemes-surface-container-lowest);
@@ -394,9 +362,10 @@
 [data-theme="dark"] {
   --leo-color-search-background-ask-input-field: var(--leo-color-schemes-surface-container-highest);
   --leo-color-search-background-container: var(--leo-color-schemes-surface-container);
-  --leo-color-search-background-container-interactive: var(--leo-color-search-primary-10);
   --leo-color-search-background-enrichment-cards: var(--leo-color-neutral-10);
   --leo-color-search-background-highlight: var(--leo-color-neutral-20);
+  --leo-color-search-background-interactive-normal: var(--leo-color-primitive-primary-25);
+  --leo-color-search-background-interactive-pale: var(--leo-color-primitive-primary-30);
   --leo-color-search-background-landing-page: #1e2028;
   --leo-color-search-background-page: var(--leo-color-primitive-neutral-10);
   --leo-color-search-background-search-bar: var(--leo-color-schemes-surface-container-highest);
@@ -421,7 +390,7 @@
   --leo-color-search-button-pale-background-normal: var(--leo-color-search-primary-10);
   --leo-color-search-divider-ask-input-field: var(--leo-color-divider-strong);
   --leo-color-search-divider-interactive: rgba(124, 145, 255, 0.3);
-  --leo-color-search-divider-strong: var(--leo-color-neutral-50);
+  --leo-color-search-divider-strong: var(--leo-color-neutral-20);
   --leo-color-search-divider-subtle: var(--leo-color-primitive-neutral-20);
   --leo-color-search-divider-subtle-container: var(--leo-color-neutral-20);
   --leo-color-search-fade-semi-transparent: rgba(31, 31, 35, 0.85);
Variables Diff: variables-web3.diff
--- ./tokens/css/variables-web3.old.css	2026-03-11 20:34:40.403657167 +0000
+++ ./tokens/css/variables-web3.css	2026-03-11 20:34:03.644828757 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 @media (prefers-color-scheme: light) {
Variables Diff: variables.diff
--- ./tokens/css/variables.old.css	2026-03-11 20:34:40.751577901 +0000
+++ ./tokens/css/variables.css	2026-03-11 20:34:03.391823850 +0000
@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue Mar 10 2026 01:28:50 GMT+0000 (Coordinated Universal Time)
+ * Generated on Wed Mar 11 2026 20:34:03 GMT+0000 (Coordinated Universal Time)
  */
 
 :root {
@@ -338,9 +338,9 @@
   --leo-font-large-link: 400 16px/24px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
   --leo-font-large-regular: 400 16px/24px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
   --leo-font-large-semibold: 600 16px/24px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
-  --leo-font-monospace-default: 400 14px/16.8px SF Mono;
-  --leo-font-monospace-large: 400 16px/19.2px SF Mono;
-  --leo-font-monospace-small: 400 12px/14.4px SF Mono;
+  --leo-font-monospace-default: 400 14px/16.8px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-monospace-large: 400 16px/19.2px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --leo-font-monospace-small: 400 12px/14.4px 'SF Mono', ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
   --leo-font-small-link: 400 12px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
   --leo-font-small-regular: 400 12px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
   --leo-font-small-semibold: 600 12px/18px system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Tokens] Update tokens and storybook stories to get the latest for the non-universal files

3 participants