app/assets/stylesheets/buttons.css in css-zero-0.0.8 vs app/assets/stylesheets/buttons.css in css-zero-0.0.9

@@ -1,42 +1,46 @@
 .btn {
   align-items: center;
-  background-color: var(--btn-background, transparent);
-  border-radius: var(--btn-border-radius, var(--rounded-lg));
-  border: 1px solid var(--btn-border-color, var(--color-border));
-  box-shadow: var(--btn-shadow, var(--shadow-sm));
-  color: var(--btn-color, var(--color-text));
-  column-gap: var(--size-2);
+  background-color: var(--btn-background, var(--color-primary));
+  border-radius: var(--btn-border-radius, var(--rounded-md));
+  border: 1px solid var(--btn-border-color, transparent);
+  color: var(--btn-color, var(--color-text-reversed));
+  column-gap: var(--btn-gap, var(--size-2));
   cursor: pointer;
   display: inline-flex;
   font-size: var(--btn-font-size, var(--text-sm));
-  font-weight: var(--btn-font-weight, var(--font-semibold));
+  font-weight: var(--btn-font-weight, var(--font-medium));
   justify-content: center;
-  line-height: var(--btn-line-height, var(--leading-6));
-  padding: var(--btn-padding, var(--size-1_5) var(--size-3_5));
+  padding: var(--btn-padding, .5rem 1rem);
   text-align: center;
+  white-space: nowrap;
 
-  &:hover {
-    filter: contrast(0.85);
+  img:not([class]) {
+    filter: var(--btn-icon-color, var(--color-filter-text-reversed));
   }
 
   &:disabled {
     opacity: var(--opacity-50);
     pointer-events: none;
   }
 }
 
-.btn--primary {
-  --btn-background: var(--color-primary);
-  --btn-border-color: transparent;
-  --btn-color: white;
+.btn--outline {
+  --btn-background: transparent;
+  --btn-border-color: var(--color-border);
+  --btn-color: var(--color-text);
+  --btn-icon-color: var(--color-filter-text);
 }
 
 .btn--plain {
-  --btn-border-color: transparent;
-  --btn-shadow: none;
+  --btn-background: transparent;
+  --btn-color: var(--color-text);
+  --btn-icon-color: var(--color-filter-text);
 }
 
-.btn--small {
-  --btn-font-size: var(--text-xs);
-  --btn-line-height: var(--leading-5);
+.btn--positive {
+  --btn-background: var(--color-positive);
+}
+
+.btn--negative {
+  --btn-background: var(--color-negative);
 }