:root {
  --navy-900: #0C2338; --navy-800: #12324F; --navy-700: #1B4269;
  --blue-600: #1E6DB4; --blue-500: #2C7FBF; --blue-400: #5AA0D6; --blue-200: #B9D6EC; --blue-50: #EAF3FA;
  --wood-700: #8A5A32; --wood-500: #B4794A; --wood-300: #D8B78E;
  --sand-50: #FAF6EF; --sand-100: #F4EDE1; --sand-200: #E7DCC9;
  --go-600: #16794C; --go-500: #1F8A5B; --go-400: #35A876;
  --buoy-600: #C0392B; --buoy-500: #D64541; --buoy-400: #E4675F;
  --white: #FFFFFF; --gray-50: #F6F7F8; --gray-100: #ECEEF1; --gray-200: #DCE0E5; --gray-400: #97A1AC; --gray-600: #59636E; --gray-800: #2B333B;
  --ok-500: #2E8B57; --warn-500: #E0A500;
  --brand: var(--blue-600); --brand-strong: var(--navy-800);
  --accent: var(--go-500); --accent-strong: var(--go-600); --accent-soft: var(--go-400);
  --accent-tint: rgba(31, 138, 91, 0.10); --accent-tint-border: rgba(31, 138, 91, 0.28);
  --text-heading: var(--navy-800); --text-body: var(--gray-800); --text-muted: var(--gray-600); --text-inverse: var(--white); --text-on-brand: var(--white);
  --surface-page: var(--sand-50); --surface-card: var(--white); --surface-tint: var(--blue-50); --surface-deep: var(--navy-800); --surface-warm: var(--sand-100);
  --border-subtle: var(--gray-200); --border-strong: var(--navy-800); --border-tint: var(--blue-200);
  --link: var(--blue-600); --link-hover: var(--navy-800);
}