:root {
  --sloth-bg-0: #F7F4EE;
  --sloth-bg-1: #EFEBE2;
  --sloth-bg-2: #E6E1D6;
  --sloth-line: #DCD5C7;
  --sloth-line-strong: #8E8676;
  --sloth-fg-0: #1F1E1B;
  --sloth-fg-1: #2D2B27;
  --sloth-fg-2: #4A463F;
  --sloth-fg-3: #686358;
  --sloth-accent: #2F5D46;
  --sloth-accent-hover: #264C39;
  --sloth-on-accent: #F7F4EE;
  --sloth-accent-soft: #E0E8DC;
  --sloth-accent-text: #2F5D46;
  --sloth-success: #2E6B47;
  --sloth-success-soft: #E1EDE3;
  --sloth-danger: #A03A2B;
  --sloth-danger-soft: #F5E3DF;
  --sloth-scrim: rgb(25 24 20 / 0.42);
  --sloth-shadow-pop: 0 8px 24px rgb(30 30 25 / 0.14);
  --sloth-shadow-stage: 0 1px 2px rgb(30 30 25 / 0.06), 0 24px 64px -16px rgb(30 30 25 / 0.22);

  --yt-bg: #FFFFFF;
  --yt-fg: #0F0F0F;
  --yt-fg2: #606060;
  --yt-sk: #F2F2F2;
  --yt-sk2: #E5E5E5;

  --font-ui: 'Figtree', system-ui, -apple-system, sans-serif;
  --font-read: 'Newsreader', Georgia, serif;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --dur-fast: 120ms;
  --dur-base: 180ms;
  --dur-slow: 240ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --gutter: 112px;
  --wrap: 1200px;
}

:root[data-theme="dark"] {
  --sloth-bg-0: #1C1B19;
  --sloth-bg-1: #252421;
  --sloth-bg-2: #2E2D29;
  --sloth-line: #393732;
  --sloth-line-strong: #7A766C;
  --sloth-fg-0: #F1EDE4;
  --sloth-fg-1: #E1DCD1;
  --sloth-fg-2: #C6C0B4;
  --sloth-fg-3: #A09B90;
  --sloth-accent: #9CC5A1;
  --sloth-accent-hover: #B0D3B4;
  --sloth-on-accent: #13221A;
  --sloth-accent-soft: #263129;
  --sloth-accent-text: #A8CFAD;
  --sloth-success: #8CC79F;
  --sloth-success-soft: #22302A;
  --sloth-danger: #EC9D88;
  --sloth-danger-soft: #3A2420;
  --sloth-scrim: rgb(0 0 0 / 0.55);
  --sloth-shadow-pop: 0 10px 28px rgb(0 0 0 / 0.5);
  --sloth-shadow-stage: 0 1px 2px rgb(0 0 0 / 0.3), 0 24px 64px -16px rgb(0 0 0 / 0.6);

  --yt-bg: #0F0F0F;
  --yt-fg: #F1F1F1;
  --yt-fg2: #AAAAAA;
  --yt-sk: #272727;
  --yt-sk2: #3A3A3A;
}
