@property --base-background {
  syntax: "*";
  inherits: false;
  initial-value: transparent;
}

/* face backgrounds */

@property --hue {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0deg;
}

@property --bg-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 45deg;
}


/* link buttons */

@property --icon {
  syntax: "<url>";
  inherits: true;
  initial-value: url(../media/favicon.webp);
}

@property --fg {
  syntax: "<color>";
  inherits: true;
  initial-value: white;
}

@property --bg {
  syntax: "<color>";
  inherits: true;
  initial-value: black;
}

@property --icon-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: white;
}
/* the initial value can't be `var(--bg)` because only "computationally
 * independent" values are allowed
 * https://drafts.css-houdini.org/css-properties-values-api/#initial-value-descriptor
 */