/* GatherBrite design tokens — v1 (Oct 2026). Reuse in the app: @import "tokens.css"; */
:root {
  /* Primary — Ember Coral */
  --gb-coral-50:  #FFF4EE;
  --gb-coral-100: #FFE8DC;
  --gb-coral-400: #FF7A3D; /* brand coral: fills, primary buttons (ink text), illustrations */
  --gb-coral-600: #D9480F; /* large text / icons only (4.3:1 on white) */
  --gb-coral-700: #B93A0A; /* links, small coral text, buttons with white text */
  --gb-coral-800: #9C3008; /* hover/pressed */

  /* Secondary — Lagoon Teal */
  --gb-teal-100: #DDF6F2;
  --gb-teal-300: #5FD3C4; /* on dark backgrounds */
  --gb-teal-700: #0B6E66; /* text, secondary buttons (white text) */
  --gb-teal-800: #08564F;

  /* Accent — Sunshine */
  --gb-sun-100: #FFF1C7;
  --gb-sun-400: #FFC83D; /* highlights, badges, points (ink text only) */

  /* Accent 2 — Berry */
  --gb-berry-100: #FDE2EC;
  --gb-berry-600: #C2255C;

  /* Neutrals (warm) */
  --gb-ink:    #2A1E17; /* body text, headings */
  --gb-muted:  #5E5049; /* secondary text */
  --gb-border: #EADBCB;
  --gb-sand:   #F6EBDD; /* alt section background */
  --gb-cream:  #FFF8EF; /* page background */
  --gb-white:  #FFFFFF;

  /* Status */
  --gb-success:    #1E7B3A; --gb-success-bg: #E3F5E8;
  --gb-warning:    #9A4A00; --gb-warning-fill: #F59F00; --gb-warning-bg: #FFF4D6;
  --gb-danger:     #B42318; --gb-danger-bg:  #FDE7E5;

  /* Semantic aliases */
  --gb-bg: var(--gb-cream);
  --gb-surface: var(--gb-white);
  --gb-text: var(--gb-ink);
  --gb-text-muted: var(--gb-muted);
  --gb-link: var(--gb-coral-700);
  --gb-focus: #1D4ED8;

  /* Type, shape, depth */
  --gb-font: ui-rounded, "SF Pro Rounded", "Nunito", "Varela Round", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --gb-radius-sm: 10px; --gb-radius: 16px; --gb-radius-lg: 28px; --gb-radius-pill: 999px;
  --gb-shadow-sm: 0 1px 2px rgba(42,30,23,.08), 0 2px 6px rgba(42,30,23,.06);
  --gb-shadow:    0 6px 24px rgba(42,30,23,.10);
}