/* Finestre del bonus dei motori 4, 5, 8 e 9 (bonus-windows.js). */
.bw-host { position: relative; --bw-a: #5fe3ff; --bw-b: #0b3a5c; --bw-ink: #f2fbff; --bw-glow: rgba(95, 227, 255, .55); }
.bw-host[data-bw-theme="dynamic"] { --bw-a: #f0c86a; --bw-b: #3a2412; --bw-ink: #fff6e2; --bw-glow: rgba(240, 200, 106, .55); }
.bw-host[data-bw-theme="yinyang"] { --bw-a: #e8c46a; --bw-b: #12322a; --bw-ink: #fbf6e8; --bw-glow: rgba(232, 196, 106, .5); }
.bw-host[data-bw-theme="diamondbloom"] { --bw-a: #ff7ac8; --bw-b: #133d2a; --bw-ink: #fff4fb; --bw-glow: rgba(255, 122, 200, .5); }

.bw-hud {
  position: absolute;
  top: 6px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 25;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  max-width: calc(100% - 16px);
  pointer-events: none;
}
.bw-hud[hidden] { display: none !important; }
.bw-chip {
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid var(--bw-a);
  background: color-mix(in srgb, var(--bw-b) 86%, black);
  color: var(--bw-ink);
  font-weight: 800;
  font-size: .82rem;
  letter-spacing: .06em;
  white-space: nowrap;
  box-shadow: 0 0 10px var(--bw-glow);
  font-variant-numeric: tabular-nums;
}
.bw-chip[hidden] { display: none; }
.bw-chip.bw-mult { color: #1a1206; background: var(--bw-a); }
.bw-chip.bw-flash { animation: bwFlash 600ms ease; }
@keyframes bwFlash { 30% { transform: scale(1.12); box-shadow: 0 0 22px var(--bw-glow); } }

.bw-veil {
  position: absolute;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  background: rgba(2, 8, 14, .58);
  opacity: 0;
  transition: opacity 300ms ease;
}
.bw-veil.on { opacity: 1; }
.bw-panel {
  min-width: min(440px, 88%);
  max-width: min(620px, 94%);
  max-height: 94%;
  overflow: auto;
  padding: 18px 22px 16px;
  border-radius: 16px;
  border: 2px solid var(--bw-a);
  background: radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--bw-a) 22%, transparent), transparent 60%), color-mix(in srgb, var(--bw-b) 92%, black);
  color: var(--bw-ink);
  text-align: center;
  box-shadow: 0 0 28px var(--bw-glow), inset 0 0 18px rgba(0, 0, 0, .45);
  transform: scale(.92);
  transition: transform 320ms cubic-bezier(.2, 1.4, .4, 1);
}
.bw-veil.on .bw-panel { transform: scale(1); }
.bw-label { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--bw-a); font-weight: 800; }
.bw-title { margin: 6px 0 8px; font-size: clamp(1.2rem, 2.4vw, 2rem); letter-spacing: .08em; text-shadow: 0 0 14px var(--bw-glow); }
.bw-icons { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.bw-icons:empty { display: none; }
.bw-icon { width: clamp(44px, 6vw, 72px); height: clamp(44px, 6vw, 72px); object-fit: contain; filter: drop-shadow(0 0 8px var(--bw-glow)); }
.bw-img { width: clamp(64px, 9vw, 110px); height: auto; object-fit: contain; filter: drop-shadow(0 0 10px var(--bw-glow)); }
.bw-number { margin: 6px 0; font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 900; line-height: 1; color: var(--bw-a); font-variant-numeric: tabular-nums; text-shadow: 0 0 18px var(--bw-glow); }
.bw-number.done { animation: bwPop 420ms ease; }
.bw-amount { color: #ffe08a; }
@keyframes bwPop { 50% { transform: scale(1.12); } }
.bw-line { margin: 4px 0 10px; font-weight: 700; }
.bw-note { margin: 4px 0 10px; font-size: .82rem; line-height: 1.35; opacity: .92; }
.bw-button {
  min-width: 150px;
  min-height: 40px;
  margin-top: 6px;
  padding: 8px 18px;
  border-radius: 10px;
  border: 1px solid var(--bw-a);
  background: var(--bw-a);
  color: #10161c;
  font-weight: 900;
  letter-spacing: .1em;
  cursor: pointer;
}
.bw-button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

/* Effetto moltiplicatore del motore 4: bolle che salgono e badge «×N» sulle celle Wild pagate. */
.fx-mult-cell { position: relative; }
.fx-mult-badge {
  position: absolute;
  right: 4%;
  top: 4%;
  z-index: 6;
  padding: 2px 8px;
  border-radius: 999px;
  background: #ffe08a;
  color: #10202c;
  font-weight: 900;
  font-size: clamp(.8rem, 1.6vw, 1.3rem);
  box-shadow: 0 0 12px rgba(255, 224, 138, .8);
  pointer-events: none;
  animation: bwPop 500ms ease;
}
.fx-bubble {
  position: absolute;
  bottom: 6%;
  z-index: 5;
  width: var(--s, 12px);
  height: var(--s, 12px);
  border-radius: 50%;
  border: 2px solid rgba(220, 250, 255, .9);
  background: radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .9), rgba(140, 230, 255, .25) 60%, transparent);
  pointer-events: none;
  animation: fxBubble var(--d, 1200ms) ease-in forwards;
}
@keyframes fxBubble {
  0% { transform: translateY(0) scale(.6); opacity: 0; }
  15% { opacity: 1; }
  100% { transform: translateY(var(--rise, -160%)) translateX(var(--sway, 6px)) scale(1.1); opacity: 0; }
}
.fx-way-cell { box-shadow: inset 0 0 0 3px #ffe08a, 0 0 14px rgba(255, 224, 138, .7); z-index: 3; }
.fx-way-dim .cell:not(.fx-way-cell) { filter: brightness(.55); }
.fx-tide { animation: bwFlash 700ms ease; }

@media (prefers-reduced-motion: reduce) {
  .bw-veil, .bw-panel { transition: none; }
  .bw-chip.bw-flash, .bw-number.done, .fx-mult-badge, .fx-tide { animation: none; }
  .fx-bubble { display: none; }
}