.recipes-page { min-height: 100vh; font-family: Arial, Helvetica, sans-serif; font-size: 14px; background: var(--background); }
.recipes-main { padding: 1.25rem 0 2.5rem; }
.recipes-title-row, .recipe-actions, .recipe-view-actions, .ingredients-heading, .form-actions { display: flex; align-items: center; gap: .65rem; }
.recipes-title-row { justify-content: space-between; margin-bottom: .4rem; }
.recipes-title-row h1 { margin: 0; font-size: 18px; }
.recipes-title-row .site-button { min-width: auto; cursor: pointer; font: inherit; }
.recipe-status { min-height: 1.55em; margin: 0 0 .75rem; color: var(--muted); }
.recipe-status.error { color: #ffd0da; }
.search-label, .recipes-main label { display: block; margin: .85rem 0 .25rem; font-weight: bold; }
.recipes-main input, .recipes-main textarea { width: 100%; padding: .5rem .55rem; color: var(--ink); background: var(--surface); border: 1px solid var(--line); border-radius: .2rem; font: inherit; }
.recipes-main textarea { resize: vertical; }
.recipes-main h2 { margin: 1.1rem 0 .65rem; font-size: 16px; }
.recipe-list { display: grid; gap: .55rem; }
.recipe-row { width: 100%; padding: .7rem .8rem; color: var(--ink); background: var(--surface); border: 1px solid var(--line); border-radius: .25rem; font: inherit; text-align: left; cursor: pointer; }
.recipe-row:hover { background: var(--surface-raised); border-color: var(--accent); }
.recipe-row-title { display: block; font-weight: bold; }
.recipe-row-meta, .recipe-help { color: var(--muted); font-size: 13px; }
.recipe-actions { justify-content: space-between; margin-bottom: 1rem; }
.button-secondary { padding: .45rem .7rem; color: var(--ink); background: transparent; border: 1px solid var(--accent); border-radius: .2rem; font: inherit; cursor: pointer; }
.button-secondary:hover { background: var(--surface-raised); }
.recipe-detail { max-width: 720px; }
.recipe-detail h1 { margin: 0 0 .4rem; font-size: 24px; }
.recipe-detail h2 { margin-top: 1.35rem; }
.recipe-meta { margin: 0; color: var(--muted); }
.recipe-detail ul, .recipe-detail ol { padding-left: 1.3rem; }
.recipe-detail li { margin: .45rem 0; }
.directions-display { white-space: pre-line; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 .7rem; }
.ingredients-heading { justify-content: space-between; margin-top: 1.1rem; }
.ingredients-heading h3 { margin: 0; font-size: 15px; }
.ingredient-row { display: grid; grid-template-columns: 5rem 5.5rem minmax(0, 1fr) minmax(0, 1fr) 2rem; gap: .4rem; align-items: end; margin: .45rem 0; }
.ingredient-row label { margin: 0; font-size: 12px; }
.remove-ingredient { padding: .45rem; color: var(--muted); background: transparent; border: 1px solid var(--line); border-radius: .2rem; cursor: pointer; }
.source-text { margin-top: 1rem; color: var(--muted); }
.source-text summary { cursor: pointer; }
.form-actions { margin-top: 1rem; }
.danger { border-color: #b66a7b; }
@media (max-width: 600px) { .form-grid { grid-template-columns: 1fr; } .ingredient-row { grid-template-columns: 4.2rem 4.6rem minmax(0, 1fr) 2rem; gap: .25rem; } .ingredient-row label:nth-child(4) { grid-column: 1 / -1; } }

@media print {
  @page { margin: .65in; }
  body.recipes-page { color: #111; background: #fff; font-family: Georgia, "Times New Roman", serif; font-size: 11pt; }
  .compact-header, .recipes-title-row, .recipe-status, .recipe-actions { display: none !important; }
  .recipes-main, .compact-width { width: auto; margin: 0; padding: 0; }
  #detail-view { display: block !important; }
  .recipe-detail { max-width: none; }
  .recipe-detail h1 { font-size: 22pt; }
  .recipe-detail h2 { margin-top: 1.1rem; font-size: 14pt; }
  .recipe-detail li { break-inside: avoid; }
}