/* Motive theme. Colours and type are the app's own (Motive 2.10.0: src/css/theme.css and main.css):
   dark is the app's "Deep Warm Navy", light its "Warm Parchment", brass (#b8956a) is the one accent.
   Syne (display) and Inter (text) are the fonts the app bundles; both SIL OFL 1.1 (fonts/Syne-OFL.txt, Inter-OFL.txt).
   The page follows the phone's light/dark setting like the app; an inline script in <head> sets data-theme before
   first paint, and the nav toggle stores a choice under "motive-theme". Without JS the page stays dark. */
@font-face { font-family: "Syne"; src: url("fonts/syne-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Syne"; src: url("fonts/syne-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Syne"; src: url("fonts/syne-800.woff2") format("woff2"); font-weight: 800; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/inter-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/inter-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/inter-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/inter-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
  color-scheme: dark;
  --display: "Syne", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* Deep Warm Navy */
  --bg: #12111a;
  --bg-well: #0d0c13;
  --surface: #1c1b26;
  --surface-2: #242330;
  --glass: rgba(28, 27, 38, .6);
  --line: rgba(255, 255, 255, .07);
  --line-2: rgba(255, 255, 255, .11);
  --line-3: rgba(255, 255, 255, .19);
  --text: #e8e6e0;               /* 15.0:1 on --bg */
  --sub: #a9a5b2;                /* body copy, 7.1:1 on --surface */
  --muted: #8a8694;              /* the app's --text-muted: captions, 4.8:1 on --surface, 5.3:1 on --bg */

  --accent: #b8956a;             /* brass: the app's only accent */
  --accent-rgb: 184, 149, 106;
  --accent-text: #c8a070;        /* labels and links, 7.8:1 on --bg */
  --plum-rgb: 155, 89, 182;      /* the app's faint dark-theme gradient */
  --cta-bg: linear-gradient(148deg, #caa868 0%, #b8956a 55%, #a37e55 100%); /* the app's primary button */
  --cta-ink: #12111a;            /* 5.0:1 or better across the gradient */
  --ghost: rgba(255, 255, 255, .03);
  --ghost-hover: rgba(255, 255, 255, .07);
  --nav-bg: rgba(18, 17, 26, .66);
  --bezel: linear-gradient(155deg, #34323d, #0b0a10 38%, #1d1c25);
  --drop: rgba(0, 0, 0, .7);
  --glow: .55;                   /* strength of brass glows */
  --wash: radial-gradient(60% 50% at 18% 0%, rgba(184, 149, 106, .09), transparent 60%),
          radial-gradient(50% 50% at 92% 100%, rgba(155, 89, 182, .07), transparent 60%);

  /* shared footer (ldc-footer.css is copied in by CI; it is styled only through these) */
  --ldc-footer-bg: transparent;
  --ldc-footer-border: var(--line);
  --ldc-footer-link: var(--sub);
  --ldc-footer-link-h: var(--text);
  --ldc-footer-current: var(--accent-text);
  --ldc-footer-cat: var(--muted);
  --ldc-footer-dot: var(--muted);
  --ldc-footer-meta: var(--muted);
}

[data-theme="light"] {
  color-scheme: light;
  /* Warm Parchment */
  --bg: #f5f0e8;
  --bg-well: #ede8df;
  --surface: #ede8df;
  --surface-2: #e4ddd4;
  --glass: rgba(255, 252, 246, .62);
  --line: rgba(90, 82, 72, .12);
  --line-2: rgba(90, 82, 72, .19);
  --line-3: rgba(90, 82, 72, .3);
  --text: #3d3832;               /* 10.2:1 on --bg */
  --sub: #5a5249;                /* 6.8:1 on --bg */
  --muted: #6b6359;              /* 5.2:1 on --bg, 4.8:1 on --surface */

  --accent-text: #7d5f37;        /* the brass, darkened for text: 5.2:1 on --bg, 4.8:1 on --surface */
  --ghost: rgba(255, 255, 255, .4);
  --ghost-hover: rgba(255, 255, 255, .75);
  --nav-bg: rgba(245, 240, 232, .74);
  --bezel: linear-gradient(155deg, #4a4540, #1c1916 38%, #35302b);
  --drop: rgba(60, 50, 40, .28);
  --glow: .4;
  --wash: radial-gradient(60% 50% at 18% 0%, rgba(184, 149, 106, .16), transparent 60%),
          radial-gradient(50% 50% at 92% 100%, rgba(184, 149, 106, .1), transparent 60%);
}