/* ARCHITECTURE OWNER: Shared compact Squish Bite choice-card geometry.
 * Character/player choices stay compact and character-forward. Destination/system cards stay broad.
 * Pages may add semantic decoration, but this owner controls the shared choice-grid/card density,
 * artwork stage, title/meta clamping, and action-foot spacing so text cannot overlap badges/actions.
 */
.squishy-choice-grid{
  --squishy-choice-min:142px;
  --squishy-choice-max:168px;
  --squishy-choice-art-h:112px;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(var(--squishy-choice-min),var(--squishy-choice-max)));
  justify-content:start;
  align-items:stretch;
  gap:9px;
}
.squishy-choice-grid.is-roomy{--squishy-choice-min:154px;--squishy-choice-max:182px;--squishy-choice-art-h:122px}
.squishy-choice-grid.is-dense{--squishy-choice-min:128px;--squishy-choice-max:154px;--squishy-choice-art-h:110px;gap:7px}
.squishy-choice-card{
  position:relative;
  min-width:0;
  width:100%;
  max-width:var(--squishy-choice-max);
  display:grid;
  grid-template-rows:var(--squishy-choice-art-h) minmax(0,1fr) auto;
  align-content:start;
  gap:6px;
  overflow:hidden;
}
.squishy-choice-art{
  min-width:0;
  height:var(--squishy-choice-art-h);
  box-sizing:border-box;
  padding:4px;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.squishy-choice-art img{display:block;width:auto;height:auto;max-width:calc(100% - 12px);max-height:calc(var(--squishy-choice-art-h) - 16px);object-fit:contain;justify-self:center;align-self:center}
.squishy-choice-copy{min-width:0;display:grid;align-content:start;gap:2px}
.squishy-choice-title{
  min-width:0;
  min-height:2.35em;
  font-weight:950;
  line-height:1.16;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  overflow-wrap:anywhere;
}
.squishy-choice-meta{
  min-width:0;
  min-height:1.35em;
  line-height:1.3;
  overflow:hidden;
  text-overflow:ellipsis;
}
.squishy-choice-submeta{
  min-width:0;
  min-height:2.5em;
  line-height:1.28;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  overflow-wrap:anywhere;
}
.squishy-choice-foot{
  min-width:0;
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
}
.squishy-choice-badge{max-width:calc(100% - 14px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Squish-forward ticket variant: use when a choice needs full metadata but should spend
 * most of its footprint on the character instead of stacked white space. Geometry stays
 * shared here so pages do not grow private card systems. */
.squishy-choice-grid.is-squish-forward{
  --squishy-choice-art-h:110px;
  grid-template-columns:repeat(auto-fill,minmax(224px,232px));
  gap:8px;
}
.squishy-choice-grid.is-squish-forward .squishy-choice-card{
  max-width:232px;
  grid-template-columns:110px minmax(0,1fr);
  grid-template-rows:auto;
  align-items:center;
  align-content:center;
  gap:5px;
}
.squishy-choice-grid.is-squish-forward .squishy-choice-art{
  width:110px;
  height:110px;
  padding:1px;
}
.squishy-choice-grid.is-squish-forward .squishy-choice-art img{
  max-width:calc(100% - 2px);
  max-height:calc(var(--squishy-choice-art-h) - 2px);
}
@media(max-width:520px){
  .squishy-choice-grid.is-squish-forward{grid-template-columns:1fr}
  .squishy-choice-grid.is-squish-forward .squishy-choice-card{max-width:none;grid-template-columns:112px minmax(0,1fr)}
  .squishy-choice-grid.is-squish-forward .squishy-choice-art{width:112px;height:112px}
}

@media(max-width:760px){
  .squishy-choice-grid{--squishy-choice-min:132px;--squishy-choice-max:1fr;--squishy-choice-art-h:108px;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .squishy-choice-grid.is-roomy{--squishy-choice-art-h:116px}
  .squishy-choice-grid.is-dense{--squishy-choice-art-h:106px}
  .squishy-choice-card{max-width:none}
}
@media(max-width:520px){.squishy-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:340px){.squishy-choice-grid{grid-template-columns:1fr}}