:root {
  /* RubanTag brand — adapted to the rubansoftwares.com family palette
     (amber #e69829 on dark navy #102b45), matching the main site + build. */
  --rtag-primary:       #e69829;
  --rtag-primary-dark:  #cb7c11;
  --rtag-primary-light: #fff1dd;
  --rtag-primary-rgb:   230,152,41;
  --rtag-accent:        #102b45;
  /* Text/icon colour to use ON an amber surface (navy — accessible, family-consistent).
     White-on-amber fails contrast, so brand fills use this instead of #fff. */
  --rtag-on-primary:    var(--rtag-accent);
  /* Accessible amber for amber-coloured TEXT/links on light surfaces.
     #e69829 on white is ~2.2:1 (fails AA); this darker shade is ~5.5:1.
     Keep --rtag-primary for fills; use this for amber text. (mirrors main's --primary-text) */
  --rtag-primary-text:  #9a5a00;

  /* Palette */
  --green-50:#f0fdf4;  --green-100:#dcfce7; --green-600:#16a34a; --green-700:#15803d;
  --red-50:#fef2f2;    --red-600:#dc2626;   --red-700:#b91c1c;
  --blue-50:#eff6ff;   --blue-100:#dbeafe;  --blue-600:#2563eb;  --blue-700:#1d4ed8;
  --amber-50:#fffbeb;  --amber-100:#fef3c7; --amber-600:#d97706; --amber-700:#b45309;
  --purple-50:#faf5ff; --purple-600:#9333ea;
  --gray-50:#f9fafb;   --gray-100:#f3f4f6;  --gray-200:#e5e7eb;
  --gray-300:#d1d5db;  --gray-400:#9ca3af;  --gray-500:#6b7280;
  --gray-600:#4b5563;  --gray-700:#374151;  --gray-800:#1f2937;  --gray-900:#111827;

  /* Semantic */
  --color-primary:  var(--rtag-primary);
  --color-danger:   var(--red-600);
  --color-warning:  var(--amber-600);
  --color-info:     var(--blue-600);
  --color-text:     var(--gray-900);
  --color-muted:    var(--gray-500);
  --color-border:   var(--gray-200);
  --color-surface:  #ffffff;
  --color-bg:       var(--gray-50);

  /* Tag type colors */
  --tag-h1:        #1d4ed8;
  --tag-h2:        #2563eb;
  --tag-h3:        #3b82f6;
  --tag-h4:        #60a5fa;
  --tag-h5:        #93c5fd;
  --tag-h6:        #bfdbfe;
  --tag-p:         var(--gray-500);
  --tag-table:     #ea580c;
  --tag-figure:    #16a34a;
  --tag-list:      #9333ea;
  --tag-artifact:  var(--gray-300);

  /* Spacing */
  --space-1:4px;  --space-2:8px;   --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:32px;  --space-7:48px; --space-8:64px;

  /* Typography */
  --fs-xs:0.75rem; --fs-sm:0.875rem; --fs-base:1rem;
  --fs-lg:1.125rem; --fs-xl:1.25rem; --fs-2xl:1.5rem; --fs-3xl:1.875rem;
  --fw-normal:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700;

  /* Layout */
  --shell-max:820px;
  --topbar-h:60px;
  --bottomnav-h:60px;
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px; --radius-full:9999px;
  --shadow-sm:0 1px 3px rgba(0,0,0,.08);
  --shadow-md:0 4px 12px rgba(0,0,0,.12);
  --shadow-lg:0 8px 24px rgba(0,0,0,.16);

  /* ── RS Design-System Scale Layer (2026-06-18)
     Naming aliases so rubansoftwares.com canonical names resolve here.
     Additive — no existing rule is changed.
     Brand: amber (#e69829) on navy — adapted to the rubansoftwares.com family. */

  /* Spacing aliases (main-site names → existing space-1..8 values) */
  --space-xs:  var(--space-1);   /*  4px */
  --space-sm:  var(--space-2);   /*  8px */
  --space-md:  var(--space-4);   /* 16px */
  --space-lg:  var(--space-5);   /* 24px */
  --space-xl:  2.5rem;           /* 40px */
  --space-2xl: var(--space-8);   /* 64px */

  /* Radius aliases (missing entries) */
  --radius-xl:   24px;
  --radius-pill: 50px;

  /* Typography scale — fluid, responsive via clamp() */
  --text-display: clamp(2.4rem, 5vw,  3.6rem);
  --text-h1:      clamp(2rem,   4vw,  2.8rem);
  --text-h2:      clamp(1.6rem, 3vw,  2.2rem);
  --text-h3:      clamp(1.3rem, 2.2vw, 1.7rem);
  --text-h4:      clamp(1.1rem, 1.6vw, 1.3rem);
  --text-h5:      1.1rem;
  --text-lg:      1.125rem;
  --text-body:    1rem;
  --text-sm:      0.875rem;
  --text-caption: 0.78rem;

  /* Line-heights */
  --leading-tight:   1.2;
  --leading-snug:    1.4;
  --leading-normal:  1.6;
  --leading-relaxed: 1.8;
}

[data-theme="dark"] {
  --color-text:    #f9fafb;
  --color-muted:   #9ca3af;
  --color-surface: #1f2937;
  --color-bg:      #111827;
  --color-border:  #374151;
}