/* ═══════════════════════════════════════════
   theme.css — CSS custom properties
   Loaded first on every page.
   Edit tokens here; global.css uses var(--*)
═══════════════════════════════════════════ */

:root {
  --font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --nav-h: 56px;

  /* Dark mode (default) */
  --bg:               transparent;
  --surface:          rgba(255,255,255,0.04);
  --surface-hover:    rgba(255,255,255,0.08);
  --border:           rgba(255,255,255,0.10);
  --border-hover:     rgba(255,255,255,0.28);
  --text-primary:     #ffffff;
  --text-secondary:   rgba(255,255,255,0.72);
  --text-tertiary:    rgba(255,255,255,0.40);
  --text-muted:       rgba(255,255,255,0.28);
  --nav-bg:           rgba(0,0,0,0.50);
  --drawer-bg:        rgba(8,8,12,0.96);
  --btn-primary-bg:   rgba(255,255,255,0.95);
  --btn-primary-text: #0a0a0a;
  --btn-ghost-border: rgba(255,255,255,0.32);
  --btn-ghost-text:   rgba(255,255,255,0.92);
  --btn-ghost-bg:     rgba(10,10,14,0.52);
  --tag-border:       rgba(255,255,255,0.18);
  --tag-text:         rgba(255,255,255,0.55);
  --eyebrow:          rgba(255,255,255,0.45);
  --bullet-border:    rgba(255,255,255,0.22);
  --scroll-cue:       rgba(255,255,255,0.35);
  --divider-line:     rgba(255,255,255,0.08);
}

[data-theme="light"] {
  --bg:               transparent;
  --surface:          rgba(0,0,0,0.04);
  --surface-hover:    rgba(0,0,0,0.07);
  --border:           rgba(0,0,0,0.10);
  --border-hover:     rgba(0,0,0,0.28);
  --text-primary:     #0d0d0f;
  --text-secondary:   rgba(0,0,0,0.72);
  --text-tertiary:    rgba(0,0,0,0.45);
  --text-muted:       rgba(0,0,0,0.60);
  --nav-bg:           rgba(255,255,255,0.60);
  --drawer-bg:        rgba(245,245,248,0.97);
  --btn-primary-bg:   #0d0d0f;
  --btn-primary-text: #ffffff;
  --btn-ghost-border: rgba(0,0,0,0.28);
  --btn-ghost-text:   rgba(0,0,0,0.82);
  --btn-ghost-bg:     rgba(242,242,245,0.55);
  --tag-border:       rgba(0,0,0,0.14);
  --tag-text:         rgba(0,0,0,0.52);
  --eyebrow:          rgba(0,0,0,0.42);
  --bullet-border:    rgba(0,0,0,0.18);
  --scroll-cue:       rgba(0,0,0,0.30);
  --divider-line:     rgba(0,0,0,0.07);
}