/* Generated by scripts/build-marketing.mjs from Caleb's design system. Do not edit. */
/* MoneyHound webfonts. Both SIL OFL, shipped with the system. */
@font-face{font-family:"Newsreader";src:url("/fonts/Newsreader.ttf") format("truetype");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url("/fonts/Newsreader-Italic.ttf") format("truetype");font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:"Inter";src:url("/fonts/InterVariable.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}

/* Color. Each has exactly one job. Target ratio per screen: 70 paper, 20 green + ink, 9 stone, 1 copper. */
:root{
  --ih-green:#123B2C;   /* the brand speaking: mark, primary surfaces, dark panels */
  --ih-copper:#B4622D;  /* the SINGLE point of emphasis. Once per composition. ~1% of pixels. */
  --ih-paper:#FAF7F1;   /* default background. The calm. */
  --ih-stone:#E5E0D5;   /* borders, card edges, resting states */
  --ih-ink:#171D1A;     /* every word. Never pure black. */
  --ih-ink-60:#5A6660;  /* secondary text */
  --ih-ink-40:#8A938D;  /* captions, meta */
  --ih-white:#FFFFFF;   /* card fill on paper */

  /* Tints, for resting rows and quiet fills only. Never for decoration. */
  --ih-green-08:rgba(18,59,44,.08);
  --ih-green-16:rgba(18,59,44,.16);
  --ih-copper-08:rgba(180,98,45,.08);
  --ih-stone-50:rgba(229,224,213,.5); /* inset panels only. Never behind a text row or a table header. */

  /* Functional status. Never decorative. */
  --ih-paid:#1E7A4B;
  --ih-waiting:#A87616;
  --ih-stopped:#A83A2E;  /* internal only. Never appears in anything a customer sees. */

  /* Dark mode */
  --ih-dark-bg:#0E1512;
  --ih-dark-green:#1C5A42;
  --ih-dark-paid:#4CAF7E;
}

/* Type does the work. Two families, one scale. */
:root{
  --ih-font-display:"Newsreader",Georgia,serif;    /* 24px and up only. Never in a button, input, table, or label. */
  --ih-font-ui:"Inter",system-ui,sans-serif;       /* text, UI, labels */
  --ih-font-money:"Inter",system-ui,sans-serif;    /* always 600, tabular-nums */

  /* Scale: 12 14 16 20 24 32 48 64 96 */
  --ih-text-caption:12px;
  --ih-text-small:14px;
  --ih-text-body:16px;
  --ih-text-lead:20px;
  --ih-text-title:24px;
  --ih-text-section:32px;
  --ih-text-head:48px;
  --ih-text-display:64px;
  --ih-text-hero:96px;

  --ih-leading-display:1.15;
  --ih-leading-body:1.55;
  --ih-leading-tight:1.3;

  --ih-tracking-display:-0.01em;
  --ih-tracking-eyebrow:0.14em;

  --ih-weight-regular:400;
  --ih-weight-medium:500;
  --ih-weight-semibold:600;
}

/* Every value is a multiple of 8. 4 is permitted inside icons and pill padding only. */
:root{
  --ih-space-1:8px;
  --ih-space-2:16px;
  --ih-space-3:24px;
  --ih-space-4:32px;
  --ih-space-6:48px;
  --ih-space-8:64px;
  --ih-space-10:80px;
  --ih-space-12:96px;
  --ih-gutter:24px;
  --ih-page-max:1120px;
  --ih-prose-max:640px;
}

/* Exactly two radii, plus pills. Nothing else exists. No shadows exist at all. */
:root{
  --ih-radius-element:8px;
  --ih-radius-container:16px;
  --ih-radius-pill:999px;
  --ih-border:1px solid var(--ih-stone);
  --ih-border-strong:1px solid var(--ih-green);
  --ih-shadow:none;
}

/* MoneyHound settles. Eases out, comes to rest. Nothing bounces, pulses, blinks, or chases. */
:root{
  --ih-ease:cubic-bezier(0.22,0.61,0.36,1); /* @kind other */
  --ih-duration:220ms; /* @kind other */
  --ih-duration-slow:400ms; /* @kind other */
  --ih-transition:all var(--ih-duration) var(--ih-ease);
}
@media (prefers-reduced-motion:reduce){:root{--ih-duration:1ms; /* @kind other */ --ih-duration-slow:1ms /* @kind other */}}

/* Semantic aliases. Reach for these in product code; reach for the base tokens only in brand work. */
:root{
  --surface-page:var(--ih-paper);
  --surface-card:var(--ih-white);
  --surface-inset:var(--ih-stone-50);
  --surface-brand:var(--ih-green);
  --surface-dark:var(--ih-dark-bg);

  --text-body:var(--ih-ink);
  --text-secondary:var(--ih-ink-60);
  --text-meta:var(--ih-ink-40);
  --text-on-brand:var(--ih-paper);
  --text-brand:var(--ih-green);
  --text-accent:var(--ih-copper);

  --border-default:var(--ih-stone);
  --border-focus:var(--ih-green);

  --action-primary-bg:var(--ih-copper);
  --action-primary-fg:var(--ih-paper);
  --action-secondary-fg:var(--ih-green);
  --action-secondary-border:var(--ih-stone);
  --action-disabled-fg:var(--ih-ink-40);
  --action-disabled-border:var(--ih-stone);

  --status-paid:var(--ih-paid);
  --status-waiting:var(--ih-waiting);
  --status-stopped:var(--ih-stopped);

  --focus-ring:0 0 0 2px var(--ih-paper),0 0 0 4px var(--ih-green);
}
