.bite-section{padding-block:48px 72px}
.bite-heading{border-bottom:1px solid var(--navy);padding-bottom:24px}
.bite-heading p{margin-top:16px;font-size:1.125rem;max-width:none}
.bite-feature{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,2.6fr);gap:48px;padding-block:32px 48px}
.bite-date time{display:block;font:600 clamp(1.65rem,2.5vw,2.4rem)/1.2 var(--meta);color:var(--teal);margin:8px 0 24px}
.bite-date .micro{max-width:none}
.bite-copy{min-width:0}
.bite-copy h3{font-size:clamp(2rem,3.4vw,3.5rem);max-width:28ch;margin-bottom:24px}
.bite-copy>.micro{margin-bottom:8px}
.bite-body{max-width:70ch;font-size:1.0625rem;line-height:1.65;overflow-wrap:anywhere}
.bite-facts{display:flex;flex-wrap:wrap;gap:24px 32px;margin-block:24px}
.bite-facts dt{font:600 .875rem/1.3 var(--meta);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:8px}
.bite-facts dd{margin:0}
.bite-tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.bite-tags li{padding:3px 8px;background:var(--pale);color:var(--navy);font-size:.875rem;overflow-wrap:anywhere;max-width:100%}
.bite-source{font-size:.875rem;overflow-wrap:anywhere}
.bite-source .text-link{font-size:inherit}
.bite-source .source-type{margin-right:4px}
.bite-history{border-top:1px solid var(--navy);padding-top:24px}
.bite-history h3{font-size:1.75rem;margin-bottom:24px}
.bite-history ol{list-style:none;padding:0;margin:0}
.bite-history li{border-top:1px solid var(--rule)}
.bite-history summary{display:grid;grid-template-columns:170px minmax(0,1.5fr) minmax(0,1fr) auto;gap:24px;align-items:start;padding-block:20px;cursor:pointer}
.bite-history time{font-family:var(--meta);color:var(--teal)}
.bite-history-title{font-family:var(--serif);font-size:1.3rem;line-height:1.25}
.bite-history-species{font-size:.875rem}
.bite-history summary>*{min-width:0;overflow-wrap:anywhere}
.bite-history details[open]{padding-bottom:24px}
.bite-history .bite-body{padding-top:8px}
.bite-pagination{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;border-top:1px solid var(--rule);padding-top:24px;margin-top:32px}
.bite-empty{padding-block:32px;max-width:60ch}
.bite-species{grid-column:1/-1;border-bottom:1px solid var(--rule);padding-bottom:24px}
.bite-species-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.bite-species-heading h3{font-size:clamp(1.65rem,2.5vw,2.2rem)}
.bite-species-heading .source-type{white-space:nowrap}
.bite-species-area{font-size:.875rem;margin-top:8px}
.bite-fish-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;list-style:none;padding:0;margin:24px 0}
.bite-fish-list figure{margin:0}
.bite-fish-list img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
.bite-fish-list figcaption{font:600 1.05rem/1.35 var(--sans);margin-top:12px;overflow-wrap:anywhere}
.bite-fish-list small{display:block;margin-top:4px;font:400 .8rem/1.4 var(--sans);color:var(--muted)}
.bite-fish-unpictured{display:flex;align-items:center;aspect-ratio:3/2;border-bottom:1px solid var(--rule)}
.bite-art-note{max-width:85ch;color:var(--muted)}
@media(max-width:1000px){.bite-fish-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.bite-species-heading{display:block}.bite-species-heading .source-type{margin-top:12px}.bite-fish-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.bite-fish-list figcaption{font-size:.95rem}}
@media(max-width:1000px){.bite-history summary{grid-template-columns:140px minmax(0,1fr)}.bite-history-species{grid-column:2}.bite-history summary>.text-link{grid-column:2}}
@media(max-width:760px){.bite-section{padding-block:32px 48px}.bite-feature{grid-template-columns:minmax(0,1fr);gap:24px;padding-block:24px 32px}.bite-date time{margin-bottom:12px}.bite-date .micro{max-width:none}.bite-history summary{grid-template-columns:minmax(0,1fr);gap:8px}.bite-history-species,.bite-history summary>.text-link{grid-column:1}.bite-history-title{font-size:1.5rem}.bite-facts{gap:20px}.bite-heading h2{font-size:2.75rem}}
