.potions-page {
  background:
    radial-gradient(circle at 88% 8%, rgba(183, 164, 245, 0.08), transparent 28rem),
    var(--color-ink-950);
}

.potions-page .section {
  padding-block: clamp(2.75rem, 6vw, 5rem);
}

.potions-hero {
  padding-block: clamp(2.75rem, 6vw, 5rem) clamp(3rem, 7vw, 5rem);
  background: linear-gradient(120deg, var(--color-ink-900), var(--color-ink-950));
  border-bottom: 1px solid var(--color-border);
}

.potions-hero__layout {
  display: grid;
  grid-template-columns: minmax(0, 54fr) minmax(0, 46fr);
  gap: var(--space-6);
  align-items: center;
}

.potions-hero__layout > * { min-width: 0; width: 100%; }
.potions-hero__copy { max-width: 35rem; display: flex; flex-direction: column; gap: var(--space-4); }
.potions-hero__copy > * { min-width: 0; margin: 0; }
.potions-hero__copy .eyebrow { margin-block-end: 0; }
.potions-hero__copy h1 { font-size: clamp(2rem, 5vw, 2.5rem); }
.potions-breadcrumb { display: flex; flex-wrap: wrap; gap: var(--space-2); color: var(--color-moon-300); font-size: var(--font-size-small); }
.potions-breadcrumb span:last-child { color: var(--color-moon-300); }
.potions-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); padding-top: var(--space-2); }
.potions-hero__actions > * { min-width: 0; }
.potions-hero__media { margin: 0; width: 100%; }
.potions-hero__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; filter: brightness(0.72) saturate(0.88); }
.potions-hero__media figcaption { padding-inline: var(--space-3); }

.potions-stats__heading, .potions-cycle__heading, .potions-mistakes__heading { max-width: 38.75rem; }

.potions-stats__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-6); }
.potions-stats__cards > * { min-width: 0; width: 100%; }
.potions-decision-card { position: relative; display: flex; min-height: 100%; flex-direction: column; gap: var(--space-3); padding: var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); transition: border-color var(--transition-fast), background-color var(--transition-fast); }
.potions-decision-card > * { margin: 0; min-width: 0; }
.potions-decision-card:hover, .potions-decision-card:focus { border-color: var(--color-amber-400); background: var(--color-ink-900); outline: none; }
.potions-decision-card--teal:hover, .potions-decision-card--teal:focus { border-color: var(--color-teal-400); }
.potions-decision-card--violet:hover, .potions-decision-card--violet:focus { border-color: var(--color-violet-300); }
.potions-step-number { color: var(--color-amber-400); font-family: var(--font-heading); font-size: 1.75rem; font-weight: 700; line-height: 1; }
.potions-decision-card--teal .potions-step-number { color: var(--color-teal-400); }
.potions-decision-card--violet .potions-step-number { color: var(--color-violet-300); }

.potions-gather { background: var(--color-ink-900); border-block: 1px solid var(--color-border); }
.potions-gather__heading { max-width: 41.25rem; }
.potions-gather__layout { display: grid; grid-template-columns: minmax(0, 64fr) minmax(0, 36fr); gap: var(--space-5); margin-top: var(--space-6); align-items: start; }
.potions-gather__layout > * { min-width: 0; width: 100%; }
.potions-gather__process { display: flex; max-width: 41.25rem; flex-direction: column; gap: var(--space-5); }
.potions-process-block { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: var(--space-3); }
.potions-process-block > * { min-width: 0; }
.potions-process-block__number { color: var(--color-amber-400); font-family: var(--font-heading); font-size: 1.25rem; font-weight: 700; line-height: 1.3; }
.potions-process-block--closing { padding-bottom: var(--space-4); border-bottom: 2px solid var(--color-teal-400); }
.potions-inline-tip { margin-bottom: 0; color: var(--color-amber-200); }
.potions-gather__side { display: flex; flex-direction: column; gap: var(--space-5); }
.potions-gather__side > * { min-width: 0; width: 100%; margin: 0; }
.potions-gather__image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: brightness(0.78); }
.potions-gather__tip { display: flex; flex-direction: column; gap: var(--space-3); }
.potions-gather__tip > * { margin: 0; min-width: 0; }
.potions-gather__tip .content-list { gap: var(--space-3); }

.potions-health__heading { max-width: 42rem; }
.potions-health__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-6); }
.potions-health__grid > * { min-width: 0; width: 100%; }
.potions-health__feature { grid-column: 1 / -1; display: flex; flex-direction: column; gap: var(--space-3); border-color: rgba(56, 197, 178, 0.45); background: linear-gradient(110deg, rgba(56, 197, 178, 0.08), var(--color-surface)); }
.potions-health__feature > *, .potions-health__card > * { margin: 0; min-width: 0; }
.potions-health__card { display: flex; flex-direction: column; gap: var(--space-3); }
.potions-text-link { display: inline-flex; width: fit-content; min-height: 2.75rem; align-items: center; gap: var(--space-2); font-weight: 700; }
.potions-warning { display: flex; max-width: 47.5rem; flex-direction: column; gap: var(--space-3); margin-top: var(--space-5); padding: var(--space-4) var(--space-5); border-left: 3px solid var(--color-red-400); background: rgba(242, 119, 119, 0.07); }
.potions-warning > * { margin: 0; min-width: 0; }

.potions-role-card { display: flex; flex-direction: column; gap: var(--space-3); }
.potions-role-card > * { margin: 0; min-width: 0; }
.potions-role-card--teal { border-top: 2px solid var(--color-teal-400); }
.potions-role-card--amber { border-top: 2px solid var(--color-amber-400); }
.potions-role-card--violet { border-top: 2px solid var(--color-violet-300); }
.potions-role-card__question { margin-top: auto; color: var(--color-moon-100); font-weight: 700; }

.potions-checks { background: linear-gradient(180deg, var(--color-ink-950), var(--color-ink-900)); }
.potions-checks__heading { max-width: 35rem; }
.potions-accordion { display: flex; width: min(100%, 51.25rem); flex-direction: column; gap: var(--space-3); margin-top: var(--space-6); }
.potions-accordion > * { min-width: 0; width: 100%; }
.potions-accordion__item { border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-ink-900); overflow: hidden; }
.potions-accordion__item h3 { margin: 0; }
.potions-accordion__trigger { display: flex; width: 100%; min-height: 3.25rem; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-3) var(--space-4); border: 0; background: transparent; color: var(--color-text); text-align: left; }
.potions-accordion__trigger > span:first-child { display: flex; min-width: 0; align-items: center; gap: var(--space-3); font-family: var(--font-heading); font-size: 1.25rem; font-weight: 700; line-height: 1.1; }
.potions-accordion__index { flex: 0 0 1.75rem; color: var(--color-amber-400); font-family: var(--font-body); font-size: var(--font-size-meta); }
.potions-accordion__index--violet { color: var(--color-violet-300); }
.potions-accordion__index--teal { color: var(--color-teal-400); }
.potions-accordion__chevron { flex: 0 0 1.5rem; color: var(--color-amber-400); font-size: 1.5rem; line-height: 1; text-align: center; transition: transform var(--transition-fast); }
.potions-accordion__trigger[aria-expanded="true"] .potions-accordion__chevron { transform: rotate(180deg); }
.potions-accordion__panel { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows 180ms ease-out, opacity 150ms ease-out; }
.potions-accordion__item.is-open .potions-accordion__panel { grid-template-rows: 1fr; opacity: 1; }
.potions-accordion__inner { min-height: 0; overflow: hidden; }
.potions-accordion__inner p { max-width: 42.5rem; margin: 0; padding: 0 var(--space-4) var(--space-4); }

.potions-cycle__layout { display: grid; grid-template-columns: minmax(0, 56fr) minmax(0, 44fr); gap: var(--space-6); margin-top: var(--space-6); align-items: center; }
.potions-cycle__layout > * { min-width: 0; width: 100%; }
.potions-route { position: relative; display: flex; flex-direction: column; gap: var(--space-5); }
.potions-route::before { position: absolute; top: 1.5rem; bottom: 1.5rem; left: 1rem; width: 1px; background: var(--color-slate-700); content: ""; }
.potions-route::after { position: absolute; top: 1.5rem; left: 1rem; width: 1px; height: 0; background: var(--color-amber-400); content: ""; }
.potions-route.is-drawn::after { height: calc(100% - 3rem); transition: height 900ms ease-out; }
.potions-route__stop { position: relative; display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: var(--space-4); }
.potions-route__stop > * { min-width: 0; }
.potions-route__marker { z-index: 1; display: grid; width: 2rem; height: 2rem; place-items: center; border: 1px solid rgba(242, 184, 75, 0.65); border-radius: 50%; background: var(--color-ink-900); color: var(--color-amber-200); font-family: var(--font-heading); font-weight: 700; }
.potions-route__marker--teal { border-color: rgba(56, 197, 178, 0.65); color: var(--color-teal-400); }
.potions-route__marker--amber { border-color: var(--color-amber-400); color: var(--color-amber-400); }
.potions-route__stop div { max-width: 22.5rem; }
.potions-route__stop h3 { margin-bottom: var(--space-2); }
.potions-route__stop p { margin-bottom: 0; }
.potions-cycle__media { margin: 0; width: 100%; }
.potions-cycle__media img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; filter: brightness(0.78); }
.potions-cycle__media figcaption { padding-inline: var(--space-3); }

.potions-mistakes { background: var(--color-ink-900); border-block: 1px solid var(--color-border); }
.potions-mistakes__list { display: flex; width: min(100%, 51.25rem); flex-direction: column; gap: var(--space-4); margin-top: var(--space-6); }
.potions-mistakes__list > * { min-width: 0; width: 100%; }
.potions-mistake { padding: 0; overflow: hidden; }
.potions-mistake__wrong, .potions-mistake__instead { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4) var(--space-5); }
.potions-mistake__wrong { background: rgba(242, 119, 119, 0.06); }
.potions-mistake__instead { border-top: 1px solid var(--color-border); }
.potions-mistake__instead--violet { border-left: 3px solid var(--color-violet-300); }
.potions-mistake__instead--teal { border-left: 3px solid var(--color-teal-400); }
.potions-mistake__wrong > *, .potions-mistake__instead > * { margin: 0; min-width: 0; }

.potions-next__summary { max-width: 38.75rem; }
.potions-summary-list { display: flex; flex-direction: column; gap: var(--space-3); margin-top: var(--space-5); }
.potions-summary-list li { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: var(--space-3); min-width: 0; }
.potions-summary-list li > * { min-width: 0; }
.potions-summary-list li > span { color: var(--color-amber-400); }
.potions-summary-list li:nth-child(2) > span { color: var(--color-teal-400); }
.potions-summary-list li:nth-child(3) > span { color: var(--color-violet-300); }
.potions-next__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-6); }
.potions-next__links > * { min-width: 0; width: 100%; }
.potions-guide-link { position: relative; display: flex; min-height: 100%; flex-direction: column; gap: var(--space-3); color: var(--color-text); text-decoration: none; }
.potions-guide-link > * { margin: 0; min-width: 0; }
.potions-guide-link:hover { color: var(--color-text); border-color: var(--color-amber-400); }
.potions-guide-link__arrow { margin-top: auto; color: var(--color-amber-400); font-size: 1.5rem; }
.potions-download { display: grid; grid-template-columns: minmax(0, 1fr) minmax(12rem, auto); gap: var(--space-5); margin-top: var(--space-6); border-color: rgba(242, 184, 75, 0.4); background: radial-gradient(circle at 85% 50%, rgba(242, 184, 75, 0.14), transparent 20rem), var(--color-ink-900); }
.potions-download > * { min-width: 0; }
.potions-download__copy { display: flex; max-width: 38.75rem; flex-direction: column; gap: var(--space-3); }
.potions-download__copy > * { margin: 0; min-width: 0; }
.potions-download__action { display: flex; width: 100%; flex-direction: column; align-items: flex-start; justify-content: center; gap: var(--space-2); }
.potions-download__action > * { min-width: 0; }

@media (max-width: 61.25rem) {
  .potions-hero__layout { grid-template-columns: 1fr; gap: var(--space-5); }
  .potions-hero__copy { max-width: 35rem; }
  .potions-hero__media { max-height: 25rem; }
  .potions-hero__media img { max-height: 22rem; }
  .potions-gather__layout { grid-template-columns: 1fr; }
  .potions-gather__process { max-width: 41.25rem; }
  .potions-gather__side { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-5); align-items: start; }
  .potions-cycle__layout { grid-template-columns: 1fr; }
  .potions-cycle__media { max-width: 46rem; }
}

@media (max-width: 56.25rem) {
  .potions-stats__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .potions-stats__cards > :last-child { grid-column: 1 / -1; }
}

@media (max-width: 47.5rem) {
  .potions-health__grid { grid-template-columns: 1fr; }
  .potions-health__feature { grid-column: auto; }
}

@media (max-width: 45rem) {
  .potions-next__links { grid-template-columns: 1fr; }
  .potions-download { grid-template-columns: 1fr; }
  .potions-download__action { align-items: flex-start; }
}

@media (max-width: 40rem) {
  .potions-stats__cards { grid-template-columns: 1fr; }
  .potions-stats__cards > :last-child { grid-column: auto; }
}

@media (max-width: 35.9375rem) {
  .potions-page .section { padding-block: 2.75rem; }
  .potions-hero { padding-block: 2.5rem 3rem; }
  .potions-hero__copy { gap: var(--space-3); }
  .potions-hero__copy h1 { font-size: 2rem; line-height: 1.125; }
  .potions-hero__actions { width: 100%; flex-direction: column; }
  .potions-hero__actions > * { width: 100%; }
  .potions-gather__side { grid-template-columns: 1fr; }
  .potions-process-block { grid-template-columns: 2.25rem minmax(0, 1fr); gap: var(--space-2); }
  .potions-health__feature, .potions-health__card { gap: var(--space-3); }
  .potions-warning { padding: var(--space-4); }
  .potions-accordion { width: 100%; }
  .potions-accordion__trigger { min-height: 3.5rem; padding: var(--space-3); }
  .potions-accordion__trigger > span:first-child { font-size: 1.125rem; }
  .potions-accordion__inner p { padding: 0 var(--space-3) var(--space-4); }
  .potions-mistake__wrong, .potions-mistake__instead { padding: var(--space-4); }
  .potions-download__action { align-items: stretch; }
  .potions-download__action .button { width: 100%; min-height: 3rem; }
}

@media (prefers-reduced-motion: reduce) {
  .potions-accordion__panel, .potions-route.is-drawn::after { transition: none; }
}