.warehouse-map { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; }
.warehouse-map__cell { display: flex; min-height: 48px; align-items: center; justify-content: center; flex-direction: column; gap: 2px; border: 1px solid var(--color-border); border-radius: 6px; background: #f8fbfb; color: var(--color-gray-600); font-size: 9px; font-weight: 700; }
.warehouse-map__cell span { color: var(--color-gray-500); font-size: 8px; font-weight: 500; }
.warehouse-map__cell.is-available { border-color: #b9dfce; background: #eef9f3; color: var(--color-green-700); }
.warehouse-map__cell.is-active { border-color: #f2d38b; background: #fff6df; color: var(--color-orange-600); }
.warehouse-map__cell.is-hold { border-color: #ecc2c7; background: #fff0f1; color: var(--color-red-700); }
.silo-list { display: flex; flex-direction: column; gap: 15px; }
.silo-list__row { display: grid; grid-template-columns: 56px minmax(0, 1fr) 56px; align-items: center; gap: 11px; }
.silo-list__name { color: var(--color-gray-700); font-size: 11px; font-weight: 750; }
.silo-list__meta { margin-top: 2px; color: var(--color-gray-500); font-size: 9px; }
.silo-list__value { color: var(--color-navy-950); font-size: 11px; font-weight: 750; text-align: right; }
.ageing-bar { display: flex; height: 12px; overflow: hidden; border-radius: var(--radius-pill); }
.ageing-bar span:nth-child(1) { background: var(--color-teal-600); }
.ageing-bar span:nth-child(2) { background: var(--color-yellow-500); }
.ageing-bar span:nth-child(3) { background: var(--color-orange-600); }
.ageing-bar span:nth-child(4) { background: var(--color-red-700); }
.ageing-legend { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 9px; color: var(--color-gray-500); font-size: 9px; }
.ageing-legend span { display: inline-flex; align-items: center; gap: 4px; }
.ageing-legend span::before { width: 7px; height: 7px; border-radius: 2px; background: var(--color-teal-600); content: ""; }
.ageing-legend span:nth-child(2)::before { background: var(--color-yellow-500); }
.ageing-legend span:nth-child(3)::before { background: var(--color-orange-600); }
.ageing-legend span:nth-child(4)::before { background: var(--color-red-700); }