/* ============================================================
   00 — DESIGN TOKENS
   Ported from the live Shopify theme (config/settings_data.json +
   computed styles measured on vapekage.com, 2026-09-15).
   Edit colours/typography HERE ONLY.
   ============================================================ */
:root {
  /* dark stack */
  --vk-black:      #000000;
  --vk-bg:         #111111;
  --vk-bg-deep:    #0a0a0a;
  --vk-surface:    #1a1a1a;
  --vk-surface-2:  #222222;
  --vk-border:     #333333;
  --vk-border-2:   #444444;

  /* text */
  --vk-text:       #ffffff;
  --vk-text-muted: rgba(255,255,255,.81);
  --vk-text-dim:   #bbbbbb;
  --vk-text-faint: #888888;

  /* brand accent */
  --vk-accent:      #aaff00;
  --vk-accent-2:    #ccff44;
  --vk-accent-soft: rgba(170,255,0,.45);

  /* status */
  --vk-danger:     #ff6b6b;

  /* shape */
  --vk-radius:     10px;
  --vk-radius-lg:  14px;
  --vk-radius-xl:  18px;
  --vk-radius-pill: 999px;

  /* type — Bebas Neue is the display face, Inter the UI face */
  --vk-font:         'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --vk-font-display: 'Bebas Neue', 'Inter', Impact, sans-serif;
  --vk-ls-display:   .02em;
  --vk-ls-eyebrow:   .14em;

  /* layout */
  --vk-maxw:       1280px;
  --vk-header-h:   109px;
}