:root{
/* Foundation */
--color-charcoal:#1A1A1A;
--color-charcoal-80:#484848;
--color-charcoal-60:#757575;
--color-charcoal-40:#A3A3A3;
--color-charcoal-20:#D1D1D1;
--color-white:#FFFFFF;
--color-off-white:#F6F4F1;
--color-pampas:#DDD8C4;

/* Extension — Rock */
--color-rock:#BAC7E1;--color-rock-80:#C8D2E7;--color-rock-60:#D6DDED;--color-rock-40:#E3E9F3;--color-rock-20:#F1F4F9;
/* Extension — Meadow Mist */
--color-meadow-mist:#ACB99A;--color-meadow-mist-80:#BDC7AE;--color-meadow-mist-60:#CDD5C2;--color-meadow-mist-40:#DEE3D7;--color-meadow-mist-20:#EEF1EB;
/* Extension — Warm Clay */
--color-warm-clay:#BA784B;--color-warm-clay-80:#C8936F;--color-warm-clay-60:#D6AE93;--color-warm-clay-40:#E3C9B7;--color-warm-clay-20:#F1E4DB;
/* Extension — Lavender */
--color-lavender:#B7B6C1;--color-lavender-80:#C5C5CD;--color-lavender-60:#D4D3DA;--color-lavender-40:#E2E2E6;--color-lavender-20:#F1F0F3;

/* Semantic — surfaces */
--surface-page:var(--color-off-white);
--surface-card:var(--color-white);
--surface-sunken:var(--color-pampas);
--surface-inverse:var(--color-charcoal);
--surface-inverse-soft:var(--color-charcoal-80);

/* Semantic — text */
--text-primary:var(--color-charcoal);
--text-secondary:var(--color-charcoal-80);
--text-muted:var(--color-charcoal-60);
--text-on-inverse:var(--color-white);
--text-on-inverse-muted:var(--color-charcoal-20);
--text-link:var(--color-charcoal);
--text-link-hover:var(--color-charcoal-80);

/* Semantic — lines */
--border-hairline:var(--color-charcoal-20);
--border-strong:var(--color-charcoal-40);
--border-inverse:rgba(255,255,255,.24);

/* Semantic — interactive */
--action-primary-bg:var(--color-charcoal);
--action-primary-bg-hover:var(--color-charcoal-80);
--action-primary-fg:var(--color-white);
--action-secondary-fg:var(--color-charcoal);
--action-secondary-border:var(--color-charcoal);
--action-ghost-bg-hover:rgba(26,26,26,.06);
--action-disabled-bg:var(--color-charcoal-20);
--action-disabled-fg:var(--color-charcoal-40);
--focus-ring:var(--color-charcoal);

/* Semantic — status (extension palette only; always Charcoal text on top) */
--status-info-bg:var(--color-rock);
--status-success-bg:var(--color-meadow-mist);
--status-warning-bg:var(--color-warm-clay);
--status-neutral-bg:var(--color-lavender);
--status-fg:var(--color-charcoal);
}