/* Echad design tokens, shared by every page, the sermon page too. Dark by default; light follows the OS or the ◐ toggle. */
:root {
  --bg: #0e0f11; --surface: #15161a; --surface-2: #1c1e22; --surface-3: #24262b; --border: #2a2c32; --border-2: #363941;
  --text: #ecebe7; --text-2: #b9b7b1; --muted: #85837d; --on-color: #ffffff;
  --accent: #5b8cff; --accent-soft: rgba(91,140,255,.16); --accent-ring: rgba(91,140,255,.45);
  --trim: #3ecf8e; --trim-soft: rgba(62,207,142,.10); --out: #ff8a4c; --play: #ff4d5e; --mark: #f5c542; --mark-soft: rgba(245,197,66,.14);
  --wave: #4a4d55; --wave-on: #7ea3ff; --stage: #000;
  --s-service: #64748b; --s-prayer: #4f9c9a; --s-worship: #8b5cf6; --s-intro: #38bdf8; --s-sermon: #3b82f6; --s-altar: #d4932b; --s-closing: #22a565; --s-after: #c24848;
  --k-felt_need: #f472b6; --k-testimony: #f59e0b; --k-encouragement: #34d399; --k-reframe: #a78bfa; --k-teaching: #60a5fa; --k-invitation: #2dd4bf;
  --flag: #f59e0b; --shadow: 0 10px 30px rgba(0,0,0,.45); --scroll: #3a3d45; --scroll-hover: #4c505a;
  --ok: #3ecf8e; --ok-soft: rgba(62,207,142,.14); --warn: #f5c542; --warn-soft: rgba(245,197,66,.16); --bad: #ff4d5e; --bad-soft: rgba(255,77,94,.14); --info-soft: rgba(91,140,255,.14);
  --raise: #262830; --hair: rgba(255,255,255,.05); --accent-2: #7ea3ff; --edge: #ffffff; --pop: 0 16px 40px rgba(0,0,0,.55);
  --ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  color-scheme: dark;
}
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) {
  color-scheme: light; --scroll: #c9cdd4; --scroll-hover: #aab0b9;
  --bg: #eef0f3; --surface: #ffffff; --surface-2: #f6f7f9; --surface-3: #eceef2; --border: #dfe2e7; --border-2: #cfd3da;
  --text: #16181c; --text-2: #3d4149; --muted: #6b7079; --wave: #b8bcc4; --wave-on: #3b6fe0; --accent: #3a6cf0; --accent-soft: rgba(58,108,240,.12);
  --trim-soft: rgba(30,170,110,.10); --mark-soft: rgba(245,180,40,.18); --shadow: 0 10px 30px rgba(20,24,32,.16);
 --ok: #17a067; --ok-soft: rgba(23,160,103,.12); --warn: #b7860b; --warn-soft: rgba(245,180,40,.18); --bad: #d92d43; --bad-soft: rgba(217,45,67,.10); --info-soft: rgba(58,108,240,.10); --trim: #17a067; --out: #e36a2c; --play: #e5394c; --mark: #c89211;
 --raise: #ffffff; --hair: rgba(0,0,0,.05); --accent-2: #2f59cf; --edge: #16181c; --pop: 0 16px 40px rgba(20,24,32,.18);
}}
:root[data-theme="light"] {
  color-scheme: light; --scroll: #c9cdd4; --scroll-hover: #aab0b9;
  --bg: #eef0f3; --surface: #ffffff; --surface-2: #f6f7f9; --surface-3: #eceef2; --border: #dfe2e7; --border-2: #cfd3da;
  --text: #16181c; --text-2: #3d4149; --muted: #6b7079; --wave: #b8bcc4; --wave-on: #3b6fe0; --accent: #3a6cf0; --accent-soft: rgba(58,108,240,.12);
  --trim-soft: rgba(30,170,110,.10); --mark-soft: rgba(245,180,40,.18); --shadow: 0 10px 30px rgba(20,24,32,.16);
 --ok: #17a067; --ok-soft: rgba(23,160,103,.12); --warn: #b7860b; --warn-soft: rgba(245,180,40,.18); --bad: #d92d43; --bad-soft: rgba(217,45,67,.10); --info-soft: rgba(58,108,240,.10); --trim: #17a067; --out: #e36a2c; --play: #e5394c; --mark: #c89211;
 --raise: #ffffff; --hair: rgba(0,0,0,.05); --accent-2: #2f59cf; --edge: #16181c; --pop: 0 16px 40px rgba(20,24,32,.18);
}
:root[data-theme="dark"] { color-scheme: dark; }
* { scrollbar-width: thin; scrollbar-color: var(--scroll) transparent; }
*:hover { scrollbar-color: var(--scroll-hover) transparent; }