/* Shared palette, type, and clay primitives. Colours are sampled from the campfire scene. */
@font-face { font-family: 'Fraunces'; src: url('/assets/fonts/fraunces-var.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'DM Sans'; src: url('/assets/fonts/dm-sans-var.woff2') format('woff2'); font-weight: 100 1000; font-display: swap; }

:root {
  /* night sky and moonlit mountains */
  --night-950: #080a20;
  --night-900: #0d1030;
  --night-800: #141a44;
  --night-700: #1c2158;
  --night-600: #2a2c6a;
  --dusk-500: #42387a;
  --dusk-400: #6253a0;
  --dusk-300: #9a8bd0;
  --dusk-200: #c4bbe8;

  /* firelight */
  --flame: #fcd96b;
  --tent: #fda529;
  --ember: #fe8c1c;
  --ember-deep: #e2581a;
  --spark: #f0431c;

  /* clay, wood, and ground */
  --clay-300: #e3935a;
  --clay-400: #c96b34;
  --clay-500: #a8481f;
  --clay-600: #7a3319;
  --clay-700: #55220f;
  --bark: #2b0e05;

  /* felt pines, berries, brass pins, moonlight */
  --pine-300: #8db487;
  --pine-400: #4f8368;
  --pine-500: #2f5d4a;
  --pine-700: #183a31;
  --pine-900: #0c1f1f;
  --berry: #d2463a;
  --brass: #d7a851;
  --moon: #fbe3bc;
  --cream: #fff3da;

  --display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --body: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --grain: url('/assets/clay-grain.png');
}

/* Soft, heavy, slightly wonky serif: reads like letters pressed out of clay. */
.clay-type, h1, h2 {
  font-family: var(--display);
  font-weight: 800;
  font-variation-settings: 'SOFT' 100, 'WONK' 1;
  font-optical-sizing: auto;
  letter-spacing: -.02em;
}

/* Fixed-width digit cells: the bundled subsets have no tabular figures. */
.digits { display: inline-flex; }
.digits > span { display: inline-block; width: .64em; text-align: center; }
.digits > span.sep { width: .34em; }
