/* ==========================================================================
   tokens.css — Orcheum design-token entry point.
   Import this single file to pull in the whole token layer.
   ========================================================================== */

@import url("colors.css");
@import url("typography.css");
@import url("shadows.css");
@import url("animations.css");

:root {
  /* Radii (Figma radius tokens + component radii) */
  --radius-sm: 4px;     /* radius/radius-sm */
  --radius-8: 8px;      /* buttons */
  --radius-10: 10px;    /* input fields */
  --radius-card: 24px;  /* hero canvas / prompt card */

  /* States (Figma states tokens) */
  --state-disabled-opacity: 0.5;  /* states/disabled = 50 */

  /* Spacing (Figma spacing / gap / padding tokens) */
  --space-0: 0px;
  --space-1: 4px;       /* spacing/1 · gap-1 */
  --space-2: 8px;       /* gap-2 */
  --space-2-5: 10px;    /* padding p-2,5 */
  --space-3: 12px;      /* gap-3 · padding p-3 */
  --space-5: 20px;
  --space-6: 24px;      /* gap-6 */
  --space-8: 32px;
  --space-10: 40px;
}