/* Official artwork is scaled whole, including Google Play's transparent space. */
.hub .tiles { --badge-height: 44px; }
.hub .tiles .tile {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
  row-gap: 0;
}
.hub .tiles .tile-main { grid-row: 1; }
.hub .tiles .store-row {
  grid-row: 2;
  direction: ltr;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 12px;
  margin: 0;
  padding: 11px 20px;
}
.hub .tiles .store-badge-link {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: var(--badge-height);
  height: var(--badge-height);
}
.hub .tiles .store-badge {
  display: block;
  width: auto;
  height: var(--badge-height);
  max-width: none;
}
.hub .tiles .tile-actions {
  grid-row: 3;
  margin-top: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
}
.hub .tiles .tile-actions .btn-solid:only-child { grid-column: 1 / -1; }
@media (max-width: 619px) {
  .hub .tiles { --badge-height: 40px; }
  .hub .tiles .store-row { padding: 10px 14px; gap: 12px; }
  .hub .tiles .tile-actions { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr; }
  .hub .tiles .tile-actions .btn-ghost { grid-row: 1; }
  .hub .tiles .tile-actions .btn-solid { grid-row: 2; }
}

.hub .tiles .store-badge-apple img[src*="apple-en.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-en.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-ru.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-ru.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-es.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-es.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-de.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-de.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-fr.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-fr.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-pt.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-pt.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-zh.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-zh.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-ja.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-ja.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-hi.svg"] { height: calc(var(--badge-height) * 1.025); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-hi.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-apple img[src*="apple-ar.svg"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }
.hub .tiles .store-badge-google img[src*="google-ar.png"] { height: calc(var(--badge-height) * 1); margin-inline: calc(var(--badge-height) * -0); }

/* A narrow card stacks both badges at the larger visible width. */
.hub .tiles .tile { container-type: inline-size; }
@container (max-width: 330px) {
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) { flex-direction: column; }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-link { height: auto; }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-en.svg"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-en.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-ru.svg"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-ru.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-es.svg"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-es.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-de.svg"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-de.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-fr.svg"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-fr.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-pt.svg"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-pt.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-zh.svg"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-zh.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-ja.svg"] { width: calc(var(--badge-height) * 3.375); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-ja.png"] { width: calc(var(--badge-height) * 3.375); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-hi.svg"] { width: calc(var(--badge-height) * 3.3970797260627985); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-hi.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-apple img[src*="apple-ar.svg"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
 .hub .tiles .store-row:has(.store-badge-apple):has(.store-badge-google) .store-badge-google img[src*="google-ar.png"] { width: calc(var(--badge-height) * 3.3661971830985915); height: auto; margin-inline: calc(var(--badge-height) * 0); }
}