/* Pescaria Clicker – Pixel Art Retro Theme */

@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');

:root {
  --font-pixel: 'Press Start 2P', monospace;
}

html, body { height: 100%; overflow: hidden; }
* { image-rendering: pixelated; }

/* Desktop: grid preenche toda a altura do viewport */
@media (min-width: 1024px) {
  main {
    grid-template-rows: 1fr;
    align-items: stretch;
  }
  main > aside,
  main > section {
    max-height: none !important;
    height: 100%;
  }
}

/* Elementos exclusivos do layout mobile (barra de abas, ouro no header) */
@media (min-width: 1024px) {
  .mobile-only { display: none !important; }
}

/* ── LAYOUT MOBILE (abaixo de 1024px) ──
   Um painel por vez em tela cheia (Loja | Pescar | Balde), trocado pela barra de abas
   #mobile-nav. Os painéis são os mesmos do desktop (mesmos ids), só a disposição muda.
   A aba ativa vem de body[data-mobile-tab], definido por setMobileTab() em ui/mobileNav.js. */
@media (max-width: 1023.98px) {
  /* 100dvh: altura visível real (100vh inclui a área atrás da barra de endereço do navegador) */
  body.h-screen { height: 100vh; height: 100dvh; }

  main {
    display: flex !important;
    flex-direction: column;
  }
  main > [data-mpanel] {
    flex: 1 1 auto;
    min-height: 0;
  }
  body[data-mobile-tab="pescar"] main > [data-mpanel]:not([data-mpanel="pescar"]),
  body[data-mobile-tab="loja"]   main > [data-mpanel]:not([data-mpanel="loja"]),
  body[data-mobile-tab="balde"]  main > [data-mpanel]:not([data-mpanel="balde"]) {
    display: none !important;
  }

  #mobile-nav {
    padding-bottom: calc(6px + env(safe-area-inset-bottom));
  }
}

/* Avisos principais (pushNotice em ui/effects.js): topo, abaixo do header. O `top` é
   definido em JS (layoutNotices) pela altura real do header. */
#toast-stack {
  position: fixed;
  left: 50%;
  top: 68px;
  transform: translateX(-50%);
  z-index: 60;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: max-content;
  max-width: min(92vw, 420px);
  pointer-events: none;
}
.toast-item {
  position: relative;
  max-width: 100%;
  padding-right: 26px !important;
  cursor: pointer;
  pointer-events: auto;
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.3s, transform 0.3s;
}
.toast-item.is-shown { opacity: 1; transform: none; }
.toast-close {
  position: absolute;
  top: 5px;
  right: 7px;
  font-size: 8px;
  line-height: 1;
  opacity: 0.7;
}
.toast-item:hover .toast-close { opacity: 1; }

/* Cards de captura: descem para baixo dos avisos principais (top definido em layoutNotices) */
#catch-toast-container { transition: top 0.2s; }

.mobile-tab-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 48px;
  padding: 4px 2px;
  font-size: 8px;
  color: #64748b;
  background: #0f172a;
  border: 2px solid #1e293b;
  cursor: pointer;
}
.mobile-tab-btn b { font-weight: bold; color: #22d3ee; }
.mobile-tab-btn.is-active {
  color: #f1f5f9;
  background: #1e293b;
  border-color: #06b6d4;
  box-shadow: 2px 2px 0 #000;
}
.mobile-tab-btn.is-full b { color: #f87171; animation: mobile-bucket-full 1s ease-in-out infinite; }
@keyframes mobile-bucket-full { 50% { opacity: 0.35; } }

body {
  font-family: var(--font-pixel);
  user-select: none;
  background-color: #0a0e1a;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,0.015) 0px, rgba(255,255,255,0.015) 1px, transparent 1px, transparent 4px),
    repeating-linear-gradient(90deg, rgba(255,255,255,0.015) 0px, rgba(255,255,255,0.015) 1px, transparent 1px, transparent 4px);
}

/* Pixel Border Helper */
.pixel-border {
  border: 3px solid;
  border-image: none;
  box-shadow:
    inset 2px 2px 0 rgba(255,255,255,0.08),
    inset -2px -2px 0 rgba(0,0,0,0.3),
    3px 3px 0 rgba(0,0,0,0.5);
}

.pixel-border-thin {
  border: 2px solid;
  box-shadow:
    inset 1px 1px 0 rgba(255,255,255,0.06),
    inset -1px -1px 0 rgba(0,0,0,0.2),
    2px 2px 0 rgba(0,0,0,0.4);
}

/* Custom Scrollbars */
* {
  scrollbar-width: thin;
  scrollbar-color: #1e3a5f #0f172a;
}
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #0f172a; }
::-webkit-scrollbar-thumb { background: #1e3a5f; border: 2px solid #0f172a; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #0284c7; }

/* Rarity Glows */
.rarity-COMUM { border-color: #475569 !important; }
.rarity-INCOMUM { border-color: #0ea5e9 !important; box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 8px rgba(14,165,233,0.2); }
.rarity-RARO {
  border-color: #a855f7 !important;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 12px rgba(168,85,247,0.3);
}
.rarity-RARO img {
  filter: drop-shadow(0 0 4px rgba(168,85,247,0.6));
}
.rarity-EPICO {
  border-color: #f59e0b !important;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 14px rgba(245,158,11,0.35);
}
.rarity-EPICO img {
  filter: drop-shadow(0 0 6px rgba(245,158,11,0.7));
}
.rarity-LENDARIO {
  border-color: #ef4444 !important;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 18px rgba(239,68,68,0.5);
  animation: pulse-legend 2s infinite;
}
.rarity-LENDARIO img {
  filter: drop-shadow(0 0 8px rgba(239,68,68,0.9)) drop-shadow(0 0 2px #fff);
  animation: fish-legend-glow 1.5s ease-in-out infinite alternate;
}
.rarity-MITICO {
  border-color: #ec4899 !important;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 22px rgba(236,72,153,0.6);
  animation: cosmic-glow 4s infinite linear;
}
.rarity-MITICO img {
  filter: drop-shadow(0 0 10px rgba(236,72,153,0.9)) drop-shadow(0 0 4px #00ffff);
  animation: fish-mythic-glow 2s ease-in-out infinite alternate;
}
.rarity-SECRETO {
  border-color: #dc2626 !important;
  box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 24px rgba(220,38,38,0.7);
  animation: void-pulse 2s infinite ease-in-out;
}
.rarity-SECRETO img {
  filter: drop-shadow(0 0 10px rgba(239,68,68,0.95)) drop-shadow(0 0 5px #7f1d1d);
  animation: fish-void-glow 1.8s ease-in-out infinite alternate;
}

@keyframes pulse-legend {
  0%,100% { box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 12px rgba(239,68,68,0.4); }
  50%     { box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 24px rgba(239,68,68,0.8); }
}

@keyframes void-pulse {
  0%, 100% { box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 14px rgba(220,38,38,0.5); }
  50%      { box-shadow: 2px 2px 0 rgba(0,0,0,0.5), 0 0 28px rgba(239,68,68,0.95), inset 0 0 10px rgba(185,28,28,0.3); }
}

@keyframes fish-legend-glow {
  0%   { filter: drop-shadow(0 0 4px rgba(239,68,68,0.7)); transform: scale(1); }
  100% { filter: drop-shadow(0 0 12px rgba(239,68,68,1)) drop-shadow(0 0 4px #ffd700); transform: scale(1.05); }
}

@keyframes fish-mythic-glow {
  0%   { filter: drop-shadow(0 0 6px #ec4899) drop-shadow(0 0 3px #06b6d4); transform: scale(1); }
  100% { filter: drop-shadow(0 0 14px #ec4899) drop-shadow(0 0 8px #a855f7) drop-shadow(0 0 4px #fff); transform: scale(1.08); }
}

@keyframes fish-void-glow {
  0%   { filter: drop-shadow(0 0 6px rgba(239,68,68,0.8)) drop-shadow(0 0 2px #000); transform: scale(1); }
  100% { filter: drop-shadow(0 0 16px rgba(239,68,68,1)) drop-shadow(0 0 6px #dc2626) drop-shadow(0 0 2px #fff); transform: scale(1.08); }
}

@keyframes cosmic-glow {
  0%   { filter: hue-rotate(0deg); }
  100% { filter: hue-rotate(360deg); }
}

/* Botão PESCAR pixel art */
.btn-pescar {
  transition: transform 0.1s;
  box-shadow:
    inset -4px -4px 0 #7f1d1d,
    inset 4px 4px 0 #fca5a5,
    6px 6px 0 #000;
  border: 3px solid #1a1a2e;
  image-rendering: pixelated;
}
.btn-pescar:hover { transform: translateY(-2px); }
.btn-pescar:active {
  transform: translateY(4px);
  box-shadow:
    inset -4px -4px 0 #7f1d1d,
    inset 4px 4px 0 #fca5a5,
    2px 2px 0 #000;
}

/* Novo Botão PESCAR com Arte Customizada */
.btn-pescar-img {
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  image-rendering: pixelated;
  transition: transform 0.08s ease, filter 0.08s ease;
  user-select: none;
  -webkit-user-select: none;
}
.btn-pescar-img:hover {
  transform: translateY(-2px);
  filter: drop-shadow(0 6px 14px rgba(239, 68, 68, 0.5)) brightness(1.08);
}
.btn-pescar-img:active {
  transform: translateY(3px) scale(0.97);
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.8)) brightness(0.95);
}
/* Recarregando: botão apagado até poder pescar de novo */
.btn-pescar-img.cooling,
.btn-pescar-img.cooling:hover {
  transform: none;
  filter: grayscale(0.7) brightness(0.7);
  cursor: wait;
}

/* Segundos de recarga embaixo do botão PESCAR (altura fixa: o botão não pula quando some) */
.fish-cooldown-text {
  display: block;
  height: 12px;
  margin-top: 2px;
  font-family: var(--font-pixel);
  font-size: 10px;
  line-height: 12px;
  color: #e2e8f0;
  text-shadow: 1px 1px 0 #000;
}

/* ═══════════════════════════════════════════════
   ESTILO DE BOTÕES ARCADE / BEVEL PIXEL ART (INSPIRADO NO BOTÃO PESCAR)
   ═══════════════════════════════════════════════ */
.pixel-btn {
  position: relative;
  border-radius: 8px !important;
  border: 2px solid #000000 !important;
  background-image: linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.06) 48%, rgba(0,0,0,0.08) 52%, rgba(0,0,0,0.32) 100%) !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.45),
    inset 0 -2.5px 0 rgba(0, 0, 0, 0.45),
    inset 1.5px 0 0 rgba(255, 255, 255, 0.18),
    inset -1.5px 0 0 rgba(0, 0, 0, 0.25),
    0 3px 0 #000000,
    0 4px 6px rgba(0, 0, 0, 0.4) !important;
  transition: transform 0.08s ease, filter 0.08s ease, box-shadow 0.08s ease;
  image-rendering: pixelated;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.7);
  user-select: none;
  cursor: pointer;
  overflow: hidden;
}

/* Brilho especular clássico de arcade no cantinho superior esquerdo */
.pixel-btn::before {
  content: '';
  position: absolute;
  top: 2px;
  left: 3px;
  width: 5px;
  height: 2px;
  background: rgba(255, 255, 255, 0.75);
  border-radius: 1px;
  pointer-events: none;
  z-index: 2;
}

/* Brilho secundário no cantinho superior direito */
.pixel-btn::after {
  content: '';
  position: absolute;
  top: 2px;
  right: 3px;
  width: 3px;
  height: 2px;
  background: rgba(255, 255, 255, 0.55);
  border-radius: 1px;
  pointer-events: none;
  z-index: 2;
}

.pixel-btn:hover:not(:disabled) {
  filter: brightness(1.12);
  transform: translateY(-1px);
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.55),
    inset 0 -2.5px 0 rgba(0, 0, 0, 0.45),
    inset 1.5px 0 0 rgba(255, 255, 255, 0.22),
    inset -1.5px 0 0 rgba(0, 0, 0, 0.25),
    0 4px 0 #000000,
    0 6px 10px rgba(0, 0, 0, 0.45) !important;
}

.pixel-btn:active:not(:disabled) {
  transform: translateY(2px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1.5px 0 rgba(0, 0, 0, 0.45),
    0 1px 0 #000000,
    0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

.pixel-btn:disabled {
  opacity: 0.6;
  filter: grayscale(0.5);
  cursor: not-allowed !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 -2px 0 rgba(0, 0, 0, 0.3),
    0 2px 0 #000000 !important;
}

/* Abas de upgrades e inventário com cantos arredondados estilo arcade */
.tab-btn, .inv-tab-btn {
  border-radius: 6px !important;
  border: 2px solid #000000 !important;
  transition: all 0.1s ease;
  box-shadow: 0 2px 0 #000 !important;
}
.tab-btn:hover, .inv-tab-btn:hover {
  filter: brightness(1.1);
}
.tab-btn:active, .inv-tab-btn:active {
  transform: translateY(1px);
  box-shadow: 0 1px 0 #000 !important;
}

/* Water / Ripple */
.water-container {
  position: relative;
  overflow: hidden;
}

.ripple {
  position: absolute;
  border: 2px solid rgba(56,189,248,0.8);
  animation: rippleEffect 1s cubic-bezier(0.1,0.8,0.3,1) forwards;
  pointer-events: none;
}

@keyframes rippleEffect {
  0%   { width:0; height:0; opacity:1; transform:translate(-50%,-50%) scale(0.2); }
  100% { width:160px; height:80px; opacity:0; transform:translate(-50%,-50%) scale(1); }
}

/* Catch popup */
@keyframes catchFloatUp {
  0%   { opacity:0; transform:translateY(30px) scale(0.85); }
  20%  { opacity:1; transform:translateY(0) scale(1.05); }
  80%  { opacity:1; transform:translateY(-5px) scale(1); }
  100% { opacity:0; transform:translateY(-30px) scale(0.9); }
}
.catch-popup { animation: catchFloatUp 2.2s ease-out forwards; }

/* Float numbers */
@keyframes floatNumber {
  0%   { opacity:1; transform:translateY(0) scale(1); }
  100% { opacity:0; transform:translateY(-50px) scale(1.15); }
}
.floating-number {
  position: absolute;
  pointer-events: none;
  animation: floatNumber 1s ease-out forwards;
  text-shadow: 2px 2px 0 #000;
  z-index: 50;
}

/* Buff pill shimmer */
.buff-pill {
  background: linear-gradient(90deg, rgba(30,41,59,0.8) 0%, rgba(51,65,85,0.9) 50%, rgba(30,41,59,0.8) 100%);
  background-size: 200% 100%;
  animation: shimmer 4s infinite linear;
}
@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* Fish icon canvas */
.fish-icon-canvas {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}

/* Scanline overlay */
.scanlines::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    transparent 0px,
    transparent 2px,
    rgba(0,0,0,0.06) 2px,
    rgba(0,0,0,0.06) 4px
  );
  z-index: 5;
}

/* ═══ GOLDEN FISH ANIMATIONS ═══ */
@keyframes goldenFishFloat {
  0%, 100% { transform: translateY(0) rotate(-5deg); }
  50% { transform: translateY(-15px) rotate(5deg); }
}

@keyframes goldenFishShimmer {
  0% { filter: drop-shadow(0 0 8px #ffd700) drop-shadow(0 0 3px gold) brightness(1); }
  100% { filter: drop-shadow(0 0 20px #ffd700) drop-shadow(0 0 8px gold) brightness(1.3); }
}

@keyframes goldenRewardIn {
  0% { opacity: 0; transform: scale(0.5); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes goldenRewardPulse {
  0% { transform: scale(0.8); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

/* ═══ CONFIGURAÇÕES VISUAIS DO JOGO ═══ */
/* Desativa auras, glows e sombras pulsantes dos peixes */
body.disable-fish-glow .rarity-INCOMUM,
body.disable-fish-glow .rarity-RARO,
body.disable-fish-glow .rarity-EPICO,
body.disable-fish-glow .rarity-LENDARIO,
body.disable-fish-glow .rarity-MITICO,
body.disable-fish-glow .rarity-SECRETO {
  box-shadow: none !important;
  animation: none !important;
}

body.disable-fish-glow .rarity-INCOMUM img,
body.disable-fish-glow .rarity-RARO img,
body.disable-fish-glow .rarity-EPICO img,
body.disable-fish-glow .rarity-LENDARIO img,
body.disable-fish-glow .rarity-MITICO img,
body.disable-fish-glow .rarity-SECRETO img {
  filter: none !important;
  animation: none !important;
}

/* Desativa animações contínuas de pulso */
body.disable-fish-animations .animate-pulse,
body.disable-fish-animations .fish-icon-canvas {
  animation: none !important;
}


#golden-fish-event:hover {
  transform: scale(1.3) !important;
  filter: drop-shadow(0 0 25px #ffd700) drop-shadow(0 0 10px gold) brightness(1.5) !important;
}

#blood-moon-fish-event {
  cursor: pointer;
  user-select: none;
  animation: bloodFishFloat 2s ease-in-out infinite, bloodFishGlow 0.8s ease-in-out infinite alternate;
  transition: transform 0.15s, opacity 0.3s;
}
#blood-moon-fish-event:hover {
  transform: scale(1.35) !important;
  filter: drop-shadow(0 0 30px #ef4444) drop-shadow(0 0 12px #991b1b) brightness(1.6) !important;
}

@keyframes bloodFishFloat {
  0%, 100% { transform: translateY(0px) rotate(-2deg); }
  50% { transform: translateY(-8px) rotate(3deg); }
}

@keyframes bloodFishGlow {
  0% { filter: drop-shadow(0 0 10px #dc2626) drop-shadow(0 0 4px #7f1d1d); }
  100% { filter: drop-shadow(0 0 24px #ef4444) drop-shadow(0 0 10px #b91c1c); }
}

/* ═══ ECLIPSE VERMELHO ESTILO BERSERK ═══ */
.berserk-eclipse-container {
  position: absolute;
  top: 10px;
  right: 28px;
  z-index: 25;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.berserk-eclipse-container.hidden {
  display: none !important;
}

.berserk-eclipse-sun {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #020205;
  position: relative;
  box-shadow: 
    0 0 20px 8px rgba(220, 38, 38, 0.95),
    0 0 45px 16px rgba(185, 28, 28, 0.75),
    inset 0 0 15px rgba(220, 38, 38, 0.6);
  animation: berserk-eclipse-pulse 2.2s infinite ease-in-out;
}

.berserk-eclipse-sun::before {
  content: '';
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  background: radial-gradient(circle, transparent 55%, rgba(239, 68, 68, 0.7) 75%, rgba(153, 27, 27, 0.9) 100%);
  animation: berserk-corona-spin 12s linear infinite;
}

@keyframes berserk-eclipse-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 
      0 0 18px 6px rgba(220, 38, 38, 0.9),
      0 0 40px 14px rgba(185, 28, 28, 0.7),
      inset 0 0 12px rgba(220, 38, 38, 0.5);
  }
  50% {
    transform: scale(1.08);
    box-shadow: 
      0 0 30px 12px rgba(239, 68, 68, 1),
      0 0 60px 24px rgba(220, 38, 38, 0.85),
      inset 0 0 20px rgba(239, 68, 68, 0.8);
  }
}

@keyframes berserk-corona-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* ═══ AURAS DOS PEIXES DO EVENTO SANGRENTO ═══ */
.aura-lua-sangrenta {
  border-color: #ef4444 !important;
  box-shadow: 0 0 16px rgba(239, 68, 68, 0.85), inset 0 0 8px rgba(185, 28, 28, 0.4) !important;
  animation: aura-blood-pulse 1.8s infinite ease-in-out !important;
}

.aura-lua-sangrenta img {
  filter: drop-shadow(0 0 8px #ef4444) drop-shadow(0 0 4px #7f1d1d) !important;
  animation: fish-blood-glow 1.8s ease-in-out infinite alternate !important;
}

.aura-eclipse {
  border-color: #7f1d1d !important;
  box-shadow: 0 0 20px rgba(153, 27, 27, 0.9), 0 0 8px rgba(0, 0, 0, 0.95), inset 0 0 10px rgba(69, 10, 10, 0.8) !important;
  animation: aura-eclipse-pulse 2s infinite ease-in-out !important;
}

.aura-eclipse img {
  filter: drop-shadow(0 0 10px #dc2626) drop-shadow(0 0 4px #000) !important;
  animation: fish-eclipse-glow 2s ease-in-out infinite alternate !important;
}

@keyframes aura-blood-pulse {
  0%, 100% { box-shadow: 0 0 14px rgba(239, 68, 68, 0.7), inset 0 0 6px rgba(185, 28, 28, 0.3); }
  50%      { box-shadow: 0 0 24px rgba(239, 68, 68, 1), inset 0 0 12px rgba(220, 38, 38, 0.6); }
}

@keyframes fish-blood-glow {
  0%   { filter: drop-shadow(0 0 6px #ef4444) drop-shadow(0 0 2px #7f1d1d); transform: scale(1); }
  100% { filter: drop-shadow(0 0 14px #ef4444) drop-shadow(0 0 6px #dc2626); transform: scale(1.06); }
}

@keyframes aura-eclipse-pulse {
  0%, 100% { box-shadow: 0 0 16px rgba(153, 27, 27, 0.8), inset 0 0 8px rgba(0, 0, 0, 0.8); }
  50%      { box-shadow: 0 0 26px rgba(220, 38, 38, 0.98), inset 0 0 14px rgba(69, 10, 10, 0.9); }
}

@keyframes fish-eclipse-glow {
  0%   { filter: drop-shadow(0 0 6px #b91c1c) drop-shadow(0 0 3px #000); transform: scale(1); }
  100% { filter: drop-shadow(0 0 16px #ef4444) drop-shadow(0 0 6px #000); transform: scale(1.07); }
}

/* Suporte à desativação de auras nas configurações */
body.disable-fish-glow .aura-lua-sangrenta,
body.disable-fish-glow .aura-eclipse {
  box-shadow: none !important;
  animation: none !important;
}
body.disable-fish-glow .aura-lua-sangrenta img,
body.disable-fish-glow .aura-eclipse img {
  filter: none !important;
  animation: none !important;
}


/* Animações da Celebração de Primeiro Peixe Raro / Mítico / Secreto */
@keyframes fcParticleExplosion {
  0% {
    transform: translate(0, 0) scale(0) rotate(0deg);
    opacity: 1;
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(var(--tx), var(--ty)) scale(1.3) rotate(360deg);
    opacity: 0;
  }
}

.fc-particle {
  position: absolute;
  top: 50%;
  left: 50%;
  pointer-events: none;
  animation: fcParticleExplosion 1.8s cubic-bezier(0.1, 0.8, 0.25, 1) forwards;
}

@keyframes fcFloatAnim {
  0%, 100% {
    transform: translateY(0px) scale(1);
  }
  50% {
    transform: translateY(-8px) scale(1.03);
  }
}

.fc-fish-float {
  animation: fcFloatAnim 3s ease-in-out infinite;
}

/* Animações da Bóia e Anzol Submersos */
@keyframes buoy-bob {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

.animate-buoy-bob {
  animation: buoy-bob 3.2s ease-in-out infinite;
}

@keyframes hook-tug {
  0% { transform: translateY(0); }
  25% { transform: translateY(10px) scale(0.95); }
  50% { transform: translateY(-3px); }
  100% { transform: translateY(0); }
}

.hook-tug-active {
  animation: hook-tug 0.4s cubic-bezier(0.17, 0.89, 0.32, 1.28);
}

/* Emojis trocados por ícones pixel art (ui/pixelEmoji.js): do tamanho da fonte, alinhados ao texto */
.pixel-emoji-wrap { display: inline-block; width: 1em; height: 1em; line-height: 1; vertical-align: -0.125em; }
.pixel-emoji { display: block; width: 100%; height: 100%; image-rendering: pixelated; }

/* Menu do topo no celular: centralizado na tela, logo abaixo do cabeçalho, com rolagem se não couber */
@media (max-width: 639px) {
  #main-dropdown-menu {
    position: fixed;
    top: 56px;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    width: min(380px, calc(100vw - 16px));
    max-height: calc(100dvh - 72px);
    overflow-y: auto;
  }
}