@font-face { font-family: Figtree; src: url('/assets/Figtree_400Regular.ttf') format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: Figtree; src: url('/assets/Figtree_600SemiBold.ttf') format('truetype'); font-weight: 600 700; font-display: swap; }
@font-face { font-family: Fraunces; src: url('/assets/Fraunces_500Medium.ttf') format('truetype'); font-weight: 500; font-display: swap; }

:root {
  color-scheme: light;
  font: 400 16px/1.5 Figtree, ui-sans-serif, system-ui, sans-serif;
  font-synthesis: none;
  color: #332f2c;
  background: #faf4ed;
  --paper: #faf4ed;
  --sheet: #fffcf8;
  --ink: #332f2c;
  --muted: #6d645c;
  --line: #e8dcd2;
  --plum: #6b2e4e;
  --plum-deep: #421b32;
  --rose: #f7e8e4;
  --peach: #faeadb;
  --sage: #eaf0e5;
}
* { box-sizing: border-box; }
body { margin: 0; }
img { max-width: 100%; }
a { color: var(--plum); }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--plum); outline-offset: 4px; }
.shell { width: min(100% - 48px, 1060px); margin-inline: auto; }
.site-header { background: var(--sheet); border-bottom: 1px solid var(--line); }
.header-inner { min-height: 80px; display: flex; align-items: center; gap: 18px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--plum); text-decoration: none; }
.brand img { border-radius: 13px; }
.brand span { font: 500 31px/1 Fraunces, Georgia, serif; letter-spacing: -.5px; }
.descriptor { color: var(--muted); font-size: 13px; padding-left: 16px; border-left: 1px solid var(--line); }
.header-link { margin-left: auto; font-size: 14px; font-weight: 600; text-decoration: none; }
.crumbs { display: flex; align-items: center; gap: 10px; margin: 27px 0 0; color: var(--muted); font-size: 13px; }
.crumbs a { text-decoration: none; font-weight: 600; }
.crumbs a:hover { text-decoration: underline; }
h1, h2, h3 { font-family: Fraunces, Georgia, serif; font-weight: 500; letter-spacing: -.6px; }
h1 { font-size: clamp(39px, 5vw, 58px); line-height: 1.12; margin: 12px 0 18px; color: var(--plum-deep); }
h2 { font-size: 29px; line-height: 1.23; margin: 0; color: var(--plum-deep); }
.eyebrow { color: var(--plum); text-transform: uppercase; letter-spacing: .9px; font-size: 11px; font-weight: 600; }
.lead { color: var(--muted); font-size: 18px; line-height: 1.56; max-width: 700px; margin: 0; }
.page-head { margin: 32px 0 30px; max-width: 870px; }
.evidence-line { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 22px; color: #61584f; font-size: 13px; }
.evidence-dot { width: 10px; height: 10px; display: inline-block; flex: none; border-radius: 50%; background: #6d9277; box-shadow: 0 0 0 4px #e4eadb; }

.guide-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 26px; align-items: start; }
.guide-main { min-width: 0; }
.answer-sheet { background: var(--sheet); border: 1px solid var(--line); border-radius: 23px; overflow: hidden; }
.answer-intro { padding: 24px 26px 21px; }
.answer-intro h2 { margin-top: 9px; font-size: 26px; }
.question-helper { color: var(--ink); font-size: 14px; margin: 12px 0 0; }
.answer-hint { color: var(--muted); font-size: 12px; margin: 13px 0 0; }
.answer-row { --tone-bg: #eff0f4; --tone-ink: #414859; border-top: 1px solid var(--line); }
.answer-row.moss { --tone-bg: #e4eadb; --tone-ink: #2c5b41; }
.answer-row.amber { --tone-bg: #fbefd8; --tone-ink: #7a5218; }
.answer-row.clay { --tone-bg: #faede9; --tone-ink: #8a3a2a; }
.answer-row > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto 18px; gap: 14px; padding: 21px 26px; align-items: center; cursor: pointer; list-style: none; }
.answer-row > summary::-webkit-details-marker { display: none; }
.answer-row > summary:hover { background: #faf6f0; }
.answer-conditions { display: grid; gap: 7px; font-size: 15px; min-width: 0; }
.condition-path { display: grid; gap: 8px; }
.condition-path > span { display: block; }
.condition-question { display: block; font-size: 12px; line-height: 1.4; color: var(--muted); margin-bottom: 2px; }
.condition-path strong { font-weight: 600; color: var(--plum-deep); }
.path-or { font-size: 11px; font-weight: 600; color: var(--muted); }
.answer-verdict { color: var(--tone-ink); background: var(--tone-bg); border-radius: 10px; padding: 8px 10px; display: flex; align-items: center; gap: 6px; font-size: 12px; max-width: 168px; line-height: 1.3; }
.answer-verdict svg { width: 19px; height: 19px; flex: none; }
.expand-mark { color: var(--plum); font-size: 22px; font-weight: 400; text-align: center; }
.answer-row[open] .expand-mark { transform: rotate(45deg); }
.answer-row[open] > summary { background: var(--tone-bg); }
.answer-explanation { padding: 0 26px 24px; background: var(--tone-bg); color: var(--tone-ink); }
.result-label { padding-top: 18px; border-top: 1px solid #332f2c22; margin: 0; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; }
.reason { font-size: 15px; line-height: 1.55; margin: 10px 0 0; }
.next { margin-top: 16px; }
.next strong { font-size: 12px; }
.next p { margin: 4px 0 0; font-size: 14px; line-height: 1.55; }
.answer-source { border-top: 1px solid #332f2c22; margin-top: 18px; padding-top: 13px; font-size: 12px; }
.answer-source ul { list-style: none; margin: 6px 0 0; padding: 0; }
.answer-source li + li { margin-top: 8px; }
.source-date { display: block; font-size: 11px; color: var(--muted); margin-top: 3px; }
.scope-note { font-size: 12px; color: var(--muted); line-height: 1.55; margin: 17px 7px 0; }

.app-panel { padding: 25px; background: #efe2ea; border-radius: 23px; }
.app-panel > img { display: block; margin-bottom: 16px; border-radius: 16px; }
.app-panel .eyebrow { font-size: 10px; }
.app-panel h2 { font-size: 28px; margin-top: 9px; }
.app-panel p { margin: 13px 0 0; font-size: 14px; line-height: 1.55; }
.app-panel ul { padding: 0; list-style: none; margin: 19px 0; font-size: 12px; }
.app-panel li { padding-left: 18px; position: relative; margin: 10px 0; }
.app-panel li::before { content: '✓'; position: absolute; left: 0; color: var(--plum); }
.app-panel .availability { font-size: 12px; color: var(--plum); font-weight: 600; border-top: 1px solid #6b2e4e22; padding-top: 15px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: var(--plum); color: #fff8fb; padding: 14px 22px; border-radius: 999px; text-decoration: none; font-size: 14px; font-weight: 600; }
.app-panel .button { width: 100%; }
.button:hover { background: #56243e; }
.quiet-link { display: inline-block; font-size: 12px; margin-top: 18px; text-underline-offset: 3px; }

.source-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 48px; padding-top: 30px; border-top: 1px solid var(--line); scroll-margin-top: 25px; }
.source-panel h2 { margin-top: 7px; font-size: 27px; }
.source-panel p { color: var(--muted); font-size: 14px; max-width: 420px; margin: 11px 0 0; }
.source-panel ul { margin: 0; padding: 0; list-style: none; font-size: 14px; }
.source-panel li + li { margin-top: 16px; }
.source-panel li span { display: block; color: var(--muted); font-size: 12px; margin-top: 5px; }
.related { margin-top: 45px; }
.related h2 { font-size: 27px; }
.related > div { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 18px; }
.related a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--sheet); color: var(--plum-deep); text-decoration: none; font-size: 14px; font-weight: 600; }
.related small { display: block; color: var(--muted); font-size: 12px; font-weight: 400; margin-top: 4px; }
.related a:hover { border-color: var(--plum); }
.method { color: var(--muted); font-size: 12px; line-height: 1.55; margin: 34px 0 60px; max-width: 850px; }

.home-hero { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); gap: 45px; align-items: center; margin-top: 48px; }
.home-hero-copy { min-width: 0; }
.home-hero h1 { font-size: clamp(43px, 5.5vw, 66px); }
.hero-note { color: var(--muted); font-size: 12px; margin: 16px 0 0; }
.quick-foods { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 23px; }
.quick-foods a { background: var(--sheet); border: 1px solid var(--line); border-radius: 30px; padding: 9px 14px; text-decoration: none; font-size: 13px; text-transform: capitalize; }
.quick-foods a:hover { border-color: var(--plum); }
.quick-foods span { margin-left: 6px; }
.hero-photo { position: relative; height: 320px; overflow: hidden; border-radius: 170px 170px 22px 22px; background: var(--rose); }
.hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 55% center; display: block; }
.photo-caption { position: absolute; bottom: 15px; left: 15px; right: 15px; padding: 11px 14px; border-radius: 12px; background: rgba(255,252,248,.94); color: var(--plum-deep); font-size: 13px; font-weight: 600; text-align: center; }
.food-hub { margin-top: 59px; }
.section-title h2 { margin-top: 6px; }
.food-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 22px 0; }
.food-card { display: flex; flex-direction: column; min-height: 173px; gap: 10px; padding: 23px; background: var(--rose); border-radius: 20px; color: var(--ink); text-decoration: none; }
.food-card:nth-child(4n + 2) { background: var(--peach); }
.food-card:nth-child(4n + 3) { background: var(--sage); }
.food-card:nth-child(4n + 4) { background: #efe2ea; }
.food-card > span:first-child { color: var(--plum); font-size: 11px; font-weight: 600; letter-spacing: .6px; text-transform: uppercase; }
.food-card strong { font: 500 21px/1.3 Fraunces, Georgia, serif; color: var(--plum-deep); }
.food-topic { font-size: 12px; color: var(--muted); }
.food-card .arrow { margin-top: auto; align-self: flex-end; font-size: 20px; color: var(--plum); }
.food-card:hover { box-shadow: 0 6px 18px rgba(66,27,50,.09); }
.hub-explainer { display: flex; align-items: flex-start; gap: 16px; background: var(--sheet); border: 1px solid var(--line); border-radius: 18px; padding: 18px 21px; margin-top: 32px; }
.hub-explainer .evidence-dot { margin-top: 7px; }
.hub-explainer p { margin: 0; font-size: 14px; }
.site-footer { border-top: 1px solid var(--line); background: var(--sheet); padding: 23px 0; color: var(--muted); font-size: 11px; }

@media (max-width: 900px) {
  .guide-layout { grid-template-columns: minmax(0, 1fr) 250px; gap: 18px; }
  .answer-row > summary { grid-template-columns: minmax(0, 1fr) 18px; gap: 10px; }
  .answer-verdict { grid-column: 1; grid-row: 2; width: fit-content; max-width: none; }
  .expand-mark { grid-column: 2; grid-row: 1 / span 2; }
  .food-grid { grid-template-columns: repeat(2, 1fr); }
  .home-hero { gap: 25px; }
}
@media (max-width: 720px) {
  .shell { width: min(100% - 32px, 1060px); }
  .header-inner { min-height: 69px; gap: 10px; }
  .brand span { font-size: 27px; }
  .brand img { width: 36px; height: 36px; }
  .descriptor { font-size: 11px; padding-left: 10px; }
  .header-link { display: none; }
  .page-head { margin: 24px 0; }
  h1 { font-size: 39px; }
  .lead { font-size: 16px; }
  .guide-layout { grid-template-columns: 1fr; gap: 26px; }
  .answer-intro { padding: 22px 20px 18px; }
  .answer-intro h2 { font-size: 24px; }
  .answer-row > summary { padding: 18px 20px; }
  .answer-explanation { padding: 0 20px 22px; }
  .app-panel { padding: 24px; }
  .app-panel h2 br { display: none; }
  .app-panel > img { float: right; margin-left: 12px; }
  .app-panel .button { width: auto; }
  .source-panel { grid-template-columns: 1fr; gap: 20px; margin-top: 34px; }
  .related > div { grid-template-columns: 1fr; }
  .home-hero { display: block; margin-top: 34px; }
  .hero-photo { display: none; }
  .food-hub { margin-top: 39px; }
  .food-grid { grid-template-columns: 1fr; }
  .food-card { min-height: 145px; }
}

/* Food guides: one question, visual choices, detail on demand. */
.page-head { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 48px; align-items: center; max-width: none; margin: 32px 0; }
.page-head h1 { max-width: 720px; }
.food-portrait { display: grid; place-items: center; width: 190px; height: 190px; border-radius: 50% 50% 42% 42%; background: #f1e3db; transform: rotate(5deg); }
.food-portrait .food-illustration { width: 168px; transform: rotate(-5deg); }
.evidence-line { margin-top: 16px; }
.evidence-line a { text-decoration: none; }
.evidence-line a:hover { text-decoration: underline; }
.answer-sheet { overflow: visible; border: none; background: none; border-radius: 0; }
.answer-intro { padding: 0 0 22px; max-width: 790px; }
.answer-intro h2 { margin: 0; font-size: 25px; }
.question-helper { margin-top: 9px; font-size: 13px; color: var(--muted); }
.answer-list { display: grid; gap: 10px; }
.answer-row { border: 1px solid var(--line); border-radius: 16px; background: var(--sheet); overflow: hidden; }
.answer-row > summary { padding: 20px 23px; min-height: 82px; }
.answer-row > summary:hover { background: var(--tone-bg); }
.single-question .answer-list { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.single-question .answer-row > summary { grid-template-columns: 1fr 20px; gap: 20px 8px; padding: 23px; }
.single-question .answer-conditions { font-size: 19px; }
.single-question .answer-verdict { grid-column: 1; grid-row: 2; background: none; padding: 0; max-width: none; font-size: 13px; }
.single-question .answer-verdict svg { width: 24px; height: 24px; }
.single-question .expand-mark { grid-column: 2; grid-row: 1; align-self: start; }
.answer-explanation { padding: 1px 23px 23px; }
.reason { margin-top: 16px; }
.scope-note { margin: 12px 0 28px; }
.scope-note a { margin-left: 5px; }
.app-panel { display: flex; align-items: center; gap: 17px; padding: 21px 25px; border-radius: 18px; }
.app-panel > img { margin: 0; flex: none; float: none; }
.app-panel h2 { font-size: 24px; margin: 0; }
.app-panel p { margin: 4px 0 0; font-size: 13px; }
.app-panel .button { width: auto; margin-left: auto; flex: none; }
.app-panel .availability { margin-left: auto; font-size: 12px; border: none; padding: 0; color: var(--plum); }
.related { margin-top: 33px; }
.related h2 { font-size: 24px; }
.related > div { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 13px; gap: 12px; }
.related a { padding: 8px 13px 8px 6px; gap: 7px; text-transform: capitalize; background: transparent; border-color: transparent; }
.related a:hover { background: var(--sheet); border-color: var(--line); }
.related .food-illustration { width: 50px; height: 50px; flex: none; }
.related a > span:last-child { margin-left: auto; }
.source-panel { display: block; margin: 27px 0 44px; padding: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.source-panel > summary { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; cursor: pointer; list-style: none; font-size: 14px; font-weight: 600; color: var(--plum); }
.source-panel > summary::-webkit-details-marker { display: none; }
.source-panel[open] .expand-mark { transform: rotate(45deg); }
.source-content { padding: 0 0 22px; max-width: 770px; }
.source-content p { max-width: none; font-size: 12px; }
.source-content ul { margin-bottom: 17px; font-size: 13px; }
@media (max-width: 900px) {
  .page-head { grid-template-columns: minmax(0, 1fr) 140px; gap: 24px; }
  .food-portrait { width: 140px; height: 140px; }
  .food-portrait .food-illustration { width: 125px; }
  .related > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .page-head { grid-template-columns: minmax(0, 1fr) 76px; gap: 10px; margin: 26px 0; }
  .page-head h1 { font-size: 33px; margin-bottom: 14px; }
  .page-head .eyebrow { font-size: 9px; }
  .food-portrait { width: 76px; height: 88px; }
  .food-portrait .food-illustration { width: 76px; }
  .evidence-line { font-size: 11px; gap: 7px; }
  .answer-intro h2 { font-size: 23px; }
  .answer-intro { padding-bottom: 17px; }
  .single-question .answer-list { grid-template-columns: 1fr; }
  .single-question .answer-row > summary { grid-template-columns: minmax(0, 1fr) auto 16px; gap: 10px; padding: 18px; min-height: 74px; }
  .single-question .answer-conditions { font-size: 16px; }
  .single-question .answer-verdict { grid-column: 2; grid-row: 1; font-size: 11px; max-width: 142px; }
  .single-question .expand-mark { grid-column: 3; align-self: center; }
  .single-question .answer-verdict svg { width: 20px; height: 20px; }
  .app-panel { flex-wrap: wrap; padding: 18px; gap: 13px; }
  .app-panel h2 { font-size: 22px; }
  .app-panel .availability { margin-left: 65px; }
  .app-panel .button { margin-left: 65px; }
  .related a { font-size: 13px; padding-right: 8px; }
  .related .food-illustration { width: 38px; height: 38px; }
}

.app-panel > div { flex: 1; min-width: 0; }
.food-card { position: relative; padding-right: 104px; justify-content: center; min-height: 152px; }
.food-card > .food-illustration { position: absolute; right: 13px; top: 22px; width: 90px; height: 90px; }
.food-card strong { text-transform: capitalize; font-size: 27px; }
.food-card .arrow { position: absolute; bottom: 14px; right: 19px; }

/* Progressive preparation check: static app results, displayed one at a time. */
[hidden] { display: none !important; }
.quick-answer { max-width: 720px; margin: -10px 0 28px; font-size: 17px; color: var(--muted); }
.food-answer-summary { max-width: 870px; margin: 0 0 28px; border: 1px solid var(--line); border-radius: 20px; background: var(--sheet); overflow: hidden; }
.summary-heading { padding: 20px 24px 16px; }
.summary-heading h2 { margin: 7px 0 0; font-size: 24px; line-height: 1.3; }
.summary-heading p { margin: 9px 0 0; font-size: 14px; color: var(--muted); }
.food-answer-summary ul { list-style: none; margin: 0; padding: 0; }
.summary-case { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 24px; padding: 17px 24px; border-top: 1px solid var(--line); border-left: 4px solid #64705d; }
.summary-case.amber { border-left-color: #a47832; }
.summary-case.clay { border-left-color: #a35b49; }
.summary-condition { font-size: 14px; align-self: start; }
.summary-path, .summary-path > span { display: block; }
.summary-path > span + span { margin-top: 8px; }
.summary-question { display: block; font-size: 12px; color: var(--muted); margin-bottom: 2px; }
.summary-or { display: block; margin-block: 6px; font-size: 12px; color: var(--muted); }
.summary-result h3 { display: flex; align-items: center; gap: 7px; margin: 0; font: 600 15px/1.4 Figtree, sans-serif; letter-spacing: 0; color: #2c5b41; }
.summary-result h3 svg { width: 20px; height: 20px; flex: none; }
.amber .summary-result h3 { color: #7a5218; }
.clay .summary-result h3 { color: #8a3a2a; }
.summary-result p { font-size: 14px; line-height: 1.5; margin: 6px 0 0; }
.summary-footnote { padding: 12px 24px; margin: 0; border-top: 1px solid var(--line); font-size: 12px; color: var(--muted); }
.food-notice-status { margin: 0; font-size: 12px; color: var(--muted); }
.food-notice-sources { border-top: 1px solid var(--line); margin-top: 20px; padding-top: 16px; }
.food-notice-sources h3 { font-size: 20px; }
@media (max-width: 600px) {
  .summary-heading { padding: 16px; }
  .summary-heading h2 { font-size: 21px; }
  .summary-case { grid-template-columns: 1fr; gap: 8px; padding: 14px 16px; }
  .summary-footnote { padding: 12px 16px; }
}
.food-picker { padding: 27px; background: var(--sheet); border: 1px solid var(--line); border-radius: 22px; }
.food-picker h2 { font-size: 27px; }
.food-picker h2:focus { outline: none; }
.prep-options { display: grid; grid-template-columns: repeat(var(--choices, 4), minmax(0,1fr)); gap: 12px; margin-top: 23px; }
.prep-choice { display: flex; flex-direction: column; align-items: flex-start; gap: 15px; border: 1px solid var(--line); background: var(--paper); color: var(--plum-deep); padding: 19px; border-radius: 16px; font: 600 15px/1.35 Figtree,sans-serif; cursor: pointer; text-align: left; min-height: 100px; }
.prep-choice:hover { border-color: var(--plum); background: #f2e4e8; }
button:focus-visible { outline: 3px solid var(--plum); outline-offset: 4px; }
.choice-arrow { align-self: flex-end; margin-top: auto; color: var(--plum); }
.egg-choice { width: 65px; height: 57px; display: grid; place-items: center; border-radius: 48% 52% 43% 57%; background: #fffef8; border: 1px solid #dacbb7; transform: rotate(-10deg); box-shadow: 0 4px 0 #eedfce; }
.egg-choice > span { width: 28px; height: 28px; background: #eaba67; border: 2px solid #dba650; border-radius: 50%; }
.egg-runny > span { width: 37px; height: 24px; border-radius: 40% 60% 35% 50%; background: #e9ac4c; transform: rotate(18deg); }
.egg-raw { background: #eed2b5; border-radius: 50% 50% 45% 45%; width: 44px; margin-left: 10px; }
.egg-raw > span { background: none; border: none; border-left: 2px solid #bc9171; border-bottom: 2px solid #bc9171; border-radius: 0; width: 13px; height: 15px; transform: rotate(-35deg); }
.egg-unsure { background: #eee5e9; border: none; box-shadow: none; color: var(--plum); font: 500 35px Fraunces,serif; transform: none; }
.picker-helper { color: var(--muted); font-size: 14px; max-width: 640px; margin: 11px 0 0; }
.step-back { font: 600 13px Figtree,sans-serif; color: var(--plum); border: none; padding: 8px 0; background: transparent; cursor: pointer; margin-bottom: 15px; }
.start-again { margin: 16px 0 0; }
.picked-result { border-radius: 15px; padding: 23px; background: #fbefd8; }
.picked-result.moss { background: #e4eadb; }
.picked-result.clay { background: #faede9; }
.picked-result h2 { display: flex; align-items: center; gap: 10px; }
.picked-result h2 svg { flex: none; }
.picked-conditions { display: flex; flex-wrap: wrap; gap: 10px 23px; font-size: 13px; margin: 17px 0; }
.picked-conditions > span { display: block; }
.picked-conditions > span > span { display: block; color: var(--muted); font-size: 12px; margin-bottom: 3px; }
.picked-next { max-width: 710px; margin: 0; font-size: 16px; }
.picked-why { margin-top: 18px; font-size: 13px; }
.picked-why summary { cursor: pointer; color: var(--plum); font-weight: 600; }
.picked-why ul { list-style: none; padding: 0; }
.all-preparations { margin-top: 14px; }
.all-preparations > summary { width: fit-content; cursor: pointer; color: var(--plum); font-size: 13px; padding: 9px 0; }
.all-preparations .answer-sheet { margin-top: 18px; }
@media (max-width: 720px) {
  .food-picker { padding: 20px; }
  .food-picker h2 { font-size: 24px; }
  .prep-options { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; margin-top: 18px; }
  .prep-choice { padding: 16px; font-size: 14px; gap: 12px; }
  .quick-answer { font-size: 15px; margin-top: -7px; }
  .picked-result { padding: 18px; }
  .picked-next { font-size: 14px; }
}

@media (max-width: 720px) {
  .prep-options[data-choices="3"] .prep-choice:last-child { grid-column: 1 / -1; min-height: 70px; flex-direction: row; align-items: center; }
  .prep-options[data-choices="3"] .prep-choice:last-child .choice-arrow { margin: 0 0 0 auto; align-self: center; }
}

/* Methodology: visual overview, optional supporting detail. */
.method-hero { margin: 35px 0 28px; }
.method-hero h1 { margin-bottom: 0; }
.method-steps { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.method-steps article { position: relative; padding: 23px 24px; background: var(--rose); border-radius: 20px; }
.method-steps article:nth-child(2) { background: var(--peach); }
.method-steps article:nth-child(3) { background: var(--sage); }
.method-drawing { width: 120px; height: 96px; margin: 0 auto 23px; }
.method-drawing svg { width: 100%; height: 100%; }
.step-number { position: absolute; top: 22px; left: 23px; font: 600 12px Figtree,sans-serif; color: var(--plum); }
.method-steps h2 { font-size: 25px; }
.method-steps p { font-size: 13px; margin: 8px 0 0; color: var(--muted); }
.method-action { text-align: center; margin: 25px 0; }
.method-people { max-width: 780px; margin: 32px auto; padding: 28px; border: 1px solid var(--line); border-radius: 20px; background: #fffcf8; }
.method-people h2 { margin: 10px 0 24px; font-size: 28px; }
.method-people-grid { display: grid; gap: 24px; }
.method-people-grid article { display: grid; grid-template-columns: minmax(180px, 1fr) 2fr; column-gap: 28px; align-content: start; }
.method-people-grid article + article { padding-top: 24px; border-top: 1px solid var(--line); }
.method-role { font-size: 12px; color: var(--muted); }
.method-people h3 { margin: 7px 0 10px; font-size: 21px; }
.method-people article p { margin: 0; font-size: 14px; line-height: 1.65; }
.method-bio a { display: inline-block; margin-top: 12px; font-size: 12px; }
.method-people .method-review-scope { margin: 24px 0 0; padding-top: 18px; border-top: 1px solid var(--line); font-size: 12px; line-height: 1.65; color: var(--muted); }
@media (max-width: 600px) {
  .method-people-grid article { display: block; }
}
.method-accordions { max-width: 780px; margin: 0 auto 44px; }
.method-accordions .source-panel { margin: 0; border-top: none; }
.method-accordions .source-panel:first-child { border-top: 1px solid var(--line); }
.meaning-list { margin: 0; }
.meaning-list > div { display: grid; grid-template-columns: 175px 1fr; gap: 18px; padding: 12px 0; }
.meaning-list dt { font-weight: 600; color: var(--plum); font-size: 13px; }
.meaning-list dd { margin: 0; font-size: 13px; }
.site-footer a { margin-left: 15px; }
@media (max-width:720px) {
  .method-hero { margin: 25px 0; }
  .method-steps { grid-template-columns: 1fr; gap: 10px; }
  .method-steps article { padding: 23px 15px 23px 97px; min-height: 100px; }
  .method-drawing { position: absolute; width: 73px; height: 67px; top: 16px; left: 13px; margin: 0; }
  .step-number { top: 7px; left: 10px; font-size: 9px; }
  .method-steps h2 { font-size: 22px; }
  .method-steps p { font-size: 12px; margin-top: 5px; }
  .meaning-list > div { grid-template-columns: 1fr; gap: 5px; }
}

/* Keep longer preparation labels readable as the guide library expands. */
.prep-options[data-choices="5"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.direct-result .picked-result { margin-top: 0; }
@media (max-width: 640px) {
  .prep-options[data-choices="5"] { grid-template-columns: 1fr; }
  .prep-options[data-choices="5"] .prep-choice { min-height: 76px; flex-direction: row; align-items: center; }
  .prep-options[data-choices="5"] .choice-arrow { margin: 0 0 0 auto; align-self: center; }
}

/* Restaurant guides: compact comparisons with source detail on demand. */
.header-nav { display: flex; gap: 24px; margin-left: auto; }
.restaurant-intro { color: var(--muted); font-size: 19px; line-height: 1.5; max-width: 640px; }
.restaurant-section { margin: 40px 0; scroll-margin-top: 24px; }
.source-checked { font-size: 12px; color: var(--muted); margin: 12px 0 0; }
.source-checked span { display: block; font-size: 11px; margin-top: 3px; }
.menu-coverage { font-size: 13px; color: var(--muted); margin: 0 0 20px; }
.menu-coverage strong { color: var(--plum-deep); }
.menu-categories { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; align-items: start; }
.menu-category { background: var(--sheet); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.menu-category > summary { cursor: pointer; padding: 17px 18px; font-weight: 600; color: var(--plum-deep); }
.menu-category > summary > span { float: right; font-size: 12px; padding: 2px 8px; background: var(--rose); border-radius: 8px; color: var(--plum); }
.menu-category ul { list-style: none; margin: 0; padding: 0 18px 8px; }
.menu-category li { border-top: 1px solid var(--line); }
.menu-category li a { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 10px; align-items: center; padding: 12px 0; text-decoration: none; font-size: 14px; }
.menu-category li small { grid-column: 1; color: var(--muted); font-size: 11px; }
.menu-category li a > span:last-child { grid-column: 2; grid-row: 1/3; }
.nutrition-unresolved { font-size: 13px; padding: 12px; background: #fbefd8; border-radius: 10px; color: #785018; }
@media (max-width:640px) {
  .menu-categories { grid-template-columns: 1fr; gap: 12px; }
  .menu-category > summary { padding: 15px 16px; }
  .menu-coverage { font-size: 12px; }
}
.restaurant-card strong { text-transform: none; }
.menu-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; margin-top: 22px; }
.menu-card { border: 1px solid var(--line); border-radius: 24px; padding: 24px; background: var(--sheet); min-width: 0; }
.menu-card-head { display: flex; gap: 14px; align-items: center; }
.menu-card-head .food-illustration { width: 76px; height: 76px; flex: none; }
.menu-card h3 { font-family: Fraunces, Georgia, serif; color: var(--plum-deep); font-size: 25px; font-weight: 500; line-height: 1.2; margin: 0; }
.menu-card-head p { font-size: 13px; color: var(--muted); line-height: 1.5; margin: 6px 0 0; }
.carb-number { display: flex; align-items: center; gap: 20px; margin: 24px 0 6px; }
.carb-number strong { font-family: Fraunces, Georgia, serif; font-size: 54px; font-weight: 500; color: var(--plum); line-height: 1; }
.carb-number strong span { font-family: Figtree, sans-serif; font-size: 22px; }
.carb-number > span { font-size: 14px; max-width: 100px; line-height: 1.4; }
.nutrition-kind, .nutrition-source { font-size: 12px; color: var(--muted); }
.nutrition-source { display: block; margin-top: 14px; }
.menu-detail { border-top: 1px solid var(--line); margin-top: 20px; padding-top: 15px; }
.menu-detail summary { cursor: pointer; color: var(--plum-deep); font-weight: 600; font-size: 14px; }
.menu-detail p { font-size: 14px; line-height: 1.65; }
.nutrition-facts { display: flex; gap: 25px; font-size: 13px; margin: 18px 0; flex-wrap: wrap; }
.nutrition-facts dt { color: var(--muted); }
.nutrition-facts dd { margin: 5px 0 0; font-weight: 600; }
.table-scroll { overflow-x: auto; }
.menu-detail table { border-collapse: collapse; font-size: 12px; width: 100%; }
.menu-detail caption { text-align: left; font-weight: 600; margin-bottom: 10px; }
.menu-detail th, .menu-detail td { text-align: left; padding: 8px 4px; border-bottom: 1px solid var(--line); }
.gd-panel { padding: 30px; border-radius: 24px; background: #efe3ea; margin: 40px 0; scroll-margin-top: 24px; }
.gd-panel h2 { font-size: 30px; margin: 8px 0 12px; }
.gd-panel > p { line-height: 1.6; max-width: 780px; }
.gd-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; margin: 25px 0; }
.gd-steps div { display: grid; gap: 8px; }
.gd-steps span { color: var(--plum); font-size: 12px; }
.gd-steps strong { font-size: 16px; }
.gd-steps small { color: var(--muted); line-height: 1.5; }
@media (max-width: 640px) {
  .header-inner { flex-wrap: wrap; padding-block: 12px; row-gap: 7px; }
  .brand span { font-size: 24px; }
  .header-nav { width: 100%; margin-left: 0; padding-left: 46px; gap: 12px; justify-content: space-between; }
  .header-nav .header-link { display: inline; margin-left: 0; font-size: 12px; }
  .header-inner .descriptor { display: none; }
  .menu-grid { grid-template-columns: 1fr; gap: 14px; }
  .menu-card { padding: 20px; }
  .menu-card h3 { font-size: 23px; }
  .restaurant-intro { font-size: 16px; }
  .gd-panel { padding: 22px; }
  .gd-panel h2 { font-size: 27px; }
  .gd-steps { grid-template-columns: 1fr; gap: 20px; }
  .gd-steps div { grid-template-columns: 24px 1fr; gap: 4px 10px; }
  .gd-steps small { grid-column: 2; }
}

/* Menu-item pages: one order, its preparation questions, and a portioned GD idea. */
.item-directory { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin: 22px 0; }
.item-link-card { display: flex; gap: 18px; align-items: center; padding: 18px; background: var(--sheet); border: 1px solid var(--line); border-radius: 22px; text-decoration: none; }
.item-link-card:hover { border-color: var(--plum); }
.item-link-card .food-illustration { width: 82px; height: 90px; flex: none; }
.item-link-card h3 { font-size: 23px; margin: 0; }
.item-link-card p { margin: 0 0 12px; color: var(--muted); font-size: 14px; }
.item-link-card span { font-size: 12px; font-weight: 600; }
.item-page-head h1 { font-size: clamp(34px,4.5vw,52px); }
.item-page-head { grid-template-columns: minmax(0,1fr) 110px; gap: 24px; margin-bottom: 22px; }
.item-page-head .food-portrait { width: 100%; max-width: 100%; height: auto; aspect-ratio: 1; }
.item-page-head .food-portrait svg { width: 100%; max-width: 100%; height: auto; }
.item-page-head h1 { margin-bottom: 0; }
.item-answers { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-bottom: 22px; }
.item-answer { --answer-color: #785018; --answer-bg: #fbefd8; display: flex; flex-direction: column; padding: 22px 24px; border: 1px solid #d8bb89; border-top: 5px solid var(--answer-color); border-radius: 18px; background: var(--answer-bg); }
.item-answer-plan { --answer-color: #564666; --answer-bg: #eeebf2; border-color: #c9bfda; border-top-color: var(--answer-color); }
.item-answer-label { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.item-answer-label h2 { font: 600 13px/1.3 Figtree,sans-serif; letter-spacing: .2px; color: var(--answer-color); }
.item-answer-marker { display: inline-grid; place-items: center; width: 27px; height: 27px; border: 1px solid currentColor; border-radius: 50%; font-weight: 600; color: var(--answer-color); }
.item-answer .item-answer-status { font: 500 clamp(24px,2.6vw,29px)/1.16 Fraunces,Georgia,serif; letter-spacing: -.5px; margin: 10px 0 8px; color: var(--plum-deep); }
.item-answer-reason { font-size: 13px; font-weight: 600; color: var(--answer-color); margin: 0 0 12px; }
.dish-action { font-size: 13px; line-height: 1.5; margin: 0 0 16px; }
.dish-coverage-group { margin: 14px 0; }
.dish-coverage-group h3, .dish-counted-additions h4 { font: 600 11px/1.4 Figtree,sans-serif; color: var(--answer-color); margin: 0 0 7px; }
.dish-chips { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px; }
.dish-chip, .dish-chip-question { font-size: 12px; line-height: 1.35; border: 1px solid var(--line); border-radius: 10px; background: var(--sheet); max-width: 100%; overflow-wrap: anywhere; }
.dish-chip { padding: 5px 8px; }
.dish-chip-question summary { padding: 5px 8px; cursor: pointer; }
.dish-chip-question[open] { width: 100%; }
.dish-chip-question p { font-size: 12px; margin: 5px 8px 9px; }
.dish-counted-additions { margin-top: 10px; }
.dish-gap-source { font-size: 11px; color: var(--muted); margin: -2px 0 8px; }
.dish-gap-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.dish-gap-list li { font-size: 12px; line-height: 1.4; }
.dish-gap-list strong, .dish-gap-list span { display: block; }
.dish-gap-question summary { cursor: pointer; font-size: 12px; }
.dish-gap-question p { font-size: 12px; margin: 7px 0; }
.item-answer-questions { padding: 0; margin: 0 0 18px; list-style: none; display: grid; gap: 10px; }
.item-answer-questions li { font-size: 13px; line-height: 1.4; }
.item-answer-questions strong { display: block; font-size: 11px; color: var(--answer-color); margin-bottom: 2px; }
.item-answer-questions span { display: block; }
.item-answer-carbs { display: flex; align-items: center; gap: 14px; margin: 6px 0; }
.item-answer-carbs strong { font: 500 44px/1 Fraunces,Georgia,serif; color: var(--answer-color); white-space: nowrap; }
.item-answer-carbs small { font: 400 19px Figtree,sans-serif; }
.item-answer-carbs > span { font-size: 12px; }
.item-answer-serving { font-size: 13px; font-weight: 600; line-height: 1.4; margin: 4px 0; }
.item-answer-sauce { font-size: 13px; margin: 4px 0 8px; }
.item-answer-scope { font-size: 12px; color: var(--muted); margin: 4px 0; }
.item-answer-source { font-size: 11px; margin: 4px 0 16px; }
.item-answer-detail { margin-top: auto; padding-top: 10px; scroll-margin-top: 24px; }
.item-answer-detail > summary { font-size: 13px; font-weight: 600; cursor: pointer; color: var(--answer-color); }
.item-answer-detail[open] > summary { margin-bottom: 12px; }
.item-answer-questions a { display: inline-block; font-size: 12px; margin-top: 4px; }
.carb-fit-label { font-size: 11px; color: var(--answer-color); margin-top: 10px; }
.carb-fit-status { padding: 8px 11px; background: #e1dce9; color: #493d5b; border-radius: 9px; font-size: 14px; font-weight: 600; margin: 3px 0 6px; }
.carb-fit-status[data-state="within"] { background: #dcebdc; color: #265237; }
.carb-fit-status[data-state="below"], .carb-fit-status[data-state="incomplete"] { background: #fbebc7; color: #785018; }
.carb-fit-status[data-state="above"] { background: #f5deda; color: #8a302b; }
.carb-fit-limit { font-size: 11px; color: var(--muted); margin: 0 0 4px; }
.carb-fit-form { display: grid; gap: 12px; }
.carb-fit-form[hidden] { display: none; }
.carb-fit-instruction, .carb-fit-result { font-size: 12px; margin: 0; }
.carb-fit-result:empty { display: none; }
.carb-fit-order { display: grid; gap: 5px; font-size: 12px; }
.carb-fit-range { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 0; padding: 0; border: 0; }
.carb-fit-range legend { font-size: 12px; font-weight: 600; margin-bottom: 6px; }
.carb-fit-range label { display: grid; gap: 4px; font-size: 12px; }
.carb-fit-form input[type="number"], .carb-fit-order select { width: 100%; min-width: 0; border: 1px solid #b7abc6; border-radius: 7px; padding: 8px; background: var(--sheet); color: var(--ink); font: inherit; font-size: 14px; }
.carb-fit-order select { min-height: 44px; font-size: 16px; line-height: 1.4; }
.carb-fit-order option { font: inherit; }
.carb-fit-complete { display: flex; align-items: start; gap: 7px; font-size: 13px; }
.carb-fit-complete input { margin: 3px 0 0; }
.carb-fit-form button { justify-self: start; padding: 9px 14px; border: 0; border-radius: 8px; background: var(--plum); color: white; font: 600 13px Figtree,sans-serif; cursor: pointer; }
.carb-fit-form input:focus-visible, .carb-fit-complete input:focus-visible, .carb-fit-order select:focus-visible, .carb-fit-form button:focus-visible { outline: 3px solid var(--plum); outline-offset: 3px; }
.carb-fit-form input[aria-invalid="true"] { border-color: #8a302b; }
.item-crumbs { flex-wrap: wrap; }
.item-summary { display: flex; align-items: center; justify-content: space-between; gap: 25px; border-block: 1px solid var(--line); padding: 20px 0; margin-top: 25px; }
.item-summary p { margin: 5px 0 0; font-size: 15px; max-width: 690px; }
.item-scope { font-size: 12px; color: var(--muted); max-width: 150px; flex-shrink: 0; }
.item-explainer { max-width: 760px; color: var(--muted); line-height: 1.65; font-size: 15px; }
.item-check-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; margin-top: 20px; }
.item-prep-check { padding: 20px; background: var(--sheet); border: 1px solid var(--line); border-radius: 20px; }
.item-prep-check > div { display: flex; gap: 12px; align-items: center; }
.item-prep-check .food-illustration { width: 50px; height: 50px; }
.item-prep-check h3 { font-size: 21px; margin: 0; }
.item-prep-check p { font-size: 15px; }
.item-prep-check a { font-size: 13px; font-weight: 600; }
.item-nutrition { padding: 27px; border-radius: 23px; background: var(--sheet); border: 1px solid var(--line); }
.item-nutrition-detail { padding: 16px 20px; scroll-margin-top: 24px; }
.item-nutrition-detail > summary { cursor: pointer; font-size: 14px; font-weight: 600; color: var(--plum); }
.item-nutrition-content { padding-top: 4px; font-size: 14px; }
.nutrition-title { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.nutrition-title h2 { margin-top: 8px; }
.nutrition-title .food-illustration { width: 80px; height: 80px; }
.item-portion { font-size: 13px; color: var(--muted); }
.item-nutrient-strip { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; margin: 25px 0; }
.item-nutrient-strip dt { font-size: 12px; color: var(--muted); }
.item-nutrient-strip dd { font: 500 34px/1.4 Fraunces, Georgia, serif; margin: 3px 0 0; color: var(--plum); }
.item-nutrient-strip small { font: 400 14px Figtree,sans-serif; }
.item-gd > h2 { max-width: 730px; margin-top: 10px; }
.item-gd { margin: 20px 0; }
.item-gd .order-idea { margin: 0; }
.order-idea { display: grid; grid-template-columns: 1fr 150px; gap: 18px 30px; padding: 28px; background: #efe3ea; border-radius: 23px; margin: 24px 0; }
.order-idea h3 { font-size: 27px; margin: 10px 0; }
.order-idea p { font-size: 14px; margin: 10px 0; line-height: 1.5; }
.order-idea .order-qualifier { font-size: 13px; margin-bottom: 0; }
.order-idea .order-basis { font-size: 12px; color: var(--muted); }
.order-idea-total { align-self: center; text-align: center; }
.order-idea-total strong { display: block; font: 500 54px/1 Fraunces,Georgia,serif; color: var(--plum); }
.order-idea-total small { font: 400 20px Figtree,sans-serif; }
.order-idea-total > span { display: block; font-size: 12px; margin-top: 10px; }
.order-idea-detail { grid-column: 1/-1; border-top: 1px solid #d6c2cd; padding-top: 15px; }
.order-idea-detail summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--plum); }
.order-item-link { grid-column: 1/-1; font-size: 13px; font-weight: 600; }
.item-faq h2 { margin-bottom: 20px; }
@media (max-width:640px) {
  .item-page-head { grid-template-columns: minmax(0,1fr) 60px; gap: 10px; margin: 20px 0 18px; }
  .item-page-head h1 { font-size: 30px; margin-bottom: 0; }
  .item-answers { grid-template-columns: 1fr; gap: 12px; }
  .item-answer { padding: 16px 18px; }
  .item-answer .item-answer-status { font-size: 25px; }
  .item-answer-questions { gap: 8px; margin-bottom: 12px; }
  .item-answer-carbs strong { font-size: 38px; }
  .item-answer-source { margin-bottom: 12px; }
  .item-directory, .item-check-grid { grid-template-columns: 1fr; }
  .item-link-card { padding: 20px; gap: 14px; }
  .item-link-card .food-illustration { width: 60px; height: 65px; }
  .item-summary { display: block; }
  .item-scope { display: block; margin-top: 10px; max-width: none; }
  .item-nutrition { padding: 20px; }
  .item-nutrition-detail { padding: 14px 18px; }
  .nutrition-title .food-illustration { display: none; }
  .item-nutrient-strip { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .order-idea { padding: 18px; grid-template-columns: 1fr; gap: 12px; }
  .order-idea-total { text-align: left; display: flex; gap: 18px; align-items: center; }
  .order-idea-total strong { font-size: 42px; }
  .order-idea-total > span { margin: 0; }
  .item-prep-check h3 { font-size: 20px; }
}

.menu-variant-table th small { display:block; font-weight:400; font-size:.75rem; margin-top:.2rem; }
.item-caffeine { margin:.5rem 0 1rem; font-size:.8rem; color:var(--muted); }

.order-builder .carb-fit-order { margin-block: 12px; }

.restaurant-search {display:block;max-width:480px;font-weight:600;margin-block:24px 12px;}
.restaurant-search input {display:block;width:100%;min-height:44px;font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--ink);border-radius:10px;background:transparent;color:inherit;}
.restaurant-search input:focus-visible {outline:2px solid currentColor;outline-offset:3px;}
.restaurant-card[hidden] {display:none;}
/* Incident coverage stays independent of preparation answers and carb fit. */
.outbreak-area { margin: 0 0 18px; }
.outbreak-notice { color: #6b2e4e; font-size: .85rem; line-height: 1.5; }
.outbreak-notice > summary { cursor: pointer; }
.outbreak-notice > div { max-width: 760px; padding: 10px 0; }
.outbreak-notice p { white-space: pre-line; overflow-wrap: anywhere; }
.outbreak-warning { border-left: 3px solid #6b2e4e; background: #f5eaf0; padding: 14px 18px; margin-bottom: 12px; border-radius: 0 12px 12px 0; }
.outbreak-warning h2 { font: 600 1rem/1.4 Figtree, sans-serif; margin: 0 0 6px; }
.outbreak-warning p { font-size: .9rem; line-height: 1.5; margin: 6px 0; }
/* Official notice hub: scannable product cards with source evidence one tap away. */
.notice-icon { width: 18px; height: 18px; flex: 0 0 auto; vertical-align: middle; }
.notice-hero { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 40px; align-items: center; padding: 39px 0 26px; }
.notice-hero h1 { font-size: clamp(40px, 5vw, 58px); margin: 13px 0 17px; }
.notice-hero p { max-width: 620px; color: var(--muted); font-size: 17px; line-height: 1.65; margin: 0; }
.notice-hero-note { display: flex; gap: 9px; align-items: flex-start; margin-top: 22px; color: var(--plum); font-size: 12px; max-width: 540px; }
.notice-hero-note .notice-icon { margin-top: 1px; }
.notice-hero-art { height: 245px; position: relative; border-radius: 47% 45% 42% 47%; background: #f0e0e6; transform: rotate(3deg); }
.notice-art-caption { position: absolute; left: 48px; top: 89px; font: 500 29px/1.18 Fraunces, Georgia, serif; color: var(--plum); transform: rotate(-6deg); }
.notice-art-food { position: absolute; width: 88px; height: 88px; display: grid; place-items: center; background: var(--sheet); border: 1px solid #e6d1d9; border-radius: 23px; box-shadow: 0 5px 0 #6b2e4e0a; }
.notice-art-food .notice-food-icon { width: 72px; height: 72px; }
.notice-art-greens { top: -7px; left: 31px; transform: rotate(-16deg); }
.notice-art-cheese { top: -11px; right: -2px; transform: rotate(12deg); }
.notice-art-berries { bottom: -9px; left: 110px; transform: rotate(-8deg); }
.notice-art-spark { position: absolute; top: 16px; right: 67px; color: var(--plum); font-size: 31px; }
.notice-hub > .outbreak-notice { border-block: 1px solid var(--line); padding: 13px 0; font-size: 12px; }
.notice-hub > .outbreak-notice > summary { width: fit-content; }
.notice-hub > .outbreak-notice > div { max-width: none; padding-top: 15px; }
.notice-source-coverage { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.notice-source-coverage > div { border: 1px solid var(--line); border-radius: 12px; padding: 15px; background: var(--sheet); }
.notice-source-coverage h3 { font: 600 15px/1.3 Figtree, sans-serif; margin: 0; }
.notice-source-coverage p { font-size: 12px; line-height: 1.7; }
.notice-tools { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 17px 24px; margin: 29px 0 26px; }
.notice-search { display: block; flex: 1 1 310px; font-size: 12px; font-weight: 600; max-width: 440px; }
.notice-search > span { display: flex; gap: 10px; align-items: center; border: 1px solid #cbb7bf; background: var(--sheet); border-radius: 13px; padding: 0 13px; margin-top: 8px; color: var(--plum); }
.notice-search input { width: 100%; min-width: 0; min-height: 48px; border: 0; background: transparent; color: var(--ink); font: 400 14px/1.4 Figtree, sans-serif; outline: 0; }
.notice-search > span:focus-within { outline: 3px solid var(--plum); outline-offset: 3px; }
.notice-search input::placeholder { color: #796c72; opacity: 1; }
.notice-filters { display: flex; flex-wrap: wrap; gap: 7px; padding-bottom: 5px; }
.notice-filters button { display: inline-flex; align-items: center; gap: 6px; font: 600 12px/1.3 Figtree, sans-serif; min-height: 39px; border: 1px solid #d6c7cb; border-radius: 999px; background: transparent; color: var(--plum); padding: 9px 12px; cursor: pointer; }
.notice-filters button .notice-icon { width: 14px; height: 14px; }
.notice-filters button[aria-pressed="true"] { background: var(--plum); color: #fff8fb; border-color: var(--plum); }
.notice-filters button:hover { border-color: var(--plum); }
.notice-filters button:focus-visible { outline: 3px solid var(--plum); outline-offset: 3px; }
.notice-list-heading { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px 16px; margin: 27px 0 17px; }
.notice-list-heading h2 { font-size: 27px; }
.notice-list-heading p { font-size: 12px; color: var(--muted); margin: 0; }
.notice-empty { padding: 25px; border: 1px solid var(--line); border-radius: 16px; color: var(--muted); }
.official-notices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 17px; }
.official-notice { border: 1px solid #e1d1d7; border-radius: 20px; padding: 18px 19px 0; background: var(--sheet); overflow-wrap: anywhere; box-shadow: 0 3px 0 #6b2e4e04; }
.notice-card-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; min-height: 59px; }
.notice-food-icon { width: 60px; height: 60px; flex: 0 0 auto; }
.official-notice .notice-food-icon { background: #f6efe6; border-radius: 17px; padding: 3px; }
.official-notice h2 { font: 500 21px/1.3 Fraunces, Georgia, serif; letter-spacing: -.35px; min-height: 55px; margin: 0 0 13px; }
.official-notice h2 a { text-decoration: none; color: var(--plum-deep); }
.official-notice h2 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.official-notice p { font-size: 12px; line-height: 1.65; margin: 9px 0; }
.notice-label { display: inline-flex; align-items: center; gap: 6px; color: var(--plum); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .55px; }
.notice-label .notice-icon { width: 15px; height: 15px; }
.notice-date { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 13px; color: var(--muted); }
.notice-date > span { display: inline-flex; align-items: center; gap: 5px; }
.notice-date > span:first-child { font-weight: 600; color: var(--plum); }
.notice-date .notice-icon { width: 13px; height: 13px; }
.notice-status { display: flex; flex-wrap: wrap; gap: 6px; margin: 13px 0; }
.notice-status-chip { display: inline-flex; align-items: center; gap: 5px; border-radius: 7px; padding: 5px 7px; font-size: 12px; line-height: 1.3; background: #f4e6ec; color: #68354e; }
.notice-status-chip .notice-icon { width: 12px; height: 12px; }
.notice-status-ended { background: #ece8e3; color: #625b55; }
.notice-update { color: #735365; }
.notice-source-link { display: inline-flex; gap: 5px; align-items: center; font-size: 12px; font-weight: 600; text-decoration: none; margin: 10px 0 18px; }
.notice-source-link .notice-icon { width: 13px; height: 13px; }
.notice-evidence-panel { color: var(--muted); font-size: 12px; border-top: 1px solid var(--line); margin-top: 0; }
.notice-evidence-panel > summary { display: flex; justify-content: space-between; align-items: center; padding: 13px 0; cursor: pointer; color: var(--plum); font-size: 11px; font-weight: 600; list-style: none; }
.notice-evidence-panel > summary::-webkit-details-marker { display: none; }
.notice-evidence-panel > summary span { font-size: 18px; line-height: 1; }
.notice-evidence-panel[open] > summary span { transform: rotate(45deg); }
.notice-evidence-panel > div { padding-bottom: 17px; }
.notice-evidence-panel dl { display: grid; grid-template-columns: minmax(75px, 95px) minmax(0, 1fr); gap: 7px 10px; font-size: 11px; }
.notice-evidence-panel dt { font-weight: 600; color: var(--plum); }
.notice-evidence-panel dd { margin: 0; }
.notice-source-title a { font-size: 12px; }
.notice-evidence { overflow-wrap: anywhere; white-space: pre-line; }
.notice-excerpt { margin: 14px 0; }
.notice-excerpt > summary { cursor: pointer; color: var(--plum); font-weight: 600; }
.notice-evidence-panel > div > a { display: inline-flex; align-items: center; gap: 5px; }
.notice-guide-link { display: flex; align-items: center; justify-content: space-between; gap: 25px; border: 1px solid #dcc9d1; border-radius: 20px; padding: 24px 27px; background: #f1e4e9; margin-top: 36px; }
.notice-guide-link h2 { font-size: 25px; margin: 8px 0; }
.notice-guide-link p { color: var(--muted); font-size: 13px; max-width: 620px; margin: 0; }
.notice-guide-link > a { font-size: 12px; font-weight: 600; white-space: nowrap; }
[data-notice-tools][hidden], .official-notice[hidden], .notice-empty[hidden] { display: none; }
@media (max-width: 940px) {
  .official-notices { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .notice-hero { grid-template-columns: minmax(0,1fr) 210px; gap: 23px; }
  .notice-hero-art { height: 215px; }
  .notice-art-caption { left: 26px; top: 86px; font-size: 25px; }
  .notice-art-food { width: 72px; height: 72px; }
  .notice-art-food .notice-food-icon { width: 62px; height: 62px; }
  .notice-art-cheese { right: -8px; }
  .notice-art-berries { left: 91px; }
}
@media (max-width: 620px) {
  .notice-hero { grid-template-columns: 1fr; padding: 28px 0 22px; gap: 20px; }
  .notice-hero h1 { font-size: 40px; }
  .notice-hero p { font-size: 15px; }
  .notice-hero-art { display: none; }
  .notice-hero-note { font-size: 11px; margin-top: 18px; }
  .notice-tools { margin: 25px 0; gap: 15px; }
  .notice-search { flex-basis: 100%; max-width: none; }
  .notice-search input { font-size: 16px; }
  .notice-filters { gap: 6px; }
  .notice-filters button { font-size: 12px; padding: 9px 10px; }
  .notice-list-heading { margin-top: 20px; }
  .notice-list-heading h2 { font-size: 25px; }
  .notice-list-heading p { font-size: 11px; }
  .official-notices { grid-template-columns: 1fr; gap: 14px; }
  .official-notice { padding-inline: 18px; }
  .official-notice h2 { min-height: 0; font-size: 22px; }
  .notice-card-top { margin-bottom: 5px; }
  .notice-source-coverage { grid-template-columns: 1fr; }
  .notice-guide-link { display: block; padding: 21px; }
  .notice-guide-link > a { display: inline-block; margin-top: 17px; }
}