.td-epf {
  --td-epf-bg: #fbfaf7;
  --td-epf-card: #ffffff;
  --td-epf-text: #242321;
  --td-epf-muted: #6f6b64;
  --td-epf-line: #e6e0d7;
  --td-epf-accent: #b86c3b;
  --td-epf-accent-soft: #f4e8de;
  margin: 1.35rem 0 1.75rem;
  padding: 1rem;
  border: 1px solid var(--td-epf-line);
  border-radius: 18px;
  background: linear-gradient(145deg, var(--td-epf-bg), #fff 72%);
  color: var(--td-epf-text);
  box-shadow: 0 8px 28px rgba(48, 39, 28, .06);
}

.td-epf__header {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .15rem 1rem;
  align-items: center;
  margin: 0 0 .9rem;
}

.td-epf__eyebrow {
  grid-column: 1 / -1;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--td-epf-accent);
}

.td-epf__title,
.td-epf__item-name {
  margin: 0;
  color: var(--td-epf-text);
}

.td-epf__title {
  font-size: clamp(1.05rem, 2vw, 1.3rem);
  line-height: 1.25;
}

.td-epf__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0 .65rem;
  border-radius: 999px;
  background: var(--td-epf-accent-soft);
  color: var(--td-epf-accent);
  font-size: .82rem;
  font-weight: 800;
}

.td-epf__collection {
  display: grid;
  gap: .85rem;
}

.td-epf__item-card {
  min-width: 0;
}

.td-epf__subject-header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .3rem .7rem;
  margin: 0 0 .85rem;
  padding: 0 .1rem .7rem;
  border-bottom: 1px solid var(--td-epf-line);
}

.td-epf__subject {
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.25;
  color: var(--td-epf-text);
}

.td-epf__fact-kind {
  font-size: .78rem;
  font-weight: 650;
  color: var(--td-epf-muted);
}

.td-epf--collection .td-epf__item-card {
  padding: .9rem;
  border: 1px solid var(--td-epf-line);
  border-radius: 14px;
  background: var(--td-epf-card);
}

.td-epf__item-name {
  margin-bottom: .7rem;
  font-size: 1rem;
  line-height: 1.25;
}

.td-epf__variant-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: .65rem;
}

.td-epf__variant {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: .4rem;
  min-height: 74px;
  padding: .75rem .8rem;
  border: 1px solid var(--td-epf-line);
  border-radius: 12px;
  background: var(--td-epf-card);
}

.td-epf--collection .td-epf__variant {
  background: var(--td-epf-bg);
}

.td-epf__dimension {
  font-size: .82rem;
  font-weight: 650;
  color: var(--td-epf-muted);
}

.td-epf__price {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .3rem;
  font-size: 1rem;
  color: var(--td-epf-text);
}

.td-epf__price strong {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--td-epf-text);
}

.td-epf__price small,
.td-epf__price-row small {
  color: var(--td-epf-muted);
  font-size: .72rem;
}

.td-epf__variant--missing {
  border-style: dashed;
  background: transparent;
}

.td-epf__price--missing {
  font-size: .78rem;
  color: var(--td-epf-muted);
}

.td-epf__price-list {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}

.td-epf__price-row {
  display: inline-flex;
  align-items: baseline;
  gap: .35rem;
  padding: .6rem .75rem;
  border-radius: 999px;
  background: var(--td-epf-accent-soft);
}

.td-epf__price-row strong {
  font-size: 1rem;
  color: var(--td-epf-text);
}

.td-epf__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--td-epf-line);
  border-radius: 14px;
  background: var(--td-epf-card);
}

.td-epf__table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  margin: 0;
}

.td-epf__table th,
.td-epf__table td {
  padding: .8rem .9rem;
  border-bottom: 1px solid var(--td-epf-line);
  text-align: left;
  vertical-align: middle;
}

.td-epf__table thead th {
  background: var(--td-epf-bg);
  color: var(--td-epf-muted);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.td-epf__table tbody th {
  width: 48%;
  font-weight: 700;
}

.td-epf__table tr:last-child th,
.td-epf__table tr:last-child td {
  border-bottom: 0;
}

@media (max-width: 640px) {
  .td-epf {
    margin: 1rem 0 1.35rem;
    padding: .8rem;
    border-radius: 14px;
  }

  .td-epf__variant-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 390px) {
  .td-epf__variant-grid {
    grid-template-columns: 1fr;
  }
}