/* Extend the original olive / paper palette; leave its typography and hero intact. */
.web-discovery { margin-top: 22px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.web-discovery summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 0; list-style: none; cursor: pointer; font-size: 15px; }
.web-discovery summary::-webkit-details-marker { display: none; }
.web-discovery summary small { color: var(--ink-soft); font-size: 12px; font-weight: 400; margin-left: 18px; }
.web-disclosure-mark { font-size: 20px; transition: transform .2s ease; }
.web-discovery[open] .web-disclosure-mark { transform: rotate(45deg); }
.web-filter-body { padding: 0 0 22px; }
.web-filter-intro { margin: 0 0 20px; color: var(--ink-soft); font-size: 12px; line-height: 1.8; }
.web-select-grid { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr) 1.3fr; gap: 18px; }
.web-select-grid label { display: grid; gap: 9px; min-width: 0; font-size: 12px; color: var(--ink-soft); }
.web-select-grid select { width: 100%; min-width: 0; min-height: 44px; padding: 10px 30px 10px 12px; border: 1px solid var(--line); border-radius: 0; color: var(--ink); background: var(--paper); font: 14px var(--sans); }
.web-filter-footer, .web-recipe-status { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; }
.web-filter-footer small { color: var(--ink-soft); line-height: 1.8; font-size: 11px; }
.web-filter-footer button, .web-recipe-status button { border: 0; border-bottom: 1px solid var(--line); padding: 10px 0; background: none; cursor: pointer; white-space: nowrap; font-size: 12px; }
.web-recipe-top { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-bottom: 22px; border-bottom: 1px solid var(--line); }
.web-recipe-categories { display: flex; gap: 25px; flex-wrap: wrap; }
.web-recipe-categories button { padding: 12px 0; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--ink-soft); cursor: pointer; font-size: 16px; }
.web-recipe-categories button.active { border-color: var(--ink); color: var(--ink); }
.web-recipe-search { display: flex; align-items: center; gap: 12px; width: min(360px, 40%); border-bottom: 1px solid var(--line); padding: 12px 0; }
.web-recipe-search input { border: 0; outline: 0; min-width: 0; width: 100%; background: none; font-size: 13px; }
.web-therapy-filters { padding: 22px 0 0; }
.web-therapy-filters[hidden] { display: none; }
.web-therapy-filters .web-select-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 760px; }
.web-preparation { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 22px; margin: 15px 0 8px; font-size: 12px; color: var(--ink-soft); }
.web-preparation label { display: inline-flex; align-items: center; min-height: 44px; gap: 8px; color: var(--ink); cursor: pointer; }
.web-preparation input { width: 16px; height: 16px; accent-color: var(--forest); }
.web-recipe-status { margin: 16px 0; color: var(--ink-soft); font-size: 12px; line-height: 1.8; }
.web-profile-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 20px 0; }
.web-profile-grid > div:last-child { grid-column: 1 / -1; }
.web-profile-grid dt { color: var(--ink-soft); font-size: 11px; margin-bottom: 7px; }
.web-profile-grid dd { margin: 0; line-height: 1.8; font-size: 14px; }
.web-reference-links { display: grid; gap: 12px; margin: 16px 0; font-size: 12px; line-height: 1.8; }
.web-source-note { display: block; font-size: 11px !important; color: var(--ink-soft); line-height: 1.8; overflow-wrap: anywhere; }
.web-traditional-more { margin: 20px 0; border-block: 1px solid var(--line); }
.web-traditional-more summary { padding: 14px 0; cursor: pointer; font-size: 13px; }
.web-traditional-more article { padding: 12px 0 22px; }
.web-traditional-more article + article { border-top: 1px solid var(--line); }
.web-traditional-more h4 { margin: 6px 0 12px; font-size: 16px; font-weight: 500; }
.web-traditional-more a { font-size: 12px; line-height: 1.8; }
.web-recipe-basis { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 22px 0; padding: 22px 0; }
.web-recipe-basis p { font-size: 13px; line-height: 1.9; }
.web-recipe-basis .kicker { font-size: 10px; }
.web-recipe-basis small { display: block; color: var(--ink-soft); font-size: 11px; line-height: 1.9; }
.web-recipe-tags { font-weight: 500; }
.meal-detail .web-recipe-basis { border-color: rgba(242, 240, 230, .24); }
.meal-detail .web-recipe-basis .kicker,
.meal-detail .web-recipe-basis small { color: rgba(242, 240, 230, .76); }
.web-recipe-search:focus-within { border-color: var(--ink); }
.web-discovery :focus-visible, #recipeDiscovery :focus-visible, .web-recipe-status :focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
@media (max-width: 800px) {
  .web-select-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .web-select-grid > label:first-child { grid-column: 1 / -1; }
  .web-therapy-filters .web-select-grid > label:first-child { grid-column: auto; }
  .web-recipe-top { flex-direction: column; align-items: stretch; gap: 10px; }
  .web-recipe-search { width: 100%; }
}
@media (max-width: 480px) {
  .web-discovery summary { font-size: 14px; }
  .web-discovery summary small { display: block; margin: 6px 0 0; font-size: 11px; }
  .web-select-grid { gap: 16px 12px; }
  .web-select-grid select { font-size: 16px; padding-left: 8px; }
  .web-recipe-categories { gap: 24px; }
  .web-recipe-categories button { font-size: 15px; }
  .web-recipe-search input { font-size: 16px; }
  .web-preparation { gap: 0 16px; }
  .web-preparation > span { width: 100%; margin-top: 8px; }
  .web-profile-grid { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) { .web-disclosure-mark { transition: none; } }