/* HumbleBear colour system.
   Product palette is lifted verbatim from humblebear/resources/css/app.css (@theme block):
   the app remaps Tailwind's `zinc-*` names onto the NEUTRAL hex ramp, primary = zinc-900,
   accent = yellow-500. Brand-mark colours come from assets/logo.png (the astronaut bear). */

:root{
  /* ---- neutral ramp (named zinc-* in the app, neutral hexes) ---- */
  --color-zinc-50:#fafafa;
  --color-zinc-100:#f5f5f5;
  --color-zinc-200:#e5e5e5;
  --color-zinc-300:#d4d4d4;
  --color-zinc-400:#a3a3a3;
  --color-zinc-500:#737373;
  --color-zinc-600:#525252;
  --color-zinc-700:#404040;
  --color-zinc-800:#262626;
  --color-zinc-900:#171717;
  --color-zinc-950:#0a0a0a;
  --color-white:#ffffff;
  --color-black:#000000;

  /* ---- accent (yellow — the single brand accent; never orange) ---- */
  --color-yellow-100:#fef9c2;
  --color-yellow-300:#ffdf20;
  --color-yellow-400:#fdc700;  /* marketing CTA fill */
  --color-yellow-500:#f0b100;  /* --color-accent, CTA hover */
  --color-yellow-800:#894b00;  /* text on yellow-500 fills */
  --color-amber-400:#ffb900;   /* marketing nav hover fill */
  --color-star:#fdde93;        /* galaxy canvas star colour */

  /* ---- semantic hues ---- */
  --color-red-100:#ffe2e2;--color-red-300:#ffa2a2;--color-red-400:#ff6467;--color-red-500:#fb2c36;
  --color-green-100:#dbfce7;--color-green-300:#7bf1a8;--color-green-400:#05df72;--color-green-500:#00c950;--color-green-600:#00a63e;
  --color-sky-100:#dff2fe;--color-sky-200:#b8e6fe;--color-sky-300:#74d4ff;--color-sky-400:#00bcff;--color-sky-500:#00a6f4;--color-sky-600:#0084d1;
  --color-purple-100:#f3e8ff;--color-purple-300:#dab2ff;--color-purple-500:#ad46ff;
  --color-orange-100:#ffedd4;--color-orange-300:#ffb86a;--color-orange-500:#ff6900; /* legacy badge colour only */

  /* ---- brand mark palette (astronaut bear) ---- */
  --brand-night:#1f2334;      /* helmet interior / space */
  --brand-indigo:#353b58;     /* highlight inside the night */
  --brand-helmet:#a7afbf;     /* glass + visor grey */
  --brand-base:#d2d7e0;       /* plinth grey */
  --brand-fur:#ffffff;        /* the bear */
  --brand-star:#f9c441;       /* stars in the mark */
  --chart-navy:#3e496b;       /* dashboard bar-chart fill */

  /* ---- semantic aliases (light — the only mode) ---- */
  --primary:var(--color-zinc-900);
  --primary-foreground:var(--color-zinc-50);
  --accent:var(--color-yellow-500);
  --accent-foreground:var(--color-white);
  --muted:var(--color-zinc-500);
  --muted-foreground:var(--color-zinc-400);

  --text-body:var(--color-zinc-800);
  --text-heading:var(--color-zinc-900);
  --text-muted:var(--color-zinc-500);
  --text-caption:var(--color-zinc-500);
  --text-on-accent:var(--color-zinc-900);

  --surface-page:var(--color-white);
  --surface-card:var(--color-white);
  --surface-subtle:var(--color-zinc-100);
  --surface-sidebar:var(--color-zinc-50);
  --surface-marketing:var(--color-zinc-900);
  --surface-marketing-raised:var(--color-zinc-800);
  --surface-input:var(--color-white);
  --surface-toast:var(--color-zinc-900);

  --border-default:var(--color-zinc-200);
  --border-strong:var(--color-zinc-300);
  --border-marketing:var(--color-zinc-600);
  --border-divide:var(--color-zinc-200);

  --focus-ring:var(--color-zinc-200);
  --link:var(--color-sky-600);
  --link-accent:var(--color-accent);
}

/* This design system is LIGHT MODE ONLY. The product does ship a `.dark` scope, but it is
   deliberately not carried here — design against the light aliases above. The dark values
   below are the marketing shell's, which is always dark and has no light counterpart:
   --surface-marketing / --surface-marketing-raised / --border-marketing. */