/* Shared scrolling paytable styles.
   Jade/gold ornament family, panel/card border-image frames, safe-area padding and the
   scroll region carry over from the repaired reuse stylesheet. The layout is a single
   scrolling column in every orientation, with the BET header pinned above the scroll and
   the Close button pinned in a footer below it (outside scroll content). */

.shared-paytable {
  box-sizing: border-box;
  display: none;
  position: fixed;
  inset: 0;
  z-index: 999999;
  height: min(100dvh, var(--paytable-available-height, 100dvh));
  padding:
    calc(4px + var(--paytable-safe-top, env(safe-area-inset-top, 0px)))
    calc(4px + var(--paytable-safe-right, env(safe-area-inset-right, 0px)))
    calc(4px + var(--paytable-safe-bottom, env(safe-area-inset-bottom, 0px)))
    calc(4px + var(--paytable-safe-left, env(safe-area-inset-left, 0px)));
  font: 16px/1.5 var(--paytable-theme-font, Georgia, "Times New Roman", serif);
  color: var(--paytable-theme-text, #e8d5c4);
  --paytable-gold: var(--paytable-theme-gold, #d4af37);
  --paytable-gold-soft: var(--paytable-theme-gold-soft, #ecd4a9);
  --paytable-dark: var(--paytable-theme-dark, #092c25);
  --paytable-line: var(--paytable-theme-line, #a87b33);
}
.shared-paytable.shared-paytable--open { display: flex; }
.shared-paytable *, .shared-paytable *::before, .shared-paytable *::after { box-sizing: border-box; }

.shared-paytable .shared-paytable__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(4px);
}

.shared-paytable .shared-paytable__panel {
  position: relative;
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  width: min(760px, 100%);
  height: 100%;
  max-height: 100%;
  min-height: 0;
  min-width: 0;
  border: 16px solid transparent;
  border-image: var(--paytable-theme-panel-frame, var(--paytable-panel-image) 160 fill / 16px / 0 stretch);
  background: var(--paytable-dark);
  padding: 10px;
  overflow: hidden;
  box-shadow: 0 0 25px rgba(212, 175, 55, 0.25);
}

.shared-paytable .shared-paytable__header {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 56px;
  padding-bottom: 6px;
}
.shared-paytable .shared-paytable__title-image {
  display: block;
  width: 280px;
  max-width: 100%;
  height: var(--paytable-theme-title-height, 56px);
  object-fit: contain;
}

/* BET header: minus / native select / plus */
.shared-paytable .shared-paytable__bet {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 6px 4px 10px;
  border-top: 1px solid var(--paytable-line);
  border-bottom: 1px solid var(--paytable-line);
}
.shared-paytable .shared-paytable__bet-label {
  font: bold 14px/1 var(--paytable-theme-font, Georgia, serif);
  letter-spacing: 3px;
  color: var(--paytable-gold);
}
.shared-paytable .shared-paytable__bet-controls {
  display: flex;
  align-items: center;
  gap: 10px;
}
.shared-paytable .shared-paytable__bet-step {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 2px solid var(--paytable-gold);
  border-radius: 50%;
  background: var(--paytable-theme-button, #082720);
  color: var(--paytable-gold);
  font: 24px/1 var(--paytable-theme-font, Georgia, serif);
  cursor: pointer;
}
.shared-paytable .shared-paytable__bet-select {
  height: 44px;
  min-height: 44px;
  min-width: 128px;
  padding: 0 12px;
  border: 2px solid var(--paytable-gold);
  border-radius: 8px;
  background: var(--paytable-theme-button, #082720);
  color: var(--paytable-gold-soft);
  font: bold 18px/1 var(--paytable-theme-font, Georgia, serif);
  text-align: center;
  cursor: pointer;
}
.shared-paytable .shared-paytable__bet-step:disabled,
.shared-paytable .shared-paytable__bet-select:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.shared-paytable .shared-paytable__bet-meta {
  margin: 0;
  font: var(--paytable-theme-bet-meta-font-size, 14px)/1.4 var(--paytable-theme-font, Georgia, serif);
  color: var(--paytable-gold-soft);
  text-align: center;
}
.shared-paytable .shared-paytable__bet-status {
  margin: 0;
  font: 14px/1.4 var(--paytable-theme-font, Georgia, serif);
  color: var(--paytable-theme-status, #ecd4a9);
  text-align: center;
}

/* Scroll region: the single shared column of document content */
.shared-paytable .shared-paytable__content {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 12px 6px 12px 0;
  scrollbar-color: #b8860b transparent;
  scrollbar-width: thin;
}

.shared-paytable .shared-paytable__subtitle {
  margin: 0 0 12px;
  font: 14px/1.5 var(--paytable-theme-font, Georgia, serif);
  text-align: center;
  color: var(--paytable-gold-soft);
}

.shared-paytable .shared-paytable__section { margin-bottom: 18px; }
.shared-paytable .shared-paytable__section-title {
  margin: 0 0 10px;
  font: bold 18px/1.3 var(--paytable-theme-font, Georgia, serif);
  letter-spacing: 1px;
  color: var(--paytable-gold);
  border-bottom: 1px solid rgba(212, 175, 55, 0.35);
  padding-bottom: 4px;
}

/* Symbol payout rows */
.shared-paytable .shared-paytable__symbols {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.shared-paytable .shared-paytable__symbol {
  display: grid;
  grid-template-columns: minmax(84px, 96px) minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  border: 8px solid transparent;
  border-image: var(--paytable-theme-card-frame, var(--paytable-card-image) 184 160 192 160 fill / 9.2px 8px 9.6px 8px / 0 stretch);
  background: var(--paytable-dark);
  padding: 8px 10px;
}
.shared-paytable .shared-paytable__symbol-exemplar {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.shared-paytable .shared-paytable__symbol-image {
  width: 100%;
  height: 72px;
  object-fit: contain;
}
.shared-paytable .shared-paytable__symbol-name {
  font: bold 14px/1.25 var(--paytable-theme-font, Georgia, serif);
  text-align: center;
  color: var(--paytable-gold);
}
.shared-paytable .shared-paytable__symbol-rows {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.shared-paytable .shared-paytable__payrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 34px;
  border-bottom: 1px solid rgba(212, 175, 55, 0.22);
  font: var(--paytable-theme-payrow-font-size, 15px)/1.3 var(--paytable-theme-font, Georgia, serif);
}
.shared-paytable .shared-paytable__payrow:last-child { border-bottom: 0; }
.shared-paytable .shared-paytable__payrow-count {
  flex: 0 0 auto;
  min-width: 44px;
  color: var(--paytable-gold-soft);
}
.shared-paytable .shared-paytable__payrow-amount {
  flex: 0 0 auto;
  font-weight: bold;
  color: var(--paytable-gold);
  white-space: nowrap;
}

/* Feature blocks (Wild, Scatter/Free Spins, Buy explanation) */
.shared-paytable .shared-paytable__feature {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  border: 1px solid rgba(212, 175, 55, 0.3);
  border-radius: 8px;
  padding: 10px 12px;
}
.shared-paytable .shared-paytable__feature:not(:has(.shared-paytable__feature-media)) {
  grid-template-columns: minmax(0, 1fr);
}
.shared-paytable .shared-paytable__feature-media {
  display: flex;
  justify-content: center;
}
.shared-paytable .shared-paytable__feature-image {
  width: 100%;
  height: 84px;
  object-fit: contain;
}
.shared-paytable .shared-paytable__feature-text { min-width: 0; }
.shared-paytable .shared-paytable__paragraph {
  margin: 0 0 8px;
  font: 14px/1.5 var(--paytable-theme-font, Georgia, serif);
  color: var(--paytable-theme-text, #e8d5c4);
}
.shared-paytable .shared-paytable__paragraph:last-child { margin-bottom: 0; }
.shared-paytable .shared-paytable__badge {
  display: inline-block;
  margin-bottom: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--paytable-gold);
  font: bold 14px/1.4 var(--paytable-theme-font, Georgia, serif);
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--paytable-gold);
}
.shared-paytable .shared-paytable__badge--muted {
  border-color: var(--paytable-theme-muted-border, #7c8a80);
  color: var(--paytable-theme-muted, #9fb0a3);
}

/* Rules list */
.shared-paytable .shared-paytable__rules {
  margin: 0;
  padding-left: 20px;
}
.shared-paytable .shared-paytable__rule {
  margin-bottom: 6px;
  font: 14px/1.5 var(--paytable-theme-font, Georgia, serif);
  color: var(--paytable-theme-text, #e8d5c4);
}

/* Controls / icon guide */
.shared-paytable .shared-paytable__controls {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.shared-paytable .shared-paytable__control {
  border-bottom: 1px solid rgba(212, 175, 55, 0.18);
  padding-bottom: 6px;
}
.shared-paytable .shared-paytable__control:last-child { border-bottom: 0; }
.shared-paytable .shared-paytable__control-label {
  margin: 0;
  font: bold 15px/1.3 var(--paytable-theme-font, Georgia, serif);
  color: var(--paytable-gold);
}
.shared-paytable .shared-paytable__control-desc {
  margin: 2px 0 0;
  font: 14px/1.45 var(--paytable-theme-font, Georgia, serif);
  color: var(--paytable-theme-text, #e8d5c4);
}

/* Footer with the persistent Close, outside the scroll content */
.shared-paytable .shared-paytable__footer {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  padding-top: 8px;
  border-top: 1px solid var(--paytable-line);
}
.shared-paytable .shared-paytable__close {
  min-width: var(--paytable-theme-close-min-width, 160px);
  min-height: var(--paytable-theme-close-height, 44px);
  height: var(--paytable-theme-close-height, 44px);
  padding: 0 24px;
  border: 2px solid var(--paytable-gold);
  border-radius: 999px;
  background: var(--paytable-theme-button, #082720);
  color: var(--paytable-gold);
  font: bold var(--paytable-theme-close-font-size, 16px)/1 var(--paytable-theme-font, Georgia, serif);
  letter-spacing: 2px;
  cursor: pointer;
}

.shared-paytable .shared-paytable__bet-step:focus-visible,
.shared-paytable .shared-paytable__bet-select:focus-visible,
.shared-paytable .shared-paytable__content:focus-visible,
.shared-paytable .shared-paytable__close:focus-visible {
  outline: 2px solid #ffe299;
  outline-offset: -2px;
}

/* Compact portrait phones */
@media (max-width: 600px) {
  .shared-paytable .shared-paytable__panel { border-width: 12px; border-image-width: 12px; padding: 6px; }
  .shared-paytable .shared-paytable__title-image { width: 220px; height: var(--paytable-theme-title-height, 50px); }
  .shared-paytable .shared-paytable__symbol { grid-template-columns: 76px minmax(0, 1fr); padding: 8px; }
  .shared-paytable .shared-paytable__symbol-image { height: 64px; }
  .shared-paytable .shared-paytable__payrow { min-height: 36px; }
}

/* Short landscape: keep the BET header and footer visible, let the middle scroll */
@media (max-height: 440px) and (orientation: landscape) {
  .shared-paytable .shared-paytable__panel { border-width: 10px; border-image-width: 10px; padding: 6px; }
  .shared-paytable .shared-paytable__header { min-height: 44px; }
  .shared-paytable .shared-paytable__title-image { height: var(--paytable-theme-title-height, 40px); width: 200px; }
  .shared-paytable .shared-paytable__bet { padding: 4px 4px 6px; }
  .shared-paytable .shared-paytable__bet-controls { gap: 8px; }
  .shared-paytable .shared-paytable__content { padding-top: 8px; }
  .shared-paytable .shared-paytable__symbols {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }
}

/* Wide desktop: still one scrolling column, just wider and centered */
@media (min-width: 1100px) {
  .shared-paytable .shared-paytable__panel { width: min(900px, 100%); }
}

/* The accepted single column remains intact. On short screens its header scrolls
   with the document so the symbol cards can use the available height. Close stays
   outside that sole scroll viewport. Portrait/desktop composition is unchanged. */
.shared-paytable .shared-paytable__scroll { display: contents; }
@media (max-height: 440px) and (orientation: landscape) {
  .shared-paytable .shared-paytable__scroll { display: block; min-height: 0; flex: 1 1 auto; overflow: auto; overscroll-behavior: contain; }
  .shared-paytable .shared-paytable__content { overflow: visible; }
}

/* Lantern Wheel prize table (release v2) */
.shared-paytable__table{width:100%;max-width:420px;margin:10px 0 4px;border-collapse:collapse;font-variant-numeric:tabular-nums}
.shared-paytable__table th,.shared-paytable__table td{padding:4px 8px;text-align:right;border-bottom:1px solid rgba(217,164,65,.28)}
.shared-paytable__table thead th{font-weight:700;color:#d9a441;text-align:right}
.shared-paytable__table th:first-child{text-align:left}
