/* SpiffyLink — hub language tokens
   Pack: /workspace/spiffylink-web-assets/
   Logo lock: logo/spiffylink-logo.svg (attribution in logo/ATTRIBUTION.txt)
*/

:root {
  /* Surfaces — dark hub (logo lives on black) */
  --sl-bg: #0B0A0F;
  --sl-bg-lift: #14121A;
  --sl-panel: #1C1924;
  --sl-panel-hover: #252230;
  --sl-line: #2E2A38;
  --sl-line-bright: #3F3A4C;

  /* Ink */
  --sl-ink: #F4F2F7;
  --sl-ink-dim: #A39EAF;
  --sl-ink-mute: #6E697A;

  /* Brand / logo accents (from logo shards) */
  --sl-spark: #EC008C;      /* hot magenta — primary CTA / Link half */
  --sl-spark-deep: #B8006A;
  --sl-spark-soft: #FF4DB8;
  --sl-volt: #6CC4A0;       /* teal shard — secondary / links */
  --sl-volt-deep: #3D9A78;
  --sl-sun: #FBAA19;        /* amber shard — highlights, badges */
  --sl-flare: #EE2424;      /* red shard — decorative only, not danger alone */
  --sl-lime: #A9DA0C;       /* lime shard — decorative / success glyph pair */
  --sl-grape: #813092;      /* purple shard — chips, tags */

  /* Semantic (shape + color; never green-vs-red alone) */
  --sl-ok: #6CC4A0;
  --sl-warn: #FBAA19;
  --sl-danger: #EC008C;     /* magenta + stop shape — not red alone */

  /* Type */
  --sl-font-display: "Fredoka", "Nunito", system-ui, sans-serif;
  --sl-font-ui: "Nunito Sans", "Inter", system-ui, sans-serif;
  --sl-font-mono: "IBM Plex Mono", ui-monospace, monospace;

  /* Space / shape */
  --sl-space: 8px;
  --sl-radius: 16px;
  --sl-radius-pill: 999px;
  --sl-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
  --sl-max: 1080px;
}