/* Semantic tokens — the Adaptive Element. Reference these, not the primitives. */
:root{
/* Background — Light Mode */
--background-ui-1:var(--gray-0);
--background-ui-2:var(--gray-10);
--background-ui-3:var(--gray-20);
--surface-sidebar:var(--foreground-soft-1);
--surface-sidebar-hover:rgba(255,255,255,.42);
--button-primary-default:var(--green-40);
--button-primary-disabled:var(--gray-10);

/* Border */
--border-vibrant:var(--orange-70);
--border-soft:var(--teal-70);
--border-harmony:var(--green-90);
--border-primary:var(--gray-90);
--border-decorative-1:var(--gray-30);
--border-decorative-2:var(--gray-20);
--border-decorative-3:var(--gray-10);
--border-decorative-4:var(--gray-5);
--border-decorative-adaptive:rgba(26,26,26,.08);
--border-button-outlined-primary:var(--gray-90);
--border-button-outlined-disabled:var(--gray-20);

/* Foreground — vibrant / soft / harmony */
--foreground-vibrant-1:var(--orange-70);
--foreground-vibrant-2:var(--orange-50);
--foreground-vibrant-3:var(--orange-20);
--foreground-vibrant-4:var(--orange-10);
--foreground-soft-1:var(--teal-70);
--foreground-soft-2:var(--teal-20);
--foreground-soft-3:var(--teal-10);
--foreground-harmony-1:var(--green-30);
--foreground-harmony-2:var(--green-20);
--foreground-harmony-3:var(--green-10);

/* Icon */
--foreground-icon-primary:var(--green-90);
--foreground-icon-secondary:var(--orange-70);
--foreground-icon-neutral-primary:var(--gray-90);
--foreground-icon-neutral-secondary:var(--gray-60);
--foreground-icon-neutral-disabled:var(--gray-30);
--foreground-icon-neutral-inverse:var(--gray-0);

/* Text */
--text-primary:var(--gray-90);
--text-primary-inverse:var(--gray-0);
--text-secondary:var(--gray-60);
--text-placeholder:var(--gray-40);
--text-link:var(--green-90);
--text-title:var(--orange-70);
--text-helper:var(--gray-40);
--text-disabled:var(--gray-30);
--text-success:var(--green-80);
--text-error:var(--red-70);

/* Overlay */
--overlay-primary:rgba(51,51,51,.7);
--overlay-decorative:rgba(133,204,179,.5);

/* Semantic */
--semantic-warning:var(--yellow-50);
--semantic-informative:var(--yellow-50); /* source duplicates warning; flagged in readme */
--semantic-success:var(--green-80);
--semantic-error:var(--red-70);
}

/* Green Mode — remap the background stack; everything else is inherited. */
.theme-green{
--background-ui-1:var(--green-0);
--background-ui-2:var(--green-10);
--background-ui-3:var(--green-20);
}