/**
 * vpm registry — npm-inspired light UI
 */
:root {
  --color-bg: #f6f6f6;
  --color-surface: #ffffff;
  --color-surface-2: #fafafa;
  --color-border: #e0e0e0;
  --color-text-primary: #1a1a1a;
  --color-text-body: #525252;
  --color-text-muted: #767676;
  --color-accent: #c90808;
  --color-accent-hover: #a80707;
  --color-accent-soft: #fff5f5;
  --color-success: #087f5b;
  --color-danger: #c90808;
  --color-warning: #e67700;
  --color-code-bg: #383838;
  --color-code-text: #f5f5f5;
  --color-search-bg: #f3f3f3;

  --text-body: 16px;
  --text-body-lh: 1.5;
  --text-small: 14px;
  --text-code: 13px;
  --max-content: 1280px;
  --nav-height: 56px;

  --font-display: "Geist", system-ui, sans-serif;
  --font-body: "Geist", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  --radius-btn: 6px;
  --radius-card: 8px;
  --radius-code: 6px;
}

@media (max-width: 767px) {
  :root {
    --nav-height: auto;
  }
}