/* pages/work.css — the work index: PROBLEM / BUILD / RESULT case entries in ledger
   structure. Calmer motion than home: rules draw, status stamps; no counting, no running
   total. */

.work__intro { max-width: 60ch; }

.case { margin-top: var(--s-7); padding-top: var(--s-6); border-top: 1px solid var(--rule-strong); }
.case:first-of-type { border-top: 0; }
.case__title {
  font-family: var(--font-display);
  font-variation-settings: "wght" 400, "SOFT" 0, "WONK" 0;
  font-size: var(--t-h2);
  line-height: 1.06;
  letter-spacing: -0.012em;
}
.case__meta { margin-top: 10px; }

.case-grid { margin-top: var(--s-6); display: grid; gap: var(--s-5); }
.case-line { display: grid; grid-template-columns: 120px 1fr; gap: 20px; padding-block: var(--s-4); border-top: 1px solid var(--rule); }
.case-line:first-child { border-top: 0; }
.case-line__key {
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 0.6875rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--oxblood);
}
.case-line__value { color: var(--ink-2); max-width: 62ch; }
.case-line__value em { color: var(--ink); font-style: italic; }

/* Empty before/after ledger: drawn-but-unfilled $ cells (measurement pending, not faked) */
.ba-ledger { margin-top: var(--s-5); width: 100%; border-collapse: collapse; max-width: 480px; }
.ba-ledger caption {
  text-align: left;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-3);
  padding-bottom: 8px;
}
.ba-ledger th, .ba-ledger td {
  border: 1px solid var(--rule-strong);
  padding: 12px 14px;
  text-align: right;
  font-family: var(--font-mono);
  font-size: var(--t-figure);
  font-variant-numeric: tabular-nums lining-nums;
}
.ba-ledger th:first-child, .ba-ledger td:first-child { text-align: left; color: var(--ink-3); }
.ba-ledger thead th {
  font-weight: 500;
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-3);
}
/* Unfilled cells: a drawn box with a faint pending mark — measured, never faked. */
.ba-ledger .pending {
  color: var(--ink-3);
  background-image: repeating-linear-gradient(-45deg, transparent 0 6px, var(--rule) 6px 7px);
  text-align: center;
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.case__status { margin-top: var(--s-5); display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.case__status .status { transform: rotate(-4deg); }

@media (max-width: 640px) {
  .case-line { grid-template-columns: 1fr; gap: 6px; }
  .case-line__key { margin-bottom: 2px; }
}