/* ewangelicka: skin tokens.
   Layer 1 = modules/brand/tokens/ewangelicka.css colour values, copied verbatim (--brand-*, --color-*; frontend main.css maps them to --c-*).
   Layer 2 = design extension: fonts, atmosphere, glass material, shadow tint. Load AFTER system.css:
     <link rel="stylesheet" href="/brand/ewangelicka/tokens.css">  (this file)  +  system.css
   Light is :root; dark follows prefers-color-scheme unless [data-theme="light"]; [data-theme="dark"] forces dark. */
:root {
  --font-display: 'Source Serif 4', Georgia, serif;
  --font-heading: var(--font-display);
  --font-body: Inter, system-ui, sans-serif;
  --font-ui: var(--font-body);
  --display-weight: 600;
  --display-tracking: -0.02em;
  --display-scale: 1;
}
:root {
  --brand-primary: #2b2f36;
  --brand-accent: #3a7bd5;
  --color-primary: #2b2f36;
  --color-on-primary: #ffffff;
  --color-accent: #3a7bd5;
  --color-on-accent: #000000;
  --color-accent-text: #1f5fb8;
  --color-surface: #fafafa;
  --color-surface-2: #f0f1f3;
  --color-text: #1c1f24;
  --color-muted: #575d66;
  --color-success: #1f6b3a;
  --color-danger: #b02222;
  --color-border: #d8dbe0;
  color-scheme: light;
  --atmosphere: radial-gradient(90% 46% at 50% 112%, rgba(255,190,130,.55), transparent 70%), radial-gradient(60% 40% at 14% -6%, rgba(58,123,213,.22), transparent 72%), linear-gradient(180deg,#e6eefa 0%,#f5f2f1 48%,#fbefe3 100%);
  --halo: 255,190,130;
  --motif: none;
  --shadow-rgb: 28 44 80;
  --glass-fill: rgba(250,250,250,0.74);
  --glass-fill-thick: rgba(250,250,250,0.88);
  --glass-stroke: rgba(255,255,255,0.55);
  --glass-edge: rgba(255,255,255,0.65);
  --glass-solid: #fafafa;
  --scrim: rgba(20,24,40,.32);
  --grain-opacity: .05;
  --cta-bg: var(--color-primary);
  --cta-fg: var(--color-on-primary);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-primary: #b8c2d0;
    --color-on-primary: #14171c;
    --color-accent: #6aa3ee;
    --color-on-accent: #0b1626;
    --color-accent-text: #6aa3ee;
    --color-surface: #14171c;
    --color-surface-2: #1d2128;
    --color-text: #eceef1;
    --color-muted: #a2a9b3;
    --color-success: #6cc58a;
    --color-danger: #f08a8a;
    --color-border: #303640;
    color-scheme: dark;
    --atmosphere: radial-gradient(90% 48% at 50% 114%, rgba(255,160,100,.24), transparent 70%), radial-gradient(60% 42% at 92% -6%, rgba(106,163,238,.26), transparent 72%), linear-gradient(180deg,#0f1520 0%,#14171c 52%,#1b1a1e 100%);
    --halo: 255,170,110;
    --motif: none;
    --shadow-rgb: 2 4 10;
    --glass-fill: rgba(27,31,39,0.62);
    --glass-fill-thick: rgba(27,31,39,0.84);
    --glass-stroke: rgba(255,255,255,0.1);
    --glass-edge: rgba(255,255,255,0.14);
    --glass-solid: #1b1f27;
    --scrim: rgba(0,0,0,.55);
    --grain-opacity: .07;
    --cta-bg: var(--color-accent);
    --cta-fg: var(--color-on-accent);
  }
}
:root[data-theme="dark"] {
  --color-primary: #b8c2d0;
  --color-on-primary: #14171c;
  --color-accent: #6aa3ee;
  --color-on-accent: #0b1626;
  --color-accent-text: #6aa3ee;
  --color-surface: #14171c;
  --color-surface-2: #1d2128;
  --color-text: #eceef1;
  --color-muted: #a2a9b3;
  --color-success: #6cc58a;
  --color-danger: #f08a8a;
  --color-border: #303640;
  color-scheme: dark;
  --atmosphere: radial-gradient(90% 48% at 50% 114%, rgba(255,160,100,.24), transparent 70%), radial-gradient(60% 42% at 92% -6%, rgba(106,163,238,.26), transparent 72%), linear-gradient(180deg,#0f1520 0%,#14171c 52%,#1b1a1e 100%);
  --halo: 255,170,110;
  --motif: none;
  --shadow-rgb: 2 4 10;
  --glass-fill: rgba(27,31,39,0.62);
  --glass-fill-thick: rgba(27,31,39,0.84);
  --glass-stroke: rgba(255,255,255,0.1);
  --glass-edge: rgba(255,255,255,0.14);
  --glass-solid: #1b1f27;
  --scrim: rgba(0,0,0,.55);
  --grain-opacity: .07;
  --cta-bg: var(--color-accent);
  --cta-fg: var(--color-on-accent);
}
