/* caza.css — el pote como marcador, su hoja y el aviso de hallazgo. */

/* ── El pote, ahora se puede tocar ───────────────────────────────────────── */

.modern .pote{
  /* En buzon.css era un dibujo y no recibía toques. Ahora es el botón que
     abre la hoja, así que recupera el puntero y una zona cómoda alrededor. */
  pointer-events: auto;
  border: 0;
  padding: 6px 10px 2px;
  background: none;
  cursor: pointer;
  border-radius: 20px;
  transition: scale .2s var(--ease);
}
.modern .pote:hover{ scale: 1.05; }
.modern .pote:focus-visible{ outline: 3px solid var(--cream); outline-offset: 2px; }

/* Las estrellas de dentro empiezan apagadas y se van encendiendo. El pote
   que ella me regaló está lleno; este empieza vacío y lo llena ella. */
.modern .pote-dentro path{
  fill: #6b5a3a;
  opacity: .28;
  filter: none;
  transition: opacity .5s var(--ease), fill .5s var(--ease);
}
.modern .pote-dentro path.pote-estrella-viva{
  fill: var(--naranja);
  opacity: .95;
  filter: drop-shadow(0 0 4px var(--naranja));
}
/* El latido solo en las encendidas: una estrella apagada que parpadea
   parecería que está a medias, y no lo está. */
.modern.motion-on .pote-dentro path{ animation: none; }
.modern.motion-on .pote-dentro path.pote-estrella-viva{
  animation: pote-latido 4.2s ease-in-out infinite;
}
/* Con el pote lleno, el cristal entero brilla. */
.modern .pote[data-hallados="7"] .pote-arte{
  filter: drop-shadow(0 0 26px #ff9a4d80);
}
.modern .pote-cuenta{
  display: block;
  margin-top: 2px;
  color: #c2b18c;
  font: 400 .72rem/1.2 'Patrick Hand', cursive;
  letter-spacing: .06em;
}

/* ── La hoja ─────────────────────────────────────────────────────────────── */

.modern dialog.caza-dialog{ width: min(620px, calc(100% - 32px)); }
.modern .caza-resumen{
  margin: -12px 0 20px;
  color: var(--naranja);
  font-size: .82em;
}
.modern .caza-lista{
  list-style: none;
  margin: 0 0 24px;
  padding: 0;
  display: grid;
  gap: 10px;
}
.modern .caza-fila{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding: 12px 16px;
  border: 1px dashed #a878ff40;
  border-radius: 16px;
  background: #a878ff0d;
  color: #cdbb96;
}
/* Lo encontrado pasa de violeta a naranja: el violeta es "todavía no" en
   toda la web, y aquí tiene que querer decir lo mismo. */
.modern .caza-fila-hecha{
  border-style: solid;
  border-color: #ff9a4d4d;
  background: #ff9a4d12;
  color: var(--text);
}
.modern .caza-marca{
  flex-shrink: 0;
  font-size: 1.1em;
  line-height: 1.4;
  color: var(--violeta);
  opacity: .75;
}
.modern .caza-fila-hecha .caza-marca{ color: var(--naranja); opacity: 1; }
.modern .caza-copia{ display: grid; gap: 2px; min-width: 0; }
.modern .caza-copia strong{ font-weight: 400; }
.modern .caza-copia small{ font-size: .72em; color: #c2b18c; }

.modern .caza-premio{
  margin-bottom: 24px;
  padding: 22px 24px;
  border: 1px solid var(--naranja);
  border-radius: 20px;
  background:
    radial-gradient(120% 140% at 10% 0%, #ff9a4d1f, transparent 60%),
    #2a2216;
}
.modern .caza-premio[hidden]{ display: none; }
.modern .caza-premio h3{
  margin: 0 0 14px;
  font: 400 30px/1.2 'Patrick Hand', cursive;
  color: var(--lavender);
}
.modern .caza-premio-texto p{ margin: 0 0 1em; }
.modern .caza-premio-texto p:last-child{ margin-bottom: 0; }
.modern .caza-premio-firma{
  margin: 18px 0 0;
  font-size: .76em;
  color: #c2b18c;
}

/* ── El aviso al encontrar ───────────────────────────────────────────────── */
/* Va abajo y estrecho a propósito: avisa sin tapar lo que se esté mirando,
   que suele ser justo lo que se acaba de descubrir. */

.modern .caza-aviso{
  position: fixed;
  left: 50%;
  bottom: max(20px, env(safe-area-inset-bottom));
  translate: -50% 0;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: min(30rem, calc(100% - 32px));
  padding: 14px 20px;
  border: 1px solid var(--naranja);
  border-radius: 18px;
  background: #1c160dfa;
  box-shadow: 0 10px 30px #000000a6;
  pointer-events: none;
}
.modern .caza-aviso[hidden]{ display: none; }
.modern .caza-aviso-estrella{
  flex-shrink: 0;
  font-size: 1.5rem;
  color: var(--naranja);
  text-shadow: 0 0 14px #ff9a4dcc;
}
.modern .caza-aviso-copia{ display: grid; gap: 2px; min-width: 0; }
.modern .caza-aviso-copia strong{
  font: 400 1.05rem/1.3 'Patrick Hand', cursive;
  color: var(--text);
}
.modern .caza-aviso-copia small{ font-size: .74rem; color: var(--naranja); letter-spacing: .05em; }
.modern.motion-on .caza-aviso-entra{
  animation: caza-aviso 460ms cubic-bezier(.2,.9,.25,1) both;
}
@keyframes caza-aviso{
  from{ opacity: 0; translate: -50% 22px; scale: .96; }
  to{ opacity: 1; translate: -50% 0; scale: 1; }
}
@media (prefers-reduced-motion: reduce){
  .modern.motion-on .caza-aviso-entra{ animation: none; }
  .modern .pote{ transition: none; }
}

/* El cartel de la nave tiene que poder tocarse: en extras.css el listón
   entero estaba fuera del alcance del puntero porque solo era adorno. */
.modern .flight-liston{ pointer-events: auto; cursor: pointer; }
.modern .flight-liston-cuerda{ pointer-events: none; }