/* Generated from src/tokens.ts by scripts/build-tokens.ts. Edit the source, then run npm run build:tokens -w @heppu/ui. */

:root {
  color-scheme: light dark;
  --font-words: "IBM Plex Sans", system-ui, sans-serif;
  --font-figures: "Figure Marks", "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --text-11: 11px;
  --text-12: 12px;
  --text-13: 13px;
  --text-14: 14px;
  --text-15: 15px;
  --text-16: 16px;
  --text-18: 18px;
  --text-22: 22px;
  --text-24: 24px;
  --text-28: 28px;
  --text-30: 30px;
  --text-34: 34px;
  --text-44: 44px;
  --text-56: 56px;
  --text-96: 96px;
  --leading-figure: 1;
  --leading-heading: 1.15;
  --leading-ui: 1.45;
  --tracking-none: 0;
  --tracking-display: -0.012em;
  --tracking-heading: -0.01em;
  --tracking-figure: -0.01em;
  --tracking-tv: -0.02em;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --size-band-height: 48px;
  --size-rail-height: 32px;
  --size-control-height-sm: 28px;
  --size-control-height: 34px;
  --size-control-height-lg: 56px;
  --size-result-row-height: 56px;
  --size-side-nav-width: 232px;
  --size-hour-chart-width: 240px;
  --size-hour-chart-height: 56px;
  --size-hour-chart-height-lg: 72px;
  --size-badge-height: 24px;
  --size-mark: 8px;
  --size-dot: 9px;
  --radius-none: 0px;
  --radius-hairline: 2px;
  --radius-mark: 4px;
  --radius-keycap: 5px;
  --radius-control: 6px;
  --radius-panel: 8px;
  --radius-window: 10px;
  --border-hairline: 1px;
  --border-keycap-bottom: 2px;
  --shadow-sticker-sm: 2px 2px 0 var(--color-sticker);
  --shadow-sticker-md: 3px 3px 0 var(--color-sticker);
  --shadow-sticker-lg: 5px 5px 0 var(--color-sticker);
  --duration-band: 420ms;
  --duration-press: 120ms;
  --duration-enter: 240ms;
  --duration-pulse: 1400ms;
  --duration-stamp: 560ms;
  --easing-band: cubic-bezier(0.2, 0.7, 0.2, 1);
  --easing-out: ease-out;
  --easing-in-out: ease-in-out;
  --easing-stamp: cubic-bezier(0.3, 1.4, 0.5, 1);
  --z-base: 0;
  --z-sticky: 10;
  --z-floating: 20;
  --z-dialog: 30;
  --z-toast: 40;
}

:root, [data-theme="light"] {
  color-scheme: light;
  --color-paper: #EDF0F3;
  --color-panel: #FFFFFF;
  --color-panel-2: #F5F7F9;
  --color-panel-3: #E6EAEE;
  --color-ink: #141A20;
  --color-ink-2: #5B6872;
  --color-ink-3: #66737E;
  --color-rule: #D8DEE4;
  --color-rule-2: #E6EAEE;
  --color-link: #2857C9;
  --color-focus: #2857C9;
  --color-selection: #E4EBFA;
  --color-danger-ink: #B3261E;
  --color-note: #FBF4DF;
  --color-note-ink: #6E6350;
  --color-band-ink: #FFFFFF;
  --color-state-idle: #343E48;
  --color-state-ring: #2857C9;
  --color-state-talk: #0F7B55;
  --color-state-miss: #5E6973;
  --color-state-stop: #B3261E;
  --color-status-on-call: #0F7B55;
  --color-status-due-now: #2857C9;
  --color-status-due-today: #5F86E3;
  --color-status-scheduled: #93B0EE;
  --color-status-unreached: #A8771A;
  --color-status-wrong-number: #B3261E;
  --color-status-meeting-booked: #722F37;
  --color-status-not-interested: #7F8EA3;
  --color-status-on-call-tint: #DFF2EA;
  --color-status-due-now-tint: #E4EBFA;
  --color-status-due-today-tint: #E9EFFB;
  --color-status-scheduled-tint: #EEF2FA;
  --color-status-unreached-tint: #F8EEDC;
  --color-status-wrong-number-tint: #F9E4E2;
  --color-status-not-interested-tint: #ECEFF2;
  --color-wine: #722F37;
  --color-wine-ink: #FFFFFF;
  --color-wine-ink-2: #FFDAD3;
  --color-sticker: #3B2A2E;
  --color-chart-bar: #7D8995;
  --color-chart-bar-now: #2857C9;
  --color-chart-now-line: #141A20;
  --color-chart-baseline: #D8DEE4;
  --shadow-floating: 0 1px 2px rgba(20, 26, 32, 0.06), 0 8px 24px rgba(20, 26, 32, 0.12);
  --shadow-window: 0 0 0 1px rgba(20, 26, 32, 0.14), 0 20px 48px rgba(20, 26, 32, 0.16);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --color-paper: #15191E;
    --color-panel: #1D2228;
    --color-panel-2: #242A31;
    --color-panel-3: #2C333B;
    --color-ink: #E8ECF0;
    --color-ink-2: #9AA5B1;
    --color-ink-3: #848F9C;
    --color-rule: #2C333B;
    --color-rule-2: #262C33;
    --color-link: #7FA3F2;
    --color-focus: #7FA3F2;
    --color-selection: #1F2A42;
    --color-danger-ink: #F28B82;
    --color-note: #2E2A24;
    --color-note-ink: #CBB98A;
    --color-band-ink: #FFFFFF;
    --color-state-idle: #353C45;
    --color-state-ring: #2957C4;
    --color-state-talk: #0E7350;
    --color-state-miss: #4E5962;
    --color-state-stop: #C73D32;
    --color-status-on-call: #2E9A75;
    --color-status-due-now: #6B93EE;
    --color-status-due-today: #4668C4;
    --color-status-scheduled: #35508F;
    --color-status-unreached: #B38A1A;
    --color-status-wrong-number: #E05A5A;
    --color-status-meeting-booked: #8C3A44;
    --color-status-not-interested: #7A86A6;
    --color-status-on-call-tint: #1A2F28;
    --color-status-due-now-tint: #1F2A42;
    --color-status-due-today-tint: #1E2840;
    --color-status-scheduled-tint: #20262F;
    --color-status-unreached-tint: #332B1C;
    --color-status-wrong-number-tint: #37231F;
    --color-status-not-interested-tint: #252B32;
    --color-wine: #8C3A44;
    --color-wine-ink: #FFFFFF;
    --color-wine-ink-2: #FFDAD3;
    --color-sticker: #0E0809;
    --color-chart-bar: #6B7884;
    --color-chart-bar-now: #6B93EE;
    --color-chart-now-line: #E8ECF0;
    --color-chart-baseline: #2C333B;
    --shadow-floating: 0 1px 2px rgba(0, 0, 0, 0.4), 0 12px 32px rgba(0, 0, 0, 0.45);
    --shadow-window: 0 0 0 1px rgba(20, 26, 32, 0.4), 0 20px 48px rgba(20, 26, 32, 0.22);
  }
}

[data-theme="dark"] {
  color-scheme: dark;
  --color-paper: #15191E;
  --color-panel: #1D2228;
  --color-panel-2: #242A31;
  --color-panel-3: #2C333B;
  --color-ink: #E8ECF0;
  --color-ink-2: #9AA5B1;
  --color-ink-3: #848F9C;
  --color-rule: #2C333B;
  --color-rule-2: #262C33;
  --color-link: #7FA3F2;
  --color-focus: #7FA3F2;
  --color-selection: #1F2A42;
  --color-danger-ink: #F28B82;
  --color-note: #2E2A24;
  --color-note-ink: #CBB98A;
  --color-band-ink: #FFFFFF;
  --color-state-idle: #353C45;
  --color-state-ring: #2957C4;
  --color-state-talk: #0E7350;
  --color-state-miss: #4E5962;
  --color-state-stop: #C73D32;
  --color-status-on-call: #2E9A75;
  --color-status-due-now: #6B93EE;
  --color-status-due-today: #4668C4;
  --color-status-scheduled: #35508F;
  --color-status-unreached: #B38A1A;
  --color-status-wrong-number: #E05A5A;
  --color-status-meeting-booked: #8C3A44;
  --color-status-not-interested: #7A86A6;
  --color-status-on-call-tint: #1A2F28;
  --color-status-due-now-tint: #1F2A42;
  --color-status-due-today-tint: #1E2840;
  --color-status-scheduled-tint: #20262F;
  --color-status-unreached-tint: #332B1C;
  --color-status-wrong-number-tint: #37231F;
  --color-status-not-interested-tint: #252B32;
  --color-wine: #8C3A44;
  --color-wine-ink: #FFFFFF;
  --color-wine-ink-2: #FFDAD3;
  --color-sticker: #0E0809;
  --color-chart-bar: #6B7884;
  --color-chart-bar-now: #6B93EE;
  --color-chart-now-line: #E8ECF0;
  --color-chart-baseline: #2C333B;
  --shadow-floating: 0 1px 2px rgba(0, 0, 0, 0.4), 0 12px 32px rgba(0, 0, 0, 0.45);
  --shadow-window: 0 0 0 1px rgba(20, 26, 32, 0.4), 0 20px 48px rgba(20, 26, 32, 0.22);
}

.t-lead-name {
  font-family: var(--font-words);
  font-size: var(--text-44);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-display);
}

.t-lead-phone {
  font-family: var(--font-figures);
  font-size: var(--text-30);
  font-weight: var(--weight-medium);
  line-height: var(--leading-figure);
  letter-spacing: var(--tracking-figure);
  font-variant-numeric: tabular-nums;
}

.t-page-title {
  font-family: var(--font-words);
  font-size: var(--text-28);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-heading);
  letter-spacing: var(--tracking-heading);
}

.t-section-title {
  font-family: var(--font-words);
  font-size: var(--text-22);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-heading);
}

.t-band {
  font-family: var(--font-words);
  font-size: var(--text-22);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-figure);
}

.t-band-clock {
  font-family: var(--font-figures);
  font-size: var(--text-22);
  font-weight: var(--weight-medium);
  line-height: var(--leading-figure);
  font-variant-numeric: tabular-nums;
}

.t-result-label {
  font-family: var(--font-words);
  font-size: var(--text-18);
  font-weight: var(--weight-medium);
  line-height: var(--leading-ui);
}

.t-body {
  font-family: var(--font-words);
  font-size: var(--text-15);
  font-weight: var(--weight-regular);
  line-height: var(--leading-ui);
}

.t-control {
  font-family: var(--font-words);
  font-size: var(--text-14);
  font-weight: var(--weight-medium);
  line-height: var(--leading-ui);
}

.t-table {
  font-family: var(--font-words);
  font-size: var(--text-14);
  font-weight: var(--weight-regular);
  line-height: var(--leading-ui);
}

.t-table-head {
  font-family: var(--font-words);
  font-size: var(--text-13);
  font-weight: var(--weight-medium);
  line-height: var(--leading-ui);
  color: var(--color-ink-2);
}

.t-meta {
  font-family: var(--font-words);
  font-size: var(--text-13);
  font-weight: var(--weight-regular);
  line-height: var(--leading-ui);
  color: var(--color-ink-2);
}

.t-figure-inline {
  font-family: var(--font-figures);
  font-size: inherit;
  font-weight: var(--weight-medium);
  line-height: var(--leading-ui);
  font-variant-numeric: tabular-nums;
}

.t-figure-table {
  font-family: var(--font-figures);
  font-size: var(--text-14);
  font-weight: var(--weight-regular);
  line-height: var(--leading-ui);
  font-variant-numeric: tabular-nums;
}

.t-figure-stat {
  font-family: var(--font-figures);
  font-size: var(--text-34);
  font-weight: var(--weight-medium);
  line-height: var(--leading-figure);
  letter-spacing: var(--tracking-figure);
  font-variant-numeric: tabular-nums;
}

.t-figure-total {
  font-family: var(--font-figures);
  font-size: var(--text-44);
  font-weight: var(--weight-medium);
  line-height: var(--leading-figure);
  letter-spacing: var(--tracking-figure);
  font-variant-numeric: tabular-nums;
}

.t-tv-headline {
  font-family: var(--font-words);
  font-size: var(--text-96);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-figure);
  letter-spacing: var(--tracking-tv);
}

.t-tv-totals {
  font-family: var(--font-words);
  font-size: var(--text-28);
  font-weight: var(--weight-medium);
  line-height: var(--leading-ui);
  color: var(--color-ink-2);
}

.t-tv-clock {
  font-family: var(--font-figures);
  font-size: var(--text-28);
  font-weight: var(--weight-medium);
  line-height: var(--leading-figure);
  font-variant-numeric: tabular-nums;
  color: var(--color-ink-2);
}

.t-tv-name {
  font-family: var(--font-words);
  font-size: var(--text-24);
  font-weight: var(--weight-medium);
  line-height: var(--leading-heading);
}

.t-keycap {
  font-family: var(--font-figures);
  font-size: var(--text-14);
  font-weight: var(--weight-medium);
  line-height: var(--leading-figure);
  font-variant-numeric: tabular-nums;
}

.t-axis {
  font-family: var(--font-figures);
  font-size: var(--text-11);
  font-weight: var(--weight-regular);
  line-height: var(--leading-figure);
  font-variant-numeric: tabular-nums;
  color: var(--color-ink-2);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-band: 0ms;
    --duration-press: 0ms;
    --duration-enter: 0ms;
    --duration-pulse: 0ms;
    --duration-stamp: 0ms;
  }
}