/* GENERATED — do not hand-edit. Build-time mirror of the SSOT
   @ghostcrawl/brand-tokens/tokens.css, served so the browser can resolve
   var(--gc-*) on the Astro marketing pages (D-04). Refreshed by `npm run
   prebuild` (scripts/sync-tokens.mjs); the package remains the single source. */
/* =============================================================================
 * GhostCrawl brand tokens — the single source of truth (@ghostcrawl/brand-tokens).
 *
 * Consumed by every surface (marketing, docs, dashboard, self-host) via
 * `@import "@ghostcrawl/brand-tokens/tokens.css"`. Edit values here once; they
 * propagate everywhere.
 *
 * Palette: electric ghost ion-blue (--gc-accent #1c63ff) with a firm neutral
 * scale for clean secondary-text hierarchy and crisp card edges.
 * ============================================================================= */

:root {
  /* Surface — strictly white scale (unchanged — Variant A introduces no grey). */
  --gc-bg:           #ffffff;
  --gc-surface:      #ffffff;
  --gc-elevated:     #ffffff;
  --gc-soft:         #f5f5f5;
  --gc-soft-2:       #ebebeb;

  /* Text — firmer neutrals for cleaner hierarchy (the Variant A refinement). */
  --gc-fg:           #060912;
  --gc-fg-muted:     #4a4a4a;   /* was #555555 — darker secondary text */
  --gc-fg-faint:     #767676;   /* was #888888 — eyebrows/labels read on white */

  /* Accent — electric ghost-ion blue. Unchanged: identity is preserved. */
  --gc-accent:       #1c63ff;
  --gc-accent-2:     #5b9bff;
  --gc-accent-hover: #0a4adb;
  --gc-accent-tint:  #d6e3ff;
  --gc-accent-wash:  rgba(28, 99, 255, 0.08);
  --gc-accent-glow:  rgba(28, 99, 255, 0.38);
  --gc-accent-90:    rgba(28, 99, 255, 0.90);
  --gc-accent-72:    rgba(28, 99, 255, 0.72);
  --gc-accent-56:    rgba(28, 99, 255, 0.56);
  --gc-accent-40:    rgba(28, 99, 255, 0.40);
  --gc-accent-24:    rgba(28, 99, 255, 0.24);
  --gc-accent-12:    rgba(28, 99, 255, 0.12);
  --gc-accent-06:    rgba(28, 99, 255, 0.06);

  /* Lines — firmer card edges so glass panes don't dissolve on white. */
  --gc-border:       #e2e2e2;   /* was #e6e6e6 */
  --gc-border-soft:  #f0f0f0;

  --gc-code-bg:      #f5f5f5;
  --gc-code-fg:      #060912;
  --gc-code-key:     #1c63ff;
  --gc-code-str:     #555555;
  --gc-code-num:     #1f2330;
  --gc-code-cmt:     #888888;

  --gc-ease:         cubic-bezier(0.16, 0.84, 0.32, 1);
  --gc-ease-out:     cubic-bezier(0.22, 1, 0.36, 1);
  --gc-fast:         140ms;
  --gc-med:          280ms;

  --gc-shadow-sm:    0 1px 2px rgba(12, 18, 24, .04), 0 1px 3px rgba(12, 18, 24, .06);
  --gc-shadow-md:    0 4px 12px rgba(12, 18, 24, .06), 0 2px 4px rgba(12, 18, 24, .04);
  --gc-shadow-lg:    0 16px 40px rgba(12, 18, 24, .08), 0 4px 12px rgba(12, 18, 24, .04);

  --gc-glass-bg:     color-mix(in srgb, var(--gc-surface) 62%, transparent);
  --gc-glass-border: rgba(15, 20, 30, 0.10);
  --gc-glass-hi:     rgba(255, 255, 255, 0.75);
  --gc-glass-shadow: 0 8px 32px rgba(12, 18, 24, .10), 0 2px 8px rgba(12, 18, 24, .06);
  --gc-glass-blur:   18px;

  --gc-radius-sm:    8px;
  --gc-radius:       12px;
  --gc-radius-lg:    18px;
  --gc-max:          1200px;

  --gc-font-mono:    "GeistMono", ui-monospace, "Menlo", "Consolas", monospace;
}

html.dark {
  /* Dark mode unchanged from default — the dark accent is already well-tuned. */
  --gc-bg:           #04060d;
  --gc-surface:      #070a14;
  --gc-elevated:     #0c1020;
  --gc-soft:         #080b15;
  --gc-soft-2:       #141828;

  --gc-fg:           #ffffff;
  --gc-fg-muted:     #aaaaaa;
  --gc-fg-faint:     #666666;

  --gc-accent:       #7aa4ff;
  --gc-accent-2:     #b3cdff;
  --gc-accent-hover: #a8c4ff;
  --gc-accent-tint:  #0f1d3a;
  --gc-accent-wash:  rgba(122, 164, 255, 0.10);
  --gc-accent-glow:  rgba(122, 164, 255, 0.55);
  --gc-accent-90:    rgba(122, 164, 255, 0.90);
  --gc-accent-72:    rgba(122, 164, 255, 0.72);
  --gc-accent-56:    rgba(122, 164, 255, 0.56);
  --gc-accent-40:    rgba(122, 164, 255, 0.40);
  --gc-accent-24:    rgba(122, 164, 255, 0.24);
  --gc-accent-12:    rgba(122, 164, 255, 0.12);
  --gc-accent-06:    rgba(122, 164, 255, 0.06);

  --gc-border:       #1a1a1a;
  --gc-border-soft:  #0e0e0e;

  --gc-code-bg:      #070a14;
  --gc-code-fg:      #ffffff;
  --gc-code-key:     #7aa4ff;
  --gc-code-str:     #aaaaaa;
  --gc-code-num:     #dddddd;
  --gc-code-cmt:     #666666;

  --gc-shadow-sm:    0 1px 2px rgba(0, 0, 0, .3), 0 1px 3px rgba(0, 0, 0, .4);
  --gc-shadow-md:    0 4px 12px rgba(0, 0, 0, .4), 0 2px 4px rgba(0, 0, 0, .3);
  --gc-shadow-lg:    0 16px 40px rgba(0, 0, 0, .5), 0 4px 12px rgba(0, 0, 0, .3);

  --gc-glass-bg:     color-mix(in srgb, var(--gc-surface) 56%, transparent);
  --gc-glass-border: rgba(255, 255, 255, 0.09);
  --gc-glass-hi:     rgba(255, 255, 255, 0.14);
  --gc-glass-shadow: 0 8px 32px rgba(0, 0, 0, .45), 0 2px 8px rgba(0, 0, 0, .35);
}