.karty-lenormand { --karta-ink: #172436; --karta-motiv: #804725; --karta-okraj: #b28056; --karta-papir: #f8efdf; }
.karty-andel { --karta-ink: #513723; --karta-motiv: #765026; --karta-okraj: #b99668; --karta-papir: #fff9ee; }
.karty-vyklad, .karty-balicek {
  border: 1px solid var(--line);
  border-top: 3px solid var(--karta-okraj);
  background: var(--karta-papir);
  padding: clamp(14px, 3vw, 30px);
  margin: 19px 0 24px;
}
.karty-vyklad h2, .karty-vyklad h3 { margin: 0 0 10px; }
.karty-vyklad > p { max-width: 65ch; }
.karty-ovladani { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 13px; }
.karty-ovladani p { margin: 0; color: var(--karta-ink); font-weight: 600; }
.karty-ovladani p:empty { display: none; }
.karty-vejir { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(7px, 1.3vw, 14px); max-width: 790px; margin-top: 19px; }
.hs-main .karty-vejir button {
  position: relative;
  min-height: 0;
  padding: 0;
  border: 2px solid var(--karta-okraj);
  border-radius: 7px;
  background: var(--karta-ink);
  overflow: hidden;
  width: 100%;
  aspect-ratio: 2/3;
}
.karty-vejir img { width: 100%; height: 100%; object-fit: cover; }
.karty-vejir button:enabled:hover { box-shadow: 0 0 0 2px var(--karta-motiv); }
.karty-vejir button:disabled img { opacity: .48; }
.karty-vejir button[data-vybrano]::after {
  content: attr(data-vybrano);
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: white;
  font: 800 38px/1 var(--head);
  text-shadow: 0 2px 3px #000;
}
.karty-vysledek { margin-top: 17px; }
.karty-vysledek-mrizka { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 12px; }
.karty-vysledek-polozka {
  padding: 13px;
  border: 1px solid var(--line);
  background: #fff;
}
.karty-vysledek-polozka:only-child { max-width: 570px; }
.karty-vysledek-polozka h4 { color: var(--karta-motiv); margin: 0 0 10px; }
.karty-vysledek-polozka p { margin: 8px 0 0; }
.karty-lic {
  position: relative;
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 4px;
  border: 1px solid var(--karta-okraj);
  border-radius: 6px;
  background: var(--karta-papir);
  color: var(--karta-ink);
  padding: 10px;
  margin: 0;
  text-align: center;
}
.karty-karta .karty-lic { max-width: 240px; }
.karty-lic img { width: 100%; height: auto; aspect-ratio: 1; }
.karty-lic > span { color: var(--karta-motiv); font: 700 14px/1 var(--body); }
.karty-lic figcaption, .karty-lic strong { font: 800 clamp(20px, 2vw, 31px)/1.16 var(--head); overflow-wrap: anywhere; }
.karty-lic small { color: var(--karta-motiv); line-height: 1.2; }
.karty-balicek summary { font: 800 clamp(24px, 3vw, 36px)/1.1 var(--head); }
.karty-balicek ol { list-style: none; padding: 0; margin-bottom: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
@media (min-width: 600px) {
  .karty-vysledek-polozka:only-child .karty-karta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 5px 17px; align-items: start; }
  .karty-vysledek-polozka:only-child .karty-lic { grid-row: span 2; }
}
@media (max-width: 670px) {
  .karty-vejir, .karty-balicek ol { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 430px) {
  .karty-balicek ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .karty-lic { padding: 6px; }
}
