.master-category-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.developer-projects { min-width: 210px; }
.developer-projects > div { display: flex; flex-wrap: wrap; gap: 6px; }
.developer-projects span,
.invoice-link-chip {
  display: inline-flex;
  margin: 2px 3px 2px 0;
  padding: 5px 8px;
  border: 1px solid #e7d8a9;
  border-radius: 999px;
  background: #fff8df;
  color: #684f08;
  font-size: 10px;
  white-space: nowrap;
}
.developer-projects button { min-height: 30px; margin-top: 8px; padding: 5px 10px; border: 1px solid #d9c998; background: #fff; color: #725700; }

.transaction-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 14px;
  margin: 0 0 14px;
  padding: 16px;
  border: 1px solid #e5ddce;
  border-radius: 13px;
  background: #fffefa;
  box-shadow: 0 8px 24px #33270e0b;
}
.transaction-filters label { margin: 0; }
.transaction-debit { background: #fde8e5; color: #983d34; }
.transaction-credit { background: #e5f2e9; color: #266244; }
.transaction-row-actions { display: flex; gap: 6px; }
.transaction-row-actions button { display: grid; place-items: center; width: 33px; height: 33px; min-height: 0; padding: 0; border: 1px solid #ddd4c2; background: #fff; color: #334f42; }
.transaction-row-actions button:hover { border-color: #f4b400; background: #fff6d5; }
.transaction-row-actions svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.business-split,
.transaction-invoices,
.split-allocation {
  margin: 10px 0;
  padding: 16px;
  border: 1px solid #e2d7c1;
  border-radius: 12px;
  background: #fffcf5;
}
.business-split[hidden], .transaction-invoices[hidden], .split-allocation[hidden] { display: none !important; }
.business-split > header,
.transaction-invoices > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.business-split header b,
.transaction-invoices header b { display: block; font: 17px Georgia, serif; }
.business-split header small,
.transaction-invoices header small { display: block; margin-top: 3px; color: #777066; }
.business-split header span,
.transaction-invoices header > span { color: #8b6300; font-size: 11px; font-weight: 700; }
.business-split.balanced header span { color: #2d6b4c; }
.business-split > div { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.transaction-invoice-list { display: grid; gap: 8px; max-height: 230px; overflow: auto; }
.transaction-invoice-list > label { display: grid; grid-template-columns: auto minmax(0, 1fr) 150px; align-items: center; gap: 11px; margin: 0; padding: 10px 12px; border: 1px solid #e5dfd3; border-radius: 9px; background: #fff; }
.transaction-invoice-list > label > input[type="checkbox"] { width: 18px; min-height: 18px; accent-color: #d5a019; }
.transaction-invoice-list > label > span b,
.transaction-invoice-list > label > span small { display: block; }
.transaction-invoice-list > label > span small { margin-top: 3px; color: #777168; }
.transaction-invoice-list > label > input[type="number"] { min-height: 38px; }

.transaction-detail { padding: 4px; }
.transaction-detail dl { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0 0 20px; }
.transaction-detail dl > div { padding: 13px; border: 1px solid #e5ddcf; border-radius: 10px; background: #fff; }
.transaction-detail dl > div.wide { grid-column: 1 / -1; }
.transaction-detail dt { color: #716b61; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.transaction-detail dd { margin: 5px 0 0; color: #24211c; font-size: 13px; }
.transaction-detail > button { float: right; min-width: 120px; }

body.shared-employee-form #recordForm { padding-top: 18px; }

@media (max-width: 900px) {
  .master-category-cards,
  .transaction-filters { grid-template-columns: 1fr; }
  .transaction-invoice-list > label { grid-template-columns: auto 1fr; }
  .transaction-invoice-list > label > input[type="number"] { grid-column: 2; }
}

@media (max-width: 620px) {
  .business-split > div,
  .transaction-detail dl { grid-template-columns: 1fr; }
  .transaction-detail dl > div.wide { grid-column: auto; }
}