:root {
  --deep: #071e24;
  --ink: #0b272e;
  --pane: #0e313a;
  --ice: #e6edee;
  --frost: #f2f6f6;
  --mist: #c3d4d7;
  --dim: #7c9297;
  --fjord: #17596f;
  --fjord-deep: #0f4356;
  --glint: #8fd3e4;
  --rule-dark: rgba(230, 237, 238, 0.14);
  --rule-light: rgba(11, 39, 46, 0.14);
  --font-display: "Clash Display", "Arial Narrow", sans-serif;
  --font-body: "General Sans", "Segoe UI", sans-serif;
  --header-h: 68px;
  --gutter: clamp(1.15rem, 4.5vw, 4rem);
  --max: 80rem;
  --touch: 44px;
  --ease: cubic-bezier(0.19, 1, 0.22, 1);
  --z-nav: 90;
  --z-drawer: 80;
}

@media (max-width: 576px) {
  :root {
    --header-h: 60px;
  }
}