/* Bagua theme. Colours are the app's own tokens (Bagua 1.2.0, src/css/theme.css: "Ink Wash" design).
   Light ("Soft Stone") is the default, as in the app; dark ("Evening Hearth") via the nav toggle, stored as
   bagua-theme and applied by the inline script in <head> before first paint.
   Accent rules, as in the app: bronze means action and change (the main button, changing lines, active state);
   teal ("water") means the relating hexagram, where a reading is heading; element colours only for the Five Phases.
   Text tokens are darkened/lightened versions of the app's inks so every text pair reaches 4.5:1. */
:root {
  color-scheme: light;
  --bg: #eae7e0;
  --bg-well: #e4e0d8;
  --surface: #f0ede6;
  --surface-2: #e4e0d8;
  --line: rgba(90, 85, 78, .13);
  --line-2: rgba(90, 85, 78, .2);
  --line-3: rgba(90, 85, 78, .32);
  --head: #4a4640;              /* 7.6:1 on --bg */
  --text: #5a554e;              /* the app's --ink, 6.0:1 */
  --sub: #625c55;               /* 5.3:1 on --bg, 5.0:1 on --surface-2 */
  --muted: #67615a;             /* 4.9:1 on --bg, 4.6:1 on --surface-2 */

  --accent: #b8956a;            /* aged brass: fills, dots, rules (not body text) */
  --accent-rgb: 184, 149, 106;
  --accent-text: #76592f;       /* bronze for text, 5.2:1 */
  --cta-ink: #2a2722;           /* text on the bronze button, 5.3:1 */
  --water: #6a8f9a;
  --water-rgb: 106, 143, 154;
  --water-text: #44666f;        /* teal for text, 5.0:1 */
  --yang: #5a554e;              /* hexagram lines, as the app draws them */
  --yin: #c8c2b8;
  --ghost: #b8b2a8;              /* the app's --ink-ghost: coin rims, decoration only */

  --el-wood: #82a88a;
  --el-fire: #b89888;
  --el-earth: #b8a880;
  --el-metal: #9a9a96;
  --el-water: #82a0ae;

  --glass: rgba(240, 237, 230, .62);
  --glass-edge: rgba(255, 255, 255, .55);
  --shadow: 0 30px 70px -42px rgba(58, 52, 44, .45);
  --phone-edge: #d9d4ca;
  --ambient: radial-gradient(55% 40% at 88% 6%, rgba(184, 149, 106, .13), transparent 70%),
             radial-gradient(45% 35% at 6% 44%, rgba(106, 143, 154, .08), transparent 70%),
             radial-gradient(50% 40% at 80% 92%, rgba(90, 85, 78, .07), transparent 70%);
  --sky: radial-gradient(60% 46% at 50% 30%, rgba(184, 149, 106, .14), transparent 70%),
         radial-gradient(40% 30% at 18% 22%, rgba(90, 85, 78, .07), transparent 70%),
         radial-gradient(40% 30% at 84% 30%, rgba(106, 143, 154, .08), transparent 70%);
  --fade: rgba(234, 231, 224, .78);

  /* shared LD Coda footer (ldc-footer.css); text colours meet WCAG AA on the footer background */
  --ldc-footer-bg: #e4e0d8;
  --ldc-footer-border: rgba(90, 85, 78, .16);
  --ldc-footer-link: #5a554e;
  --ldc-footer-link-h: #2a2722;
  --ldc-footer-current: #76592f;
  --ldc-footer-cat: #625c55;
  --ldc-footer-dot: #9a948a;
  --ldc-footer-meta: #625c55;
}

[data-theme="dark"] {
  color-scheme: dark;
  --bg: #2a2722;
  --bg-well: #26231f;
  --surface: #32302a;
  --surface-2: #3a3832;
  --line: rgba(200, 194, 184, .1);
  --line-2: rgba(200, 194, 184, .16);
  --line-3: rgba(200, 194, 184, .27);
  --head: #ddd7cc;              /* 10.4:1 */
  --text: #c8c2b8;              /* the app's --ink, 8.4:1 */
  --sub: #b3ada3;               /* 6.7:1, 5.3:1 on --surface-2 */
  --muted: #aaa49a;             /* 6.0:1, 4.7:1 on --surface-2 */

  --accent: #c8a070;
  --accent-rgb: 200, 160, 112;
  --accent-text: #c8a070;       /* 6.2:1, 4.9:1 on --surface-2 */
  --cta-ink: #2a2722;           /* 6.2:1 on the button */
  --water: #7a9faa;
  --water-rgb: 122, 159, 170;
  --water-text: #8fb0ba;        /* 6.4:1 */
  --yang: #c8c2b8;
  --yin: #4a4640;
  --ghost: #5e5951;

  --el-wood: #6a9a72;
  --el-fire: #aa7a6a;
  --el-earth: #aa9a6a;
  --el-metal: #8a8a86;
  --el-water: #6a8a9a;

  --glass: rgba(50, 48, 42, .6);
  --glass-edge: rgba(255, 255, 255, .06);
  --shadow: 0 34px 80px -40px rgba(0, 0, 0, .7);
  --phone-edge: #46423b;
  --ambient: radial-gradient(55% 40% at 88% 6%, rgba(200, 160, 112, .09), transparent 70%),
             radial-gradient(45% 35% at 6% 44%, rgba(122, 159, 170, .05), transparent 70%),
             radial-gradient(50% 40% at 80% 92%, rgba(200, 160, 112, .04), transparent 70%);
  --sky: radial-gradient(60% 46% at 50% 30%, rgba(200, 160, 112, .11), transparent 70%),
         radial-gradient(40% 30% at 18% 22%, rgba(200, 194, 184, .04), transparent 70%),
         radial-gradient(40% 30% at 84% 30%, rgba(122, 159, 170, .05), transparent 70%);
  --fade: rgba(42, 39, 34, .8);

  --ldc-footer-bg: #26231f;
  --ldc-footer-border: rgba(200, 194, 184, .1);
  --ldc-footer-link: #b3ada3;
  --ldc-footer-link-h: #ddd7cc;
  --ldc-footer-current: #c8a070;
  --ldc-footer-cat: #aaa49a;
  --ldc-footer-dot: #6e6860;
  --ldc-footer-meta: #aaa49a;
}