/* YinYang Food: design tokens. Colours are the app's own (src/css/base.css in the app, 1.3.0).
   One light theme, like the app ("color-scheme: light only"). Vermillion is the accent; gold and jade support it.
   Contrast (WCAG, on parchment / card-alt): text 14.3 / 12.3, sub 7.9 / 6.7, muted 5.5 / 4.7, red 5.9 / 5.1,
   gold-text 5.4 / 4.6, jade 5.4 / 4.7. Element and nature colours are for marks and lines, not for small text. */
:root {
  color-scheme: light only;

  /* paper */
  --bg: #f5ebe0;          /* app --bg-primary: warm parchment */
  --bg-card: #efe3d4;     /* app --bg-card */
  --bg-alt: #e8dac8;      /* app --bg-card-alt */
  --paper: #faf4eb;       /* app --bg-input */
  --ink: #2a1d16;         /* device bezels */

  /* type */
  --text: #2c1810;        /* app --text */
  --sub: #55443a;         /* body copy */
  --muted: #6b5c50;       /* app --text-dim: captions, mono labels */

  /* accents */
  --red: #a0342e;         /* 朱红 vermillion, the app's primary accent */
  --red-deep: #8c2b26;
  --red-rgb: 160, 52, 46;
  --gold: #b8860b;        /* 金 gold, decoration only */
  --gold-rgb: 184, 134, 11;
  --gold-text: #7a5a12;
  --jade: #2d6a4f;        /* 翠 jade green */
  --jade-rgb: 45, 106, 79;

  /* the Five Elements (app --wood … --water) */
  --wood: #2d7a42;
  --fire: #c04030;
  --earth: #b8860b;
  --metal: #8a8a8a;
  --water: #2a5a9a;

  /* thermal nature (app --nature-*) */
  --cold: #2a7ab5;
  --cool: #3a9a9a;
  --neutral: #7a7a6a;
  --warm: #c4842a;
  --hot: #b03a3a;

  /* lines and surfaces */
  --line: rgba(var(--red-rgb), .1);
  --line-2: rgba(var(--red-rgb), .16);
  --line-3: rgba(44, 24, 16, .22);
  --glass: rgba(250, 244, 235, .64);
  --shadow: 0 2px 8px rgba(139, 105, 20, .06), 0 1px 3px rgba(0, 0, 0, .04); /* the app's card shadow */
  --lift: 0 34px 80px -46px rgba(92, 52, 20, .55);
  --top-bar: linear-gradient(90deg, var(--red), var(--gold), var(--jade), var(--gold), var(--red)); /* the app's 3px top accent */

  --ambient:
    radial-gradient(60vw 50vh at 88% 6%, rgba(var(--red-rgb), .10), transparent 70%),
    radial-gradient(55vw 55vh at 6% 38%, rgba(var(--gold-rgb), .11), transparent 70%),
    radial-gradient(60vw 50vh at 80% 92%, rgba(var(--jade-rgb), .08), transparent 70%),
    var(--bg);

  /* shared footer (ldc-footer.css) */
  --ldc-footer-bg: #e8dac8;
  --ldc-footer-border: rgba(160, 52, 46, .14);
  --ldc-footer-link: #5a4a3e;
  --ldc-footer-link-h: #2c1810;
  --ldc-footer-current: #a0342e;
  --ldc-footer-cat: #6b5c50;
  --ldc-footer-dot: rgba(44, 24, 16, .3);
  --ldc-footer-meta: #5a4a3e;
}