/* Copied from brand/tokens/tokens.css by tools/sync-brand.mjs. Do not edit: change brand/tokens/tokens.json and run both scripts. */

/* Tiroir brand tokens.
 * Generated from brand/tokens/tokens.json by brand/scripts/tokens/build.mjs:
 * edit the JSON and run the script, never this file.
 */

:root {
  /* Dark palette: the website and the dark appearance */
  --tiroir-night: #0C0B0A; /* Warm black: dark backgrounds */
  --tiroir-lacquer: #17150F; /* Raised dark surfaces: cards, panels, sidebars */
  --tiroir-rice: #F5F1EA; /* Text on dark */
  --tiroir-ash: #9D968B; /* Secondary text on dark */
  --tiroir-honey: #FFB938; /* The single accent on dark: a lamp inside a drawer */
  --tiroir-ember: #FF8A1F; /* The second stop of the glow; never text */

  /* Light palette */
  --tiroir-paper: #FAF8F4; /* Light backgrounds */
  --tiroir-ink: #1C1A17; /* Text on light */
  --tiroir-graphite: #6E6A63; /* Secondary text on light */
  --tiroir-deep-honey: #8F5600; /* The accent on light: links and buttons */
  --tiroir-hairline: #DAD5CC; /* Separators and outlines on light; never text */

  /* The lamp's glow, honey to ember: the icon, the website hero and key moments only, never for text */
  --tiroir-glow-1: #FFB938;
  --tiroir-glow-2: #FF8A1F;
  --tiroir-glow: linear-gradient(135deg, var(--tiroir-glow-1) 0%, var(--tiroir-glow-2) 100%);

  /* Type: SF Pro through the system names, never shipped; Inter as the only webfont.
     --tiroir-<style> is a font shorthand (weight size/line family); set letter-spacing
     with --tiroir-<style>-tracking. */
  --tiroir-font-sans: -apple-system, BlinkMacSystemFont, "Inter", system-ui, sans-serif;
  --tiroir-weight-regular: 400;
  --tiroir-weight-medium: 500;
  --tiroir-weight-semibold: 600;
  --tiroir-weight-bold: 700;
  --tiroir-display-1-size: 64px;
  --tiroir-display-1-line: 68px;
  --tiroir-display-1-weight: 600;
  --tiroir-display-1-tracking: -0.009em;
  --tiroir-display-1: 600 64px/68px var(--tiroir-font-sans);
  --tiroir-display-2-size: 56px;
  --tiroir-display-2-line: 60px;
  --tiroir-display-2-weight: 600;
  --tiroir-display-2-tracking: -0.005em;
  --tiroir-display-2: 600 56px/60px var(--tiroir-font-sans);
  --tiroir-display-3-size: 48px;
  --tiroir-display-3-line: 52px;
  --tiroir-display-3-weight: 600;
  --tiroir-display-3-tracking: -0.003em;
  --tiroir-display-3: 600 48px/52px var(--tiroir-font-sans);
  --tiroir-title-1-size: 32px;
  --tiroir-title-1-line: 36px;
  --tiroir-title-1-weight: 600;
  --tiroir-title-1-tracking: 0.004em;
  --tiroir-title-1: 600 32px/36px var(--tiroir-font-sans);
  --tiroir-title-2-size: 28px;
  --tiroir-title-2-line: 32px;
  --tiroir-title-2-weight: 600;
  --tiroir-title-2-tracking: 0.007em;
  --tiroir-title-2: 600 28px/32px var(--tiroir-font-sans);
  --tiroir-title-3-size: 22px;
  --tiroir-title-3-line: 28px;
  --tiroir-title-3-weight: 600;
  --tiroir-title-3-tracking: 0.01em;
  --tiroir-title-3: 600 22px/28px var(--tiroir-font-sans);
  --tiroir-body-1-size: 17px;
  --tiroir-body-1-line: 25px;
  --tiroir-body-1-weight: 400;
  --tiroir-body-1-tracking: -0.022em;
  --tiroir-body-1: 400 17px/25px var(--tiroir-font-sans);
  --tiroir-body-2-size: 15px;
  --tiroir-body-2-line: 22px;
  --tiroir-body-2-weight: 400;
  --tiroir-body-2-tracking: -0.018em;
  --tiroir-body-2: 400 15px/22px var(--tiroir-font-sans);
  --tiroir-caption-size: 13px;
  --tiroir-caption-line: 18px;
  --tiroir-caption-weight: 400;
  --tiroir-caption-tracking: -0.012em;
  --tiroir-caption: 400 13px/18px var(--tiroir-font-sans);

  /* Radii */
  --tiroir-radius-s: 8px; /* Buttons, small controls */
  --tiroir-radius-m: 12px; /* Inputs, tiles in a drawer */
  --tiroir-radius-l: 20px; /* Cards, previews */
  --tiroir-radius-xl: 28px; /* Large panels, hero frames */

  /* Spacing: 4-point scale, the key is the multiple of 4 */
  --tiroir-space-1: 4px;
  --tiroir-space-2: 8px;
  --tiroir-space-3: 12px;
  --tiroir-space-4: 16px;
  --tiroir-space-5: 20px;
  --tiroir-space-6: 24px;
  --tiroir-space-8: 32px;
  --tiroir-space-10: 40px;
  --tiroir-space-12: 48px;
  --tiroir-space-16: 64px;
  --tiroir-space-20: 80px;
  --tiroir-space-24: 96px;
  --tiroir-space-32: 128px;

  /* Motion. The drawer spring: response 0.32, damping 0.86, settled in 0.45s. */
  --tiroir-spring-drawer: linear(0, 0.0215, 0.0758, 0.1502, 0.2355, 0.3248, 0.4131, 0.4972, 0.5751, 0.6455, 0.708, 0.7626, 0.8095, 0.8493, 0.8826, 0.9101, 0.9326, 0.9506, 0.965, 0.9762, 0.9849, 0.9914, 0.9962, 0.9997, 1.002, 1.0036, 1.0045, 1.0049, 1.005, 1.0049, 1.0046, 1.0042, 1.0038, 1.0033, 1.0029, 1.0025, 1.0021, 1.0017, 1.0014, 1.0012, 1);
  --tiroir-spring-drawer-duration: 0.45s;
  --tiroir-ease-sort: cubic-bezier(0.45, 0, 0.2, 1); /* Icons slide to their drawer in Smart Sort */
  --tiroir-ease-fade: cubic-bezier(0, 0, 0.58, 1); /* The fade that replaces every movement under Reduce Motion (ease out) */
  --tiroir-duration-fade: 0.16s; /* The Reduce Motion fade */

  /* Roles, dark appearance (the default) */
  --tiroir-background: var(--tiroir-night);
  --tiroir-surface: var(--tiroir-lacquer);
  --tiroir-text: var(--tiroir-rice);
  --tiroir-text-secondary: var(--tiroir-ash);
  --tiroir-separator: #F5F1EA24; /* Rice at 14% opacity: quiet, and visible on Night and on Lacquer */
  --tiroir-accent: var(--tiroir-honey);
}

/* Roles, light appearance: opt in with data-tiroir-theme="light" on any element. */
[data-tiroir-theme="light"] {
  --tiroir-background: var(--tiroir-paper);
  --tiroir-surface: #FFFFFF; /* White: raised surfaces on Paper */
  --tiroir-text: var(--tiroir-ink);
  --tiroir-text-secondary: var(--tiroir-graphite);
  --tiroir-separator: var(--tiroir-hairline);
  --tiroir-accent: var(--tiroir-deep-honey);
}
