.premaculture-ecosystem-entry.has-open-farming-guide {
  row-gap: 0;
  border-radius: 0;
}

@media (min-width: 641px) {
  /* Keep the row background behind full, multiline portion identities. */
  .premaculture-ecosystem-entry:not(.premaculture-ecosystem-total):not(.is-dual-scope):not(.has-open-farming-guide)::before {
    height: max(calc(var(--ecosystem-artwork-size) * 0.82), calc(100% - 0.7rem));
  }

  .premaculture-ecosystem-list.Portions_design_1
    .premaculture-ecosystem-entry.Portions_design_1.has-open-farming-guide::before {
    top: calc((max(9rem, var(--ecosystem-artwork-size) + 0.7rem) - var(--ecosystem-artwork-size) * 0.82) / 2);
    bottom: 0;
    display: block;
    height: auto;
    transform: none;
  }

  .premaculture-ecosystem-list.Portions_design_1
    .premaculture-ecosystem-entry.has-open-farming-guide > .premaculture-essentiality-breakdown {
    top: calc(max(9rem, var(--ecosystem-artwork-size) + 0.7rem) / 2 + var(--ecosystem-artwork-size) * 0.41 - 0.75rem);
    bottom: auto;
  }
}

.premaculture-portion-inline-guide {
  grid-column: 1 / -1;
  grid-row: 2;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #f7f9f8;
  font-family: "DM Sans", Helvetica, Arial, sans-serif;
  padding: 0.2rem 1.5rem 1.35rem;
  animation: premaculture-farming-guide-unroll 180ms ease-out both;
}

.premaculture-portion-inline-guide *,
.premaculture-portion-inline-guide *::before,
.premaculture-portion-inline-guide *::after {
  box-sizing: border-box;
}

.premaculture-portion-guide-navigation {
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
}

.premaculture-portion-guide-toolbar {
  display: grid;
  grid-template-columns: 6.5rem minmax(0, 1fr);
  align-items: center;
  gap: 1.25rem;
  width: 100%;
  min-width: calc(var(--ecosystem-artwork-column) + 42rem);
  padding: 0.6rem 0;
}

.premaculture-portion-guide-tabs {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  min-width: 0;
}

.premaculture-portion-guide-toolbar h3 {
  width: max-content;
  justify-self: center;
  margin: 0;
  padding: 0;
  color: #fff;
  font: 700 0.82rem/1.4 "DM Sans", Helvetica, Arial, sans-serif;
  white-space: nowrap;
  text-align: center;
}

.premaculture-portion-guide-tabs > .premaculture-portion-guide-tab {
  appearance: none;
  min-width: 0;
  min-height: 2.5rem;
  margin: 0;
  padding: 0.35rem 0.2rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #fff;
  font: 500 0.74rem/1.4 "DM Sans", Helvetica, Arial, sans-serif;
  white-space: nowrap;
  text-align: center;
  opacity: 0.75;
  cursor: pointer;
}

.premaculture-portion-guide-tabs > .premaculture-portion-guide-tab[aria-selected="true"] {
  font-weight: 700;
  opacity: 1;
}

.premaculture-portion-guide-tabs > .premaculture-portion-guide-tab:hover {
  background: transparent;
  color: #fff;
  opacity: 1;
}

.premaculture-portion-guide-tab:focus-visible,
.premaculture-portion-inline-stage:focus-visible,
.premaculture-guide-items:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.7);
  outline-offset: -2px;
}

.premaculture-ecosystem-entry.Portions_design_1 .premaculture-portion-guide-toolbar {
  padding-left: calc(var(--ecosystem-artwork-column) + 0.45rem);
}

.premaculture-ecosystem-entry.Portions_design_1 .premaculture-portion-inline-stages {
  padding-left: var(--farming-guide-content-inset, calc(var(--ecosystem-artwork-column) + 0.45rem));
}

.premaculture-portion-inline-stage {
  min-width: 0;
  min-height: 4rem;
  padding: 0.4rem 0 0.7rem;
  border: 0;
}

.premaculture-portion-inline-stage[hidden] {
  display: none;
}

.premaculture-portion-inline-stage-content {
  min-width: 0;
}

.premaculture-portion-inline-stage-content p,
.premaculture-portion-inline-stage-content li {
  color: #fff;
  font: 500 0.74rem/1.55 "DM Sans", Helvetica, Arial, sans-serif;
}

.premaculture-portion-inline-stage-content p {
  margin: 0;
}

.premaculture-portion-inline-stage-content p + p {
  margin-top: 0.55rem;
}

.premaculture-portion-inline-stage-content .premaculture-guide-researched-note {
  color: #dce9e5;
}

.premaculture-guide-sources {
  margin: 0.55rem 0 0;
  padding-left: var(--farming-guide-content-inset, calc(var(--ecosystem-artwork-column) + 0.45rem));
  color: #dce9e5;
  font: 500 0.68rem/1.5 "DM Sans", Helvetica, Arial, sans-serif;
}

.premaculture-guide-sources a {
  color: #e8f5f0;
  text-decoration: underline;
  text-underline-offset: 0.13rem;
}

.premaculture-portion-inline-stage-content .premaculture-guide-list {
  grid-template-columns: minmax(0, 1fr);
  margin: 0;
  padding: 0 0 0 1rem;
  list-style: disc;
}

.premaculture-guide-list > li {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
}

.premaculture-portion-inline-stage-content li::marker {
  color: #fff;
}

.premaculture-guide-items {
  --guide-column-gap: 1.25rem;
  display: grid;
  grid-template-rows: repeat(var(--guide-row-count), auto);
  grid-auto-flow: column;
  grid-auto-columns: max(min(100%, 12rem), calc((100% - (var(--guide-visible-count) - 1) * var(--guide-column-gap)) / var(--guide-visible-count)));
  gap: 0.3rem var(--guide-column-gap);
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  margin-top: 1rem;
  padding-bottom: 0.4rem;
  color: #fff;
  font: 500 0.74rem/1.5 "DM Sans", Helvetica, Arial, sans-serif;
}

.premaculture-guide-item-column {
  display: grid;
  grid-row: span var(--guide-row-count);
  grid-template-rows: subgrid;
  align-items: baseline;
  min-width: 0;
  margin: 0;
}

.premaculture-sowing-data {
  font-weight: 700;
}

.premaculture-sowing-column {
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 0.55rem;
}

.premaculture-sowing-metric {
  display: contents;
}

.premaculture-sowing-metric dt,
.premaculture-sowing-metric dd {
  margin: 0;
  padding: 0;
}

.premaculture-sowing-metric dt {
  text-align: right;
  white-space: nowrap;
}

.premaculture-sowing-metric dd {
  min-width: 0;
  overflow-wrap: anywhere;
  text-align: left;
}

@keyframes premaculture-farming-guide-unroll {
  from {
    opacity: 0;
    clip-path: inset(0 0 100% 0);
    transform: translateY(-0.35rem);
  }
  to {
    opacity: 1;
    clip-path: inset(0);
    transform: translateY(0);
  }
}

@media (max-width: 640px) {
  .premaculture-ecosystem-list.Portions_design_1
    .premaculture-ecosystem-phone-row-shell:has(
      > .premaculture-ecosystem-entry.Portions_design_1.has-open-farming-guide
    ) {
    --farming-guide-row-background-top: calc(
      (9rem - var(--ecosystem-artwork-size) * 0.82) / 2
    );
    background-position: 0.35rem var(--farming-guide-row-background-top);
    background-size:
      calc(100% - 0.7rem)
      calc(100% - var(--farming-guide-row-background-top));
  }

  .premaculture-ecosystem-list.Portions_design_1
    .premaculture-ecosystem-entry.Portions_design_1.has-open-farming-guide {
    overflow-x: hidden;
    clip-path: none;
  }

  .premaculture-ecosystem-list.Portions_design_1
    .premaculture-ecosystem-phone-row-shell:has(
      > .premaculture-ecosystem-entry.Portions_design_1.has-open-farming-guide
    ) > .premaculture-ecosystem-phone-row-reveal {
    top: max(4.5rem, calc((var(--ecosystem-artwork-size) + 1.35rem) / 2));
  }

  .premaculture-ecosystem-entry.Portions_design_1 > .premaculture-portion-inline-guide {
    position: sticky;
    left: 0;
    width: min(100%, calc(100vw - 2rem));
    padding: 0.15rem 1rem 1.1rem;
  }

  .premaculture-ecosystem-entry.Portions_design_1 .premaculture-portion-guide-toolbar {
    min-width: 43rem;
    padding-left: 2.25rem;
  }

  .premaculture-portion-guide-toolbar h3 {
    justify-self: start;
  }

  .premaculture-portion-guide-tabs {
    grid-template-columns: repeat(6, 5.5rem);
  }

  .premaculture-guide-sources {
    padding-left: 2.25rem;
  }

}

@media (prefers-reduced-motion: reduce) {
  .premaculture-portion-inline-guide {
    animation: none;
  }
}
