/* Tribl Journal — design tokens */
:root {
  --color-canvas: #ffffff;
  --blog-page-bg: #f3f3f3;
  --blog-card-bg: #ffffff;
  --color-soft-stone: #f5f6f7;
  --color-soft-stone-hover: #e4e6e9;
  --color-ink: #212121;
  --color-body-muted: #616161;
  --color-muted: #93939f;
  --color-slate: #75758a;
  --color-primary: #17171c;
  --color-action-blue: #1863dc;
  --color-coral: #ff7759;
  --color-coral-soft: #ffad9b;
  --color-hairline: #d9d9dd;
  --color-border-light: #e5e7eb;
  --color-card-border: #f2f2f2;
  --landing-v2-content-max: 100%;
  --landing-v2-content-pad: clamp(1rem, 2vw, 2rem);
  --blog-hub-edge-gap: 1.8rem;
  --blog-aside-w: 340px;
  --blog-nav-w: 280px;
  --blog-col-gap: clamp(1.25rem, 2vw, 2.5rem);
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-card: 20px;
  --radius-pill: 32px;
  --font-display: "Graphik LCG", Gilroy, "Space Grotesk", Inter, ui-sans-serif, system-ui, sans-serif;
  --font-body: "Graphik LCG", Gilroy, Inter, Arial, ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;
}

.dark,
:root[data-theme="dark"] {
  --blog-page-bg: #121212;
  --blog-card-bg: #1e1e1e;
  --color-ink: #f4f4f5;
  --color-body-muted: #b3b3b3;
  --color-muted: #b3b3b3;
  --color-soft-stone: #262626;
  --color-soft-stone-hover: #333333;
  --color-hairline: rgba(255, 255, 255, 0.1);
  --color-border-light: rgba(255, 255, 255, 0.12);
  --color-card-border: rgba(255, 255, 255, 0.08);
}

html.blog-mobile-nav-lock,
html.blog-mobile-nav-lock body {
  overflow: hidden;
  overscroll-behavior: none;
}

.blog-mobile-nav-scroll {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: contain;
  touch-action: pan-y;
}