/*
 * TriPeaks-pasianssin omat tarkennukset korttipöytään (kortit/kortit.css). Vain .hdp-tripeaks-luokat ja
 * .hdpeli[data-game="tripeaks"]-valitsimet. Jumipaneeli ja ilmoitukset ovat ytimen paneeli (ctx.ui.banner).
 */
/* Vihjeen kortti limittyneiden naapureidensa päälle, jotta okra reunus näkyy kokonaan (puhelimessa kortit
   limittyvät vaakasuunnassa). Vihjeen kortti on aina vapaa, joten sen päällä ei ole alemman rivin kortteja. */
.hdpeli[data-game="tripeaks"] .hdp-kortit-card.is-hint { z-index: 600 !important; }
/* Poistopinon paikka erottuu pakasta katkoviivalla. */
.hdpeli[data-game="tripeaks"] .hdp-kortit-slot.is-waste { border-style: dashed; }
/* Putkilaskuri poistopinon oikealla puolella. Teksti vasemmalle myös RTL-kielillä, koska se kuuluu poistopinoon. */
.hdp-tripeaks-run {
  position: absolute; left: 0; top: 0; z-index: 1; pointer-events: none; display: flex; align-items: center;
  justify-content: flex-start; transform-origin: 0 50%; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
  font: 700 max(13px, calc(var(--cw) * .24))/1.2 "Montserrat", "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}
.hdp-tripeaks-run span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hdp-tripeaks-run.is-zero { color: rgba(255, 255, 255, .55); font-weight: 600; }
/* Pakan korttimäärä pakan päällimmäisen oikeassa yläkulmassa. */
.hdp-tripeaks-count {
  position: absolute; left: 0; top: 0; z-index: 400; pointer-events: none; min-width: 22px; height: 22px; padding: 0 6px;
  margin: -9px 0 0 -16px; border-radius: 11px; background: #f4ba6c; color: #3d2208; box-shadow: 0 1px 3px rgba(0, 0, 0, .35);
  font: 700 12px/22px "Inter", "Segoe UI", system-ui, -apple-system, sans-serif; text-align: center; font-variant-numeric: tabular-nums;
}
.hdp-tripeaks-count[hidden] { display: none; }
/* Pisteet lentävät poistopinon yltä; huipun bonus okralla toisella rivillä. */
.hdp-tripeaks-pop {
  position: absolute; left: 0; top: 0; z-index: 2500; pointer-events: none; display: grid; justify-items: center;
  color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .55);
  font: 800 max(14px, calc(var(--cw) * .3))/1.1 "Montserrat", "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}
.hdp-tripeaks-pop span { color: #f4ba6c; font-size: 1.15em; }
/* Lyhyet ilmoitukset (ratkaistavan jaon haku) eivät ota kosketuksia vastaan. */
.hdpeli[data-game="tripeaks"] .hdpeli-banner.hdp-tripeaks-flash { pointer-events: none; }
/* Näppäimistö: lauta on yksi kohdistettava alue, kohdistettu kortti tai pakka näkyy reunuksena. */
.hdpeli[data-game="tripeaks"] .hdp-tripeaks-board:focus { outline: none; }
.hdpeli[data-game="tripeaks"] .hdp-tripeaks-board:focus-visible { box-shadow: inset 0 0 0 3px #14a5dc, inset 0 20px 60px rgba(0, 0, 0, .18); }
.hdp-tripeaks-focus {
  position: absolute; left: 0; top: 0; z-index: 2600; pointer-events: none;
  border: 3px solid #14a5dc; border-radius: calc(var(--cr) + 4px); box-shadow: 0 0 0 2px rgba(255, 255, 255, .65);
}
.hdp-tripeaks-focus[hidden] { display: none; }