:root {
  --color-paper: #f8f8f3;
  --color-ink: #163b45;
  --color-muted: #59696c;
  --color-accent: #28658c;
  --color-line: #163b4526;
  --color-studio: #133e48;
  --color-studio-paper: #f6f3e9;
  --color-studio-muted: #b8ced0;
  --color-coral: #ff684f;
  --water-pigment-opacity: .82;
  --water-pigment-saturation: .86;
  --water-plant-opacity: .86;
  --water-plant-saturation: 1.08;
  --font-sans: Switzer, Arial, sans-serif;
  --font-serif: Sentient, Georgia, serif;
  --font-mono: 'IBM Plex Mono', 'Courier New', monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}
::selection { background: #c8dce2; color: var(--color-ink); }
input, textarea { caret-color: currentColor; }

.motion-toggle{display:inline-grid;place-items:center;background:none;border:1px solid var(--color-line);border-radius:50%;width:36px;height:36px;min-width:36px;padding:0;font:16px var(--font-sans);color:var(--color-muted);cursor:pointer}
.motion-toggle:focus-visible{outline:2px solid var(--color-accent);outline-offset:4px}
.works-masthead .motion-toggle{order:2;margin-left:auto}
[data-motion-paused="true"] .baba-site *{animation-play-state:paused!important}
@media(pointer:coarse){.motion-toggle{width:44px;height:44px}}
