:root {
  --ink-950: #05070D;
  --ink-900: #0A0E17;
  --ink-850: #0E1320;
  --ink-800: #131A2A;
  --ink-750: #182035;
  --ink-700: #212B42;
  --ink-600: #2E3A54;

  --parchment: #EEF1F8;
  --parchment-dim: #AAB4C8;
  --slate-400: #8B96AC;
  --slate-500: #6F7A92;
  --slate-600: #565F76;

  --brass: #4F7DF9;
  --brass-bright: #7B9CFF;
  --brass-soft: rgba(79, 125, 249, 0.16);
  --brass-soft-strong: rgba(79, 125, 249, 0.32);

  --teal: #8B6BF0;
  --teal-bright: #A78BFA;
  --teal-soft: rgba(139, 107, 240, 0.18);

  --coral: #F0925C;
  --coral-soft: rgba(240, 146, 92, 0.16);
  --green: #3EBD82;
  --green-soft: rgba(62, 189, 130, 0.16);

  --font-display: -apple-system, BlinkMacSystemFont, "Inter", "Noto Sans Bengali", "Segoe UI", sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Inter", "Noto Sans Bengali", "Segoe UI", sans-serif;
  --font-mono: -apple-system, BlinkMacSystemFont, "Inter", "Noto Sans Bengali", "SFMono-Regular", Consolas, monospace;

  --fs-2xs: 0.6875rem;
  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-base: 0.9375rem;
  --fs-md: 1.0625rem;
  --fs-lg: 1.3125rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.25rem;

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur-med: 260ms;
  --dur-slow: 420ms;

  --sidebar-w: 340px;
  --topbar-h: 60px;

  --on-accent: #FFFFFF;

  /* ---- Liquid Glass tokens (dark / VisionOS-night) ---- */
  --glass-bg: rgba(24, 30, 48, 0.55);
  --glass-bg-strong: rgba(24, 30, 48, 0.72);
  --glass-bg-soft: rgba(24, 30, 48, 0.34);
  --glass-border: rgba(255, 255, 255, 0.10);
  --glass-border-strong: rgba(255, 255, 255, 0.18);
  --glass-highlight: rgba(255, 255, 255, 0.14);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255,255,255,0.3);
  --glass-shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255,255,255,0.32);
  --glass-blur: 24px;
  --noise-opacity: 0.05;
  --glass-shine: rgba(255, 255, 255, 0.16);
  --mesh-bg:
    radial-gradient(900px 700px at 8% -8%, rgba(139,107,240,0.28), transparent 55%),
    radial-gradient(1000px 800px at 100% 0%, rgba(79,125,249,0.24), transparent 55%),
    radial-gradient(900px 700px at 20% 100%, rgba(62,189,130,0.10), transparent 50%),
    radial-gradient(1100px 900px at 100% 100%, rgba(240,146,92,0.10), transparent 55%),
    #05070D;

  color-scheme: dark;
}

[data-theme="light"] {
  --ink-950: #F4F6FB;
  --ink-900: #FFFFFF;
  --ink-850: #FFFFFF;
  --ink-800: #F6F8FC;
  --ink-750: #EEF1F8;
  --ink-700: #E3E8F2;
  --ink-600: #C6CEDE;

  --parchment: #101828;
  --parchment-dim: #4B5468;
  --slate-400: #5C6680;
  --slate-500: #757F98;
  --slate-600: #94A0B8;

  --brass: #3A66E0;
  --brass-bright: #2851C4;
  --brass-soft: rgba(58, 102, 224, 0.10);
  --brass-soft-strong: rgba(58, 102, 224, 0.22);

  --teal: #7C51E8;
  --teal-bright: #6636D6;
  --teal-soft: rgba(124, 81, 232, 0.12);

  --coral: #D9722F;
  --coral-soft: rgba(217, 114, 47, 0.12);
  --green: #1E9A5E;
  --green-soft: rgba(30, 154, 94, 0.12);

  --on-accent: #FFFFFF;

  /* ---- Liquid Glass tokens (light / VisionOS-day) ---- */
  --glass-bg: rgba(255, 255, 255, 0.55);
  --glass-bg-strong: rgba(255, 255, 255, 0.72);
  --glass-bg-soft: rgba(255, 255, 255, 0.4);
  --glass-border: rgba(255, 255, 255, 0.6);
  --glass-border-strong: rgba(255, 255, 255, 0.8);
  --glass-highlight: rgba(255, 255, 255, 0.9);
  --glass-shadow: 0 8px 32px rgba(31, 42, 88, 0.10), inset 0 1px 0 rgba(255,255,255,0.7);
  --glass-shadow-lg: 0 24px 60px rgba(31, 42, 88, 0.14), inset 0 1px 0 rgba(255,255,255,0.8);
  --glass-blur: 24px;
  --noise-opacity: 0.035;
  --glass-shine: rgba(255, 255, 255, 0.5);
  --mesh-bg:
    radial-gradient(900px 700px at 8% -8%, rgba(124,81,232,0.14), transparent 55%),
    radial-gradient(1000px 800px at 100% 0%, rgba(58,102,224,0.14), transparent 55%),
    radial-gradient(900px 700px at 20% 100%, rgba(30,154,94,0.08), transparent 50%),
    radial-gradient(1100px 900px at 100% 100%, rgba(217,114,47,0.08), transparent 55%),
    #F4F6FB;

  color-scheme: light;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur-med: 0ms;
    --dur-slow: 0ms;
  }
}
