@layer base {
  :root,
  [data-theme] {
    /* Mapping color channels to DaisyUI tokens */
    --p: var(--color-primary-hsl);
    --s: var(--color-secondary-hsl);
    --a: var(--color-accent-hsl);
    --n: var(--color-neutral-hsl);
    --b1: var(--color-base-100-hsl);
    --b2: var(--color-base-200-hsl);
    --b3: var(--color-base-300-hsl);
    --in: var(--color-info-hsl);
    --su: var(--color-success-hsl);
    --wa: var(--color-warning-hsl);
    --er: var(--color-error-hsl);

    /* Universal readable aliases */
    --primary: hsl(var(--p));
    --secondary: hsl(var(--s));
    --accent: hsl(var(--a));
    --neutral: hsl(var(--n));
    --base-100: hsl(var(--b1));
    --base-200: hsl(var(--b2));
    --base-300: hsl(var(--b3));
    --info: hsl(var(--in));
    --success: hsl(var(--su));
    --warning: hsl(var(--wa));
    --error: hsl(var(--er));

    /* Optional convenience */
    color-scheme: light dark;
    font-family: var(--font-sans);
  }
}