:root {
  
  --fx-ground: #071a24;
  --fx-ground-ink: #edf5ed;
  --fx-gold: #ffc46b;
  --fx-sea: #83cfbd;
  --fx-muted: #adc3c7;
  
  --fx-abyss: #04101b;
  --fx-deep: #08202f;
  --fx-deep-2: #0d2c3f;
  --fx-deep-3: #14435c;
  --fx-navy: #173d63;
  
  --fx-ink: #eef6ff;
  --fx-ink-2: rgb(238 246 255 / 80%);
  --fx-ink-3: rgb(238 246 255 / 62%);
  --fx-ink-blue: #a9c9ea;
  --fx-ink-on-gold: #12304a;
  
  --fx-gold-light: #ffe2a6;
  --fx-gold-face: #ffe4a8;
  --fx-gold-deep: #e59a3e;
  --fx-gold-foot: #c88a3d;
  --fx-gold-warm: #ff9a6b;
  --fx-amber: #f4c656;
  
  --fx-tone-sky: #6cc8ff;
  --fx-tone-coral: #ff8f87;
  --fx-tone-kelp: #7fdc8f;
  --fx-tone-violet: #b8a2ff;
  --fx-tone-lagoon: #5cd8c6;
  --fx-tone-mute: #8fa7b5;
  --fx-good: #6fe3b0;
  --fx-alarm: #ff8478;
  --fx-pearl: #fff4d6;
  --fx-cream: #f3dfb2;
  --fx-plum: #36203f;
  
  --fx-glass-top: rgb(22 58 120 / 70%);
  --fx-glass-bottom: rgb(8 26 66 / 88%);
  --fx-glass-quiet-top: rgb(22 58 120 / 62%);
  --fx-glass-quiet-bottom: rgb(8 26 66 / 82%);
  --fx-glass-sheen: rgb(255 255 255 / 16%);
  --fx-glass: linear-gradient(180deg, var(--fx-glass-sheen), transparent 46%), linear-gradient(180deg, var(--fx-glass-top), var(--fx-glass-bottom));
  --fx-glass-quiet: linear-gradient(180deg, var(--fx-glass-sheen), transparent 46%), linear-gradient(180deg, var(--fx-glass-quiet-top), var(--fx-glass-quiet-bottom));
  --fx-glass-well: rgb(4 16 30 / 55%);
  --fx-glass-blur: blur(14px) saturate(1.2);
  
  --fx-rim: rgb(140 200 255 / 34%);
  --fx-rim-bright: rgb(140 200 255 / 55%);
  --fx-gold-rim: rgb(255 196 107 / 58%);
  --fx-gold-rim-quiet: rgb(255 196 107 / 26%);
  --fx-rim-light: inset 0 1px rgb(255 240 210 / 30%);
  --fx-ground-rim: #9ebfbe26;
  
  --fx-lift-1: 0 2px 10px rgb(2 10 18 / 34%);
  --fx-lift-2: 0 10px 30px rgb(2 8 20 / 45%);
  --fx-lift-3: 0 24px 60px rgb(2 8 20 / 60%);
  --fx-foot: 0 4px 0 rgb(4 18 34 / 55%);
  --fx-foot-deep: 0 6px 0 rgb(4 18 34 / 55%);
  --fx-plump: inset 0 2px rgb(255 255 255 / 40%), inset 0 -6px 12px rgb(0 0 0 / 28%);
  --fx-on-water: 0 1px 2px #020c1a, 0 4px 16px rgb(2 12 26 / 80%);
  
  --fx-font-display: var(--font-display), "Baloo 2", ui-rounded, sans-serif;
  --fx-font-ui: var(--font-ui), Nunito, ui-rounded, sans-serif;
  --fx-t-xs: 12px;
  --fx-t-sm: 13px;
  --fx-t-md: 15px;
  --fx-t-lg: 19px;
  --fx-t-xl: 24px;
  --fx-t-2xl: 31px;
  --fx-t-3xl: 40px;
  --fx-track-tight: -.015em;
  --fx-track-label: .14em;
  
  --fx-r-sm: 10px;
  --fx-r-md: 14px;
  --fx-r-lg: 20px;
  --fx-r-xl: 28px;
  --fx-r-full: 999px;
  
  --fx-s-1: 4px;
  --fx-s-2: 8px;
  --fx-s-3: 12px;
  --fx-s-4: 16px;
  --fx-s-5: 24px;
  --fx-s-6: 32px;
  --fx-s-7: 48px;
  
  --fx-z-raised: 10;
  --fx-z-sticky: 100;
  --fx-z-dock: 900;
  --fx-z-modal: 1000;
  --fx-z-toast: 1100;
  --fx-z-tooltip: 1200;
}