/* Recipe card grid only. Colors match src tailwind tokens. */
.recipe-app .recipe-card {
  width: 760px;
  max-width: 760px;
  flex: 0 0 760px;
  transform-origin: top center;
  overflow: hidden;
  border-radius: 0 !important;
}

.recipe-app .recipe-card table {
  width: 100%;
  max-width: none;
  margin: 0;
  border-collapse: collapse;
  table-layout: fixed;
  text-align: left;
}

.recipe-app .recipe-card th,
.recipe-app .recipe-card td {
  border: 1px solid #e4bdc2;
  vertical-align: middle;
  padding: 10px 14px;
}

.dark .recipe-app .recipe-card th,
.dark .recipe-app .recipe-card td {
  border-color: #8f6f73;
}

.recipe-app .recipe-banner {
  text-align: center;
  font-family: Montserrat, sans-serif;
  font-weight: 600;
  font-size: 0.98rem;
  background: #fdf2f5;
  padding: 12px 10px;
}

.dark .recipe-app .recipe-banner {
  background: #3a2026;
  color: #f2f0f0;
}

.recipe-app .recipe-banner.title {
  font-size: 1.55rem;
  font-weight: 700;
  background: #b80049;
  color: #fff;
  padding: 16px 14px;
}

.recipe-app .recipe-ing {
  font-size: 0.92rem;
  line-height: 1.35;
  width: 48%;
}

.recipe-app .recipe-act {
  text-align: center;
  font-family: Montserrat, sans-serif;
  font-weight: 700;
  font-size: 0.78rem;
  color: #b80049;
  background: #fff8fa;
  width: 3.4rem;
  line-height: 1.3;
  padding: 8px 6px;
}

.dark .recipe-app .recipe-act {
  background: #2a171b;
  color: #ffb2be;
}

.recipe-app .recipe-act.final {
  background: #b80049;
  color: #fff;
  width: 7.25rem;
  padding: 10px 8px;
}

.recipe-app .step-head,
.recipe-app .act-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 3.2rem 3.2rem 36px;
  gap: 8px;
}

.recipe-app .step-head {
  padding: 0 0 4px;
  font-size: 0.7rem;
  font-weight: 600;
}

.recipe-app .step-head span { text-align: center; }

.recipe-app .row-item {
  display: grid;
  grid-template-columns: 2rem 1fr auto;
  gap: 8px;
  align-items: center;
}

.recipe-app .act-item { align-items: stretch; }
.recipe-app .recipe-editor[hidden] { display: none !important; }

.recipe-app .recipe-act-label {
  min-height: 52px;
  font-size: 0.8rem;
  line-height: 1.25;
}

@media print {
  @page { margin: 10mm; }

  html, body {
    background: #fff !important;
  }

  body * {
    visibility: hidden !important;
  }

  .recipe-card,
  .recipe-card * {
    visibility: visible !important;
  }

  .recipe-card {
    position: absolute !important;
    left: 0;
    top: 0;
    transform: none !important;
    margin: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

@media (max-width: 640px) {
  .recipe-app .step-head,
  .recipe-app .act-item {
    grid-template-columns: minmax(0, 1fr) 2.8rem 2.8rem 32px;
    gap: 6px;
  }
}