/* Account controls are siblings of the recipe link, not nested buttons. */
.recipe-preference-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.recipe-preference-tools button { min-height: 44px; border: 1px solid var(--hairline); background: var(--paper); color: var(--accent-dark); }
.recipe-preference-tools [aria-pressed="true"] { background: var(--accent); color: var(--paper); }
.recipe-preference-tools [hidden], .recipe-card[hidden] { display: none; }
.recipe-card .open-recipe { padding-bottom: 58px; }
.favorite-btn {
  position: relative; z-index: 2; grid-column: 2; grid-row: 1; align-self: start;
  width: 44px; min-height: 44px; margin: 8px 10px 0 0; border: 1px solid var(--hairline); border-radius: 50%;
  color: var(--muted); background: var(--paper); font-size: 23px;
}
.favorite-btn.is-favorite { color: var(--alarm); }
.rating-row {
  position: relative; z-index: 2; grid-column: 1 / -1; grid-row: 2;
  display: flex; flex-wrap: wrap; gap: 4px; padding: 0 10px 8px 104px;
  /* Blank space over the image/card belongs to the recipe-opening button. */
  pointer-events: none;
}
.rating-row .rating-btn {
  pointer-events: auto;
  width: 44px; min-width: 44px; height: 44px; padding: 0; border: 0; border-radius: 8px;
  color: var(--muted); background: var(--paper); font-size: 24px; line-height: 1;
}
.rating-row .rating-btn.is-filled { color: #8b4a1e; }
.favorite-btn:disabled, .rating-btn:disabled { opacity: .55; cursor: wait; }
.favorite-btn:focus-visible, .rating-btn:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
@media (max-width: 480px) { .home { padding-top: max(76px, env(safe-area-inset-top)); } }
@media (max-width: 380px) { .rating-row { padding-left: 14px; } }