* { box-sizing: border-box; }
[hidden] { display: none !important; }
:root {
  color-scheme: light;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  background: radial-gradient(ellipse at 15% 0%, #f5e9d9, transparent 65%), #e5d4bf;
  --ink: #463426;
  --green: #4f694d;
  --line: #e6d8c4;
  --muted: #6f5d4c;
  --surface: #f8efdf;
  --white: #fffaf1;
}
body { width: calc(100% - 32px); max-width: 1180px; margin: 24px auto; color: var(--ink); background: var(--white); font-size: 1rem; line-height: 1.55; border: 1px solid var(--line); border-radius: 20px; box-shadow: 0 18px 60px #62432924; }
.wrap { margin: auto; padding: 0 clamp(1rem, 3vw, 1.65rem); }
.masthead { border-bottom: 1px solid var(--line); }
.masthead-inner { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding-block: .85rem; flex-wrap: wrap; }
.brand { display: inline-flex; align-items: center; gap: .5rem; font: 600 clamp(1.18rem, 3.5vw, 1.55rem)/1.2 Georgia, serif; letter-spacing: .015em; }
.brand-pot { flex: none; width: clamp(2rem, 7vw, 3.25rem); height: auto; }
.personal-settings { position: relative; margin-left: auto; color: var(--ink); background: #f3e7d4; padding: .35rem .65rem; }
.personal-settings label { margin-top: .4rem; }
#default-servings { width: 5.5rem; }
#servings-settings-status { margin: .25rem 0 0; font-size: .8rem; }
#servings-settings-status:empty { display: none; }
main { padding-bottom: 4rem !important; }
#status:empty { display: none; }
#status, #welcome, #households, #library { margin-top: 1rem; }
h1, h2 { font-weight: 600; line-height: 1.15; }
h1 { font-size: clamp(1.85rem, 5vw, 2.4rem); letter-spacing: -.035em; margin: .2rem 0 .6rem; }
h2 { font-size: 1.25rem; }
a { color: var(--green); }
button, input, select, textarea { font: inherit; color: inherit; }
button, input, select, textarea { border: 1px solid var(--line); border-radius: 10px; background: var(--white); }
button, input, select { min-height: 44px; padding: .45rem .8rem; }
select { background: var(--surface); }
button { cursor: pointer; }
button:disabled { opacity: .55; cursor: default; }
button:hover:not(:disabled) { background: #f2e6d3; }
button.primary, button[aria-pressed="true"] { background: var(--green); border-color: var(--green); color: white; }
button.primary:hover:not(:disabled), button[aria-pressed="true"]:hover:not(:disabled) { background: #3d573b; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible {
  outline: 3px solid #9b603d;
  outline-offset: 3px;
}
#logout { color: var(--ink); }
label { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
input, select { max-width: 100%; }
summary { cursor: pointer; font-weight: 650; }
details { border: 1px solid var(--line); padding: .65rem .85rem; border-radius: .5rem; }
details details { margin: .65rem 0; }
.forms, .actions, .toolbar { display: flex; gap: .65rem; flex-wrap: wrap; align-items: center; }
.forms { margin-top: .7rem; }
.forms form { display: flex; flex-wrap: wrap; gap: .35rem; }
#invite-result { margin-top: .75rem; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; }
textarea { display: block; width: 100%; padding: .65rem; font-family: monospace; margin: .3rem 0 .65rem; }
.recipes { display: flex; flex-wrap: wrap; gap: .45rem; list-style: none; padding: 0; }
.planning { border-top: 1px solid var(--line); margin: 1.25rem 0; }
#pantry { display: flex; flex-wrap: wrap; gap: .4rem 1rem; margin-top: .6rem; }
#pantry input { min-height: 1rem; width: 1rem; accent-color: var(--green); }
#missing-groceries { display: flex; flex-wrap: wrap; gap: .4rem 1rem; margin: .6rem 0; }
#missing-groceries input { min-height: 1rem; width: 1rem; accent-color: var(--green); }
.menu-heading { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: .5rem 1rem; margin: 1.35rem 0 .8rem; }
.menu-heading h2 { font-size: clamp(1.65rem, 4vw, 2.15rem); letter-spacing: -.025em; margin: .2rem 0 0; }
#week-range { color: var(--green); font-size: .87rem; font-weight: 650; margin: 0; padding: .35rem .75rem; border-radius: 2rem; background: #efe1ca; }
#week, #future { display: grid; padding: 0; margin: 0; list-style: none; }
#week { border: 1px solid var(--line); background: var(--white); border-radius: .8rem; overflow: clip; }
.menu-day { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: .7rem; align-items: start; padding: .75rem 1rem; }
#week .menu-day + .menu-day { border-top: 1px solid var(--line); }
.menu-today { background: #efe0c9; box-shadow: inset 4px 0 #a8583a; }
.menu-date h3 { margin: 0; font-family: inherit; font-size: .98rem; }
.menu-date time { color: #6f5d4c; font-size: .84rem; }
.today-badge { display: inline-block; margin-left: .4rem; padding: .05rem .42rem; border-radius: 1rem; background: #a8583a; color: white; font-size: .72rem; }
.menu-day-content { min-width: 0; }
.menu-empty, .menu-event { margin: 0; font-size: .88rem; }
.menu-empty { color: #6f5d4c; }
.menu-event { color: var(--green); font-weight: 700; margin-bottom: .25rem; overflow-wrap: anywhere; }
.menu-meals { display: grid; gap: .35rem; padding: 0; margin: 0; list-style: none; }
.menu-meals > li { display: flex; align-items: start; justify-content: space-between; flex-wrap: wrap; gap: .3rem .65rem; padding: .35rem .5rem; border-radius: .45rem; background: #f7eddd; }
.menu-recipe-name { display: grid; justify-items: start; min-width: 0; }
.menu-recipe-identity, .deck-recipe-heading { display: flex; align-items: center; gap: .55rem; min-width: 0; }
.menu-thumbnail { width: 56px; height: 56px; flex: none; object-fit: cover; border-radius: .5rem; border: 1px solid var(--line); background: var(--surface); }
.deck-recipe-heading { margin-bottom: .25rem; }
.thumbnail-field { padding: .45rem .55rem; background: var(--surface); border-radius: .5rem; }
.thumbnail-field input { max-width: 100%; font-size: .85rem; }
.thumbnail-field span { color: var(--muted); font-size: .84rem; }
.menu-recipe-name button { border: 0; background: transparent; color: var(--green); font-weight: 700; padding: 0; min-height: 2rem; text-align: left; overflow-wrap: anywhere; }
.menu-recipe-actions { display: flex; align-items: start; flex-wrap: wrap; gap: .35rem; min-width: 0; }
.menu-recipe-actions > button, .menu-recipe-actions > details { background: transparent; border-color: transparent; font-size: .82rem; min-height: 2rem; padding: .28rem .45rem; }
.menu-recipe-actions > details[open] { border-color: var(--line); background: var(--white); }
.menu-add { border: 0; padding: 0; margin: .25rem 0 0; }
.menu-add summary { color: var(--ink); font-size: .87rem; display: list-item; width: fit-content; padding: .2rem .6rem; border-radius: 1rem; background: #efe1ca; list-style-position: inside; }
.menu-add[open] { padding-bottom: .15rem; }
.menu-add-recipe, .menu-other-plan { margin-top: .4rem; }
.menu-typed-meal { margin-top: .5rem; }
.menu-other-plan { font-size: .88rem; font-weight: 650; }
.menu-extras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.25rem; }
.menu-extra { border: 1px solid var(--line); border-radius: .8rem; background: var(--white); padding: .9rem 1rem; }
.menu-extra h2 { margin: 0 0 .6rem; }
.menu-extra p { margin: .35rem 0; color: #6f5d4c; }
.deck-panel { background: #f9f0e0; }
.deck-heading { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.deck-heading h2 { margin: 0; }
.deck-count, .deck-badge { border-radius: 2rem; padding: .16rem .55rem; font-size: .75rem; font-weight: 700; }
.deck-count { background: #efe4d2; color: #624d3b; }
.deck-card, .deck-empty { border: 1px solid var(--line); border-radius: .65rem; background: var(--white); padding: .7rem .8rem; min-width: 0; }
.deck-empty { color: #6f5d4c; font-size: .9rem; }
.deck-empty button { display: block; margin-top: .55rem; }
.deck-recipe { display: block; min-height: 2rem; padding: 0; border: 0; background: transparent; color: var(--green); font-weight: 750; text-align: left; overflow-wrap: anywhere; }
.deck-recipe:hover { text-decoration: underline; }
.deck-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; }
.deck-badge { color: #24533e; background: #e5edda; }
.deck-needs { color: #694615; background: #f8edd7; }
.deck-meta .deck-missing { flex-basis: 100%; margin: 0; font-size: .82rem; overflow-wrap: anywhere; }
.deck-actions { display: flex; flex-wrap: wrap; align-items: start; gap: .3rem .65rem; margin-top: .55rem; }
.deck-actions > button, .deck-cooked, .deck-schedule summary { min-height: 2.25rem; padding: .3rem .45rem; font-size: .85rem; }
.deck-actions > button { border-color: transparent; background: transparent; color: #6f5d4c; }
.deck-schedule { padding: 0; border-color: transparent; }
.deck-schedule summary { color: var(--green); }
.deck-schedule[open] { flex-basis: 100%; border-color: var(--line); padding: .15rem .45rem; }
.deck-cooked input { min-height: 1rem; accent-color: var(--green); }
#deck-suggestions h3 { font-family: inherit; font-size: .92rem; margin: .8rem 0 .35rem; }
#future { gap: .55rem; margin-top: .6rem; font-size: .88rem; }
#future .menu-day { display: block; background: #f8eddb; border-radius: .5rem; padding: .55rem .65rem; }
#future .menu-date { margin-bottom: .4rem; }
#future-form { margin-top: .55rem; }
@media (max-width: 36rem) {
  .tabs { gap: .3rem; }
  .tabs button { flex: 1; font-size: .85rem; padding-inline: .35rem; white-space: nowrap; }
  .menu-day { grid-template-columns: 5.8rem minmax(0, 1fr); padding: .65rem .6rem; }
  .today-badge { margin-left: .15rem; }
  .menu-extras { grid-template-columns: minmax(0, 1fr); }
}
.tabs { border-bottom: 1px solid var(--line); padding-bottom: .65rem; margin-bottom: .65rem; gap: .5rem; }
.tabs button:not([aria-pressed="true"]) { background: transparent; border-color: transparent; }
.tabs button:not([aria-pressed="true"]):hover { background: #f0e4d0; }
.recipe-cards { list-style: none; padding: 0; display: grid; gap: .5rem; }
.recipe-cards > li > p { margin: .3rem 0; }
.recipe-metadata { display: block; margin: .2rem 0 0 1rem; color: #624d3b; font-size: .875rem; font-weight: 400; }
.personal-settings label:not([hidden]) { display: flex; justify-content: space-between; gap: .5rem; }
.settings-panel { position: absolute; right: 0; top: calc(100% + .3rem); z-index: 10; width: min(23rem, calc(100vw - 2rem)); padding: .85rem; background: var(--paper, #fff8ec); border: 1px solid var(--line); border-radius: .65rem; box-shadow: 0 6px 18px #48352226; }
.settings-panel select, .settings-panel input { min-width: 0; max-width: 100%; }
.settings-panel .forms { flex-direction: column; align-items: stretch; }
.measurement-choice { font-size: .88rem; }
.step-order { border-top: 1px solid var(--line); padding-top: .45rem; }
.draft-sections { display: grid; gap: .65rem; margin: .8rem 0; }
.draft-sections section { padding: .65rem .8rem; border: 1px solid var(--line); border-radius: .5rem; }
.draft-sections h5 { font: 700 .94rem/1.4 system-ui, sans-serif; color: var(--green); margin: 0 0 .4rem; }
.draft-sections ul, .draft-sections ol { padding-left: 1.3rem; }
.draft-sections li + li, .draft-sections p + p { margin-top: .35rem; }
.draft-sections p { margin: 0; }
.recipe-entry { display: grid; gap: .85rem; margin-top: 1rem; }
.recipe-entry h2, .recipe-entry h3, .recipe-entry h4 { margin: 0; }
.recipe-entry .planning-panel { display: grid; gap: .65rem; }
.recipe-entry .planning-panel > button { justify-self: start; }
.recipe-entry ol, .recipe-entry ul { margin-block: .2rem; }
.recipe-entry textarea { min-width: 0; }
.entry-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: .65rem; }
.entry-fields label { display: grid; gap: .2rem; }
.recipe-entry fieldset { min-width: 0; border: 1px solid var(--line); border-radius: .5rem; }
.editor-main-fields { grid-template-columns: minmax(0, 1fr) repeat(2, minmax(7rem, 11rem)); }
@media (max-width: 36rem) {
  .editor-main-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .editor-main-fields label:first-child { grid-column: 1 / -1; }
}
.editor-details > .entry-fields { margin-top: .65rem; }
.manual-ingredient { display: grid; grid-template-columns: minmax(0, 1fr) 4.2rem; gap: .3rem .55rem; padding: .35rem 0; align-items: center; }
.manual-ingredient + .manual-ingredient { border-top: 1px solid var(--line); }
.ingredient-main-fields, .ingredient-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(3rem, 6rem) minmax(3rem, 6rem); gap: .35rem; }
.ingredient-columns { margin-right: 4.75rem; color: #624d3b; font-size: .78rem; }
.ingredient-main-fields label > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ingredient-main-fields label { display: grid; min-width: 0; color: #624d3b; font-size: .78rem; }
.ingredient-main-fields input { width: 100%; padding-inline: .4rem; font-size: .93rem; min-height: 2.25rem; }
.ingredient-options, .step-order details { padding: .3rem .4rem; font-size: .82rem; }
.ingredient-options[open] { grid-column: 1 / -1; }
.ingredient-options .entry-fields { margin-top: .45rem; }
.ingredient-options button { margin-top: .45rem; }
#add-ingredient, #add-step { margin-top: .5rem; }
.manual-step { margin-bottom: .5rem; padding: .45rem .55rem; }
.manual-step legend { color: var(--green); font-weight: 700; font-size: .85rem; }
.manual-step .toolbar { margin: .35rem 0 0; }
.step-order { gap: .3rem; }
.step-order > button { padding-inline: .45rem; min-height: 2rem; }
.step-order details[open] { flex-basis: 100%; }
.editor-footer { position: sticky; bottom: 0; padding: .55rem; background: #f7eddd; border: 1px solid var(--line); border-radius: .5rem; z-index: 1; }
#delete-recipe { margin-left: auto; color: #8d2c27; border-color: #cda29d; }
.recipe-group-items { margin: .5rem 0 0; }
:is(#all-recipes, #rare-recipes, #recipes) { gap: .25rem; }
:is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card] { padding: 0; margin: 0; }
:is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card] > summary {
  display: flex; align-items: center; gap: .55rem; padding: .4rem .65rem; min-width: 0;
}
:is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card] > summary::before { content: '▸'; color: var(--green); flex: none; }
:is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card][open] > summary::before { content: '▾'; }
:is(#all-recipes, #rare-recipes, #recipes) .recipe-card-name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
:is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card]:not([open]) .recipe-card-name,
:is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card]:not([open]) :is(.recipe-metadata, .last-made) {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
:is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card] > summary :is(.recipe-metadata, .last-made) { margin: 0; max-width: 32%; }
:is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card][open] > :not(summary) { margin-inline: .8rem; }
@media (max-width: 40rem) {
  .menu-thumbnail { width: 42px; height: 42px; }
  :is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card]:not([open]) > summary :is(.recipe-metadata, .last-made) { display: none; }
  :is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card][open] > summary { flex-wrap: wrap; }
  :is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card][open] .recipe-card-name { flex-basis: calc(100% - 1.5rem); }
  :is(#all-recipes, #rare-recipes, #recipes) [data-recipe-card][open] > summary :is(.recipe-metadata, .last-made) { max-width: 100%; }
}
@media (max-width: 36rem) {
  .ingredient-main-fields, .ingredient-columns { grid-template-columns: minmax(0, 1fr) 3rem 3rem; }
}
.step-editor { min-height: 3.2rem; padding: .55rem .65rem; border: 1px solid var(--line); border-radius: .45rem; background: var(--white); white-space: pre-wrap; overflow-wrap: anywhere; }
.ingredient-chip { display: inline-block; padding: .04rem .45rem; border-radius: .7rem; background: #e5edda; color: var(--green); font-size: .88em; font-weight: 700; }
.recipe-facts { display: flex; flex-wrap: wrap; gap: .25rem .8rem; color: #6f5d4c; font-size: .88rem; }
.recipe-facts p { margin: 0; }
.recipe-section-label { display: block; padding: .25rem .45rem; color: var(--green); font-size: .85rem; }
.last-made { color: #6f5d4c; font-size: .75rem; font-weight: 400; }
.day-plan { margin-block: .5rem; }
summary .last-made { display: block; margin-left: 1rem; }
.recipe-cards .toolbar { margin: .5rem 0; }
.planning-workspace { display: grid; gap: .9rem; margin-top: 1rem; }
.planning-links { display: flex; flex-wrap: wrap; gap: .4rem .75rem; }
#planning-shortcuts { margin-bottom: .65rem; gap: .35rem; }
#planning-shortcuts button { min-height: 2.25rem; padding: .25rem .65rem; font-size: .88rem; }
.planning-links a { padding: .25rem .65rem; background: #efe1ca; border-radius: 2rem; font-size: .85rem; font-weight: 650; }
.planning-panel { padding: clamp(.75rem, 2.5vw, 1.2rem); background: var(--white); border: 1px solid var(--line); border-radius: .8rem; min-width: 0; }
.planning-panel h2, .planning-panel > p { margin: 0 0 .55rem; }
.planning-panel > p { color: #6f5d4c; font-size: .9rem; }
.planning-heading { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
.planning-panel form { padding: .65rem; background: #f7eddd; border-radius: .5rem; }
#pantry, #matches { grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); align-items: start; }
#pantry > li, #matches > li { border: 1px solid var(--line); border-radius: .6rem; padding: .6rem .7rem; min-width: 0; }
#pantry h3 { margin: 0 0 .35rem; color: var(--green); font: 700 .92rem/1.4 system-ui, sans-serif; }
#pantry ul { list-style: none; margin: 0; padding: 0; }
#pantry ul li { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; justify-content: space-between; padding: .3rem 0; }
#pantry ul li + li { border-top: 1px solid var(--line); }
#pantry label { overflow-wrap: anywhere; }
#pantry button, #pantry select, #missing-groceries button { font-size: .82rem; min-height: 2rem; padding: .2rem .45rem; }
#matches details { border: 0; padding: 0; }
#matches summary .deck-badge { display: inline-block; margin: .3rem 0 .1rem 1rem; }
.match-breakdown { margin: .5rem 0 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .25rem .6rem; font-size: .83rem; }
.match-breakdown dt { color: #624d3b; font-weight: 700; }
.match-breakdown dd { margin: 0; overflow-wrap: anywhere; }
#missing-groceries { display: grid; gap: .35rem; }
#missing-groceries > div { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem; border: 1px solid var(--line); border-radius: .5rem; padding: .35rem .55rem; }
#missing-groceries > div:has(input:checked) { background: #efe0c9; border-color: #829e89; }
#missing-groceries label { flex: 1; overflow-wrap: anywhere; }
.grocery-actions { background: #f7eddd; padding: .6rem; border-radius: .5rem; }
#grocery-selected { color: #624d3b; font-size: .85rem; font-weight: 700; }
#ingredients li.done { color: #59645d; background: #edf3ec; }
#ingredients input { min-height: 1rem; accent-color: var(--green); }
#cook-jump { position: sticky; top: 0; z-index: 2; display: flex; flex-wrap: wrap; gap: .45rem; margin: .8rem 0; padding: .5rem; background: #f7eddd; border: 1px solid var(--line); border-radius: .55rem; }
#jump-step { background: var(--green); color: white; }
.cooking-active .recipe-grid { gap: .85rem; align-items: start; }
.cooking-active .cook-panel { min-width: 0; padding: .8rem; border: 1px solid var(--line); border-radius: .65rem; background: var(--white); }
.cook-panel-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .35rem; }
.cook-panel-heading h2 { margin: 0; }
.cooking-active #ingredients, .cooking-active #steps { list-style: none; padding: 0; margin: .6rem 0 0; }
.cooking-active #ingredients li { padding: 0; border-radius: .35rem; }
.cooking-active #ingredients li + li { border-top: 1px solid var(--line); }
.cooking-active #ingredients label { display: flex; flex-wrap: nowrap; align-items: start; width: 100%; padding: .55rem .45rem; cursor: pointer; }
.cooking-active #ingredients input, .cooking-active .step-check { flex: none; width: 1.2rem; height: 1.2rem; margin: .16rem 0 0; }
.cooking-active #steps li { border: 1px solid var(--line); border-radius: .5rem; padding: .65rem .55rem; }
.cooking-active #steps li.current { border-color: #78977d; box-shadow: inset .25rem 0 var(--green); }
.cooking-active .step-row { align-items: start; }
.cook-step-body { min-width: 0; }
.cook-step-state { display: block; color: #6f5d4c; font-size: .76rem; font-weight: 750; }
.current .cook-step-state { color: var(--green); }
.cooking-active .step-text { display: block; min-height: 0; padding: .25rem 0 0; font-size: 1.05rem; scroll-margin-block: 5rem; }
.current .step-text { font-weight: 650; }
#ingredients-heading, #steps-heading { scroll-margin-top: 5rem; }
#recipe { margin-top: 1.4rem; border: 1px solid var(--line); background: var(--white); border-radius: .75rem; padding: clamp(1rem, 4vw, 2.4rem); }
.eyebrow { margin: 0; color: var(--green); font-size: .84rem; font-weight: 700; letter-spacing: .08em; }
#servings-print { margin: .25rem 0 .75rem; }
.cook-controls { margin-top: .9rem; }
#servings { width: 6rem; }
.recipe-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 1.5rem; }
#ingredients, #steps { padding-left: 1.4rem; }
#ingredients li, #steps li { padding: .45rem .55rem; overflow-wrap: anywhere; }
#steps li + li { margin-top: .35rem; }
#steps li.current { background: #eaf0e1; box-shadow: inset .2rem 0 var(--green); border-radius: .3rem; }
#steps li.done { color: #59645d; background: #f1e8da; }
.step-row { display: flex; align-items: baseline; gap: .6rem; }
.step-text { border: 0; text-align: left; background: transparent; padding: 0; flex: 1; }
.step-check { min-height: auto; width: 1.15rem; height: 1.15rem; flex: none; margin: 0; accent-color: var(--green); }
.notes { background: #fff3ce; padding: .6rem 1.9rem; }
@media (max-width: 40rem) {
  body { width: 100%; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
  .tabs { flex-wrap: nowrap; gap: .3rem; overflow-x: auto; padding-inline: .2rem; }
  .tabs button { flex: 1 0 auto; font-size: .78rem; padding-inline: .38rem; white-space: nowrap; }
  .tabs button:focus-visible { outline-offset: -3px; }
  .recipe-grid { display: block; }
  .cooking-active .cook-panel + .cook-panel { margin-top: .8rem; }
}
@media print {
  body { width: auto; max-width: none; margin: 0; border: 0; box-shadow: none; background: white; color: black; font-size: 10pt; }
  .wrap { max-width: none; padding: 0; }
  .masthead, #status, #welcome, #households, #library, .cook-controls, #cook-jump, #ingredient-progress, #step-progress, .step-check, #ingredients input, #edit-current, .eyebrow { display: none !important; }
  #recipe { border: 0; margin: 0; padding: 0; }
  .recipe-grid { display: grid; }
  #steps li, #ingredients li { break-inside: avoid; color: black !important; background: transparent !important; box-shadow: none !important; }
  .cooking-active .cook-panel, .cooking-active #steps li, .cooking-active #ingredients li + li { border: 0; padding: 0; }
}

#menu-undo { border: 1px dashed #c7aa86; border-radius: .7rem; background: #fbf0da; padding: .45rem .7rem; }