/* ============================================================
   TaskNote · Liquid Glass — design tokens
   Source: glass/glass-tokens.css (palette + glass recipes + gradients + radii)
   Used by [data-style="glass"] overrides in style.css
   ============================================================ */

:root {
  /* ─── Palette ────────────────────────────────────────────── */
  --g-ink-900: #1B1530;
  --g-ink-700: #2F2848;
  --g-ink-500: #5E5670;
  --g-ink-400: #7A7290;
  --g-ink-300: #9C95AE;
  --g-ink-200: #C8C2D4;

  --g-paper-50:  #FBF8F2;
  --g-paper-100: #F4EFE6;
  --g-paper-200: #ECE5D7;

  /* Accents */
  --g-violet-300: #B4A7FF;
  --g-violet-500: #6B5BFF;
  --g-violet-600: #5847E0;
  --g-violet-700: #4231B8;

  --g-mint-300:  #8FEDE5;
  --g-mint-500:  #3FD0C9;
  --g-mint-700:  #1A9E97;

  --g-peach-400: #FFB39A;
  --g-rose-400:  #F79AD6;
  --g-sky-400:   #9CC6FF;
  --g-lemon-400: #FFE08A;

  /* ─── Gradients ──────────────────────────────────────────── */
  --grad-violet: linear-gradient(135deg, #8B7BFF 0%, #5847E0 100%);
  --grad-mint:   linear-gradient(135deg, #7DEBE3 0%, #2BBDB6 100%);
  --grad-peach:  linear-gradient(135deg, #FFC9B6 0%, #FF8F77 100%);
  --grad-rose:   linear-gradient(135deg, #F8B6E0 0%, #C078E5 100%);
  --grad-aurora: linear-gradient(135deg, #B4A7FF 0%, #8FEDE5 50%, #FFB39A 100%);

  /* ─── Glass tokens ───────────────────────────────────────── */
  /* "Matte" — softer, more opaque, easy on eyes */
  --glass-matte-bg: linear-gradient(135deg, rgba(255,255,255,0.72) 0%, rgba(255,255,255,0.52) 100%);
  --glass-matte-border: 1px solid rgba(255,255,255,0.65);
  --glass-matte-blur: blur(24px) saturate(150%);
  --glass-matte-shadow:
    0 12px 32px -8px rgba(40,30,80,0.18),
    0 2px 6px rgba(40,30,80,0.06),
    inset 0 1px 0 rgba(255,255,255,0.95),
    inset 0 -1px 0 rgba(255,255,255,0.15);

  /* "Clear" — translucent like reference */
  --glass-clear-bg: linear-gradient(135deg, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0.18) 100%);
  --glass-clear-border: 1px solid rgba(255,255,255,0.55);
  --glass-clear-blur: blur(28px) saturate(180%);
  --glass-clear-shadow:
    0 18px 48px -12px rgba(40,30,80,0.22),
    0 4px 10px rgba(40,30,80,0.06),
    inset 0 1px 0 rgba(255,255,255,0.9),
    inset 0 -2px 4px rgba(180,167,255,0.18);

  /* "Tinted" — colored fill behind clear glass */
  --glass-tint-bg: linear-gradient(135deg, rgba(180,167,255,0.55) 0%, rgba(143,237,229,0.35) 60%, rgba(255,179,154,0.45) 100%);
  --glass-tint-border: 1px solid rgba(255,255,255,0.6);
  --glass-tint-blur: blur(20px) saturate(170%);
  --glass-tint-shadow:
    0 18px 48px -10px rgba(80,60,140,0.28),
    inset 0 1px 0 rgba(255,255,255,0.85),
    inset 0 -2px 6px rgba(255,255,255,0.25);

  /* ─── Radii ──────────────────────────────────────────────── */
  --r-pill: 999px;
  --r-xl:   28px;
  --r-lg:   20px;
  --r-md:   14px;
  --r-sm:   10px;

  /* ─── Blur tokens (system-wide) ──────────────────────────── */
  --blur-card:   blur(24px) saturate(150%);
  --blur-pill:   blur(16px) saturate(160%);
  --blur-chip:   blur(12px) saturate(160%);
  --blur-modal:  blur(28px) saturate(180%);
  --blur-inset:  blur(8px)  saturate(140%);

  /* ─── Accent tint helpers (defaults — overridden per theme) ─ */
  --accent-tint-bg:  rgba(107,91,255,0.14);
  --accent-tint-rim: rgba(107,91,255,0.22);
  --accent-grad-tint: linear-gradient(135deg, rgba(107,91,255,0.85) 0%, rgba(88,71,224,0.75) 100%);
}