/* Generated by export_web.py from tokens.json v4; sha256 f08aabb3d7268e54408077cf7df2f20e882e8bf797a50cb0841f01ff97b60dbd. Do not edit by hand. */
:root {
  --ds-color-blue: #1E6DF7;
  --ds-color-blue-strong: #0F3DB2;
  --ds-color-blue-soft: #E8F0FE;
  --ds-color-gradient-start: #1E6DF7;
  --ds-color-gradient-end: #0F3DB2;
  --ds-color-on-blue: #FFFFFF;
  --ds-color-ink: #000000;
  --ds-color-grey: #4B5568;
  --ds-color-muted: #8B95A8;
  --ds-color-ground: #FFFFFF;
  --ds-color-mist: #ECF0F8;
  --ds-color-line: #DCE3EE;
  --ds-color-scrim: rgba(0,0,0,0.48);
  --ds-color-focus: {blue};
  --ds-color-green: #0F9D58;
  --ds-color-green-text: #0B7A45;
  --ds-color-green-soft: #E3F5EC;
  --ds-color-red: #E0344A;
  --ds-color-red-text: #C42B3F;
  --ds-color-red-soft: #FDE8EB;
  --ds-color-purple: #7B4DF2;
  --ds-color-purple-text: #6A3CE6;
  --ds-color-purple-soft: #EFE9FE;
  --ds-color-yellow: #F5B301;
  --ds-color-yellow-text: #8A5F00;
  --ds-color-yellow-soft: #FEF5D9;
  --ds-color-orange: #F06A1D;
  --ds-color-orange-text: #B84A0C;
  --ds-color-orange-soft: #FDEDE3;
  --ds-color-cyan: #0EA5C6;
  --ds-color-cyan-text: #087089;
  --ds-color-cyan-soft: #E0F5FA;
  --ds-space-4: 4px;
  --ds-space-12: 12px;
  --ds-space-8: 8px;
  --ds-space-16: 16px;
  --ds-space-24: 24px;
  --ds-space-32: 32px;
  --ds-space-48: 48px;
  --ds-space-64: 64px;
  --ds-space-96: 96px;
  --ds-space-128: 128px;
  --ds-radius-sm: 8px;
  --ds-radius-md: 16px;
  --ds-radius-32: 32px;
  --ds-radius-pill: 9999px;
  --ds-font-web: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
  --ds-web-caption-size: 14px;
  --ds-web-caption-line: 20px;
  --ds-web-caption-weight: 400;
  --ds-web-caption-tracking: -0.006em;
  --ds-web-label-size: 14px;
  --ds-web-label-line: 20px;
  --ds-web-label-weight: 600;
  --ds-web-label-tracking: -0.006em;
  --ds-web-body-size: 16px;
  --ds-web-body-line: 24px;
  --ds-web-body-weight: 400;
  --ds-web-body-tracking: -0.011em;
  --ds-web-nav-button-size: 16px;
  --ds-web-nav-button-line: 24px;
  --ds-web-nav-button-weight: 600;
  --ds-web-nav-button-tracking: -0.011em;
  --ds-web-lead-size: 18px;
  --ds-web-lead-line: 28px;
  --ds-web-lead-weight: 400;
  --ds-web-lead-tracking: -0.014em;
  --ds-web-h4-size: 20px;
  --ds-web-h4-line: 28px;
  --ds-web-h4-weight: 600;
  --ds-web-h4-tracking: -0.017em;
  --ds-web-h3-size: 24px;
  --ds-web-h3-line: 32px;
  --ds-web-h3-weight: 600;
  --ds-web-h3-tracking: -0.019em;
  --ds-web-h2-size: 40px;
  --ds-web-h2-line: 48px;
  --ds-web-h2-weight: 700;
  --ds-web-h2-tracking: -0.022em;
  --ds-web-h1-size: 56px;
  --ds-web-h1-line: 64px;
  --ds-web-h1-weight: 700;
  --ds-web-h1-tracking: -0.022em;
  --ds-web-hero-size: 72px;
  --ds-web-hero-line: 80px;
  --ds-web-hero-weight: 700;
  --ds-web-hero-tracking: -0.022em;
  --ds-web-mobile-h2-size: 32px;
  --ds-web-mobile-h2-line: 40px;
  --ds-web-mobile-h2-weight: 700;
  --ds-web-mobile-h2-tracking: -0.022em;
  --ds-web-mobile-h1-size: 40px;
  --ds-web-mobile-h1-line: 48px;
  --ds-web-mobile-h1-weight: 700;
  --ds-web-mobile-h1-tracking: -0.022em;
  --ds-web-mobile-hero-size: 48px;
  --ds-web-mobile-hero-line: 56px;
  --ds-web-mobile-hero-weight: 700;
  --ds-web-mobile-hero-tracking: -0.022em;
  --ds-primary: var(--ds-color-blue);
  --ds-accent: var(--ds-color-blue);
  --ds-accent-text: var(--ds-color-blue-strong);
  --ds-accent-soft: var(--ds-color-blue-soft);
  --ds-shadow-overlay: 0 2px 8px 0 rgba(0,0,0,0.32);
}
[data-ds-theme="dark"] {
  --ds-color-blue: #1E6DF7;
  --ds-color-blue-strong: #5C8DFF;
  --ds-color-blue-soft: #0E1E3F;
  --ds-color-gradient-start: #1E6DF7;
  --ds-color-gradient-end: #0F3DB2;
  --ds-color-on-blue: #FFFFFF;
  --ds-color-ink: #FFFFFF;
  --ds-color-grey: #A3ADBF;
  --ds-color-muted: #6B7487;
  --ds-color-ground: #000000;
  --ds-color-mist: #11151F;
  --ds-color-line: #232A38;
  --ds-color-scrim: rgba(0,0,0,0.64);
  --ds-color-focus: {blue};
  --ds-color-green: #2BBF73;
  --ds-color-green-text: #2BBF73;
  --ds-color-green-soft: #0C2A1C;
  --ds-color-red: #FF5468;
  --ds-color-red-text: #FF5468;
  --ds-color-red-soft: #3A1016;
  --ds-color-purple: #A283FF;
  --ds-color-purple-text: #A283FF;
  --ds-color-purple-soft: #221640;
  --ds-color-yellow: #FFC933;
  --ds-color-yellow-text: #FFC933;
  --ds-color-yellow-soft: #33280A;
  --ds-color-orange: #FF8A45;
  --ds-color-orange-text: #FF8A45;
  --ds-color-orange-soft: #3A1C0A;
  --ds-color-cyan: #38C6E4;
  --ds-color-cyan-text: #38C6E4;
  --ds-color-cyan-soft: #0B2A33;
  --ds-shadow-overlay: 0 2px 8px 0 rgba(0,0,0,0.48);
}
[data-ds-profile="spacious"] {
  --ds-page-gutter: 48px;
  --ds-section-gap: 64px;
  --ds-panel-padding: 24px;
  --ds-panel-gap: 24px;
  --ds-row-height: 56px;
  --ds-control-height: 48px;
}
[data-ds-profile="compact"] {
  --ds-page-gutter: 24px;
  --ds-section-gap: 16px;
  --ds-panel-padding: 8px;
  --ds-panel-gap: 8px;
  --ds-row-height: 40px;
  --ds-control-height: 40px;
}
[data-ds-product="0xhieu-xyz"] {
  --ds-primary: #F5B301;
  --ds-accent: #F5B301;
  --ds-accent-text: #F5B301;
  --ds-color-surface: #E5E5E5;
  --ds-color-line: #A3A3A3;
  --ds-color-grey: #525252;
  --ds-color-muted: #525252;
  --ds-accent-soft: var(--ds-color-surface);
  --ds-val-header-height: 56px;
  --ds-val-header-font-size: 16px;
  --ds-val-header-line-height: 24px;
  --ds-val-panel-height: 328px;
  --ds-val-row-height: 40px;
  --ds-val-metric-row-height: 56px;
  --ds-val-panel-gap: 12px;
  --ds-work-project-column: 240px;
  --ds-work-phase-column: 104px;
  --ds-work-group-gap: 16px;
  --ds-work-safe-bottom: 96px;
  --ds-cv-hero-top: 96px;
  --ds-cv-section-gap: 64px;
  --ds-cv-portrait: 112px;
  --ds-workspace-frame-max-width: 1280px;
  --ds-workspace-frame-padding-x: 24px;
  --ds-workspace-card-radius: 8px;
  --ds-workspace-card-padding-x: 12px;
  --ds-workspace-section-padding-y: 8px;
  --ds-workspace-card-gap: 12px;
  --ds-workspace-header-surface: var(--ds-color-surface);
  --ds-workspace-header-foreground: var(--ds-color-ink);
  --ds-on-primary: var(--ds-color-ink);
  --ds-product-card-surface: var(--ds-color-ground);
  --ds-product-card-radius: 8px;
  --ds-product-control-radius: 8px;
  --ds-product-badge-radius: 8px;
}
@media (max-width: 640px) {
  [data-ds-profile] { --ds-page-gutter: 16px; }
  [data-ds-profile="spacious"] { --ds-section-gap: 32px; --ds-panel-padding: 16px; --ds-panel-gap: 16px; }
  [data-ds-product="0xhieu-xyz"] { --ds-val-header-font-size: 14px; --ds-val-header-line-height: 20px; --ds-val-panel-gap: 12px; --ds-cv-hero-top: 48px; --ds-cv-section-gap: 32px; --ds-cv-portrait: 72px; }
}
:root {
  --ds-palette-neutral-0: #FFFFFF;
  --ds-palette-neutral-100: #F2F2F0;
  --ds-palette-neutral-200: #ECECEA;
  --ds-palette-neutral-400: #A3A3A3;
  --ds-palette-neutral-600: #525252;
  --ds-palette-neutral-800: #262626;
  --ds-palette-neutral-900: #161616;
  --ds-palette-neutral-950: #0A0A0A;
  --ds-palette-neutral-1000: #000000;
  --ds-palette-red-50: #FDEFF1;
  --ds-palette-red-300: #EF95A1;
  --ds-palette-red-600: #BE2E40;
  --ds-palette-red-950: #43161E;
  --ds-palette-amber-50: #FEF7EB;
  --ds-palette-amber-300: #FACD80;
  --ds-palette-amber-800: #85580C;
  --ds-palette-amber-950: #49320D;
  --ds-palette-yellow-500: #F5B301;
  --ds-palette-green-50: #ECF7F2;
  --ds-palette-green-300: #82CCA8;
  --ds-palette-green-700: #0E6F40;
  --ds-palette-green-950: #0D3221;
  --ds-palette-blue-50: #EDF3FE;
  --ds-palette-blue-300: #8AB3FB;
  --ds-palette-blue-600: #1B5DD2;
  --ds-palette-blue-950: #11254B;
}
:root {
  --ds-bento-canvas: #F2F2F0;
  --ds-bento-tile: #FFFFFF;
  --ds-bento-hair: #ECECEA;
  --ds-bento-dark-tile: #161616;
  --ds-bento-radius-tile: 20px;
  --ds-bento-radius-inner: 10px;
  --ds-bento-radius-pill: 9999px;
  --ds-bento-gutter: 24px;
  --ds-type-display-size: 56px;
  --ds-type-display-line: 60px;
  --ds-type-display-weight: 700;
  --ds-type-display-tracking: -0.03em;
  --ds-type-page-size: 32px;
  --ds-type-page-line: 40px;
  --ds-type-page-weight: 700;
  --ds-type-page-tracking: -0.02em;
  --ds-type-header-size: 20px;
  --ds-type-header-line: 28px;
  --ds-type-header-weight: 600;
  --ds-type-header-tracking: -0.015em;
  --ds-type-content-size: 16px;
  --ds-type-content-line: 24px;
  --ds-type-content-weight: 400;
  --ds-type-content-tracking: -0.011em;
  --ds-type-secondary-size: 14px;
  --ds-type-secondary-line: 20px;
  --ds-type-secondary-weight: 400;
  --ds-type-secondary-tracking: -0.006em;
  --ds-type-data-size: 14px;
  --ds-type-data-line: 20px;
  --ds-type-data-weight: 400;
  --ds-type-data-tracking: -0.006em;
  --ds-type-label-size: 13px;
  --ds-type-label-line: 18px;
  --ds-type-label-weight: 600;
  --ds-type-label-tracking: 0em;
  --ds-type-button-size: 15px;
  --ds-type-button-line: 20px;
  --ds-type-button-weight: 600;
  --ds-type-button-tracking: -0.006em;
  --ds-type-note-size: 13px;
  --ds-type-note-line: 18px;
  --ds-type-note-weight: 400;
  --ds-type-note-tracking: 0em;
  --ds-type-input-size: 16px;
  --ds-type-input-line: 24px;
  --ds-type-input-weight: 400;
  --ds-type-input-tracking: -0.011em;
  --ds-type-hero-size: 72px;
  --ds-type-hero-line: 76px;
  --ds-type-hero-weight: 700;
  --ds-type-hero-tracking: -0.035em;
}
[data-ds-profile="compact"] {
  --ds-bento-tile-gap: 12px;
  --ds-bento-section-gap: 12px;
  --ds-bento-tile-padding: 20px;
  --ds-bento-row-height: 40px;
}
[data-ds-profile="spacious"] {
  --ds-bento-tile-gap: 16px;
  --ds-bento-section-gap: 48px;
  --ds-bento-tile-padding: 32px;
}
@media (max-width: 640px) {
  :root { --ds-bento-gutter: 16px; --ds-type-display-size: 28px; --ds-type-display-line: 32px; --ds-type-page-size: 20px; --ds-type-page-line: 26px; --ds-type-header-size: 16px; --ds-type-header-line: 22px; --ds-type-content-size: 14px; --ds-type-content-line: 20px; --ds-type-secondary-size: 13px; --ds-type-secondary-line: 18px; --ds-type-data-size: 13px; --ds-type-data-line: 18px; --ds-type-label-size: 12px; --ds-type-label-line: 16px; --ds-type-button-size: 14px; --ds-type-button-line: 20px; --ds-type-note-size: 12px; --ds-type-note-line: 16px; --ds-type-input-size: 16px; --ds-type-input-line: 24px; --ds-type-hero-size: 32px; --ds-type-hero-line: 36px; }
  [data-ds-profile="compact"] { --ds-bento-tile-gap: 12px; --ds-bento-section-gap: 12px; --ds-bento-tile-padding: 16px; --ds-bento-row-height: 44px; }
  [data-ds-profile="spacious"] { --ds-bento-tile-gap: 12px; --ds-bento-section-gap: 32px; --ds-bento-tile-padding: 20px; }
}