/* Shamba tokens, generated from /Users/joechege/Projects/Shamba/brand-v3/tokens.json
   version 3.0-wave1-frozen-r2. Variables only. No reset, no element styling here.

   THE NINE LEGAL HEX VALUES. A tenth is a defect until justified in writing.
     #080C0A  loam                 dark surface, primary background
     #EDF1EC  chaff                light surface, and primary ink on dark
     #E3D9C2  millet               warm paper surface and emphasis rule. never type, never a button
     #8FA69B  fallow               muted ink, dark surfaces only
     #45A187  terrace              the one signal colour, dark surfaces only
     #145744  furrow               the same signal colour, light surfaces only
     #515552  ink-secondary-light  secondary text on light
     #313533  rule-dark            hairline on dark
     #C8CCC8  rule-light           hairline on light

   THREE THINGS THAT ARE FORBIDDEN ANYWHERE IN THIS BUILD.
   (Stated in words on purpose. tools/check.sh greps the source for the literal CSS
   property names, so this file must not contain them or it would fail its own gate.)
     1. Any corner radius above 0, on any element, in any state, including inputs,
        buttons, and the focus ring. Use var(--radius), which is 0.
     2. Any shadow of any kind, box, drop, or text, and no blur and no glow.
        Depth comes from three surface tiers plus a 1px hairline.
     3. Any font smoothing property, in any vendor spelling. Measured in v3: a label
        declared at 7.59:1 renders its dominant ink pixel at 1.01:1 with smoothing
        forced on. Leave it at auto and verify contrast on rendered pixels.

   Refused colour pairs, forbidden by measurement, not by taste:
     terrace on chaff 2.75:1, terrace on millet 2.23:1,
     fallow on chaff 2.27:1, furrow on loam 2.32:1.
   No meaning in this system may be carried by colour alone. */

:root {

  /* colour, the five named */
  --color-loam: #080C0A;
  --color-chaff: #EDF1EC;
  --color-millet: #E3D9C2;
  --color-fallow: #8FA69B;
  --color-terrace: #45A187;

  /* colour, the four derived */
  --color-furrow: #145744;
  --color-ink-secondary-light: #515552;
  --color-rule-dark: #313533;
  --color-rule-light: #C8CCC8;

  /* families. Register is enforced by size, not by choice.
     Source Serif 4 floor 29. Inter ceiling 24. IBM Plex Mono 12 or 14 only. */
  --font-display: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --font-utility: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* weights. Emphasis in prose is display italic 400. Bold is not an emphasis device. */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* type scale, base 17, single ratio 1.200.
     Every size below is paired with its leading at the same step. */
  --text-12: 12px;
  --text-14: 14px;
  --text-17: 17px;
  --text-24: 24px;
  --text-29: 29px;
  --text-35: 35px;
  --text-42: 42px;
  --text-51: 51px;
  --text-61: 61px;
  --text-73: 73px;

  --leading-12: 16px;
  --leading-14: 20px;
  --leading-17: 28px;
  --leading-24: 36px;
  --leading-29: 36px;
  --leading-35: 44px;
  --leading-42: 48px;
  --leading-51: 56px;
  --leading-61: 64px;
  --leading-73: 76px;

  /* measure, 45 to 80 characters, target 66 to 72 */
  --measure: 68ch;

  /* comma kern, applied on a comma followed by a space at 42px and above */
  --comma-kern: -0.045em;

  /* space, base unit 8. 4 is the only sub-unit value: optical correction inside a
     component, never to separate two blocks. 1px hairlines are a stated exception. */
  --space-4: 4px;
  --space-8: 8px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --space-96: 96px;
  --space-128: 128px;
  --space-192: 192px;

  --hairline: 1px;

  /* grid, desktop. 12 x 8U + 11 x 4U = 140U = 1120 */
  --grid-columns: 12;
  --grid-column: 64px;
  --grid-gutter: 32px;
  --grid-content: 1120px;
  --grid-outer: 1216px;
  --grid-margin: 48px;

  /* grid, tablet. An inset composition yields a different column width, so state it. */
  --grid-columns-tablet: 8;
  --grid-gutter-tablet: 24px;
  --grid-margin-tablet: 32px;
  --grid-frame-tablet: 768px;

  /* grid, mobile */
  --grid-columns-mobile: 4;
  --grid-gutter-mobile: 16px;
  --grid-margin-mobile: 24px;
  --grid-frame-mobile: 375px;

  /* shape. The chamfer is the only shape device: 45 degrees, keyed to the element's
     shorter side, bottom-right corner only, once per element, via clip-path.
     Nested elements use inner chamfer equals outer minus the padding step. */
  --radius: 0;
  --chamfer-8: 8px;
  --chamfer-16: 16px;
  --chamfer-24: 24px;

  /* mark. Clear space is one quarter of the mark height on all four sides.
     Mark alone never below 16px. Lockup never below 48px mark height. */
  --mark-min: 16px;
  --lockup-min: 48px;
  --mark-clearspace-ratio: 0.25;
}