FinanceBuddy: card money badge on line 3 (v0.3.1)

Asset/css/finance.css

@@ -1,10 +1,38 @@
 /*
  * FinanceBuddy styles.
  *
- * The money badge (.fb-badge / .fb-installments) and the per-column total (.fb-column-total)
- * styling are added as those features land in later versions.
+ * The per-column total (.fb-column-total) styling is added in a later version.
  */
 
+/* Line-3 money badge on board cards. Its own background guarantees contrast on any card color. */
+.fb-line {
+    margin: 2px 0 4px;
+    line-height: 1.4;
+}
+
+.fb-badge {
+    display: inline-block;
+    padding: 1px 6px;
+    border-radius: 3px;
+    color: #fff;
+    font-weight: bold;
+    font-size: 1.1em;
+}
+
+.fb-badge-debit {
+    background: #b94a48;
+}
+
+.fb-badge-credit {
+    background: #468847;
+}
+
+.fb-installments {
+    margin-left: 6px;
+    color: #000;
+    font-size: 1.05em;
+}
+
 /* Task-form finance fieldset (middle column). */
 .fb-form-directions {
     margin-bottom: 8px;