CSS block preview sample

Primary Action
Input Surface
Subtle Surface

Token and spacing effects appear here.

:root {
  /* Success */
  --color-success:     #22C55E;
  --color-success-bg:  rgba(34, 197, 94, 0.10);

  /* Warning */
  --color-warning:     #F59E0B;
  --color-warning-bg:  rgba(245, 158, 11, 0.10);

  /* Error */
  --color-error:       #EF4444;
  --color-error-bg:    rgba(239, 68, 68, 0.10);

  /* Info */
  --color-info:        #3B82F6;
  --color-info-bg:     rgba(59, 130, 246, 0.10);
}