/* The economy: the State Bank's pages and item ids on the plan.
   Same register as the rest of the site: ledger tables, the Commonwealth red
   for what came in and steel (--brick) for what went out. Meters run red, gold,
   then --danger striped for a comrade far behind the quota. Bars are native
   <progress> and <meter>, so no inline styles are needed under the strict CSP. */

.item-id {
  font-size: 0.78rem;
  color: var(--ink-soft);
  font-stretch: 87.5%;
  overflow-wrap: anywhere;
}

/* The citizen's own tax account. */
.stores-account {
  margin-top: 2.5rem;
  border-top: 3px solid var(--civic);
  padding-top: 0.25rem;
}
.stores-account > h2 { margin-top: 1rem; }
.stores-account__met { color: var(--civic); font-weight: 700; }

.stores-settlements { list-style: none; padding: 0; margin: 0 0 1rem; }
.stores-settlements li { padding: 0.35rem 0; border-bottom: 1px solid var(--rule); }
.stores-settlements .status { margin-right: 0.5rem; }

/* The ledger: in and out. */
.stores-in { color: var(--civic); font-weight: 700; }
.stores-out { color: var(--brick); font-weight: 700; }

/* Quota fulfilment: <meter class="stores-meter"> coloured by how far along each comrade is. */
.stores-fulfilment td:last-child { min-width: 11rem; white-space: nowrap; }
.stores-meter {
  width: 8rem;
  height: 0.9rem;
  vertical-align: middle;
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  background: var(--paper-deep);
}
.stores-meter::-webkit-meter-bar { background: var(--paper-deep); border: 0; border-radius: var(--radius); }
.stores-meter::-webkit-meter-optimum-value { background: var(--civic); }
.stores-meter::-webkit-meter-suboptimum-value { background: var(--gold); }
.stores-meter::-webkit-meter-even-less-good-value { background: repeating-linear-gradient(-45deg, var(--danger) 0 5px, var(--gold-light) 5px 7px); }
.stores-meter:-moz-meter-optimum::-moz-meter-bar { background: var(--civic); }
.stores-meter:-moz-meter-sub-optimum::-moz-meter-bar { background: var(--gold); }
.stores-meter:-moz-meter-sub-sub-optimum::-moz-meter-bar { background: repeating-linear-gradient(-45deg, var(--danger) 0 5px, var(--gold-light) 5px 7px); }
.stores-fulfilment__pct { margin-left: 0.5rem; font-weight: 700; font-size: 0.9rem; font-stretch: 87.5%; }
.stores-fulfilment__pct.is-met { color: var(--civic); }

/* The game master's page. */
.stores-defaults { margin-top: 1.5rem; }
.stores-defaults summary { cursor: pointer; color: var(--civic); font-weight: 600; }
.stores-held { columns: 2 16rem; padding-left: 1.2rem; }

@media (max-width: 40rem) {
  .stores-ledger th:nth-child(1), .stores-ledger td:nth-child(1) { display: none; }
  .stores-meter { width: 5.5rem; }
}