/* ============================================================
   LUBYLAB — Design tokens
   ============================================================ */

:root {
  /* ===== Colors ===== */
  --bg:      #ffffff;
  --surface: #ffffff;
  --fg:      oklch(15% 0.01 60);
  --muted:   oklch(55% 0.01 60);
  --border:  oklch(88% 0.008 80);
  --accent:  #ffffff;
  --dark:    oklch(18% 0.01 60);
  --dark-fg: oklch(95% 0.005 80);

  /* Hover accent (beige) — used wherever a hover swaps to a color. */
  --hover:         #9e9a97;
  --accent-strong: #9e9a97;

  --clr-daily:    #ffffff;
  --clr-recovery: #ffffff;
  --clr-elixir:   #ffffff;
  --clr-balance:  #ffffff;

  /* ===== Typefaces — Pretendard everywhere ===== */
  --font-stack: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI',
                'Apple SD Gothic Neo', 'Helvetica Neue', system-ui, sans-serif;
  --font-display: var(--font-stack);
  --font-body:    var(--font-stack);
  --font-mono:    'Pretendard', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* ===== Spacing ===== */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 48px;
  --space-xl: 80px;
  --space-2xl: 120px;

  /* ===== Layout ===== */
  /* Content fills the viewport (fluid) instead of capping at a fixed width;
     side breathing room comes from the .container gutter below. */
  --max-w: 100%;
  --nav-h: 64px;
  --bar-h: 36px;

  /* Default corner radius for content images. */
  --radius: 0;
}