:root {
  --bg: #f4f5f2;
  --glass: rgba(255, 255, 255, .82);
  --card: #ffffff;
  --soft: rgba(15, 30, 22, .055);
  --soft-2: rgba(15, 30, 22, .1);
  --ink: #101b15;
  --muted: #647067;
  --line: rgba(15, 30, 22, .1);
  --accent: #0f7a55;
  --shadow: 0 24px 60px -18px rgba(12, 30, 22, .35), 0 2px 8px rgba(12, 30, 22, .08);
  --hiking: #1fa35c;
  --auto: #f0642a;
  --bike: #8b4ff0;
  --river: #1a8bf0;
  --r: 18px;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --panel-w: 440px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0c1210;
    --glass: rgba(17, 25, 22, .8);
    --card: #17211d;
    --soft: rgba(255, 255, 255, .06);
    --soft-2: rgba(255, 255, 255, .12);
    --ink: #ecf3ee;
    --muted: #93a39a;
    --line: rgba(255, 255, 255, .1);
    --accent: #35c98f;
    --shadow: 0 24px 60px -18px rgba(0, 0, 0, .7), 0 2px 8px rgba(0, 0, 0, .3);
  }
}