/* Labirent Path — 4×4 kaydırmalı kaçış.
 *
 * Yapbozla aynı hareket mantığı, farklı hedef: bir tek taş önemli.
 * O yüzden bloklar sessiz, Dahi taşı ve portal yüksek sesle çiziliyor.
 *
 * ⚠️ Taşların DIŞ ölçüsü tam olarak %25 — boşluk iç dolgudan geliyor.
 * Dış ölçüden pay düşülseydi `translate(100%)` hücre adımından küçük
 * kalır, taşlar her sütunda birkaç piksel kayardı. */

.labirent {
  position: relative;
  width: min(94vw, 440px);
  aspect-ratio: 1;
  border-radius: var(--kose-buyuk);
  background: var(--beyaz);
  border: 1px solid var(--cizgi);
  box-shadow: var(--golge-orta);
  touch-action: none;
  overflow: hidden;
}

/* Portal blokların ÜSTÜNDE ve tıklamayı yutmuyor. Altta bırakılmıştı
   ve üstüne bir blok geldiğinde hedef görünmez oluyordu — oyuncu
   nereye gitmesi gerektiğini göremiyordu. Şimdi hep görünen bir
   çerçeve; simge blok varken soluklaşıyor. */
.portal {
  position: absolute;
  right: 3px;
  bottom: 3px;
  width: calc(25% - 6px);
  height: calc(25% - 6px);
  display: grid;
  place-items: center;
  z-index: 3;
  pointer-events: none;
  border-radius: var(--kose-kucuk);
  box-shadow: inset 0 0 0 3px var(--vurgu);
  font-size: clamp(1.4rem, 7vw, 2rem);
}

.portal span {
  display: block;
  opacity: 0.55;
  animation: dons 6s linear infinite;
}

@keyframes dons { to { transform: rotate(360deg); } }

.blok {
  position: absolute;
  left: 0;
  top: 0;
  width: 25%;
  height: 25%;
  padding: 3px;
  border: 0;
  background: none;
  cursor: pointer;
  transition: transform 170ms cubic-bezier(0.22, 0.61, 0.36, 1);
}

.blok__ic {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  border-radius: var(--kose-kucuk);
  background: var(--krem-koyu);
  color: var(--sonuk);
  font-family: var(--yazi-baslik);
  font-weight: 700;
  font-size: 0.95rem;
  box-shadow: inset 0 0 0 1px var(--cizgi);
  transition: box-shadow var(--gecis-hizli);
}

.blok:hover .blok__ic { box-shadow: inset 0 0 0 2px var(--cizgi-koyu); }

.blok--dahi { z-index: 2; }

.blok--dahi .blok__ic {
  background: var(--vurgu);
  color: var(--beyaz);
  font-size: clamp(1.3rem, 6.5vw, 1.9rem);
  box-shadow: 0 0 0 3px var(--parilti), var(--golge-kucuk);
}

.labirent.kacti .blok--dahi .blok__ic { animation: kacis 700ms ease-out; }

@keyframes kacis {
  0% { filter: none; }
  55% { filter: brightness(1.6); transform: scale(1.14); }
  100% { filter: none; transform: scale(1); }
}
