/*
 * Fistbump's colour chart, one file for fistbump.world and the app (approved by the owner on
 * 4 November 2026). landing/tokens.css is the same file for the public site; src/theme/tokens.ts
 * repeats the colours for the phone app's own screens. tests/tokens.test.ts keeps all three equal
 * and checks every other place that still names one of these colours.
 *
 * Day: the site, the map and every panel; the 3D characters stay the brightest thing on screen.
 * Night: Fistbump Park, the same forest after dark, lit in cyan and gold. Each accent has one job.
 */
:root {
  /* Day neutrals */
  --paper: #fafbf6;
  --card: #ffffff;
  --meadow: #eef3e6;
  --trail: #dce4d3;
  --forest: #1e3a2c;
  --forest-hover: #2d4f3d;
  --moss: #46594d;
  --lichen: #5f7266;
  --lagoon: #5b948b;
  --float: #ffffffee;
  /* Accents */
  --sun: #f5bd4f; /* Plus, Sponsored, rewards */
  --sun-soft: #fdf3dc;
  --sun-ink: #6b4a07;
  --event: #c2410c; /* events: pins, chips, dates */
  --event-soft: #ffede3;
  --event-ink: #7c2d12;
  --sky: #23b9e9; /* new builders, lights */
  --sky-soft: #e6f6fb;
  --sky-ink: #0b5f7d;
  --focus: #127fa6; /* the keyboard focus ring, 3 px */
  --danger: #b42318;
  /* Night: Fistbump Park */
  --night-top: #0d2c23;
  --night: #08201a;
  --night-deep: #04130f;
  --night-panel: #0f3027;
  --night-panel-hi: #14402fe6;
  --night-panel-lo: #0a2419e6;
  --night-edge: #7cf0c840;
  --night-ink: #f3faf6;
  --night-ink-soft: #c3dccf;
  --night-ink-faint: #8fb3a3;
  --glow-cyan: #3ee6ff;
  --glow-mint: #7cf0c8;
  --glow-gold: #ffd43b;
  --glow-coral: #ff7a52;
  /* Type: Bricolage Grotesque for titles, Manrope for everything else */
  --display:
    BricolageGrotesque_800ExtraBold, 'Bricolage Grotesque', Manrope_800ExtraBold, Arial, sans-serif;
  --display-bold:
    BricolageGrotesque_700Bold, 'Bricolage Grotesque', Manrope_700Bold, Arial, sans-serif;
  --text: Manrope_500Medium, Manrope, Arial, sans-serif;
  --fs-tiny: 11px;
  --fs-small: 12px;
  --fs-note: 13px;
  --fs-label: 14px;
  --fs-body: 15px;
  --fs-input: 16px; /* text fields: phones zoom into anything smaller */
  --fs-lead: 17px;
  --fs-heading: 20px;
  --fs-title-3: 24px;
  --fs-title-2: 30px;
  --fs-title-1: 40px;
  /* Shape */
  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-pill: 999px;
  /* The design rules of 10 November 2026 (docs/design-proposal-10nov): three radii (controls,
     cards, sheets), one control height (48, small 36, round icon 40) and a 4 px space scale.
     src/world/ui.css builds the shared button, card and row classes from them. */
  --r-control: 12px;
  --r-card: 20px;
  --r-sheet: 28px;
  --control: 48px;
  --control-small: 36px;
  --control-icon: 40px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s6: 24px;
  --s8: 32px;
  --shadow-float: 0 1px 2px #1e3a2c0f, 0 6px 22px #1e3a2c12;
  --shadow-raise: 0 1px 0 #ffffff1f inset, 0 10px 24px #1e3a2c2e;
  --shadow-dialog: 0 30px 130px #1d34284d;
  --float-shadow: var(--shadow-float);
}