/* ============================================================================
   symbols.css — vector slot symbols (paired with symbols.js).
   Loaded last on game pages so it wins over each game's .symbol rules.
   ========================================================================== */

.cell .symbol.has-sym {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  line-height: 1;
  font-size: 0; /* kill inherited emoji sizing / stray whitespace */
  filter: none; /* the drop-shadow lives on the <svg> instead */
  /* neutralise the old text "card rank" plaque when an icon is present */
  background: none;
  border: none;
  padding: 0;
  box-shadow: none;
}

.symbol .sym {
  width: 84%;
  height: 84%;
  overflow: visible;
  filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 0.5));
}

/* Winning cells: warm glow on the icon. */
.cell.win .symbol .sym {
  filter: drop-shadow(0 0 8px var(--accent, #ffd166)) drop-shadow(0 3px 3px rgba(0, 0, 0, 0.5));
}

/* Symbols shown inline in the paytable list. */
.paytable-list .sym,
.pay-sym .sym {
  width: 1.7em;
  height: 1.7em;
  vertical-align: -0.55em;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5));
}
.pay-sym { display: inline-flex; gap: 1px; align-items: center; }
.pay-sym > span { display: inline-flex; }
.pay-sym small { margin-left: 4px; opacity: 0.7; }