/* Generated from tokens.json by build-tokens.cjs. Edit JSON, then rebuild. */
:root {
  --g-paper: #E4E5DF;
  --g-ink: #171717;
  --g-font-display: StMarie, serif;
  --g-font-ui: Martian, monospace;
  --g-font-width: 100%;
  --g-font-width-text: 87.5%;
  --g-space-unit: 4px;
  --g-space-tight: 8px;
  --g-space-control-x: 16px;
  --g-space-card: 24px;
  --g-space-content: 24px;
  --g-space-section: 80px;
  --g-space-compact: 12px;
  --g-space-group: 32px;
  --g-space-block: 48px;
  --g-space-wide: 64px;
  --g-space-contact: 96px;
  --g-page-desktop: 32px;
  --g-page-mobile: 24px;
  --g-radius: 4px;
  --g-border: 1px;
  --g-focus: 2px;
  --g-touch-target: 44px;
  --g-control-height: 48px;
  --g-icon: 16px;
  --g-icon-large: 20px;
  --g-brand: 28px;
  --g-focus-offset: 3px;
  --g-scrollbar: 8px;
  --g-icon-stroke: 1.5;
  --g-content-max: 1200px;
  --g-disabled-opacity: 0.38;
  --g-spinner-size: 12px;
  --g-spinner-stroke: 1.5px;
  --g-motion-s: 160ms;
  --g-motion-m: 280ms;
  --g-motion-l: 480ms;
  --g-motion-ease: cubic-bezier(0.25,1,0.5,1);
  --g-motion-shift-s: 4px;
  --g-motion-shift-l: 16px;
  --g-motion-stagger: 60ms;
  --g-motion-dialog-scale: 0.98;
  --g-motion-spinner: 800ms;
  --g-motion-spinner-ease: linear;
  --g-motion-press-y: 1px;
  --g-motion-link-x: 2px;
  --g-motion-link-y: -2px;
  --g-motion-icon-scale: 0.6;
  --g-motion-feedback: 1600ms;
  --g-motion-letters-rise: 450ms;
  --g-motion-letters-return: 650ms;
  --g-motion-letters-stagger: 40ms;
  --g-motion-letters-y: -20px;
  --g-motion-letters-rotation: -12deg;
  --g-motion-letters-ease: outExpo;
  --g-motion-logo-draw: 800ms;
  --g-motion-logo-fill: 200ms;
  --g-motion-logo-exit: 120ms;
  --g-motion-logo-ease: cubic-bezier(0.16,1,0.3,1);
  --g-motion-not-found: 1100ms;
  --g-motion-not-found-row-stagger: 40ms;
  --g-motion-not-found-digit-stagger: 60ms;
  --g-motion-not-found-ease: cubic-bezier(0.22,1,0.36,1);
  --g-layer-header: 30;
  --g-layer-intro: 9999;
  --g-layer-skip-link: 10000;
  --g-reference-header: 72px;
  --g-reference-header-mobile: 64px;
  --g-logo-size: 128px;
  --g-header: 80px;
  --g-header-mobile: 128px;
  --g-header-compact: 176px;
  --g-text-measure: 70ch;
  --g-layout-columns: 3;
  --g-card-media-ratio: 1 / 1;
  --g-card-thumbnail: 96px;
  --g-card-thumbnail-mobile: 72px;
  --g-menu-max-height: 260px;
  --g-skill-text-max-height: 560px;
  --g-source-code-height: 400px;
  --g-dialog-inset: 16px;
  --g-dialog-backdrop-opacity: 60%;
  --g-type-display: 80px;
  --g-leading-display: 88px;
  --g-weight-display: 100;
  --g-tracking-display: -0.025em;
  --g-type-title: 40px;
  --g-leading-title: 46px;
  --g-weight-title: 100;
  --g-tracking-title: -0.025em;
  --g-type-heading: 32px;
  --g-leading-heading: 42px;
  --g-weight-heading: 500;
  --g-tracking-heading: -0.03em;
  --g-type-body: 16px;
  --g-leading-body: 26px;
  --g-weight-body: 400;
  --g-tracking-body: 0;
  --g-type-caption: 13px;
  --g-leading-caption: 20px;
  --g-weight-caption: 400;
  --g-tracking-caption: 0;
  --g-type-control: 13px;
  --g-leading-control: 20px;
  --g-weight-control: 500;
  --g-tracking-control: 0;
}
:root, [data-theme="light"] {
  --g-background: #E4E5DF;
  --g-text: #171717;
  --g-line: #A7A7A7;
  --g-muted: #555555;
  --g-surface: #D3D3D3;
  --ds-primary-hover: #3D3D3D;
  --ds-primary-pressed: #555555;
  --ds-secondary-hover: #C4C4C4;
  --ds-secondary-pressed: #B9B9B9;
  --ds-filter-hover: #B9B9B9;
  --ds-filter-pressed: #A7A7A7;
  --g-ramp-0: #D3D3D3;
  --g-ramp-1: #B9B9B9;
  --g-ramp-2: #8C8C8C;
  --g-ramp-3: #5F5F5F;
  --g-ramp-4: #171717;
  color-scheme: light;
}
[data-theme="dark"] {
  --g-background: #171717;
  --g-text: #E4E5DF;
  --g-line: #545454;
  --g-muted: #B9B9B9;
  --g-surface: #272727;
  --ds-primary-hover: #B9B9B9;
  --ds-primary-pressed: #A7A7A7;
  --ds-secondary-hover: #3D3D3D;
  --ds-secondary-pressed: #545454;
  --ds-filter-hover: #484848;
  --ds-filter-pressed: #545454;
  --g-ramp-0: #272727;
  --g-ramp-1: #484848;
  --g-ramp-2: #747474;
  --g-ramp-3: #A7A7A7;
  --g-ramp-4: #E4E5DF;
  color-scheme: dark;
}
@media (max-width: 1023px) {
:root {
  --g-layout-columns: 2;
}
}
@media (max-width: 720px) {
:root {
  --g-type-display: 48px;
  --g-leading-display: 54px;
  --g-type-heading: 26px;
  --g-leading-heading: 36px;
  --g-space-section: 48px;
  --g-layout-columns: 1;
}
}
