/* HYPE BOX 66 · tokens do design system (loja e admin)
   Preto e laranja da marca. Os nomes antigos (--bg, --fg, --accent...) continuam valendo. */
:root {
  /* cor */
  --bg: #000000;
  --surface: #111113;
  --surface-2: #17171a;
  --line: #2e2e33;
  --fg: #f5f4f2;
  --muted: #a8a8b0;
  --accent: #ff5a1f;
  --accent-ink: #0e0e10;
  --focus: #ffffff;
  --danger: #ff6b6b;
  --ok: #4cc27a;

  /* papel da etiqueta de caixa (vitrine) */
  --kraft: #b8955d;
  --kraft-ink: #17110a;
  --kraft-dim: #3a2b15;

  /* tipografia */
  --font: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; /* admin */
  --font-display: 'Archivo', 'Arial Narrow', Impact, system-ui, sans-serif;          /* vitrine: títulos e preços */
  --font-body: 'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; /* vitrine: texto */
  --fs-1: 13px;   /* apoio */
  --fs-2: 15px;   /* texto */
  --fs-3: 18px;   /* destaque */
  --fs-4: 22px;   /* título de seção */

  /* espaçamento (base 4) */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;

  /* forma */
  --r-1: 6px;
  --r-2: 10px;
  --r-pill: 999px;

  /* movimento */
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --dur: 0.16s;

  color-scheme: dark;
}