/* Only the high-fiber-foods server figures and source-derived table use these classes. */
.fiber-context { margin: 2rem 0 0; }
.fiber-context img { display: block; width: 100%; height: auto; border-radius: 1.25rem; }
.fiber-context figcaption, .fiber-diagram figcaption { margin-top: .75rem; color: #5c4b53; font-size: .875rem; line-height: 1.6; }
.fiber-table-wrap { margin: 2rem 0; border: 1px solid #dfcdd5; border-radius: 1rem; background: #fffdfb; }
.fiber-table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; color: #2b2024; }
.fiber-table caption { padding: 1rem; text-align: left; font-size: 1rem; font-weight: 650; line-height: 1.45; color: #2b2024; }
.fiber-food-col { width: 45%; }
.fiber-portion-col { width: 33%; }
.fiber-grams-col { width: 22%; }
.fiber-table th, .fiber-table td { padding: .85rem 1rem; border-top: 1px solid #e9dfe3; vertical-align: top; text-align: left; font-size: .95rem; line-height: 1.5; overflow-wrap: anywhere; }
.fiber-table thead th { color: #7a2e52; background: #f7eff2; font-weight: 650; }
.fiber-table tbody th { font-weight: 550; }
.fiber-table tbody tr:nth-child(even) { background: #fcf8fa; }
.fiber-table .fiber-grams { white-space: nowrap; font-variant-numeric: tabular-nums; }
.fiber-diagram { margin: 2.25rem auto; max-width: 360px; }
.fiber-diagram img { display: block; width: 100%; height: auto; }
.fiber-diagram figcaption { padding: 0 .5rem; }
@media (max-width: 400px) {
  .fiber-table caption { padding: .85rem .7rem; font-size: .95rem; }
  .fiber-table th, .fiber-table td { padding: .75rem .6rem; font-size: .875rem; line-height: 1.45; }
  .fiber-context { margin-top: 1.5rem; }
}