/* Shared brand constants: fonts + design tokens. Loaded by index.html and trial.html. */
@font-face {
  font-family: 'Bricolage Grotesque';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url(/assets/bricolage-grotesque-300-800.woff2) format('woff2');
}
@font-face {
  font-family: 'Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/plex-mono-400.woff2) format('woff2');
}
@font-face {
  font-family: 'Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/plex-mono-500.woff2) format('woff2');
}
@font-face {
  font-family: 'Plex Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/plex-mono-700.woff2) format('woff2');
}

:root, :root[data-theme="light"], :root[data-theme="dark"] {
  --paper:    #f4efe3;   /* ivory ground */
  --chalk:    #fbf8ec;   /* raised cards */
  --slate:    #1d3529;   /* racing green: ink on ivory, dark surfaces */
  --slate-2:  #2a4739;   /* raised surfaces on green */
  --sediment: #67705e;   /* secondary text on ivory */
  --dust:     #9c9c85;   /* tertiary */
  --seam:     #ded6bf;   /* hairlines on ivory */
  --seam-d:   #35543f;   /* hairlines on green */
  --accent-light: #9ec7ab;  /* sage: accents on green surfaces */
  --accent-deep: #2e5c43;  /* racing green, deep: accents on ivory */
  color-scheme: light;
}

/* Brand wordmark: shared base for the nav lockup on every page.
   Pages override size/gap only (index 21px/8px, subpages 19px/10px). */
.wordmark {
  display: flex; align-items: baseline;
  font-weight: 700; color: var(--slate); text-decoration: none;
}
.wordmark .gtm {
  font-family: 'Plex Mono', monospace; font-size: 11.5px; font-weight: 700;
  letter-spacing: 0.18em; color: var(--accent-deep);
}