/* ===== Spreads list ===== */
.spreads-page__title {
  font-family: var(--font-logo);
  font-size: clamp(1.65rem, 4vw, 2.2rem);
  text-align: center;
  margin: 0 0 2rem;
  color: var(--color-ink);
}

.spreads-list {
  display: grid;
  gap: 1.25rem;
  max-width: 28rem;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}

.spreads-list__item {
  margin: 0;
}

.spread-card-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  width: 100%;
  padding: 1.35rem 1.5rem;
  border: 1px solid rgba(61, 46, 31, 0.25);
  border-radius: 10px;
  background: rgba(240, 230, 208, 0.65);
  color: var(--color-ink);
  font-family: var(--font-logo);
  font-size: 1.25rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  box-shadow: var(--shadow-soft);
  transition:
    transform var(--transition),
    border-color var(--transition),
    background var(--transition);
}

.spread-card-btn:hover,
.spread-card-btn:focus-visible {
  transform: translateY(-2px);
  border-color: var(--color-accent);
  background: rgba(248, 240, 224, 0.9);
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
}

.spread-card-btn__badge {
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--color-accent);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* ===== Spreads catalog ===== */
.spreads-featured {
  max-width: 28rem;
  margin: 0 auto 2.5rem;
}

.spreads-catalog {
  max-width: 42rem;
  margin: 0 auto;
  padding-top: 0.5rem;
  border-top: 1px dashed rgba(61, 46, 31, 0.2);
}

.spreads-catalog__title {
  margin: 0 0 1rem;
  font-family: var(--font-logo);
  font-size: clamp(1.35rem, 3vw, 1.65rem);
  font-weight: 600;
  text-align: center;
  color: var(--color-ink);
}

.spreads-catalog__day {
  margin: 0 auto 1.35rem;
  max-width: 36rem;
  padding: 0.85rem 1rem;
  border-radius: 8px;
  border: 1px solid rgba(107, 63, 42, 0.22);
  background: rgba(255, 252, 245, 0.72);
  font-size: 1.1rem;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
  color: var(--color-accent);
  box-shadow: var(--shadow-soft);
}

.spreads-catalog__filters-wrap {
  margin-bottom: 1.25rem;
}

.spread-catalog__list {
  display: grid;
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.spread-catalog__item--favorable .spread-catalog-card {
  border-color: rgba(107, 63, 42, 0.45);
  background: rgba(248, 240, 224, 0.92);
}

.spread-catalog-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  padding: 1rem 1.1rem 1.1rem;
  border: 1px solid rgba(61, 46, 31, 0.22);
  border-radius: 10px;
  background: rgba(240, 230, 208, 0.6);
  box-shadow: var(--shadow-soft);
}

.spread-catalog-card__title {
  margin: 0;
  padding-right: 4.5rem;
  font-family: var(--font-logo);
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--color-ink);
}

.spread-catalog-card__text {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.45;
  color: var(--color-ink-muted);
}

.spread-catalog-card__meta {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-catalog-card__badge {
  align-self: flex-start;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: rgba(107, 63, 42, 0.12);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.spread-catalog-card__status {
  position: absolute;
  top: 1rem;
  right: 1rem;
  font-family: var(--font-body);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-ink-muted);
}

.spread-catalog-card--link {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition:
    transform var(--transition),
    border-color var(--transition),
    background var(--transition);
}

.spread-catalog-card--link:hover,
.spread-catalog-card--link:focus-visible {
  transform: translateY(-2px);
  border-color: var(--color-accent);
  background: rgba(248, 240, 224, 0.92);
  outline: 2px solid var(--color-accent);
  outline-offset: 3px;
}

.spread-catalog-card__status--paid {
  color: var(--color-accent);
}

/* ===== Avos da Nebos spread ===== */
.spread-avos-nebos__intro {
  max-width: 36rem;
  margin: 0 auto 1.25rem;
  text-align: center;
}

.spread-avos-nebos__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-avos-nebos__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-avos-nebos__questions {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-avos-nebos__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-dela-dela__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-dela-dela__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-dela-dela__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-dela-dela__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-dela-dela__questions li {
  margin: 0.25rem 0;
}

.spread-dela-dela__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.dela-board {
  margin: 0 auto 2rem;
  max-width: 42rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
}

.dela-board__grid {
  display: grid;
  grid-template-columns: repeat(5, 6.75rem);
  grid-template-rows: auto auto auto;
  gap: 0.65rem 0.55rem;
  justify-content: center;
  margin: 0 auto;
}

.dela-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 6.75rem;
}

.dela-board__slot--2 {
  grid-column: 3;
  grid-row: 1;
}

.dela-board__slot--4 {
  grid-column: 1;
  grid-row: 2;
}

.dela-board__slot--3 {
  grid-column: 2;
  grid-row: 2;
}

.dela-board__slot--1 {
  grid-column: 3;
  grid-row: 2;
}

.dela-board__slot--5 {
  grid-column: 4;
  grid-row: 2;
}

.dela-board__slot--6 {
  grid-column: 5;
  grid-row: 2;
}

.dela-board__slot--7 {
  grid-column: 2;
  grid-row: 3;
}

.dela-board__slot--9 {
  grid-column: 3;
  grid-row: 3;
}

.dela-board__slot--8 {
  grid-column: 4;
  grid-row: 3;
}

.dela-board .spread-slot__frame {
  width: 100%;
  max-width: 6.75rem;
}

.dela-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.25rem;
}

.dela-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

@media (max-width: 520px) {
  .dela-board__grid {
    grid-template-columns: repeat(5, 5.5rem);
    gap: 0.5rem 0.4rem;
  }

  .dela-board__slot {
    width: 5.5rem;
  }

  .dela-board .spread-slot__frame {
    max-width: 5.5rem;
  }
}

.spread-merlin-stone__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-merlin-stone__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-merlin-stone__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-merlin-stone__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-merlin-stone__questions li {
  margin: 0.25rem 0;
}

.spread-merlin-stone__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-merlin-stone__variants {
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
}

.spread-merlin-stone__variant-label {
  display: block;
  margin: 0.65rem 0 0.35rem;
  font-size: 1rem;
  color: var(--color-ink-muted);
}

.spread-merlin-stone__variant-input {
  margin-bottom: 0.25rem;
}

.merlin-board {
  margin: 0 auto 2rem;
  max-width: 44rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
}

.merlin-board__grid {
  display: grid;
  grid-template-columns: 6.75rem 6.75rem 6.75rem 6.75rem;
  grid-template-rows: auto auto auto auto;
  gap: 0.65rem 0.55rem;
  justify-content: center;
  margin: 0 auto;
}

.merlin-board__col-head {
  margin: 0;
  font-family: var(--font-logo);
  font-size: calc(0.72rem + 3pt);
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
  color: var(--color-accent);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  transform: rotate(180deg);
  justify-self: center;
  align-self: end;
  max-height: 5.5rem;
}

.merlin-board__col-head--1 {
  grid-column: 2;
  grid-row: 1;
}

.merlin-board__col-head--2 {
  grid-column: 3;
  grid-row: 1;
}

.merlin-board__col-head--3 {
  grid-column: 4;
  grid-row: 1;
}

.merlin-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 6.75rem;
}

.merlin-board__slot--1 {
  grid-column: 2;
  grid-row: 2;
}

.merlin-board__slot--2 {
  grid-column: 3;
  grid-row: 2;
}

.merlin-board__slot--3 {
  grid-column: 4;
  grid-row: 2;
}

.merlin-board__slot--S {
  grid-column: 1;
  grid-row: 3;
  align-self: center;
}

.merlin-board__slot--4 {
  grid-column: 2;
  grid-row: 3;
}

.merlin-board__slot--5 {
  grid-column: 3;
  grid-row: 3;
}

.merlin-board__slot--6 {
  grid-column: 4;
  grid-row: 3;
}

.merlin-board__slot--7 {
  grid-column: 2;
  grid-row: 4;
}

.merlin-board__slot--8 {
  grid-column: 3;
  grid-row: 4;
}

.merlin-board__slot--9 {
  grid-column: 4;
  grid-row: 4;
}

.merlin-board .spread-slot__frame {
  width: 100%;
  max-width: 6.75rem;
}

.merlin-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.25rem;
}

.merlin-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.merlin-board__slot--S .spread-slot__label {
  font-size: 1.05rem;
}

@media (max-width: 520px) {
  .merlin-board__grid {
    grid-template-columns: 5.5rem 5.5rem 5.5rem 5.5rem;
    gap: 0.5rem 0.4rem;
  }

  .merlin-board__slot {
    width: 5.5rem;
  }

  .merlin-board .spread-slot__frame {
    max-width: 5.5rem;
  }

  .merlin-board__col-head {
    font-size: calc(0.65rem + 3pt);
    max-height: 4.5rem;
  }
}

.spread-tetra__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-tetra__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-tetra__intro-text--note {
  font-size: 1rem;
  color: var(--color-ink-muted);
}

.spread-tetra__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-tetra__points,
.spread-tetra__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-tetra__points li,
.spread-tetra__questions li {
  margin: 0.25rem 0;
}

.spread-tetra__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-tetra__options {
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
}

.spread-tetra__option-label {
  display: block;
  margin: 0.65rem 0 0.35rem;
  font-size: 1rem;
  color: var(--color-ink-muted);
}

.spread-tetra__option-input {
  margin-bottom: 0.25rem;
}

.tetra-board {
  margin: 0 auto 2rem;
  max-width: 32rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
}

.tetra-board__grid {
  display: grid;
  grid-template-columns: 6.75rem 6.75rem 6.75rem;
  grid-template-rows: auto auto auto;
  gap: 0.85rem 0.65rem;
  justify-content: center;
  margin: 0 auto;
}

.tetra-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 6.75rem;
}

.tetra-board__slot--1 {
  grid-column: 2;
  grid-row: 1;
}

.tetra-board__slot--4 {
  grid-column: 1;
  grid-row: 2;
}

.tetra-board__slot--S {
  grid-column: 2;
  grid-row: 2;
}

.tetra-board__slot--3 {
  grid-column: 3;
  grid-row: 2;
}

.tetra-board__slot--2 {
  grid-column: 2;
  grid-row: 3;
}

.tetra-board .spread-slot__frame {
  width: 100%;
  max-width: 6.75rem;
}

.tetra-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.25rem;
}

.tetra-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.tetra-board .spread-slot__role {
  margin: 0 0 0.2rem;
  font-size: 0.72rem;
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.tetra-board__slot--S .spread-slot__label {
  font-size: 1.05rem;
}

@media (max-width: 520px) {
  .tetra-board__grid {
    grid-template-columns: 5.5rem 5.5rem 5.5rem;
    gap: 0.65rem 0.45rem;
  }

  .tetra-board__slot {
    width: 5.5rem;
  }

  .tetra-board .spread-slot__frame {
    max-width: 5.5rem;
  }

  .tetra-board .spread-slot__role {
    font-size: 0.65rem;
  }
}

.spread-relation__subtitle {
  max-width: 40rem;
  margin: -0.35rem auto 1rem;
  font-size: 1.15rem;
  line-height: 1.45;
  text-align: center;
  color: var(--color-ink-muted);
}

.spread-relation__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-relation__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-relation__intro-text--note {
  font-size: 1rem;
  color: var(--color-ink-muted);
}

.spread-relation__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-relation__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-relation__questions li {
  margin: 0.25rem 0;
}

.spread-relation__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.relation-board {
  margin: 0 auto 2rem;
  max-width: 38rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.relation-board__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 5rem));
  column-gap: 0.35rem;
  row-gap: 0.5rem;
  justify-content: center;
  margin: 0 auto;
}

.relation-board__caption {
  margin: 0;
  font-size: 0.68rem;
  line-height: 1.3;
  text-align: center;
  color: var(--color-ink-muted);
}

.relation-board__caption--querent {
  grid-column: 1 / 3;
  grid-row: 1;
}

.relation-board__caption--bridge {
  grid-column: 4;
  grid-row: 1;
  font-family: var(--font-logo);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-accent);
}

.relation-board__caption--subject {
  grid-column: 6 / 8;
  grid-row: 1;
}

.relation-board__group-title {
  margin: 0;
  font-family: var(--font-logo);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-align: center;
  text-transform: uppercase;
  color: var(--color-accent);
}

.relation-board__group-title--querent {
  grid-column: 1;
  grid-row: 3;
}

.relation-board__group-title--subject {
  grid-column: 7;
  grid-row: 3;
}

.relation-board__group-hint {
  margin: 0;
  font-size: 0.72rem;
  text-align: center;
  color: var(--color-ink-muted);
}

.relation-board__group-hint--querent {
  grid-column: 1 / 4;
  grid-row: 5;
}

.relation-board__group-hint--subject {
  grid-column: 5 / 8;
  grid-row: 5;
}

.spread-sleep__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-sleep__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-sleep__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-sleep__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-sleep__questions li {
  margin: 0.25rem 0;
}

.spread-sleep__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.sleep-board {
  margin: 0 auto 2rem;
  max-width: 52rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.sleep-board__layout {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.65rem 0.45rem;
}

.sleep-board__block {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 5rem));
  gap: 0.5rem 0.35rem;
}

.sleep-board__tail {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
}

.sleep-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5rem;
}

.sleep-board .spread-slot__frame {
  width: 100%;
  max-width: 5rem;
}

.sleep-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.25rem;
}

.sleep-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.sleep-board .spread-slot__role {
  margin: 0 0 0.2rem;
  font-size: 0.72rem;
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.sleep-board__slot--S .spread-slot__label {
  font-size: 1rem;
}

@media (max-width: 520px) {
  .sleep-board__block {
    grid-template-columns: repeat(2, minmax(0, 4.1rem));
  }

  .sleep-board__slot {
    max-width: 4.1rem;
  }

  .sleep-board .spread-slot__frame {
    max-width: 4.1rem;
  }

  .sleep-board__tail {
    gap: 0.25rem;
  }

  .sleep-board .spread-slot__role {
    font-size: 0.65rem;
  }
}

.spread-celt__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-celt__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-celt__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-celt__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-celt__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-celt__questions li {
  margin: 0.25rem 0;
}

.spread-celt__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.celt-board {
  margin: 0 auto 2rem;
  max-width: 24rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.celt-board__layout {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.celt-board__cross {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 5rem));
  grid-template-rows: repeat(3, auto);
  column-gap: 0.35rem;
  row-gap: 0.5rem;
  justify-content: center;
  align-items: start;
}

.celt-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5rem;
  justify-self: center;
}

.celt-board__slot--3 {
  grid-column: 2 / 4;
  grid-row: 1;
}

.celt-board__slot--5 {
  grid-column: 1;
  grid-row: 2;
}

.celt-board__pair {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
  gap: 0.35rem;
  grid-column: 2 / 4;
  grid-row: 2;
}

.celt-board__pair .celt-board__slot {
  flex: 0 0 calc(50% - 0.175rem);
  max-width: calc(50% - 0.175rem);
}

.celt-board__slot--6 {
  grid-column: 4;
  grid-row: 2;
}

.celt-board__slot--4 {
  grid-column: 2 / 4;
  grid-row: 3;
}

.celt-board__staff {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
}

.celt-board .spread-slot__frame {
  width: 100%;
  max-width: 5rem;
}

.celt-board__pair .spread-slot__frame {
  max-width: 100%;
}

.celt-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.25rem;
}

.celt-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

@media (max-width: 520px) {
  .celt-board__cross {
    grid-template-columns: repeat(4, minmax(0, 4.1rem));
  }

  .celt-board__slot {
    max-width: 4.1rem;
  }

  .celt-board__pair .celt-board__slot {
    max-width: calc(50% - 0.15rem);
  }

  .celt-board .spread-slot__frame {
    max-width: 4.1rem;
  }

  .spread-celt__intro-text {
    font-size: 1rem;
  }
}

.relation-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5rem;
  justify-self: center;
}

.relation-board__slot--top-left {
  grid-column: 2;
  grid-row: 2;
}

.relation-board__slot--bridge {
  grid-column: 4;
  grid-row: 2;
}

.relation-board__slot--top-right {
  grid-column: 6;
  grid-row: 2;
}

.relation-board__slot--pos1 {
  grid-column: 1;
  grid-row: 4;
}

.relation-board__slot--pos2 {
  grid-column: 2;
  grid-row: 4;
}

.relation-board__slot--pos3 {
  grid-column: 3;
  grid-row: 4;
}

.relation-board__slot--pos4 {
  grid-column: 5;
  grid-row: 4;
}

.relation-board__slot--pos5 {
  grid-column: 6;
  grid-row: 4;
}

.relation-board__slot--pos6 {
  grid-column: 7;
  grid-row: 4;
}

.relation-board .spread-slot__frame {
  width: 100%;
  max-width: 5rem;
}

.relation-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.25rem;
}

.relation-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.relation-board__slot--pos1 .spread-slot__label,
.relation-board__slot--pos6 .spread-slot__label {
  font-size: 1rem;
}

@media (max-width: 520px) {
  .relation-board__grid {
    grid-template-columns: repeat(7, minmax(0, 4.1rem));
    column-gap: 0.25rem;
  }

  .relation-board__slot {
    max-width: 4.1rem;
  }

  .relation-board .spread-slot__frame {
    max-width: 4.1rem;
  }

  .relation-board__caption {
    font-size: 0.6rem;
  }

  .relation-board__group-title {
    font-size: 0.82rem;
  }
}

.spread-brack__subtitle {
  max-width: 40rem;
  margin: -0.35rem auto 1rem;
  font-size: 1.15rem;
  line-height: 1.45;
  text-align: center;
  color: var(--color-ink-muted);
}

.spread-brack__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-brack__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-brack__intro-text--note {
  font-size: 1rem;
  color: var(--color-ink-muted);
}

.spread-brack__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-brack__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-brack__questions li {
  margin: 0.25rem 0;
}

.spread-brack__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.brack-jealousy-board {
  margin: 0 auto 2rem;
  max-width: 50rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.brack-jealousy-board__layout {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 1.25rem 1.5rem;
}

.brack-jealousy-board__grid {
  display: grid;
  grid-template-columns: 5.75rem 5.75rem 5.75rem;
  grid-template-rows: auto auto auto;
  gap: 0.55rem 0.45rem;
  justify-content: center;
}

.brack-jealousy-board__stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding-top: 2rem;
}

.brack-jealousy-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 5.75rem;
}

.brack-jealousy-board__grid--left .brack-jealousy-board__slot--7 {
  grid-column: 2;
  grid-row: 1;
}

.brack-jealousy-board__grid--left .brack-jealousy-board__slot--11 {
  grid-column: 3;
  grid-row: 1;
}

.brack-jealousy-board__grid--left .brack-jealousy-board__slot--6 {
  grid-column: 1;
  grid-row: 2;
}

.brack-jealousy-board__grid--left .brack-jealousy-board__slot--S1 {
  grid-column: 2;
  grid-row: 2;
}

.brack-jealousy-board__grid--left .brack-jealousy-board__slot--5 {
  grid-column: 3;
  grid-row: 2;
}

.brack-jealousy-board__grid--left .brack-jealousy-board__slot--9 {
  grid-column: 1;
  grid-row: 3;
}

.brack-jealousy-board__grid--left .brack-jealousy-board__slot--8 {
  grid-column: 2;
  grid-row: 3;
}

.brack-jealousy-board__grid--left .brack-jealousy-board__slot--10 {
  grid-column: 3;
  grid-row: 3;
}

.brack-jealousy-board__grid--right .brack-jealousy-board__slot--4 {
  grid-column: 2;
  grid-row: 1;
}

.brack-jealousy-board__grid--right .brack-jealousy-board__slot--1 {
  grid-column: 1;
  grid-row: 2;
}

.brack-jealousy-board__grid--right .brack-jealousy-board__slot--S2 {
  grid-column: 2;
  grid-row: 2;
}

.brack-jealousy-board__grid--right .brack-jealousy-board__slot--2 {
  grid-column: 3;
  grid-row: 2;
}

.brack-jealousy-board__grid--right .brack-jealousy-board__slot--3 {
  grid-column: 2;
  grid-row: 3;
}

.brack-jealousy-board .spread-slot__frame {
  width: 100%;
  max-width: 5.75rem;
}

.brack-jealousy-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.2rem;
}

.brack-jealousy-board .spread-slot__label {
  margin: 0 0 0.3rem;
  font-family: var(--font-logo);
  font-size: 0.88rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.brack-jealousy-board__slot--S1 .spread-slot__label,
.brack-jealousy-board__slot--S2 .spread-slot__label {
  font-size: 0.95rem;
}

@media (min-width: 900px) {
  .brack-jealousy-board__layout {
    flex-wrap: nowrap;
    align-items: center;
  }
}

@media (max-width: 520px) {
  .brack-jealousy-board__grid {
    grid-template-columns: 4.75rem 4.75rem 4.75rem;
    gap: 0.45rem 0.35rem;
  }

  .brack-jealousy-board__slot {
    width: 4.75rem;
  }

  .brack-jealousy-board .spread-slot__frame {
    max-width: 4.75rem;
  }

  .brack-jealousy-board__stack {
    padding-top: 1.25rem;
  }
}

.spread-brack-full__subtitle {
  max-width: 40rem;
  margin: -0.35rem auto 1rem;
  font-size: 1.15rem;
  line-height: 1.45;
  text-align: center;
  color: var(--color-ink-muted);
}

.spread-brack-full__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-brack-full__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-brack-full__intro-text--note {
  font-size: 1rem;
  color: var(--color-ink-muted);
}

.spread-brack-full__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-brack-full__intro-question {
  margin: 0 0 0.65rem;
  padding: 0.65rem 0.85rem;
  border-left: 3px solid var(--color-accent);
  font-size: 1.05rem;
  line-height: 1.55;
  font-style: italic;
  color: var(--color-ink-muted);
}

.spread-brack-full__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-brack-full__questions li {
  margin: 0.25rem 0;
}

.spread-brack-full__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.brack-board {
  margin: 0 auto 2rem;
  max-width: 52rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.brack-board__layout {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 1.25rem 1.5rem;
}

.brack-board__cluster {
  flex: 0 0 auto;
}

.brack-board__grid {
  display: grid;
  grid-template-columns: 5.75rem 5.75rem 5.75rem;
  grid-template-rows: auto auto auto auto;
  gap: 0.55rem 0.45rem;
  justify-content: center;
}

.brack-board__stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  padding-top: 2.5rem;
}

.brack-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 5.75rem;
}

.brack-board__grid--left .brack-board__slot--S1 {
  grid-column: 2;
  grid-row: 1;
}

.brack-board__grid--left .brack-board__slot--13 {
  grid-column: 2;
  grid-row: 2;
}

.brack-board__grid--left .brack-board__slot--11 {
  grid-column: 1;
  grid-row: 3;
}

.brack-board__grid--left .brack-board__slot--10 {
  grid-column: 3;
  grid-row: 3;
}

.brack-board__grid--left .brack-board__slot--12 {
  grid-column: 2;
  grid-row: 4;
}

.brack-board__grid--right .brack-board__slot--S2 {
  grid-column: 2;
  grid-row: 1;
}

.brack-board__grid--right .brack-board__slot--8 {
  grid-column: 1;
  grid-row: 2;
}

.brack-board__grid--right .brack-board__slot--9 {
  grid-column: 3;
  grid-row: 2;
}

.brack-board__grid--right .brack-board__slot--2 {
  grid-column: 1;
  grid-row: 3;
}

.brack-board__grid--right .brack-board__slot--6 {
  grid-column: 2;
  grid-row: 3;
}

.brack-board__grid--right .brack-board__slot--3 {
  grid-column: 3;
  grid-row: 3;
}

.brack-board__grid--right .brack-board__slot--4 {
  grid-column: 1;
  grid-row: 4;
}

.brack-board__grid--right .brack-board__slot--5 {
  grid-column: 3;
  grid-row: 4;
}

.brack-board .spread-slot__frame {
  width: 100%;
  max-width: 5.75rem;
}

.brack-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.2rem;
}

.brack-board .spread-slot__label {
  margin: 0 0 0.3rem;
  font-family: var(--font-logo);
  font-size: 0.88rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.brack-board__slot--S1 .spread-slot__label,
.brack-board__slot--S2 .spread-slot__label {
  font-size: 0.95rem;
}

@media (min-width: 900px) {
  .brack-board__layout {
    flex-wrap: nowrap;
    align-items: center;
  }
}

@media (max-width: 520px) {
  .brack-board__grid {
    grid-template-columns: 4.75rem 4.75rem 4.75rem;
    gap: 0.45rem 0.35rem;
  }

  .brack-board__slot {
    width: 4.75rem;
  }

  .brack-board .spread-slot__frame {
    max-width: 4.75rem;
  }

  .brack-board__stack {
    padding-top: 1.5rem;
  }
}

.spread-wheel__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-wheel__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-wheel__intro-text--note {
  font-size: 1rem;
  color: var(--color-ink-muted);
}

.spread-wheel__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-wheel__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-wheel__questions li {
  margin: 0.25rem 0;
}

.spread-wheel__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-2soul__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-2soul__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-2soul__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-2soul__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-2soul__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-2soul__questions li {
  margin: 0.25rem 0;
}

.spread-2soul__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-lovepath__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-lovepath__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-lovepath__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-lovepath__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-lovepath__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-lovepath__questions li {
  margin: 0.25rem 0;
}

.spread-lovepath__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-lovepath__scheme {
  margin: 0.75rem 0 0;
  font-family: var(--font-logo);
  font-size: 0.95rem;
  letter-spacing: 0.08em;
  text-align: center;
  color: var(--color-accent);
}

.spread-familycircle7__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-familycircle7__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-familycircle7__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-familycircle7__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-familycircle7__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-familycircle7__questions li {
  margin: 0.25rem 0;
}

.spread-familycircle7__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.familycircle7-board {
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.familycircle7-board__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 5rem));
  grid-template-rows: repeat(3, auto);
  column-gap: 0.65rem;
  row-gap: 0.55rem;
  justify-content: center;
  align-items: start;
}

.familycircle7-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5rem;
  justify-self: center;
}

/* Верх/низ — в «промежутках» между 3, 4 и 5 */
.familycircle7-board__slot--1 {
  grid-column: 2;
  grid-row: 1;
}

.familycircle7-board__slot--2 {
  grid-column: 4;
  grid-row: 1;
}

.familycircle7-board__slot--3 {
  grid-column: 1;
  grid-row: 2;
}

.familycircle7-board__slot--4 {
  grid-column: 3;
  grid-row: 2;
}

.familycircle7-board__slot--5 {
  grid-column: 5;
  grid-row: 2;
}

.familycircle7-board__slot--6 {
  grid-column: 2;
  grid-row: 3;
}

.familycircle7-board__slot--7 {
  grid-column: 4;
  grid-row: 3;
}

.familycircle7-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  min-height: 3em;
  margin: 0 0 0.2rem;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.familycircle7-board__slot--1 .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

.familycircle7-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.familycircle7-board .spread-slot__frame {
  width: 100%;
  max-width: 5rem;
}

.familycircle7-board .spread-slot__reading {
  width: 100%;
  max-width: 5rem;
  margin-top: 0.25rem;
}

@media (max-width: 520px) {
  .familycircle7-board__grid {
    grid-template-columns: repeat(5, minmax(0, 4.25rem));
    column-gap: 0.45rem;
  }

  .familycircle7-board__slot {
    max-width: 4.25rem;
  }

  .familycircle7-board .spread-slot__frame {
    max-width: 4.25rem;
  }

  .familycircle7-board .spread-slot__role {
    min-height: 3.2em;
    font-size: calc(0.58rem + 3px);
  }
}

.spread-familycircle__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-familycircle__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-familycircle__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-familycircle__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-familycircle__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-familycircle__questions li {
  margin: 0.25rem 0;
}

.spread-familycircle__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-bizdesi__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-bizdesi__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-bizdesi__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-bizdesi__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-bizdesi__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-bizdesi__questions li {
  margin: 0.25rem 0;
}

.spread-bizdesi__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-bizdesi2__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-bizdesi2__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-bizdesi2__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-bizdesi2__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-bizdesi2__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-bizdesi2__questions li {
  margin: 0.25rem 0;
}

.spread-bizdesi2__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.bizdesi2-board {
  position: relative;
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding: 1.5rem 0 0.5rem;
}

.bizdesi2-board__legend {
  position: absolute;
  top: 0;
  margin: 0;
  font-family: var(--font-logo);
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-accent);
  opacity: 0.85;
}

.bizdesi2-board__legend--a {
  left: 50%;
  transform: translateX(calc(-100% - 3.5rem));
}

.bizdesi2-board__legend--b {
  left: 50%;
  transform: translateX(3.5rem);
}

.bizdesi2-board__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 5rem));
  grid-template-rows: repeat(2, auto);
  column-gap: 0.65rem;
  row-gap: 0.55rem;
  justify-content: center;
  align-items: start;
}

.bizdesi2-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5rem;
  justify-self: center;
}

.bizdesi2-board__slot--2 {
  grid-column: 2;
  grid-row: 1;
}

.bizdesi2-board__slot--1 {
  grid-column: 1;
  grid-row: 2;
}

.bizdesi2-board__slot--3 {
  grid-column: 2;
  grid-row: 2;
}

.bizdesi2-board__slot--4 {
  grid-column: 3;
  grid-row: 2;
}

.bizdesi2-board__slot--5 {
  grid-column: 4;
  grid-row: 2;
}

.bizdesi2-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  min-height: 2.5em;
  margin: 0 0 0.2rem;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.bizdesi2-board__slot--key .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

.bizdesi2-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.bizdesi2-board .spread-slot__frame {
  width: 100%;
  max-width: 5rem;
}

.bizdesi2-board .spread-slot__reading {
  width: 100%;
  max-width: 5rem;
  margin-top: 0.25rem;
}

@media (max-width: 520px) {
  .bizdesi2-board__grid {
    grid-template-columns: repeat(4, minmax(0, 4.25rem));
    column-gap: 0.45rem;
  }

  .bizdesi2-board__slot {
    max-width: 4.25rem;
  }

  .bizdesi2-board .spread-slot__frame {
    max-width: 4.25rem;
  }

  .bizdesi2-board .spread-slot__role {
    min-height: 2.75em;
    font-size: calc(0.58rem + 3px);
  }

  .bizdesi2-board__legend--a {
    transform: translateX(calc(-100% - 2.75rem));
  }

  .bizdesi2-board__legend--b {
    transform: translateX(2.75rem);
  }
}

.spread-choise__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-choise__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-choise__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-choise__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-choise__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-choise__questions li {
  margin: 0.25rem 0;
}

.spread-choise__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.choise-board {
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.choise-board__head {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 5.5rem));
  column-gap: 2rem;
  justify-content: center;
  margin-bottom: 0.5rem;
}

.choise-board__col-title {
  margin: 0;
  font-family: var(--font-logo);
  font-size: 0.8rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: center;
  color: var(--color-accent);
}

.choise-board__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 5.5rem));
  grid-auto-rows: auto;
  column-gap: 2rem;
  row-gap: 0.65rem;
  justify-content: center;
  align-items: start;
}

.choise-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5.5rem;
}

.choise-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  min-height: 2.5em;
  margin: 0 0 0.2rem;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.choise-board__slot--result .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

.choise-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.choise-board .spread-slot__frame {
  width: 100%;
  max-width: 5.5rem;
}

.choise-board .spread-slot__reading {
  width: 100%;
  max-width: 5.5rem;
  margin-top: 0.25rem;
}

@media (max-width: 520px) {
  .choise-board__head,
  .choise-board__grid {
    grid-template-columns: repeat(2, minmax(0, 4.5rem));
    column-gap: 1rem;
  }

  .choise-board__slot {
    max-width: 4.5rem;
  }

  .choise-board .spread-slot__frame {
    max-width: 4.5rem;
  }

  .choise-board .spread-slot__role {
    min-height: 2.75em;
    font-size: calc(0.58rem + 3px);
  }
}

.bizdesi-board {
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.bizdesi-board__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 5.5rem));
  grid-auto-rows: auto;
  column-gap: 1.25rem;
  row-gap: 0.65rem;
  justify-content: center;
  align-items: start;
}

.bizdesi-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5.5rem;
}

.bizdesi-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  min-height: 3em;
  margin: 0 0 0.2rem;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.bizdesi-board__slot--key .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

.bizdesi-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.bizdesi-board .spread-slot__frame {
  width: 100%;
  max-width: 5.5rem;
}

.bizdesi-board .spread-slot__reading {
  width: 100%;
  max-width: 5.5rem;
  margin-top: 0.25rem;
}

@media (max-width: 520px) {
  .bizdesi-board__grid {
    grid-template-columns: repeat(2, minmax(0, 4.5rem));
    column-gap: 0.85rem;
  }

  .bizdesi-board__slot {
    max-width: 4.5rem;
  }

  .bizdesi-board .spread-slot__frame {
    max-width: 4.5rem;
  }

  .bizdesi-board .spread-slot__role {
    min-height: 3.2em;
    font-size: calc(0.58rem + 3px);
  }
}

.familycircle-board {
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.familycircle-board__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 5.5rem));
  grid-auto-rows: auto;
  column-gap: 1.25rem;
  row-gap: 0.65rem;
  justify-content: center;
  align-items: start;
}

.familycircle-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5.5rem;
}

.familycircle-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  min-height: 3em;
  margin: 0 0 0.2rem;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.familycircle-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.familycircle-board .spread-slot__frame {
  width: 100%;
  max-width: 5.5rem;
}

.familycircle-board .spread-slot__reading {
  width: 100%;
  max-width: 5.5rem;
  margin-top: 0.25rem;
}

@media (max-width: 520px) {
  .familycircle-board__grid {
    grid-template-columns: repeat(2, minmax(0, 4.5rem));
    column-gap: 0.85rem;
  }

  .familycircle-board__slot {
    max-width: 4.5rem;
  }

  .familycircle-board .spread-slot__frame {
    max-width: 4.5rem;
  }

  .familycircle-board .spread-slot__role {
    min-height: 3.2em;
    font-size: calc(0.58rem + 3px);
  }
}

.spread-heartcross__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-heartcross__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-heartcross__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-heartcross__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-heartcross__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-heartcross__questions li {
  margin: 0.25rem 0;
}

.spread-heartcross__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.heartcross-board {
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.heartcross-board__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 5rem));
  grid-template-rows: repeat(4, auto);
  column-gap: 0.65rem;
  row-gap: 0.5rem;
  justify-content: center;
  align-items: start;
}

.heartcross-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5rem;
  justify-self: center;
}

.heartcross-board__slot--1 {
  grid-column: 2;
  grid-row: 1;
}

.heartcross-board__slot--3 {
  grid-column: 1;
  grid-row: 2;
}

.heartcross-board__slot--4 {
  grid-column: 3;
  grid-row: 2;
}

.heartcross-board__slot--2 {
  grid-column: 2;
  grid-row: 3;
}

.heartcross-board__slot--5 {
  grid-column: 2;
  grid-row: 4;
}

.heartcross-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  min-height: 2.5em;
  margin: 0 0 0.2rem;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.heartcross-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.heartcross-board .spread-slot__frame {
  width: 100%;
  max-width: 5rem;
}

.heartcross-board .spread-slot__reading {
  width: 100%;
  max-width: 5rem;
  margin-top: 0.25rem;
}

@media (max-width: 520px) {
  .heartcross-board__grid {
    grid-template-columns: repeat(3, minmax(0, 4.25rem));
  }

  .heartcross-board__slot {
    max-width: 4.25rem;
  }

  .heartcross-board .spread-slot__frame {
    max-width: 4.25rem;
  }

  .heartcross-board .spread-slot__role {
    min-height: 2.75em;
    font-size: calc(0.58rem + 3px);
  }
}

.spread-carier__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-carier__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-carier__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-carier__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-carier__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-carier__questions li {
  margin: 0.25rem 0;
}

.spread-carier__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-defence__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-defence__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-defence__intro-text--note {
  color: var(--color-ink-muted);
}

.spread-defence__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-defence__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-defence__questions li {
  margin: 0.25rem 0;
}

.spread-defence__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-finflow__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-finflow__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-finflow__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-finflow__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-finflow__questions li {
  margin: 0.25rem 0;
}

.spread-finflow__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-pastfuture__subtitle {
  max-width: 40rem;
  margin: -0.35rem auto 1rem;
  font-size: 1.15rem;
  line-height: 1.45;
  text-align: center;
  color: var(--color-ink-muted);
}

.spread-pastfuture__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-pastfuture__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-pastfuture__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-pastfuture__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-pastfuture__questions li {
  margin: 0.25rem 0;
}

.spread-pastfuture__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.spread-fork__intro {
  max-width: 40rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}

.spread-fork__intro-text {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink);
}

.spread-fork__intro-label {
  margin: 0.85rem 0 0.4rem;
  font-family: var(--font-logo);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--color-accent);
}

.spread-fork__questions {
  margin: 0 0 0.65rem;
  padding: 0;
  list-style: none;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--color-ink-muted);
}

.spread-fork__questions li {
  margin: 0.25rem 0;
}

.spread-fork__questions li::before {
  content: "• ";
  color: var(--color-accent);
}

.carier-board__slot--key .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

.defence-board__slot--key .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

.finflow-board__slot--key .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

.fork-board__slot--key .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

.fork-board {
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.fork-board__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 5rem));
  grid-template-rows: repeat(3, auto);
  column-gap: 0.45rem;
  row-gap: 0.6rem;
  justify-content: center;
  align-items: start;
  min-width: min-content;
}

.fork-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5rem;
  justify-self: center;
}

.fork-board__slot--3 {
  grid-column: 4;
  grid-row: 1;
}

.fork-board__slot--4 {
  grid-column: 5;
  grid-row: 1;
}

.fork-board__slot--1 {
  grid-column: 1;
  grid-row: 2;
}

.fork-board__slot--2 {
  grid-column: 2;
  grid-row: 2;
}

.fork-board__slot--7 {
  grid-column: 7;
  grid-row: 2;
}

.fork-board__slot--5 {
  grid-column: 4;
  grid-row: 3;
}

.fork-board__slot--6 {
  grid-column: 5;
  grid-row: 3;
}

.fork-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  height: calc(1.25em * 3);
  margin: 0;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
  box-sizing: border-box;
  overflow: hidden;
}

.fork-board .spread-slot__label {
  flex-shrink: 0;
  width: 100%;
  margin: 0;
  line-height: 1.2;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.fork-board .spread-slot__frame {
  flex-shrink: 0;
  width: 100%;
  max-width: 5rem;
  margin-top: 0;
}

.fork-board .spread-slot__reading {
  width: 100%;
  max-width: 5rem;
  margin: 0;
}

.pastfuture-board {
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.pastfuture-board__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 5rem)) minmax(0, 0.8rem) minmax(0, 5rem);
  grid-template-rows: repeat(2, auto);
  column-gap: 0.45rem;
  row-gap: 0.6rem;
  justify-content: center;
  align-items: start;
  min-width: min-content;
}

.pastfuture-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 5rem;
  justify-self: center;
}

.pastfuture-board__slot--3 {
  grid-column: 2;
  grid-row: 1;
}

.pastfuture-board__slot--1 {
  grid-column: 1;
  grid-row: 2;
}

.pastfuture-board__slot--2 {
  grid-column: 3;
  grid-row: 2;
}

.pastfuture-board__slot--4 {
  grid-column: 5;
  grid-row: 2;
}

.pastfuture-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  min-height: 3.15em;
  margin: 0;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.pastfuture-board .spread-slot__label {
  flex-shrink: 0;
  width: 100%;
  margin: 0;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.pastfuture-board .spread-slot__frame {
  flex-shrink: 0;
  width: 100%;
  max-width: 5rem;
}

.pastfuture-board .spread-slot__reading {
  width: 100%;
  max-width: 5rem;
  margin: 0;
}

.pastfuture-board__slot--key .spread-slot__role {
  color: var(--color-accent);
  font-weight: 600;
}

@media (max-width: 720px) {
  .fork-board__grid {
    grid-template-columns: repeat(7, minmax(0, 4.25rem));
  }

  .fork-board .spread-slot__role {
    height: calc(1.25em * 3);
    font-size: calc(0.58rem + 3px);
  }

  .fork-board .spread-slot__frame {
    max-width: 4.25rem;
  }

  .pastfuture-board__grid {
    grid-template-columns: repeat(3, minmax(0, 4.25rem)) minmax(0, 0.55rem) minmax(0, 4.25rem);
  }

  .pastfuture-board .spread-slot__role {
    min-height: 3.15em;
    font-size: calc(0.58rem + 3px);
  }

  .pastfuture-board .spread-slot__frame {
    max-width: 4.25rem;
  }
}

.souls-board,
.lovepath-board,
.carier-board,
.defence-board,
.finflow-board {
  margin: 0 auto 2rem;
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}

.souls-board__row,
.lovepath-board__row,
.carier-board__row,
.defence-board__row,
.finflow-board__row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: center;
  gap: 0.65rem;
  min-width: min-content;
  margin: 0 auto;
}

.lovepath-board__arrow {
  flex-shrink: 0;
  align-self: center;
  margin-top: 3.1em;
  font-family: var(--font-logo);
  font-size: 1.1rem;
  line-height: 1;
  color: var(--color-accent);
  opacity: 0.75;
}

.souls-board .spread-slot__role,
.lovepath-board .spread-slot__role,
.carier-board .spread-slot__role,
.defence-board .spread-slot__role,
.finflow-board .spread-slot__role {
  flex-shrink: 0;
  width: 100%;
  min-height: 3em;
  margin: 0;
  font-size: calc(0.62rem + 3px);
  line-height: 1.25;
  text-align: center;
  color: var(--color-ink-muted);
}

.souls-board .spread-slot__frame,
.lovepath-board .spread-slot__frame,
.carier-board .spread-slot__frame,
.defence-board .spread-slot__frame,
.finflow-board .spread-slot__frame {
  flex-shrink: 0;
  width: 100%;
  max-width: 5rem;
}

.souls-board .spread-slot__reading,
.lovepath-board .spread-slot__reading,
.carier-board .spread-slot__reading,
.defence-board .spread-slot__reading,
.finflow-board .spread-slot__reading {
  width: 100%;
  max-width: 5rem;
  margin: 0;
}

.souls-board .spread-slot__label,
.lovepath-board .spread-slot__label,
.carier-board .spread-slot__label,
.defence-board .spread-slot__label,
.finflow-board .spread-slot__label {
  flex-shrink: 0;
  width: 100%;
  margin: 0;
  font-family: var(--font-logo);
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

@media (max-width: 720px) {
  .souls-board .spread-slot__role,
  .lovepath-board .spread-slot__role,
  .carier-board .spread-slot__role,
  .defence-board .spread-slot__role,
  .finflow-board .spread-slot__role {
    min-height: 3.15em;
    font-size: calc(0.58rem + 3px);
  }

  .souls-board .spread-slot__frame,
  .lovepath-board .spread-slot__frame,
  .carier-board .spread-slot__frame,
  .defence-board .spread-slot__frame,
  .finflow-board .spread-slot__frame {
    max-width: 4.25rem;
  }

  .lovepath-board__arrow {
    margin-top: 3.25em;
    font-size: 0.95rem;
  }
}

.wheel-board {
  margin: 0 auto 2rem;
  max-width: 32rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
}

.wheel-board__grid {
  display: grid;
  grid-template-columns: 6.75rem 6.75rem 6.75rem;
  grid-template-rows: auto auto auto;
  gap: 0.85rem 0.65rem;
  justify-content: center;
  margin: 0 auto;
}

.wheel-board__slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 6.75rem;
}

.wheel-board__slot--5 {
  grid-column: 2;
  grid-row: 1;
}

.wheel-board__slot--2 {
  grid-column: 1;
  grid-row: 2;
}

.wheel-board__slot--1 {
  grid-column: 2;
  grid-row: 2;
}

.wheel-board__slot--4 {
  grid-column: 3;
  grid-row: 2;
}

.wheel-board__slot--3 {
  grid-column: 2;
  grid-row: 3;
}

.wheel-board .spread-slot__frame {
  width: 100%;
  max-width: 6.75rem;
}

.wheel-board .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.25rem;
}

.wheel-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.wheel-board__slot--1 .spread-slot__label {
  font-size: 1.05rem;
}

@media (max-width: 520px) {
  .wheel-board__grid {
    grid-template-columns: 5.5rem 5.5rem 5.5rem;
    gap: 0.65rem 0.45rem;
  }

  .wheel-board__slot {
    width: 5.5rem;
  }

  .wheel-board .spread-slot__frame {
    max-width: 5.5rem;
  }
}

.avos-nebos-board {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1rem 1.25rem;
  max-width: 44rem;
  margin: 0 auto 2rem;
}

.avos-nebos-board__column {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2.75rem;
  flex-shrink: 0;
}

.avos-nebos-board__row {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  gap: 0.85rem;
  flex: 0 1 auto;
}

.avos-nebos-board .spread-slot {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.avos-nebos-board .spread-slot {
  width: 6.75rem;
}

.avos-nebos-board .spread-slot .spread-slot__frame {
  width: 100%;
  max-width: 6.75rem;
}

.avos-nebos-board .spread-slot .spread-slot__reading {
  max-width: 100%;
  margin-top: 0.25rem;
}

.avos-nebos-board .spread-slot__label {
  margin: 0 0 0.35rem;
  font-family: var(--font-logo);
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  color: var(--color-accent);
}

.spread-slot__img--reversed.spread-slot__img--visible {
  transform: scale(1) rotate(180deg);
}

.spread-slot__position {
  display: inline;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--color-ink-muted);
}

@media (min-width: 640px) {
  .avos-nebos-board {
    flex-wrap: nowrap;
    gap: 1.25rem 1.5rem;
  }
}

@media (max-width: 520px) {
  .avos-nebos-board__row {
    flex-wrap: wrap;
    max-width: 100%;
  }
}

/* ===== Small spread ===== */
.spread-small__header {
  text-align: center;
  margin-bottom: 1.5rem;
}

.spread-small__title {
  font-family: var(--font-logo);
  font-size: clamp(1.5rem, 3.5vw, 2rem);
  margin: 0 0 0.75rem;
  color: var(--color-ink);
}

.spread-small__rules {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 1.1rem;
  color: var(--color-ink-muted);
  line-height: 1.6;
}

.spread-small__rules li {
  margin: 0.2rem 0;
}

.spread-small__notice {
  margin: 1rem auto 0;
  max-width: 36rem;
  padding: 0.75rem 1rem;
  border-radius: 8px;
  font-size: 1.05rem;
  text-align: center;
}

.spread-small__notice--info {
  background: rgba(107, 63, 42, 0.1);
  color: var(--color-ink-muted);
  border: 1px dashed rgba(61, 46, 31, 0.25);
}

.spread-small__notice--warn {
  background: rgba(139, 58, 42, 0.12);
  color: #6b2e22;
  border: 1px solid rgba(107, 46, 34, 0.25);
}

.spread-small__notice--hidden {
  display: none;
}

.spread-small__test-reset {
  display: block;
  margin: 0.75rem auto 0;
  padding: 0.4rem 0.85rem;
  border: 1px dashed rgba(107, 63, 42, 0.45);
  border-radius: 6px;
  background: transparent;
  color: var(--color-ink-muted);
  font-family: var(--font-body);
  font-size: 0.95rem;
  cursor: pointer;
  transition:
    color var(--transition),
    border-color var(--transition);
}

.spread-small__test-reset:hover,
.spread-small__test-reset:focus-visible {
  color: var(--color-accent);
  border-color: var(--color-accent);
  outline: none;
}

.spread-small__test-reset--hidden {
  display: none;
}

.spread-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 36rem;
  margin: 0 auto 1.5rem;
}

.spread-board {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  max-width: 56rem;
  margin: 0 auto 2rem;
}

@media (min-width: 640px) {
  .spread-board {
    grid-template-columns: 1fr 1fr 1fr;
    align-items: start;
    gap: 1.25rem;
  }
}

.spread-slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}

.souls-board__row > .spread-slot,
.lovepath-board__row > .spread-slot,
.carier-board__row > .spread-slot,
.defence-board__row > .spread-slot,
.finflow-board__row > .spread-slot {
  flex: 0 0 5rem;
  width: 5rem;
  max-width: 5rem;
  gap: 0.35rem;
}

@media (max-width: 720px) {
  .souls-board__row > .spread-slot,
  .lovepath-board__row > .spread-slot,
  .carier-board__row > .spread-slot,
  .defence-board__row > .spread-slot,
  .finflow-board__row > .spread-slot {
    flex: 0 0 4.25rem;
    width: 4.25rem;
    max-width: 4.25rem;
  }
}

.spread-slot__frame {
  position: relative;
  width: min(100%, 11rem);
  aspect-ratio: 7 / 11;
  border: 2px dashed rgba(61, 46, 31, 0.35);
  border-radius: 10px;
  background: rgba(255, 252, 245, 0.35);
  overflow: hidden;
  box-shadow: inset 0 0 20px rgba(61, 46, 31, 0.08);
}

.spread-slot__frame--filled {
  border-style: solid;
  border-color: rgba(107, 63, 42, 0.45);
  background: rgba(255, 252, 245, 0.75);
}

.spread-slot__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(0.92) rotateY(90deg);
  transition:
    opacity 0.45s ease,
    transform 0.55s ease;
}

.spread-slot__img--visible {
  opacity: 1;
  transform: scale(1) rotateY(0);
}

.spread-slot__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  font-size: 0.9rem;
  text-align: center;
  color: rgba(61, 46, 31, 0.45);
}

.spread-slot__placeholder--hidden {
  display: none;
}

.spread-form__label {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--color-ink-muted);
}

.spread-form__input {
  width: 100%;
  min-height: 5rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(61, 46, 31, 0.3);
  border-radius: 8px;
  background: rgba(255, 252, 245, 0.8);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: 1.15rem;
  line-height: 1.45;
  resize: vertical;
}

.spread-form__input:focus {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
  border-color: var(--color-accent);
}

.spread-form__input:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

.spread-form__actions {
  display: flex;
  justify-content: center;
}

.spread-form__submit {
  min-width: 14rem;
  padding: 0.85rem 2rem;
  border: none;
  border-radius: 8px;
  background: var(--color-accent);
  color: #faf6ee;
  font-family: var(--font-logo);
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
  box-shadow: var(--shadow-soft);
  transition:
    background var(--transition),
    transform var(--transition),
    opacity var(--transition);
}

.spread-form__submit:hover:not(:disabled),
.spread-form__submit:focus-visible:not(:disabled) {
  background: var(--color-accent-hover);
  transform: translateY(-1px);
  outline: 2px solid var(--color-ink);
  outline-offset: 3px;
}

.spread-form__submit:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.spread-slot__reading {
  width: 100%;
  max-width: 14rem;
  margin: 0.35rem auto 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
}

.spread-slot__reading--hidden {
  display: none;
}

.spread-slot__caption {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.12rem;
}

.spread-slot__caption-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
}

.spread-slot__name-text {
  margin: 0;
  font-family: var(--font-logo);
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-accent);
  text-align: center;
}

.spread-slot__position-text {
  display: block;
  font-family: var(--font-body);
  font-size: 0.72rem;
  line-height: 1.2;
  color: var(--color-ink-muted);
  text-align: center;
}

.spread-slot__hint-wrap {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
}

.spread-slot__hint {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.1rem;
  border: none;
  background: transparent;
  cursor: help;
  border-radius: 50%;
}

.spread-slot__hint:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

.spread-slot__hint-icon {
  display: block;
  width: 1rem;
  height: 1rem;
  opacity: 0.7;
  filter: brightness(0) saturate(100%) invert(24%) sepia(12%) saturate(1200%) hue-rotate(358deg)
    brightness(95%) contrast(90%);
  transition: opacity var(--transition);
}

.spread-slot__hint:hover .spread-slot__hint-icon,
.spread-slot__hint:focus-visible .spread-slot__hint-icon {
  opacity: 1;
}

.spread-slot__tooltip {
  position: absolute;
  z-index: 30;
  top: calc(100% + 0.45rem);
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: min(16rem, 72vw);
  padding: 0.65rem 0.75rem;
  font-family: var(--font-body);
  font-size: 0.88rem;
  line-height: 1.45;
  color: #faf6ee;
  text-align: left;
  background: var(--color-accent);
  border: 1px solid rgba(61, 46, 31, 0.25);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.15s ease, visibility 0.15s ease;
}

.spread-slot__tooltip::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-bottom-color: var(--color-accent);
}

.spread-slot__hint-wrap:hover .spread-slot__tooltip,
.spread-slot__hint-wrap:focus-within .spread-slot__tooltip,
.spread-slot__hint-wrap--open .spread-slot__tooltip {
  visibility: visible;
  opacity: 1;
}

.spread-slot__tooltip--missing {
  color: rgba(250, 246, 238, 0.85);
  font-style: italic;
}

.spread-slot__name {
  margin: 0;
}

.spread-slot__text {
  display: none;
}

.spread-slot__text--missing {
  color: var(--color-ink-muted);
  font-style: italic;
}

.spread-webhook-response {
  max-width: 56rem;
  margin: 0 auto 2.5rem;
  padding: 1.15rem 1.25rem;
  border: 1px solid rgba(61, 46, 31, 0.22);
  border-radius: 10px;
  background: rgba(255, 252, 245, 0.65);
  box-shadow: var(--shadow-soft);
}

.spread-webhook-response--hidden {
  display: none;
}

.spread-webhook-response__title {
  margin: 0 0 0.85rem;
  font-family: var(--font-logo);
  font-size: 1.2rem;
  text-align: center;
  color: var(--color-accent);
}

.spread-webhook-response__loading {
  margin: 0 0 0.75rem;
  font-size: 1.05rem;
  text-align: center;
  color: var(--color-ink-muted);
  font-style: italic;
}

.spread-webhook-response__loading--hidden {
  display: none;
}

.spread-webhook-response__body {
  min-height: 4rem;
  padding: 0.85rem 1rem;
  border-radius: 8px;
  background: rgba(255, 252, 245, 0.9);
  border: 1px solid rgba(61, 46, 31, 0.15);
  font-family: var(--font-body);
  font-size: 1.1rem;
  line-height: 1.55;
  color: var(--color-ink);
  white-space: pre-wrap;
}

.spread-webhook-response__body:empty::before {
  content: "Ответ появится после расклада.";
  color: var(--color-ink-muted);
  font-style: italic;
}

.spread-webhook-response__body--rich {
  white-space: normal;
}

.spread-webhook-response__body--error {
  color: #6b2e22;
  border-color: rgba(139, 58, 42, 0.35);
  background: rgba(139, 58, 42, 0.08);
}

.spread-webhook-response__body--rich p {
  margin: 0 0 0.75rem;
}

.spread-webhook-response__body--rich p:last-child {
  margin-bottom: 0;
}

.spread-webhook-response__body--rich h1,
.spread-webhook-response__body--rich h2,
.spread-webhook-response__body--rich h3 {
  margin: 0 0 0.65rem;
  font-family: var(--font-logo);
  color: var(--color-accent);
}

.spread-webhook-response__body--rich ul,
.spread-webhook-response__body--rich ol {
  margin: 0 0 0.75rem;
  padding-left: 1.25rem;
}

.spread-webhook-response__body--rich strong {
  font-weight: 600;
}

.spread-webhook-response__body--rich a {
  color: var(--color-accent);
}
