/* Monolith3 design tokens — v1.3, 2026-09-22 (bolder base).
   Source of truth: Brands/monolith3/brand-kit/guidelines.md
   Fonts are Boring Type only. Paths assume this file sits next to fonts/web/. */

@font-face { font-family: "M3 Sans"; src: url("fonts/web/sussie-light.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "M3 Sans"; src: url("fonts/web/sussie-lightitalic.woff2") format("woff2"); font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: "M3 Sans"; src: url("fonts/web/sussie-regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "M3 Sans"; src: url("fonts/web/sussie-medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "M3 Label"; src: url("fonts/web/soehne-buch.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "M3 Label"; src: url("fonts/web/soehne-kraeftig.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "M3 Label"; src: url("fonts/web/soehne-halbfett.woff2") format("woff2"); font-weight: 600; font-display: swap; }

:root {
  /* Warm monochrome. Boring Stories family, one step darker. No accent color. */
  --m3-ink:      #100E0C; /* type, marks, dark ground. 15.4:1 on stone */
  --m3-ink-2:    #1C1916; /* raised surface on ink */
  --m3-umber:    #4F473F; /* secondary text on light. 7.3:1 on stone */
  --m3-dust:     #A0968A; /* secondary text on ink only (6.6:1). Never on light */
  --m3-taupe:    #C4B9AA; /* hairlines on light. Decorative only */
  --m3-stone:    #ECE5D9; /* default ground (Stories ivory #FFF9F3, darkened) */
  --m3-stone-2:  #DDD5C8; /* alternate band (Stories film base, darkened) */
  --m3-paper:    #F2EDE4; /* documents, raised surface. 16.5:1 with ink */

  /* One accent: cobalt (Jason, 2026-09-22). It marks the one thing that needs attention or action. */
  --m3-cobalt:       #2E4BFF; /* fills (stone text on it, 4.7:1); text/rules on paper and stone (5.1:1) */
  --m3-cobalt-light: #6F86FF; /* cobalt TEXT, numbers and thin rules on ink (6.0:1) */

  /* Type */
  --m3-font-sans:  "M3 Sans", ui-sans-serif, system-ui, sans-serif;   /* Sussie */
  --m3-font-label: "M3 Label", ui-sans-serif, system-ui, sans-serif;  /* Söhne */
  --m3-display:  clamp(2.75rem, 1.6rem + 5vw, 6rem);   /* Sussie Light 300, -0.025em */
  --m3-h1:       clamp(2.1rem, 1.5rem + 2.6vw, 3.5rem); /* Sussie Light 300, -0.02em */
  --m3-h2:       clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); /* Sussie Regular 400, -0.01em */
  --m3-h3:       1.25rem;                              /* Sussie Medium 500 */
  --m3-body:     1.0625rem;                            /* Sussie Regular 400, 1.6 leading */
  --m3-small:    0.875rem;
  --m3-label:    0.75rem;                              /* Söhne Kräftig 500, caps, +0.14em */
  --m3-figure:   clamp(3rem, 2rem + 4vw, 5.5rem);      /* big counts. Sussie Light, tabular */

  /* Space: 4px base */
  --m3-s1: 4px; --m3-s2: 8px; --m3-s3: 12px; --m3-s4: 16px; --m3-s6: 24px;
  --m3-s8: 32px; --m3-s12: 48px; --m3-s16: 64px; --m3-s24: 96px; --m3-s36: 144px;

  /* Shape. The bars have square corners; so does everything else. */
  --m3-radius: 0;
  --m3-radius-ui: 2px;   /* inputs and buttons only */
  --m3-rule: 1px solid var(--m3-taupe);
  --m3-measure: 64ch;
  --m3-ease: cubic-bezier(.16, 1, .3, 1);
  --m3-slow: 900ms;
}