/* GENERATED by scripts/design/generate-tokens.mjs from design/handoff/tokens/tokens.json (handoff 1.1.1). Do not edit. */

:root {
  --hm-color-brand-orange: #FBB03B;
  --hm-color-brand-orangeLight: #FFD28B;
  --hm-color-brand-orangeDark: #F7931E;
  --hm-color-brand-placeBackdrop: #5C3F14;
  --hm-color-ink: #160D00;
  --hm-color-white: #FFFFFF;
  --hm-color-grey-200: #E6E6E6;
  --hm-color-grey-400: #AEAEAE;
  --hm-color-text-primary: #160D00;
  --hm-color-text-muted: #6B6258;
  --hm-color-text-onBrand: #160D00;
  --hm-color-semantic-successFill: #0C9900;
  --hm-color-semantic-successText: #087F00;
  --hm-color-semantic-warningFill: #F7931E;
  --hm-color-semantic-warningText: #A15C00;
  --hm-color-semantic-danger: #D92D20;
  --hm-color-semantic-verified: #005EFF;
  --hm-color-light-bg: #FFFFFF;
  --hm-color-light-surface: #FFFFFF;
  --hm-color-light-surfaceAlt: #F5F1EB;
  --hm-color-light-text: #160D00;
  --hm-color-light-textMuted: #6B6258;
  --hm-color-light-border: #E6E6E6;
  --hm-color-light-header: #FBB03B;
  --hm-color-light-onHeader: #160D00;
  --hm-color-light-primary: #FBB03B;
  --hm-color-light-onPrimary: #160D00;
  --hm-color-light-focus: #005EFF;
  --hm-color-light-success: #087F00;
  --hm-color-light-warning: #F7931E;
  --hm-color-light-danger: #D92D20;
  --hm-color-light-verified: #005EFF;
  --hm-color-light-moment: #160D00;
  --hm-color-light-onMoment: #F5F1EB;
  --hm-color-light-disabledFill: #E6E6E6;
  --hm-color-light-disabledText: #6B6258;
  --hm-color-dark-bg: #120C05;
  --hm-color-dark-surface: #1E160B;
  --hm-color-dark-surfaceAlt: #2A2014;
  --hm-color-dark-text: #F5F1EB;
  --hm-color-dark-textMuted: #BFB5A8;
  --hm-color-dark-border: #3A2E1F;
  --hm-color-dark-header: #FBB03B;
  --hm-color-dark-onHeader: #160D00;
  --hm-color-dark-primary: #FBB03B;
  --hm-color-dark-onPrimary: #160D00;
  --hm-color-dark-focus: #4D8BFF;
  --hm-color-dark-success: #3FBF3A;
  --hm-color-dark-warning: #F7931E;
  --hm-color-dark-danger: #FF6B5E;
  --hm-color-dark-verified: #4D8BFF;
  --hm-color-dark-moment: #120C05;
  --hm-color-dark-onMoment: #F5F1EB;
  --hm-color-dark-disabledFill: #3A2E1F;
  --hm-color-dark-disabledText: #A89E91;
  --hm-color-sunlight-bg: #FFFFFF;
  --hm-color-sunlight-surface: #FFFFFF;
  --hm-color-sunlight-surfaceAlt: #FFFFFF;
  --hm-color-sunlight-text: #160D00;
  --hm-color-sunlight-textMuted: #160D00;
  --hm-color-sunlight-border: #160D00;
  --hm-color-sunlight-header: #FBB03B;
  --hm-color-sunlight-onHeader: #160D00;
  --hm-color-sunlight-primary: #FBB03B;
  --hm-color-sunlight-onPrimary: #160D00;
  --hm-color-sunlight-focus: #005EFF;
  --hm-color-sunlight-success: #087F00;
  --hm-color-sunlight-warning: #F7931E;
  --hm-color-sunlight-danger: #D92D20;
  --hm-color-sunlight-verified: #005EFF;
  --hm-color-sunlight-moment: #160D00;
  --hm-color-sunlight-onMoment: #FFFFFF;
  --hm-color-sunlight-disabledFill: #E6E6E6;
  --hm-color-sunlight-disabledText: #160D00;
  --hm-color-chart-series1: #160D00;
  --hm-color-chart-series2: #A15C00;
  --hm-color-chart-series3: #D92D20;
  --hm-color-chart-areaFill: #FBB03B;
  --hm-color-chart-barFill: #FBB03B;
  --hm-color-chart-heat0: #F5F1EB;
  --hm-color-chart-heat1: #FFD28B;
  --hm-color-chart-heat2: #FBB03B;
  --hm-color-chart-heat3: #F7931E;
  --hm-color-chart-heat4: #A15C00;
  --hm-font-family-base: "Source Sans 3", system-ui, sans-serif;
  --hm-font-weight-regular: 400;
  --hm-font-weight-semibold: 600;
  --hm-font-weight-bold: 700;
  --hm-font-weight-black: 900;
  --hm-typography-display-mobile: 900 34px/40px var(--hm-font-family-base);
  --hm-typography-display-console: 900 40px/48px var(--hm-font-family-base);
  --hm-typography-headline-mobile: 700 28px/34px var(--hm-font-family-base);
  --hm-typography-headline-console: 700 28px/36px var(--hm-font-family-base);
  --hm-typography-title-mobile: 600 20px/26px var(--hm-font-family-base);
  --hm-typography-title-console: 600 18px/24px var(--hm-font-family-base);
  --hm-typography-body-mobile: 400 16px/24px var(--hm-font-family-base);
  --hm-typography-body-console: 400 14px/20px var(--hm-font-family-base);
  --hm-typography-label-mobile: 600 14px/20px var(--hm-font-family-base);
  --hm-typography-label-console: 600 13px/18px var(--hm-font-family-base);
  --hm-typography-caption-mobile: 400 12px/16px var(--hm-font-family-base);
  --hm-typography-caption-console: 400 12px/16px var(--hm-font-family-base);
  --hm-numeric-tabular: tnum;
  --hm-radius-card: 20px;
  --hm-radius-header: 32px;
  --hm-radius-control: 12px;
  --hm-radius-pill: 9999px;
  --hm-radius-pass: 28px;
  --hm-space-1: 4px;
  --hm-space-2: 8px;
  --hm-space-3: 12px;
  --hm-space-4: 16px;
  --hm-space-6: 24px;
  --hm-space-8: 32px;
  --hm-space-12: 48px;
  --hm-space-0_5: 2px;
  --hm-size-tapTarget: 48px;
  --hm-size-tapTargetGate: 56px;
  --hm-size-qrPass: 236px;
  --hm-size-pinKey: 56px;
  --hm-size-passRing: 5px;
  --hm-elevation-e1: 0 1px 2px rgba(22,13,0,.10);
  --hm-elevation-e2: 0 1px 2px rgba(22,13,0,.06), 0 6px 16px rgba(22,13,0,.10);
  --hm-elevation-e3: 0 2px 4px rgba(22,13,0,.08), 0 16px 40px rgba(22,13,0,.16);
  --hm-motion-press: 120ms;
  --hm-motion-enter: 200ms;
  --hm-motion-sheet: 280ms;
  --hm-motion-qrRefresh: 15000ms;
  --hm-motion-easing: cubic-bezier(0.2, 0, 0, 1);
  --hm-breakpoint-phone: 360px;
  --hm-breakpoint-tablet: 840px;
  --hm-breakpoint-desktop: 1280px;

  /* The active theme: light by default. */
  --hm-bg: var(--hm-color-light-bg);
  --hm-surface: var(--hm-color-light-surface);
  --hm-surfaceAlt: var(--hm-color-light-surfaceAlt);
  --hm-text: var(--hm-color-light-text);
  --hm-textMuted: var(--hm-color-light-textMuted);
  --hm-border: var(--hm-color-light-border);
  --hm-header: var(--hm-color-light-header);
  --hm-onHeader: var(--hm-color-light-onHeader);
  --hm-primary: var(--hm-color-light-primary);
  --hm-onPrimary: var(--hm-color-light-onPrimary);
  --hm-focus: var(--hm-color-light-focus);
  --hm-success: var(--hm-color-light-success);
  --hm-warning: var(--hm-color-light-warning);
  --hm-danger: var(--hm-color-light-danger);
  --hm-verified: var(--hm-color-light-verified);
  --hm-moment: var(--hm-color-light-moment);
  --hm-onMoment: var(--hm-color-light-onMoment);
  --hm-disabledFill: var(--hm-color-light-disabledFill);
  --hm-disabledText: var(--hm-color-light-disabledText);
}

/* Follow the device unless a theme is chosen explicitly. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --hm-bg: var(--hm-color-dark-bg);
    --hm-surface: var(--hm-color-dark-surface);
    --hm-surfaceAlt: var(--hm-color-dark-surfaceAlt);
    --hm-text: var(--hm-color-dark-text);
    --hm-textMuted: var(--hm-color-dark-textMuted);
    --hm-border: var(--hm-color-dark-border);
    --hm-header: var(--hm-color-dark-header);
    --hm-onHeader: var(--hm-color-dark-onHeader);
    --hm-primary: var(--hm-color-dark-primary);
    --hm-onPrimary: var(--hm-color-dark-onPrimary);
    --hm-focus: var(--hm-color-dark-focus);
    --hm-success: var(--hm-color-dark-success);
    --hm-warning: var(--hm-color-dark-warning);
    --hm-danger: var(--hm-color-dark-danger);
    --hm-verified: var(--hm-color-dark-verified);
    --hm-moment: var(--hm-color-dark-moment);
    --hm-onMoment: var(--hm-color-dark-onMoment);
    --hm-disabledFill: var(--hm-color-dark-disabledFill);
    --hm-disabledText: var(--hm-color-dark-disabledText);
  }
}

[data-theme="light"] {
  --hm-bg: var(--hm-color-light-bg);
  --hm-surface: var(--hm-color-light-surface);
  --hm-surfaceAlt: var(--hm-color-light-surfaceAlt);
  --hm-text: var(--hm-color-light-text);
  --hm-textMuted: var(--hm-color-light-textMuted);
  --hm-border: var(--hm-color-light-border);
  --hm-header: var(--hm-color-light-header);
  --hm-onHeader: var(--hm-color-light-onHeader);
  --hm-primary: var(--hm-color-light-primary);
  --hm-onPrimary: var(--hm-color-light-onPrimary);
  --hm-focus: var(--hm-color-light-focus);
  --hm-success: var(--hm-color-light-success);
  --hm-warning: var(--hm-color-light-warning);
  --hm-danger: var(--hm-color-light-danger);
  --hm-verified: var(--hm-color-light-verified);
  --hm-moment: var(--hm-color-light-moment);
  --hm-onMoment: var(--hm-color-light-onMoment);
  --hm-disabledFill: var(--hm-color-light-disabledFill);
  --hm-disabledText: var(--hm-color-light-disabledText);
}

[data-theme="dark"] {
  --hm-bg: var(--hm-color-dark-bg);
  --hm-surface: var(--hm-color-dark-surface);
  --hm-surfaceAlt: var(--hm-color-dark-surfaceAlt);
  --hm-text: var(--hm-color-dark-text);
  --hm-textMuted: var(--hm-color-dark-textMuted);
  --hm-border: var(--hm-color-dark-border);
  --hm-header: var(--hm-color-dark-header);
  --hm-onHeader: var(--hm-color-dark-onHeader);
  --hm-primary: var(--hm-color-dark-primary);
  --hm-onPrimary: var(--hm-color-dark-onPrimary);
  --hm-focus: var(--hm-color-dark-focus);
  --hm-success: var(--hm-color-dark-success);
  --hm-warning: var(--hm-color-dark-warning);
  --hm-danger: var(--hm-color-dark-danger);
  --hm-verified: var(--hm-color-dark-verified);
  --hm-moment: var(--hm-color-dark-moment);
  --hm-onMoment: var(--hm-color-dark-onMoment);
  --hm-disabledFill: var(--hm-color-dark-disabledFill);
  --hm-disabledText: var(--hm-color-dark-disabledText);
}

[data-theme="sunlight"] {
  --hm-bg: var(--hm-color-sunlight-bg);
  --hm-surface: var(--hm-color-sunlight-surface);
  --hm-surfaceAlt: var(--hm-color-sunlight-surfaceAlt);
  --hm-text: var(--hm-color-sunlight-text);
  --hm-textMuted: var(--hm-color-sunlight-textMuted);
  --hm-border: var(--hm-color-sunlight-border);
  --hm-header: var(--hm-color-sunlight-header);
  --hm-onHeader: var(--hm-color-sunlight-onHeader);
  --hm-primary: var(--hm-color-sunlight-primary);
  --hm-onPrimary: var(--hm-color-sunlight-onPrimary);
  --hm-focus: var(--hm-color-sunlight-focus);
  --hm-success: var(--hm-color-sunlight-success);
  --hm-warning: var(--hm-color-sunlight-warning);
  --hm-danger: var(--hm-color-sunlight-danger);
  --hm-verified: var(--hm-color-sunlight-verified);
  --hm-moment: var(--hm-color-sunlight-moment);
  --hm-onMoment: var(--hm-color-sunlight-onMoment);
  --hm-disabledFill: var(--hm-color-sunlight-disabledFill);
  --hm-disabledText: var(--hm-color-sunlight-disabledText);
}