/* Modyfikatory widoku (modifiers.js): wybór w karcie „Sam”, efekty na obrazie rundy, mnożnik w HUD i wyniku */

/* ---------- Wybór przed grą ---------- */
.mods[hidden], .hud-mult[hidden], .result-mult[hidden], .summary-mods[hidden] { display: none; }
.mods { display: flex; flex-direction: column; gap: 8px; }
.mods-head {
  display: flex; justify-content: space-between; align-items: baseline; gap: 10px;
  font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-2);
}
.mods-total { font-size: 1.05rem; font-variant-numeric: tabular-nums; font-weight: 800; color: var(--muted); letter-spacing: 0; }
.mods-total.on { color: var(--gold); text-shadow: 0 1px 1px #000; }
.mods-list { display: flex; flex-wrap: wrap; gap: 6px; }
.mod-chip {
  display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px; cursor: pointer;
  font: inherit; font-size: 0.82rem; color: var(--text-2); border: 0; border-radius: 6px;
  background: rgba(0, 0, 0, 0.55); box-shadow: inset 0 0 0 1px #6b6868, inset 0 0 0 3px #0c0d0d;
}
.mod-chip:hover { color: #fff; filter: brightness(1.2); }
.mod-chip:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.mod-chip.on {
  color: var(--title); background: linear-gradient(rgba(77, 200, 60, 0.28), rgba(29, 83, 20, 0.35));
  box-shadow: inset 0 0 0 1px var(--gold-2), inset 0 0 0 3px #0c0d0d;
}
.mod-icon { font-size: 1rem; line-height: 1; }
.mod-mult { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--muted); }
.mod-chip.on .mod-mult { color: var(--gold); }

/* ---------- HUD, wynik rundy, podsumowanie ---------- */
.hud-mult .hud-value { color: var(--gold); }
.result-mult {
  margin: 0 0 12px; padding: 7px 12px; font-size: 0.82rem; color: var(--gold-2); line-height: 1.5; border-radius: 8px;
  background: rgba(0, 0, 0, 0.45); box-shadow: inset 0 0 0 1px rgba(213, 191, 116, 0.35);
}
.summary-mods { margin: 0 0 10px; font-size: 0.88rem; color: var(--gold-2); }

/* ---------- Efekty tylko na obrazie widoku (celownik leży w .pz-overlay, więc ich nie dostaje) ---------- */
.game-screen.fx-blur, .game-screen.fx-gray { --fx-blur: blur(0); --fx-gray: grayscale(0); }
.game-screen.fx-blur { --fx-blur: blur(3px); }
.game-screen.fx-gray { --fx-gray: grayscale(1); }
.game-screen.fx-blur .view .pz-inner > img, .game-screen.fx-blur .view .pz-inner > canvas,
.game-screen.fx-gray .view .pz-inner > img, .game-screen.fx-gray .view .pz-inner > canvas {
  filter: var(--fx-blur) var(--fx-gray);
}
.view .pz-inner > canvas { display: block; image-rendering: pixelated; pointer-events: none; }
/* Lustro: odbicie samego obrazu wokół jego środka - celownik zostaje w środku widoku */
.game-screen.fx-mirror .view .pz-inner > img, .game-screen.fx-mirror .view .pz-inner > canvas { transform: scaleX(-1); }
.game-screen.fx-nozoom .view .pz { cursor: default; }
.game-screen.fx-nozoom .view-hint { visibility: hidden; }

/* Wąski ekran: w HUD sam mnożnik, bez podpisu (żeby nagłówek się mieścił) */
@media (max-width: 640px) {
  .hud-mult .hud-label { display: none; }
  .hud-mult { padding-top: 6px; padding-bottom: 6px; }
}