/* Neuriosity — Memory Test playfield.
   Shared chrome (HUD, results, capture) lives in ../_shared/game-kit.css */

.neu-grid {
  display: grid;
  grid-template-columns: repeat(var(--cols, 3), 1fr);
  gap: calc(var(--gu) * 1.7);
  width: calc(var(--gu) * 60);
  max-width: 100%;
  aspect-ratio: 1;
}

.neu-tile {
  padding: 0;
  background: #fff;
  border: calc(var(--gu) * 0.28) solid rgba(8, 120, 232, 0.2);
  border-radius: calc(var(--gu) * 1.8);
  box-shadow: 0 calc(var(--gu) * 0.5) calc(var(--gu) * 1.2) rgba(6, 43, 99, 0.08);
  cursor: pointer;
  transition: background 150ms ease, transform 150ms ease, border-color 150ms ease;
}

.neu-grid.is-locked .neu-tile { cursor: default; }

.neu-grid:not(.is-locked) .neu-tile:hover {
  background: #eaf6ff;
  transform: translateY(calc(var(--gu) * -0.3));
}

.neu-tile:focus-visible {
  outline: calc(var(--gu) * 0.6) solid var(--blue-bright, #19a4f3);
  outline-offset: calc(var(--gu) * 0.4);
}

.neu-tile.is-flash {
  background: var(--blue, #0878e8);
  border-color: var(--blue, #0878e8);
  box-shadow: 0 0 calc(var(--gu) * 2.4) rgba(8, 120, 232, 0.5);
}

.neu-tile.is-correct {
  background: var(--teal, #13aa8b);
  border-color: var(--teal, #13aa8b);
  animation: neu-pop 260ms ease;
}

.neu-tile.is-wrong {
  background: var(--coral, #f15f6d);
  border-color: var(--coral, #f15f6d);
  animation: neu-shake 320ms ease;
}

.neu-tile.is-reveal {
  background: rgba(8, 120, 232, 0.34);
  border-color: rgba(8, 120, 232, 0.5);
}

@keyframes neu-pop {
  0% { transform: scale(0.84); }
  60% { transform: scale(1.06); }
  100% { transform: scale(1); }
}

@keyframes neu-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(calc(var(--gu) * -1)); }
  75% { transform: translateX(calc(var(--gu) * 1)); }
}