/*
  theme.css — design tokens only (direction B «Mint»: ink, struck metal, reeded edge).
  Values follow brand/brand.css. base.css reads nothing else.
*/

@font-face {
  font-family: "Fraunces";
  src: url("fonts/Fraunces-VF.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fraunces";
  src: url("fonts/Fraunces-Italic-VF.woff2") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Sans";
  src: url("fonts/InstrumentSans-VF.woff2") format("woff2");
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* ink: blue-green, never neutral black */
  --ink-950: #061118;
  --ink-900: #0a1a22;
  --ink-850: #0d212b;
  --ink-800: #112a35;
  --ink-700: #1a3946;
  --ink-600: #26495a;
  --ink-400: #4f7480;
  --verdigris: #7fa39d;

  /* paper the ink prints on */
  --bone: #ece3cf;
  --bone-2: #c3c2b3;
  --bone-3: #8d9a94;

  /* struck metal: red gold, the only warm colour */
  --gold-100: #f6e5bd;
  --gold-300: #e3c07e;
  --gold-500: #c99a52;
  --gold-700: #8a6431;
  --gold-900: #4a3418;

  /* roles */
  --bg: var(--ink-900);
  --bg-deep: var(--ink-950);
  --panel: var(--ink-850);
  --text: var(--bone);
  --text-2: var(--bone-2);
  --text-3: var(--bone-3);
  --rule: rgba(127, 163, 157, 0.16);
  --rule-strong: rgba(127, 163, 157, 0.32);
  --rule-ink: var(--ink-700);
  --tint: rgba(236, 227, 207, 0.03);
  --tint-strong: rgba(236, 227, 207, 0.06);
  --accent: var(--gold-300);
  --accent-strong: var(--gold-100);
  --hatch: rgba(201, 154, 82, 0.34);
  --hatch-hot: rgba(227, 192, 126, 0.62);
  --hatch-pool: rgba(127, 163, 157, 0.26);
  --error: #e7a98c;

  /* form controls: lines that hold up on a phone in daylight */
  --field-line: var(--ink-400);          /* 3.5:1 on the ink */
  --field-line-hover: var(--verdigris);
  --placeholder: rgba(141, 154, 148, 0.82); /* bone-3, softened: 4.6:1 on a field */
  --watermark: #ece3cf;                  /* engraved rosettes, drawn at low opacity */
  --watermark-opacity: 0.065;

  /* type */
  --serif: "Fraunces", "Iowan Old Style", Georgia, serif;
  --sans: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --display-axes: "SOFT" 0, "WONK" 0;
  --italic-axes: "SOFT" 30, "WONK" 1;

  /* shape */
  --radius: 3px;
  --hairline: 1px;
}