:root{
--color-canvas:#0a0a0b;
--color-surface-1:#151517;
--color-surface-2:#1e1e21;
--color-surface-3:#28282c;
--color-hairline:#2a2a2e;
--color-hairline-soft:#1c1c1f;
--color-ink:#ffffff;
--color-ink-muted:#98989f;
--color-ink-faint:#616167;
--color-primary:#ffffff;
--color-on-primary:#0a0a0b;
--color-accent:#5b8cff;
--color-accent-soft:rgba(91,140,255,.15);
--color-accent-ring:rgba(91,140,255,.35);
--color-success:#22c55e;
--color-danger:#f87171;
--color-warning:#f5a524;
--gradient-violet:linear-gradient(135deg,#6a4cf5,#a855f7);/* @kind color */
--gradient-cyan:linear-gradient(135deg,#06b6d4,#3b82f6);/* @kind color */
--gradient-coral:linear-gradient(135deg,#fb7185,#f97316);/* @kind color */
--gradient-emerald:linear-gradient(135deg,#10b981,#0ea5a0);/* @kind color */
--gradient-amber:linear-gradient(135deg,#f59e0b,#ef4444);/* @kind color */
--text-heading:var(--color-ink);
--text-body:var(--color-ink-muted);
--text-faint:var(--color-ink-faint);
--surface-page:var(--color-canvas);
--surface-card:var(--color-surface-1);
--surface-card-hover:var(--color-surface-2);
--surface-card-featured:var(--color-surface-2);
--border-default:var(--color-hairline);
--border-soft:var(--color-hairline-soft);
}