/* =====================================================================
   AlanyaKura — "YAYIN REJİSİ / BROADCAST" (Varyant A → kök uygulama, Revizyon 2)
   TV kura yayını grafik dili: alt bantlar (lower-third), yatay ışık süpürmeleri,
   keskin diyagonal kesimler, Oswald başlık + Montserrat gövde, gümüş/altın metalik
   kenarlar, gece laciverti zemin, elektrik mavisi vurgu, seçim kırmızısı #E0162B.
   Dikey bütçe: ÜST 40vh · ORTA 35vh · ALT 25vh (1080p ve 768p'de kaydırma yok).
   Gruplar: 8 sütun × (1 başlık + 6 satır); D–H'de 6. satır kapalı. Çipler: 9 × 5.
   ===================================================================== */

:root {
  --lac-0: #060B2B;
  --lac-1: #0A1442;
  --lac-2: #0E1B5A;
  --lac-3: #14267A;
  --elektrik: #1E6BFF;
  --elektrik-acik: #5EA0FF;
  --cyan: #00D4FF;
  --gumus: #C9D1DE;
  --gumus-koyu: #7E8AA3;
  --gumus-acik: #F2F5FA;
  --altin: #E8C56A;
  --altin-koyu: #9C7A2C;
  --kirmizi: #E0162B;
  --kirmizi-acik: #FF3B4E;
  --metin: #F2F5FA;
  --metin-soluk: rgba(201, 209, 222, 0.72);
  --cam: rgba(10, 20, 66, 0.58);
  --cam-kenar: rgba(201, 209, 222, 0.22);
  --metal: linear-gradient(135deg, #f2f5fa 0%, #8d98b0 26%, #e3e8f0 48%, #6f7b94 70%, #c9d1de 100%);
  --metal-yatay: linear-gradient(90deg, transparent, #c9d1de 20%, #f2f5fa 50%, #c9d1de 80%, transparent);
  --altin-yatay: linear-gradient(90deg, transparent, #9c7a2c 15%, #e8c56a 50%, #9c7a2c 85%, transparent);
  --ust-h: 40vh;
  --orta-h: 35vh;
  --alt-h: 25vh;
  --f-baslik: 'Oswald', 'Arial Narrow', 'Roboto Condensed', sans-serif;
  --f-govde: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
  --f-serif: 'Cinzel', 'Georgia', serif;
  --gecis-hizli: cubic-bezier(0.2, 0.8, 0.2, 1);
  --gecis-vurucu: cubic-bezier(0.2, 0.9, 0.3, 1.25);
  --grup-renk: var(--elektrik-acik);
  --grup-rgb: 94, 160, 255;
  --forma-renk: #7E8AA3;
  --forma-yazi: #ffffff;
  --forma-rgb: 126, 138, 163;
  --forma-kontur: rgba(255, 255, 255, 0.55);
  --forma-yaka: rgba(0, 0, 0, 0.38);
}

/* ---------------------------------------------------------------- temel */
*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body {
  overflow: hidden;
  background: var(--lac-0);
  color: var(--metin);
  font-family: var(--f-govde);
  font-size: 16px;
  line-height: 1.3;
  -webkit-font-smoothing: antialiased;
  user-select: none;
}
[hidden] { display: none !important; }
button { font-family: inherit; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.svg-tanimlar { position: absolute; width: 0; height: 0; overflow: hidden; }
kbd {
  font: 600 0.9em var(--f-govde);
  padding: 0.1em 0.45em;
  border: 1px solid var(--gumus-koyu);
  border-bottom-width: 2px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--gumus-acik);
}

/* ---------------------------------------------------------------- zemin */
.zemin { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.zemin > * { position: absolute; inset: 0; }
.zemin-yildizlar { width: 100%; height: 100%; opacity: 0.85; }
.zemin-nefes {
  background:
    radial-gradient(ellipse 55% 45% at 18% 12%, rgba(30, 107, 255, 0.26), transparent 70%),
    radial-gradient(ellipse 45% 40% at 84% 88%, rgba(0, 212, 255, 0.14), transparent 70%),
    radial-gradient(ellipse 70% 60% at 50% 50%, rgba(14, 27, 90, 0.9), transparent 100%);
  animation: nefes 10s ease-in-out infinite alternate;
  will-change: opacity, transform;
}
@keyframes nefes {
  from { opacity: 0.55; transform: scale(1); }
  to { opacity: 1; transform: scale(1.06); }
}
.zemin-izgara {
  background-image:
    linear-gradient(rgba(94, 160, 255, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(94, 160, 255, 0.06) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 70% 70% at 50% 45%, #000 20%, transparent 100%);
  mask-image: radial-gradient(ellipse 70% 70% at 50% 45%, #000 20%, transparent 100%);
}
/* Özgün yıldız-geometri deseni: seyrek, dönen çokgen ışıklar (marka öğesi değil) */
.zemin-yildiz-desen {
  background:
    conic-gradient(from 0deg at 12% 22%, transparent 0 40deg, rgba(94, 160, 255, 0.07) 41deg 43deg, transparent 44deg 130deg, rgba(94, 160, 255, 0.07) 131deg 133deg, transparent 134deg 220deg, rgba(94, 160, 255, 0.07) 221deg 223deg, transparent 224deg 310deg, rgba(94, 160, 255, 0.07) 311deg 313deg, transparent 314deg),
    conic-gradient(from 20deg at 86% 78%, transparent 0 60deg, rgba(232, 197, 106, 0.06) 61deg 63deg, transparent 64deg 150deg, rgba(232, 197, 106, 0.06) 151deg 153deg, transparent 154deg 240deg, rgba(232, 197, 106, 0.06) 241deg 243deg, transparent 244deg 330deg, rgba(232, 197, 106, 0.06) 331deg 333deg, transparent 334deg),
    radial-gradient(circle at 12% 22%, rgba(94, 160, 255, 0.12), transparent 12%),
    radial-gradient(circle at 86% 78%, rgba(232, 197, 106, 0.1), transparent 12%);
  -webkit-mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, #000 30%, transparent 100%);
  mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, #000 30%, transparent 100%);
  animation: desen-don 90s linear infinite;
  will-change: transform;
}
@keyframes desen-don { from { transform: rotate(0deg) scale(1.15); } to { transform: rotate(360deg) scale(1.15); } }
.zemin-isin {
  inset: -60vh -20vw;
  width: 22vw;
  background: linear-gradient(90deg, transparent, rgba(94, 160, 255, 0.10) 45%, rgba(242, 245, 250, 0.12) 50%, rgba(94, 160, 255, 0.10) 55%, transparent);
  transform: rotate(18deg) translateX(-40vw);
  animation: isin-kay 16s linear infinite;
  will-change: transform;
}
.zemin-isin--2 { width: 9vw; opacity: 0.6; animation-duration: 23s; animation-delay: -9s; }
.zemin-isin--3 {
  width: 5vw; opacity: 0.5; animation-duration: 31s; animation-delay: -17s;
  background: linear-gradient(90deg, transparent, rgba(232, 197, 106, 0.08) 45%, rgba(255, 255, 255, 0.1) 50%, rgba(232, 197, 106, 0.08) 55%, transparent);
}
@keyframes isin-kay {
  from { transform: rotate(18deg) translateX(-50vw); }
  to { transform: rotate(18deg) translateX(190vw); }
}
/* İnce hareketli çizgiler (yayın rejisi "scanline" hissi, çok düşük opaklık) */
.zemin-cizgi {
  inset: auto -10vw;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(201, 209, 222, 0.22) 30%, rgba(255, 255, 255, 0.35) 50%, rgba(201, 209, 222, 0.22) 70%, transparent);
  animation: cizgi-kay 22s linear infinite;
  will-change: transform;
  opacity: 0.55;
}
.zemin-cizgi--1 { top: -2px; }
.zemin-cizgi--2 { top: -2px; animation-duration: 37s; animation-delay: -14s; opacity: 0.35; }
.zemin-cizgi--3 { top: -2px; animation-duration: 29s; animation-delay: -25s; opacity: 0.25; }
@keyframes cizgi-kay { from { transform: translateY(0); } to { transform: translateY(102vh); } }
.zemin-vinyet { background: radial-gradient(ellipse at center, transparent 50%, rgba(3, 6, 20, 0.78) 100%); }

/* ---------------------------------------------------------------- düzen */
.duzen {
  position: relative;
  z-index: 1;
  height: 100vh;
  display: grid;
  grid-template-rows: var(--ust-h) var(--orta-h) var(--alt-h);
}
.duzen > section { min-height: 0; }

/* ---------------------------------------------------------------- FORMA (jersey) rozeti */
.forma-rozet {
  position: relative;
  display: inline-grid;
  place-items: center;
  flex: none;
  aspect-ratio: 1;
  height: 100%;
  color: var(--forma-yazi);
  filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.55));
  transition: filter 0.3s, opacity 0.3s, transform 0.3s;
}
.forma { width: 100%; height: 100%; overflow: visible; display: block; }
.forma-no {
  position: absolute;
  left: 50%; top: 58%;
  transform: translate(-50%, -50%);
  font: 700 0.34em/1 var(--f-baslik);
  font-size: calc(var(--forma-boyut, 40px) * 0.34);
  color: var(--forma-yazi);
  letter-spacing: -0.02em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.16), 0 -1px 0 rgba(0, 0, 0, 0.3), 0 2px 4px rgba(0, 0, 0, 0.25);
  pointer-events: none;
}
.forma-rozet--hayalet { opacity: 0.3; filter: grayscale(0.4); }
.forma-rozet--vur { animation: forma-vur 0.55s var(--gecis-vurucu); }
@keyframes forma-vur {
  0% { transform: scale(0.6) rotate(-8deg); opacity: 0; }
  60% { transform: scale(1.12) rotate(2deg); opacity: 1; }
  100% { transform: scale(1) rotate(0); }
}

/* ================================================================ ÜST BANT */
.ust-bant {
  display: grid;
  grid-template-columns: clamp(270px, 20.5vw, 400px) minmax(0, 1fr) clamp(240px, 17.8vw, 350px);
  gap: 0.9vw;
  padding: 1.3vh 1.2vw 0.5vh;
}

/* --- başlık bloğu (diyagonal kesimli yayın paneli) */
.baslik-blok {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1vh;
  padding: 1.6vh 1.2vw 1.6vh 1.3vw;
  min-width: 0;
  isolation: isolate;
}
.baslik-blok::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -3;
  background: var(--metal);
  clip-path: polygon(0 0, 100% 0, calc(100% - 3.2vh) 100%, 0 100%);
  opacity: 0.85;
}
.baslik-blok::after {
  content: '';
  position: absolute;
  inset: 1.5px;
  z-index: -2;
  background: linear-gradient(160deg, rgba(20, 38, 122, 0.92), rgba(6, 11, 43, 0.96) 70%);
  clip-path: polygon(0 0, 100% 0, calc(100% - 3.2vh) 100%, 0 100%);
}
/* Ali Nazım Köseoğlu portresi (assets/img/ali-nazim-koseoglu.webp): başlığın sağında, yüz net; sola doğru metnin
   altında eriyerek kaybolur. Lacivert–sıcak gümüş duotone (arac: Pillow). */
.baslik-portre {
  position: absolute;
  top: 1.5px; bottom: 1.5px; right: 1.5px;
  width: 74%;
  z-index: -1;
  clip-path: polygon(0 0, 100% 0, calc(100% - 3.2vh) 100%, 0 100%);
  background: url('../assets/img/ali-nazim-koseoglu.webp') no-repeat 78% 32% / cover;
  opacity: 0.9;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,0.3) 32%, rgba(0,0,0,0.85) 56%, #000 70%),
                      linear-gradient(180deg, rgba(0,0,0,0.7) 0%, #000 20%, #000 60%, rgba(0,0,0,0.5) 82%, rgba(0,0,0,0.12) 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,0.3) 32%, rgba(0,0,0,0.85) 56%, #000 70%),
              linear-gradient(180deg, rgba(0,0,0,0.7) 0%, #000 20%, #000 60%, rgba(0,0,0,0.5) 82%, rgba(0,0,0,0.12) 100%);
  mask-composite: intersect;
  pointer-events: none;
}
.canli-rozet {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  align-self: flex-start;
  padding: 0.25em 0.8em 0.25em 0.6em;
  background: var(--kirmizi);
  color: #fff;
  font: 600 clamp(10px, 1.3vh, 14px)/1 var(--f-baslik);
  letter-spacing: 0.28em;
  clip-path: polygon(0 0, 100% 0, calc(100% - 6px) 100%, 0 100%);
}
.canli-rozet i {
  width: 0.6em; height: 0.6em; border-radius: 50%;
  background: #fff;
  animation: canli-nokta 1.1s ease-in-out infinite;
}
@keyframes canli-nokta { 0%, 100% { opacity: 1; } 50% { opacity: 0.2; } }
.turnuva-ad {
  margin: 0;
  font: 500 clamp(14px, 1.95vh, 23px)/1.15 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--gumus);
}
.kura-baslik { position: relative; padding-bottom: 1.3vh; }
.kura-baslik-metin {
  display: block;
  font: 700 clamp(38px, 6.8vh, 78px)/0.95 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.015em;
  background: linear-gradient(180deg, #ffffff 0%, #dfe5ef 40%, #8d98b0 62%, #f2f5fa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 4px 14px rgba(0, 0, 0, 0.45));
}
.kura-baslik::after {
  content: '';
  position: absolute;
  left: 0; bottom: 0;
  width: 42%; height: 4px;
  background: var(--kirmizi);
  clip-path: polygon(0 0, 100% 0, calc(100% - 6px) 100%, 0 100%);
}
.sezon-etiket {
  font: 700 clamp(10px, 1.35vh, 14px)/1.35 var(--f-govde);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--elektrik-acik);
}
.baslik-ozet {
  font: 600 clamp(8px, 1.1vh, 12px)/1.5 var(--f-govde);
  letter-spacing: 0.1em;
  color: var(--metin-soluk);
  overflow: hidden;
}

/* --- harita kutusu */
.harita-kutu {
  position: relative;
  isolation: isolate; /* .harita-gravur z-index:-1 panel zemininin ÜSTÜNDE, haritanın ALTINDA kalsın */
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background:
    radial-gradient(ellipse 80% 90% at 50% 50%, rgba(20, 38, 122, 0.45), rgba(6, 11, 43, 0.2) 100%),
    rgba(6, 11, 43, 0.35);
  border: 1px solid var(--cam-kenar);
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.35), 0 10px 40px rgba(0, 0, 0, 0.35);
}
.harita-kutu::before, .harita-kutu::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 14%;
  z-index: 2;
  pointer-events: none;
}
.harita-kutu::before { top: 0; background: linear-gradient(180deg, rgba(6, 11, 43, 0.95), transparent); }
.harita-kutu::after { bottom: 0; background: linear-gradient(0deg, rgba(6, 11, 43, 0.95), transparent); }
/* R17: harita kendi compositor katmanında — viewBox her karede değişince yalnız harita yeniden rasterlenir,
   altındaki sayfa (zemin, kutu gölgeleri) değil. Ölçüm: 41 → 61 fps, 50 ms+ kare 22 → 2. */
.harita { display: block; width: 100%; height: 100%; will-change: transform; }
/* Alanya limanı panoraması (assets/img/alanya-liman.webp): haritanın arkasında ışıklı gravür.
   Odak/lazer sırasında sönükleşir ki kesim hattı ve renkler öne çıksın. */
.harita-gravur {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url('../assets/img/alanya-liman.webp') no-repeat center 58% / cover;
  opacity: 0.34;
  mix-blend-mode: screen;
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, #000 22%, #000 80%, rgba(0,0,0,0.5) 100%),
                      linear-gradient(90deg, rgba(0,0,0,0.6), #000 12%, #000 88%, rgba(0,0,0,0.6));
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, #000 22%, #000 80%, rgba(0,0,0,0.5) 100%),
              linear-gradient(90deg, rgba(0,0,0,0.6), #000 12%, #000 88%, rgba(0,0,0,0.6));
  mask-composite: intersect;
  transition: opacity 0.9s ease;
  pointer-events: none;
}
.harita-kutu:has(.harita--odak) .harita-gravur { opacity: 0.1; }
.harita-tarama {
  position: absolute;
  top: 0; bottom: 0; left: -12%;
  width: 12%;
  z-index: 2;
  background: linear-gradient(90deg, transparent, rgba(94, 160, 255, 0.07) 60%, rgba(242, 245, 250, 0.16) 100%);
  border-right: 1px solid rgba(201, 209, 222, 0.28);
  animation: tarama-gec 9s cubic-bezier(0.4, 0, 0.6, 1) infinite;
  pointer-events: none;
  will-change: transform;
}
@keyframes tarama-gec {
  0% { transform: translateX(0); opacity: 0; }
  8% { opacity: 1; }
  88% { opacity: 1; }
  100% { transform: translateX(940%); opacity: 0; }
}
body.akis--calisiyor .harita-tarama { animation-play-state: paused; opacity: 0; }
.harita-kose {
  position: absolute;
  width: clamp(14px, 2.2vh, 24px); height: clamp(14px, 2.2vh, 24px);
  z-index: 3;
  border: 2px solid var(--gumus);
  pointer-events: none;
}
.harita-kose--sol-ust { top: 4px; left: 4px; border-right: 0; border-bottom: 0; }
.harita-kose--sag-ust { top: 4px; right: 4px; border-left: 0; border-bottom: 0; }
.harita-kose--sol-alt { bottom: 4px; left: 4px; border-right: 0; border-top: 0; }
.harita-kose--sag-alt { bottom: 4px; right: 4px; border-left: 0; border-top: 0; }
.harita-kaynak {
  position: absolute;
  right: 10px; bottom: 5px;
  z-index: 3;
  font: 500 10px/1 var(--f-govde);
  color: var(--metin-soluk);
  opacity: 0.55;
  pointer-events: none;
}

/* harita lejantları (grup renkleri sol, forma renkleri sağ; akış sırasında gizlenir) */
.harita-lejant {
  position: absolute;
  top: 50%;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 0.35vh;
  padding: 0.7vh 0.7vw;
  transform: translateY(-50%);
  background: linear-gradient(180deg, rgba(6, 11, 43, 0.72), rgba(10, 20, 66, 0.5));
  border: 1px solid rgba(201, 209, 222, 0.14);
  font: 600 clamp(8px, 1.15vh, 12px)/1 var(--f-govde);
  letter-spacing: 0.14em;
  color: var(--gumus);
  pointer-events: none;
  transition: opacity 0.35s;
}
.harita-lejant--gruplar { left: 1vw; }
.harita-lejant--formalar { right: 1vw; }
.harita-lejant-baslik {
  margin-bottom: 0.3vh;
  font: 600 clamp(8px, 1.1vh, 12px)/1 var(--f-baslik);
  letter-spacing: 0.3em;
  color: var(--elektrik-acik);
}
.lejant-satir { display: flex; align-items: center; gap: 0.5em; height: clamp(12px, 2.3vh, 24px); white-space: nowrap; }
.lejant-renk { width: 0.9em; height: 0.9em; flex: none; background: var(--grup-renk); box-shadow: 0 0 8px rgba(var(--grup-rgb), 0.6); }
.lejant-satir .forma-rozet { height: 100%; --forma-boyut: clamp(12px, 2.3vh, 24px); }
body.akis--calisiyor .harita-lejant { opacity: 0; }

/* harita etiketi (alt bant, sol alt) */
.harita-etiket {
  position: absolute;
  left: 1vw; bottom: 1.8vh;
  z-index: 4;
  display: flex;
  flex-direction: column;
  padding: 0.6vh 1.6vw 0.6vh 1vw;
  background: linear-gradient(90deg, rgba(6, 11, 43, 0.96), rgba(14, 27, 90, 0.85) 75%, transparent);
  border-left: 5px solid var(--kirmizi);
  clip-path: polygon(0 0, 100% 0, calc(100% - 1.6vh) 100%, 0 100%);
  opacity: 0;
  transform: translateX(-24px);
  transition: opacity 0.3s var(--gecis-hizli), transform 0.35s var(--gecis-hizli);
  pointer-events: none;
}
.harita-etiket--acik { opacity: 1; transform: translateX(0); }
.harita-etiket-ust {
  font: 600 clamp(9px, 1.25vh, 13px)/1 var(--f-baslik);
  letter-spacing: 0.35em;
  color: var(--kirmizi-acik);
}
.harita-etiket-ad {
  font: 700 clamp(22px, 3.9vh, 46px)/1.05 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #fff;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
}

/* --- SVG harita içi (R2.5: yumuşak konturlar, iç parlaklık, kıyı ışıltısı, arazi gradyanı) */
.harita .ilce { stroke: rgba(201, 209, 222, 0.62); stroke-width: 1.1; stroke-linejoin: round; }
.harita .ilce--yedek { stroke: none; }
.harita .ilce-isik { fill: rgba(94, 160, 255, 0.34); }
.harita .kiyi-hale { fill: none; stroke: rgba(0, 212, 255, 0.55); stroke-width: 5; stroke-linejoin: round; }
.harita .kiyi-isilti {
  fill: none;
  stroke: rgba(180, 235, 255, 0.85);
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-dasharray: 3 14 1 22 5 30;
  animation: kiyi-akis 9s linear infinite;
  pointer-events: none;
}
@keyframes kiyi-akis { from { stroke-dashoffset: 0; } to { stroke-dashoffset: -300; } }
.harita .hucre {
  fill: rgba(20, 38, 122, 0.22);
  stroke: rgba(201, 209, 222, 0.16);
  stroke-width: 0.6;
  stroke-linejoin: round;
  stroke-linecap: round;
  transition: fill 0.35s ease, opacity 0.35s ease, stroke 0.35s ease;
}
.harita .harita-hucreler-soluk .hucre { fill: rgba(20, 38, 122, 0.04); stroke: rgba(201, 209, 222, 0.11); }
.harita .hucre--katilimci {
  fill: rgba(40, 118, 255, 0.36);
  stroke: rgba(214, 226, 245, 0.62);
  stroke-width: 0.8;
  cursor: pointer;
}
.harita .hucre--katilimci:hover, .harita .hucre--on { fill: rgba(94, 160, 255, 0.72); stroke: #fff; stroke-width: 1.1; }
.harita--odak .hucre--katilimci:not(.hucre--secili):not(.hucre--parlak):not(.hucre--yerlesti):not(.hucre--lazer):not(.hucre--kesildi) {
  fill: rgba(30, 107, 255, 0.14);
}
.harita--odak .hucre--yerlesti { opacity: 0.55; }
/* Lazer sırasında hücre: hafif kor rengi; kapanışta beyaz flaş → kırmızı dolgu */
.harita .hucre--lazer {
  fill: rgba(224, 22, 43, 0.16);
  stroke: rgba(255, 120, 120, 0.35);
  stroke-width: 0.8;
  transition: none;
}
.harita .hucre--kesildi {
  stroke: #fff;
  stroke-width: 1.8;
  filter: drop-shadow(0 0 6px rgba(255, 59, 78, 0.95)) drop-shadow(0 0 18px rgba(255, 59, 78, 0.55));
  animation: hucre-kesildi 0.5s ease-out both;
}
@keyframes hucre-kesildi {
  0% { fill: #ffffff; stroke: #ffffff; }
  35% { fill: #ffd9c2; }
  100% { fill: #ff3b4e; stroke: #ffffff; }
}
.harita .hucre--secili {
  fill: var(--kirmizi);
  stroke: #fff;
  stroke-width: 1.8;
  filter: drop-shadow(0 0 6px rgba(255, 59, 78, 0.95)) drop-shadow(0 0 18px rgba(255, 59, 78, 0.55));
  animation: hucre-yanip 0.52s ease-in-out 2; /* R6: 2 × 0.52 s (SURE.yanipAdim × yanipSayisi ile aynı) */
}
@keyframes hucre-yanip {
  0%, 100% { fill: rgba(224, 22, 43, 0.18); stroke: rgba(255, 255, 255, 0.5); }
  50% { fill: #ff3b4e; stroke: #fff; }
}
.harita .hucre--parlak {
  fill: var(--kirmizi-acik);
  stroke: #fff;
  stroke-width: 2;
  filter: drop-shadow(0 0 6px rgba(255, 59, 78, 0.95)) drop-shadow(0 0 18px rgba(255, 59, 78, 0.55));
  animation: hucre-nabiz 1.1s ease-in-out infinite;
}
@keyframes hucre-nabiz {
  0%, 100% { fill: #ff3b4e; }
  50% { fill: #e0162b; }
}
.harita .hucre--yerlesti { stroke-width: 1.1; opacity: 0.96; }
/* İç parlaklık (ic-parlak) R17'de bir kez raster'a pişirilir (harita.js _isimaRasterle); raster hazır olana kadar
   vektör filtre kalır ve hareket sırasında kapatılır. */
.harita--hareket .harita-hucreler-katilimci { filter: none; }
.hucre-harf {
  font-family: var(--f-baslik);
  font-weight: 700;
  fill: #fff;
  text-anchor: middle;
  dominant-baseline: central;
  paint-order: stroke;
  stroke: rgba(6, 11, 43, 0.85);
  stroke-width: 1.4px;
  pointer-events: none;
  transform-box: fill-box;
  transform-origin: center;
}
.hucre-harf--yeni { animation: harf-belir 0.6s var(--gecis-vurucu) both; }
@keyframes harf-belir {
  from { opacity: 0; transform: scale(2.6); }
  to { opacity: 1; transform: scale(1); }
}
.dalga { fill: none; stroke: var(--kirmizi-acik); stroke-width: 2.5; }

/* --- LAZER KESİM katmanı */
.harita-lazer { pointer-events: none; }
/* Işıma SVG filtresi yerine CSS drop-shadow (ekran pikseli): zoom ne olursa olsun aynı kalınlıkta parlar,
   kor iz asla lazer başının önüne taşmaz. */
.lazer-iz { fill: none; stroke: #ff3b3b; stroke-linecap: round; stroke-linejoin: round; /* stroke-width JS'te birim cinsinden */
  filter: drop-shadow(0 0 3px #ff3b3b) drop-shadow(0 0 12px rgba(255, 50, 50, 0.7)); } /* R17: 3 → 2 blur geçişi */
.lazer-cekirdek { fill: none; stroke: #ffd9c2; stroke-linecap: round; stroke-linejoin: round; }
.lazer-kuyruk { fill: none; stroke: #ffffff; stroke-linecap: round; stroke-linejoin: round;
  filter: drop-shadow(0 0 4px #fff2e0) drop-shadow(0 0 10px #ff8a5b); }
/* Odak (lazer/yanıp sönme/zoom) sırasında "spot ışığı": ilçe ve katılımcı olmayan hücreler kararır */
.harita .harita-ilce, .harita .harita-hucreler-soluk, .harita .harita-on-kiyi { transition: opacity 0.5s ease; }
.harita--odak .harita-ilce { opacity: 0.6; }
.harita--odak .harita-hucreler-soluk { opacity: 0.45; }
.lazer-iz-grup { transition: opacity 0.7s ease-out 0.15s; }
.lazer-iz-grup--kapandi { opacity: 0; }
.lazer-cekirdek-grup { transition: opacity 0.5s ease-out 0.2s; }
.lazer-iz-grup--kapandi + .lazer-cekirdek-grup { opacity: 0; }
/* Kesim HUD'u (R7): köşe parantezleri, ilerleme yayı, yüzde */
.lazer-hud { transition: opacity 0.4s ease-out; }
.lazer-hud--kapandi { opacity: 0 !important; }
.lazer-hud-kose { fill: none; stroke: rgba(242, 245, 250, 0.9); stroke-linecap: square; filter: drop-shadow(0 0 3px rgba(94, 160, 255, 0.6)); }
/* Daktilo ad (R12): harita panelinin TAM ORTASI, HTML katmanı; tam ad görünmez olarak yerleşir (genişlik sabit → ortalı),
   harfler soldan sağa görünür olur; imleç son görünen harfin ardında. Zoom'dan bağımsız. */
.harita-daktilo {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  display: none;
  white-space: nowrap;
  font: 700 clamp(20px, 3.4vh, 40px)/1 var(--f-baslik);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #fff;
  text-shadow: 0 0 10px rgba(255, 59, 78, 0.55), 0 0 2px rgba(6, 11, 43, 0.9), 0 2px 5px rgba(0, 0, 0, 0.6);
  pointer-events: none;
  transition: text-shadow 0.4s, opacity 0.4s;
  will-change: transform; /* R17: harf başına güncelleme altındaki katmanı boyatmasın */
}
.harita-daktilo--acik { display: block; }
.harita-daktilo--tam { text-shadow: 0 0 18px rgba(255, 90, 110, 0.9), 0 0 2px rgba(6, 11, 43, 0.9), 0 3px 6px rgba(0, 0, 0, 0.6); }
.harita-daktilo i { font-style: normal; visibility: hidden; }
.harita-daktilo i.gorunur { visibility: visible; }
.harita-daktilo i.imlec::after { content: '|'; margin-left: 0.04em; font-weight: 400; animation: daktilo-imlec 0.5s steps(1) infinite; }
@keyframes daktilo-imlec { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
.harita-daktilo--tam i.imlec::after { content: ''; }
/* Kesim sırasında spot: alt bant ve gruplar kararır, hedef slot öne çıkar */
body.akis--kesim .cipler, body.akis--kesim .grup:not(.grup--sira) { opacity: 0.42; transition: opacity 0.5s; }
body.akis--kesim .grup--sira .slot:not(.slot--hedef) { opacity: 0.55; transition: opacity 0.5s; }
.cipler, .grup, .slot { transition: opacity 0.5s; }
.lazer-uc-hale { fill: #ff3b3b; opacity: 0.55; filter: blur(4px); }
.lazer-uc-dis { fill: #ff8a5b; opacity: 0.95; filter: drop-shadow(0 0 6px #ff5a3b); }
.lazer-uc { fill: #ffffff; filter: drop-shadow(0 0 3px #ffffff); }
.lazer-kivilcim { fill: #ffd9c2; }

/* --- sıradaki paneli */
.siradaki-blok {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.9vh;
  padding: 1.3vh 1vw 1.3vh;
  min-width: 0;
  background: linear-gradient(200deg, rgba(14, 27, 90, 0.85), rgba(6, 11, 43, 0.92));
  border: 1px solid var(--cam-kenar);
  border-right: 3px solid transparent;
  border-image: linear-gradient(180deg, #f2f5fa, #7e8aa3 45%, #c9d1de) 1;
  clip-path: polygon(2.6vh 0, 100% 0, 100% 100%, 0 100%, 0 2.6vh);
}
.siradaki-ust {
  display: flex;
  align-items: center;
  gap: 0.6em;
  font: 600 clamp(10px, 1.4vh, 15px)/1 var(--f-baslik);
  letter-spacing: 0.32em;
  color: var(--elektrik-acik);
}
.siradaki-ust::after { content: ''; flex: 1; height: 1px; background: var(--metal-yatay); opacity: 0.6; }
.siradaki-slot {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.6vw;
  padding: 0.6vh 0.7vw;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid var(--cam-kenar);
  border-left: 4px solid var(--sira-renk, var(--elektrik-acik));
  min-width: 0;
  transition: border-color 0.4s;
}
.siradaki-forma { height: clamp(38px, 6.6vh, 76px); --forma-boyut: clamp(38px, 6.6vh, 76px); filter: drop-shadow(0 0 10px rgba(var(--forma-rgb), 0.55)) drop-shadow(0 3px 6px rgba(0, 0, 0, 0.6)); }
.siradaki-detay { display: flex; flex-direction: column; gap: 0.35vh; min-width: 0; }
#siradaki-grup {
  font: 600 clamp(16px, 2.5vh, 29px)/1 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}
#siradaki-sira {
  font: 700 clamp(10px, 1.4vh, 15px)/1 var(--f-govde);
  letter-spacing: 0.22em;
  color: var(--metin-soluk);
  white-space: nowrap;
}
#siradaki-forma-ad {
  font: 700 clamp(9px, 1.25vh, 13px)/1 var(--f-govde);
  letter-spacing: 0.08em;
  color: var(--gumus);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.4s;
}
.siradaki-harf {
  font: 700 clamp(40px, 7vh, 84px)/0.9 var(--f-baslik);
  color: var(--sira-renk, var(--elektrik-acik));
  text-shadow: 0 0 22px rgba(var(--sira-rgb, 94, 160, 255), 0.55);
  transition: color 0.4s;
}
.siradaki-harf--vur { animation: sayac-vur 0.5s var(--gecis-vurucu); }
.sayac {
  display: flex;
  align-items: baseline;
  font: 600 clamp(22px, 3.7vh, 42px)/1 var(--f-baslik);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.sayac-bol { color: var(--metin-soluk); margin: 0 0.12em; font-weight: 500; }
#sayac-toplam { color: var(--gumus); }
.sayac-etiket {
  margin-left: 0.7em;
  font: 700 clamp(9px, 1.25vh, 13px)/1 var(--f-govde);
  letter-spacing: 0.25em;
  color: var(--metin-soluk);
}
#sayac-yerlesen.sayac--vur { animation: sayac-vur 0.5s var(--gecis-vurucu); display: inline-block; }
@keyframes sayac-vur {
  0% { transform: translateY(0.5em); opacity: 0; }
  60% { transform: translateY(-0.08em); opacity: 1; }
  100% { transform: translateY(0); }
}
.ilerleme {
  position: relative;
  height: clamp(5px, 0.9vh, 9px);
  background: rgba(255, 255, 255, 0.09);
  -webkit-mask-image: repeating-linear-gradient(90deg, #000 0 calc(100% / var(--bolum, 43) - 2px), transparent calc(100% / var(--bolum, 43) - 2px) calc(100% / var(--bolum, 43)));
  mask-image: repeating-linear-gradient(90deg, #000 0 calc(100% / var(--bolum, 43) - 2px), transparent calc(100% / var(--bolum, 43) - 2px) calc(100% / var(--bolum, 43)));
}
.ilerleme::before {
  content: '';
  position: absolute;
  inset: 0;
  width: calc(var(--oran, 0) * 100%);
  background: linear-gradient(90deg, var(--elektrik), var(--cyan));
  transition: width 0.6s var(--gecis-hizli);
}
.son-yerlesen {
  display: flex;
  flex-direction: column;
  gap: 0.35vh;
  padding: 0.7vh 0.8vw;
  min-width: 0;
  border: 1px solid rgba(201, 209, 222, 0.12);
  border-left: 3px solid var(--grup-renk, rgba(201, 209, 222, 0.3));
  background: linear-gradient(90deg, rgba(var(--grup-rgb, 126, 138, 163), 0.16), rgba(0, 0, 0, 0.18) 70%);
  transition: border-color 0.4s, background 0.4s;
}
.son-yerlesen-ust {
  font: 600 clamp(8px, 1.1vh, 12px)/1 var(--f-baslik);
  letter-spacing: 0.3em;
  color: var(--metin-soluk);
}
.son-yerlesen-ad {
  font: 600 clamp(14px, 2.2vh, 26px)/1 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.son-yerlesen-slot {
  font: 700 clamp(8px, 1.1vh, 12px)/1.3 var(--f-govde);
  letter-spacing: 0.08em;
  color: var(--grup-renk, var(--gumus));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rastgele-btn {
  position: relative;
  margin-top: auto;
  padding: 1.2vh 1vw;
  background: var(--kirmizi);
  border: 0;
  color: #fff;
  font: 600 clamp(14px, 2.15vh, 23px)/1 var(--f-baslik);
  letter-spacing: 0.18em;
  clip-path: polygon(9px 0, 100% 0, calc(100% - 9px) 100%, 0 100%);
  cursor: pointer;
  overflow: hidden;
  transition: background 0.2s, transform 0.15s, opacity 0.2s;
}
.rastgele-btn::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 40%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  transform: translateX(-140%) skewX(-20deg);
}
.rastgele-btn:hover:not(:disabled) { background: var(--kirmizi-acik); transform: translateY(-1px); }
.rastgele-btn:hover:not(:disabled)::after { animation: supur 0.7s var(--gecis-hizli); }
.rastgele-btn:active:not(:disabled) { transform: translateY(1px); }
.rastgele-btn:disabled { opacity: 0.35; cursor: not-allowed; }
@keyframes supur {
  from { transform: translateX(-140%) skewX(-20deg); }
  to { transform: translateX(340%) skewX(-20deg); }
}

/* ================================================================ ORTA BANT: GRUPLAR */
.orta-bant {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--grup-sayisi, 8), minmax(0, 1fr));
  gap: 0.65vw;
  padding: 0.7vh 1.2vw;
}
.orta-bant::before {
  content: '';
  position: absolute;
  left: 1.2vw; right: 1.2vw; top: 0;
  height: 1px;
  background: var(--altin-yatay);
  opacity: 0.5;
}
.grup {
  position: relative;
  display: grid;
  grid-template-rows: auto repeat(var(--satir-sayisi, 6), minmax(0, 1fr));
  gap: 0.5vh;
  min-height: 0;
  min-width: 0;
}
.grup-baslik {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 0.4em;
  padding: 0.35vh 0.7vw 0.4vh;
  background: linear-gradient(90deg, rgba(var(--grup-rgb), 0.28), rgba(255, 255, 255, 0.04) 70%, transparent);
  border-bottom: 2px solid var(--grup-renk);
  clip-path: polygon(0 0, calc(100% - 1.4vh) 0, 100% 100%, 0 100%);
  overflow: hidden;
}
.grup-baslik::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 45%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
  transform: translateX(-140%) skewX(-20deg);
  pointer-events: none;
}
.grup--vurgu .grup-baslik::after { animation: supur 0.9s var(--gecis-hizli); }
.grup--vurgu .grup-baslik { animation: baslik-parla 1.1s ease-out; }
@keyframes baslik-parla {
  0% { box-shadow: 0 0 0 rgba(var(--grup-rgb), 0); }
  25% { box-shadow: 0 0 26px rgba(var(--grup-rgb), 0.75); }
  100% { box-shadow: 0 0 0 rgba(var(--grup-rgb), 0); }
}
.grup--sira .grup-baslik { border-bottom-width: 3px; }
.grup--sira .grup-harf { text-shadow: 0 0 18px rgba(var(--grup-rgb), 0.8); }
.grup-harf {
  font: 700 clamp(19px, 3.1vh, 36px)/1 var(--f-baslik);
  color: var(--grup-renk);
}
.grup-etiket {
  font: 700 clamp(8px, 1.15vh, 12px)/1 var(--f-govde);
  letter-spacing: 0.26em;
  color: var(--metin-soluk);
}
.grup-kapasite {
  margin-left: auto;
  padding-right: 1vh;
  font: 600 clamp(7px, 1vh, 11px)/1 var(--f-govde);
  letter-spacing: 0.18em;
  color: var(--metin-soluk);
  opacity: 0.8;
}
.grup--dolu .grup-kapasite { color: var(--grup-renk); opacity: 1; }
.grup--dolu .grup-kapasite::before { content: '✓ '; }
.grup--doldu-vur { animation: grup-doldu 1.5s ease-out; }
@keyframes grup-doldu {
  0% { box-shadow: 0 0 0 rgba(var(--grup-rgb), 0); }
  20% { box-shadow: 0 0 0 2px rgba(var(--grup-rgb), 0.9), 0 0 34px rgba(var(--grup-rgb), 0.55); }
  100% { box-shadow: 0 0 0 rgba(var(--grup-rgb), 0); }
}
.slot {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.4vw;
  min-height: 0;
  min-width: 0;
  padding: 0.35vh 0.5vw 0.35vh 0.4vw;
  background: var(--cam);
  border: 1px solid var(--cam-kenar);
  border-left: 3px solid rgba(201, 209, 222, 0.22);
  overflow: hidden;
  transition: border-color 0.3s, background 0.3s, box-shadow 0.3s;
}
.slot::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 1px;
  background: var(--metal-yatay);
  opacity: 0.25;
}
.slot-forma { height: 82%; --forma-boyut: clamp(20px, 4.4vh, 50px); }
.slot:not(.slot--dolu) .slot-forma { opacity: 0.32; filter: grayscale(0.15) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5)); }
.slot--hedef .slot-forma { opacity: 0.75; animation: forma-nabiz 1.5s ease-in-out infinite; }
@keyframes forma-nabiz { 0%, 100% { opacity: 0.55; } 50% { opacity: 1; } }
.slot--dolu .slot-forma {
  opacity: 1;
  filter: drop-shadow(0 0 7px rgba(var(--forma-rgb), 0.7)) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.6));
}
.slot--yeni .slot-forma { animation: forma-parla 1s ease-out; }
@keyframes forma-parla {
  0% { transform: scale(1.7); filter: drop-shadow(0 0 0 rgba(255, 255, 255, 0)) brightness(2.6); }
  50% { transform: scale(1.15); filter: drop-shadow(0 0 18px rgba(255, 255, 255, 0.9)) brightness(1.6); }
  100% { transform: scale(1); filter: drop-shadow(0 0 7px rgba(var(--forma-rgb), 0.7)) brightness(1); }
}
.slot-ad {
  flex: 1;
  min-width: 0;
  font: 500 clamp(16px, 2.3vh, 26px)/1 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #fff;
}
.slot:not(.slot--dolu) .slot-ad::before { content: '—'; color: rgba(201, 209, 222, 0.3); }
.slot--hedef {
  border-color: rgba(var(--grup-rgb), 0.8);
  border-left-color: var(--grup-renk);
  box-shadow: inset 0 0 18px rgba(var(--grup-rgb), 0.18);
  animation: hedef-nabiz 1.5s ease-in-out infinite;
}
@keyframes hedef-nabiz {
  0%, 100% { box-shadow: inset 0 0 14px rgba(var(--grup-rgb), 0.12); }
  50% { box-shadow: inset 0 0 26px rgba(var(--grup-rgb), 0.38), 0 0 12px rgba(var(--grup-rgb), 0.35); }
}
.slot--dolu {
  border-color: rgba(var(--grup-rgb), 0.45);
  border-left-color: var(--grup-renk);
  background: linear-gradient(90deg, rgba(var(--grup-rgb), 0.26), var(--cam) 65%);
}
.slot--yeni { animation: slot-parla 0.9s ease-out; }
.slot--yeni::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 45%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.55), transparent);
  transform: translateX(-140%) skewX(-20deg);
  animation: supur 0.8s 0.05s var(--gecis-hizli) both;
  pointer-events: none;
}
@keyframes slot-parla {
  0% { box-shadow: 0 0 0 rgba(255, 255, 255, 0); background-color: rgba(255, 255, 255, 0.4); }
  100% { box-shadow: 0 0 0 rgba(255, 255, 255, 0); }
}
/* Bu grupta olmayan sıra: kart yüksekliği korunur, satır zarifçe kapalı */
.slot-yok {
  position: relative;
  min-height: 0;
  opacity: 0.55;
}
.slot-yok::before {
  content: '';
  position: absolute;
  left: 8%; right: 8%; top: 50%;
  height: 1px;
  background: repeating-linear-gradient(90deg, rgba(201, 209, 222, 0.28) 0 6px, transparent 6px 12px);
}

/* ================================================================ ALT BANT: ÇİPLER + TICKER */
.alt-bant {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 0.5vh;
  padding: 0.5vh 1.2vw 0.8vh;
}
.cipler {
  --cip-bosluk-x: 0.4vw;
  --cip-bosluk-y: 0.5vh;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: flex-start;
  gap: var(--cip-bosluk-y) var(--cip-bosluk-x);
  min-height: 0;
}
.cip {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  flex: 0 0 calc((100% - (var(--cip-sutun, 9) - 1) * var(--cip-bosluk-x)) / var(--cip-sutun, 9));
  height: calc((100% - (var(--cip-satir, 5) - 1) * var(--cip-bosluk-y)) / var(--cip-satir, 5));
  min-height: 0;
  min-width: 0;
  padding: 0 0.3vw;
  font: 700 clamp(13px, 1.75vh, 20px)/1 var(--f-govde);
  text-transform: uppercase;
  letter-spacing: 0.01em;
  white-space: nowrap;
  color: var(--gumus-acik);
  background: linear-gradient(180deg, rgba(20, 38, 122, 0.6), rgba(10, 20, 66, 0.78));
  border: 1px solid rgba(201, 209, 222, 0.3);
  clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.15s, background 0.2s, border-color 0.2s, color 0.2s, opacity 0.25s;
}
.cip::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 40%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
  transform: translateX(-140%) skewX(-20deg);
  pointer-events: none;
}
.cip:hover:not(:disabled) {
  transform: translateY(-1px);
  background: linear-gradient(180deg, rgba(30, 107, 255, 0.75), rgba(14, 27, 90, 0.95));
  border-color: var(--elektrik-acik);
  color: #fff;
}
.cip:hover:not(:disabled)::after { animation: supur 0.6s var(--gecis-hizli); }
.cip:active:not(:disabled) { transform: translateY(1px); }
.cip-ad { overflow: hidden; text-overflow: ellipsis; }
.cip-rozet {
  display: none;
  align-items: center;
  justify-content: center;
  min-width: 1.5em;
  height: 1.35em;
  padding: 0 0.3em;
  border-radius: 2px;
  background: var(--grup-renk);
  color: #06102b;
  font: 700 0.85em/1 var(--f-baslik);
}
.cip--tur { background: linear-gradient(180deg, rgba(94, 160, 255, 0.9), rgba(30, 107, 255, 0.8)); border-color: #fff; color: #fff; }
.cip--secili {
  background: var(--kirmizi) !important;
  border-color: #fff !important;
  color: #fff;
  animation: cip-nabiz 0.62s ease-in-out infinite;
}
@keyframes cip-nabiz {
  0%, 100% { box-shadow: inset 0 0 0 rgba(255, 255, 255, 0); }
  50% { box-shadow: inset 0 0 0 40px rgba(255, 255, 255, 0.28); }
}
.cip--yerlesti {
  opacity: 0.55;
  cursor: default;
  background: rgba(3, 6, 20, 0.45);
  border-color: rgba(var(--grup-rgb), 0.45);
  color: var(--gumus);
}
.cip--yerlesti .cip-rozet { display: inline-flex; }
.cip:disabled:not(.cip--yerlesti):not(.cip--secili) { opacity: 0.5; cursor: not-allowed; }
.cipler--kilitli .cip { pointer-events: none; }

.ticker {
  display: flex;
  align-items: stretch;
  height: clamp(18px, 2.7vh, 30px);
  overflow: hidden;
  border-top: 1px solid rgba(201, 209, 222, 0.2);
  background: rgba(3, 6, 20, 0.5);
}
.ticker-etiket {
  flex: none;
  display: flex;
  align-items: center;
  padding: 0 1.4vw 0 1vw;
  background: var(--kirmizi);
  color: #fff;
  font: 600 clamp(10px, 1.35vh, 14px)/1 var(--f-baslik);
  letter-spacing: 0.3em;
  clip-path: polygon(0 0, 100% 0, calc(100% - 9px) 100%, 0 100%);
}
.ticker-ray { position: relative; flex: 1; overflow: hidden; }
.ticker-icerik {
  position: absolute;
  top: 0; bottom: 0; left: 0;
  display: flex;
  align-items: center;
  white-space: nowrap;
  font: 600 clamp(10px, 1.35vh, 14px)/1 var(--f-govde);
  letter-spacing: 0.16em;
  color: var(--gumus);
  animation: ticker-kay var(--ticker-sure, 48s) linear infinite;
  will-change: transform;
}
.ticker-icerik b { color: var(--elektrik-acik); font-weight: 700; }
.ticker-icerik i { font-style: normal; color: var(--kirmizi-acik); margin: 0 1.2em; }
@keyframes ticker-kay {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* ================================================================ SAHNE (3 görsel + dev tipografi) */
.sahne {
  position: fixed;
  left: 0; right: 0;
  top: var(--ust-h);
  bottom: 0;
  z-index: 20;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  background: linear-gradient(180deg, rgba(6, 11, 43, 0.9), rgba(6, 11, 43, 0.98));
  overflow: hidden;
  border-top: 1px solid rgba(201, 209, 222, 0.3);
}
.sahne-gravur {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: url('../assets/img/alanya-kale.webp') no-repeat center 40% / 74% auto;
  opacity: 0.13;
  mix-blend-mode: screen;
  -webkit-mask-image: radial-gradient(ellipse 70% 80% at 50% 45%, #000 40%, transparent 100%);
  mask-image: radial-gradient(ellipse 70% 80% at 50% 45%, #000 40%, transparent 100%);
  pointer-events: none;
}
.sahne > :not(.sahne-gravur) { position: relative; z-index: 1; }
.sahne--acik { animation: sahne-gir 0.5s var(--gecis-hizli) both; }
.sahne--kapaniyor { animation: sahne-cik 0.32s ease-in both; pointer-events: none; }
@keyframes sahne-gir {
  from { clip-path: polygon(0 0, 0 0, -14% 100%, -14% 100%); }
  to { clip-path: polygon(0 0, 114% 0, 100% 100%, 0 100%); }
}
@keyframes sahne-cik {
  from { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); opacity: 1; }
  to { clip-path: polygon(114% 0, 100% 0, 100% 100%, 114% 100%); opacity: 0.6; }
}
.sahne-gorseller {
  display: flex;
  min-height: 0;
  padding: 1.6vh 1.2vw 0.6vh;
}
.sahne-panel {
  position: relative;
  flex: 1;
  min-width: 0;
  margin: 0 -1.5%;
  background: var(--lac-1);
  clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%);
  overflow: hidden;
  opacity: 0;
  transform: translateY(14px);
}
.sahne-panel:first-child { margin-left: 0; clip-path: polygon(0 0, 100% 0, 93% 100%, 0 100%); }
.sahne-panel:last-child { margin-right: 0; clip-path: polygon(7% 0, 100% 0, 100% 100%, 0 100%); }
.sahne-panel--acik { animation: panel-gir 0.6s var(--gecis-hizli) forwards; }
@keyframes panel-gir {
  0% { opacity: 0; transform: translateY(14px); filter: brightness(2.2); }
  60% { opacity: 1; filter: brightness(1.15); }
  100% { opacity: 1; transform: translateY(0); filter: brightness(1); }
}
.sahne-panel img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: var(--kb-kok, 50% 50%);
  animation: ken-burns 8s ease-out forwards;
  will-change: transform;
}
@keyframes ken-burns {
  from { transform: scale(1.06) translate(0, 0); }
  to { transform: scale(1.24) translate(var(--kb-x, -2%), var(--kb-y, -1.5%)); }
}
.sahne-panel::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(6, 11, 43, 0.25), transparent 30%, transparent 70%, rgba(6, 11, 43, 0.55));
  pointer-events: none;
}
.sahne-panel-no {
  position: absolute;
  left: 10%; top: 1.4vh;
  z-index: 2;
  padding: 0.3em 0.7em;
  background: rgba(6, 11, 43, 0.75);
  border-left: 3px solid var(--kirmizi);
  font: 600 clamp(10px, 1.4vh, 15px)/1 var(--f-baslik);
  letter-spacing: 0.3em;
  color: var(--gumus);
}
.sahne-yedek {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.6vh;
  background:
    radial-gradient(ellipse 60% 70% at 50% 40%, rgba(94, 160, 255, 0.35), transparent 70%),
    linear-gradient(160deg, var(--lac-3), var(--lac-0));
}
.sahne-yedek::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(201, 209, 222, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201, 209, 222, 0.08) 1px, transparent 1px);
  background-size: 40px 40px;
}
.sahne-yedek-harf {
  position: relative;
  font: 700 clamp(60px, 16vh, 180px)/1 var(--f-baslik);
  background: var(--metal);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.sahne-yedek-ad {
  position: relative;
  font: 600 clamp(12px, 1.8vh, 20px)/1 var(--f-baslik);
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--gumus);
}
.sahne-alt { padding: 0.4vh 1.2vw 1.8vh; }
.sahne-alt-bant {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 1.6vw;
  padding: 1vh 2.4vw 1.1vh 1.6vw;
  background: linear-gradient(90deg, rgba(14, 27, 90, 0.96), rgba(10, 20, 66, 0.8) 60%, rgba(10, 20, 66, 0.3));
  border-left: 7px solid var(--kirmizi);
  clip-path: polygon(0 0, 100% 0, calc(100% - 3.4vh) 100%, 0 100%);
  overflow: hidden;
}
.sahne-alt-bant::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 2px;
  background: var(--metal-yatay);
  opacity: 0.7;
}
.sahne-etiket {
  grid-column: 1;
  font: 600 clamp(11px, 1.6vh, 18px)/1 var(--f-baslik);
  letter-spacing: 0.38em;
  color: var(--kirmizi-acik);
  animation: ad-gir 0.45s var(--gecis-hizli) both;
}
.sahne-ad {
  grid-column: 1;
  font: 700 clamp(42px, 8.8vh, 112px)/0.95 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.01em;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 4px 24px rgba(0, 0, 0, 0.55), 0 0 40px rgba(94, 160, 255, 0.25);
  animation: ad-gir 0.55s 0.05s var(--gecis-vurucu) both;
}
.sahne-hedef {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  display: flex;
  align-items: center;
  gap: 1vw;
  height: clamp(54px, 9.6vh, 110px);
  padding: 0.8vh 1.4vw 0.8vh 1vw;
  border: 1px solid rgba(var(--grup-rgb), 0.9);
  border-left: 5px solid var(--grup-renk);
  background: linear-gradient(90deg, rgba(var(--grup-rgb), 0.22), rgba(var(--grup-rgb), 0.08));
  font: 600 clamp(14px, 2.5vh, 29px)/1 var(--f-baslik);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #fff;
  white-space: nowrap;
  animation: ad-gir 0.5s 0.2s var(--gecis-hizli) both;
}
.sahne-hedef-forma { height: 100%; --forma-boyut: clamp(54px, 8.6vh, 100px); filter: drop-shadow(0 0 14px rgba(var(--forma-rgb), 0.65)) drop-shadow(0 4px 8px rgba(0, 0, 0, 0.6)); animation: forma-vur 0.6s 0.25s var(--gecis-vurucu) both; }
.sahne-hedef-metin { display: flex; align-items: center; gap: 0.55em; }
.sahne-hedef-metin b { font-weight: 700; color: var(--grup-renk); text-shadow: 0 0 14px rgba(var(--grup-rgb), 0.6); }
.sahne-hedef-metin i { font-style: normal; color: var(--metin-soluk); }
.sahne-hedef-metin em { font-style: normal; font-weight: 700; text-shadow: 0 0 12px rgba(255, 255, 255, 0.25); }
@keyframes ad-gir {
  from { opacity: 0; transform: translateX(-28px); }
  to { opacity: 1; transform: translateX(0); }
}
.sahne-supurme {
  position: absolute;
  inset: -20% -35%;
  background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, 0.09) 50%, transparent 58%);
  animation: supurme-gec 2.6s ease-in-out 0.9s infinite;
  pointer-events: none;
}
@keyframes supurme-gec {
  from { transform: translateX(-45%); }
  to { transform: translateX(45%); }
}
/* Sahnede süzülen ışık parçacıkları (yalnız transform/opacity) */
.sahne-parcaciklar { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.sahne-parcaciklar i {
  position: absolute;
  bottom: -2vh;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.95), rgba(94, 160, 255, 0.4) 60%, transparent 70%);
  opacity: 0;
  animation: parcacik-yuksel 7s linear infinite;
  will-change: transform, opacity;
}
.sahne-parcaciklar i:nth-child(1) { left: 6%; animation-duration: 8s; animation-delay: -1s; }
.sahne-parcaciklar i:nth-child(2) { left: 14%; animation-duration: 6.5s; animation-delay: -4s; width: 3px; height: 3px; }
.sahne-parcaciklar i:nth-child(3) { left: 23%; animation-duration: 9s; animation-delay: -2.5s; }
.sahne-parcaciklar i:nth-child(4) { left: 31%; animation-duration: 7.2s; animation-delay: -6s; width: 4px; height: 4px; }
.sahne-parcaciklar i:nth-child(5) { left: 40%; animation-duration: 8.4s; animation-delay: -3.3s; }
.sahne-parcaciklar i:nth-child(6) { left: 48%; animation-duration: 6.8s; animation-delay: -0.5s; width: 3px; height: 3px; }
.sahne-parcaciklar i:nth-child(7) { left: 57%; animation-duration: 9.4s; animation-delay: -5.1s; }
.sahne-parcaciklar i:nth-child(8) { left: 65%; animation-duration: 7.6s; animation-delay: -2s; width: 6px; height: 6px; }
.sahne-parcaciklar i:nth-child(9) { left: 74%; animation-duration: 8.8s; animation-delay: -4.6s; }
.sahne-parcaciklar i:nth-child(10) { left: 82%; animation-duration: 6.9s; animation-delay: -1.7s; width: 3px; height: 3px; }
.sahne-parcaciklar i:nth-child(11) { left: 90%; animation-duration: 8.1s; animation-delay: -3.9s; }
.sahne-parcaciklar i:nth-child(12) { left: 96%; animation-duration: 7.4s; animation-delay: -5.8s; width: 4px; height: 4px; }
@keyframes parcacik-yuksel {
  0% { transform: translate(0, 0); opacity: 0; }
  12% { opacity: 0.85; }
  85% { opacity: 0.5; }
  100% { transform: translate(2vw, -64vh); opacity: 0; }
}

/* ================================================================ FLIP UÇUŞ */
.ucus-katmani { position: fixed; inset: 0; z-index: 30; pointer-events: none; }
.ucan-kart {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 0.4vw;
  padding: 0.35vh 0.5vw 0.35vh 0.4vw;
  transform-origin: 0 0;
  background: linear-gradient(90deg, rgba(var(--grup-rgb), 0.85), rgba(14, 27, 90, 0.96) 70%);
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-left: 4px solid var(--grup-renk);
  color: #fff;
  font: 500 clamp(16px, 2.3vh, 26px)/1 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.55), 0 0 28px rgba(var(--grup-rgb), 0.6);
  will-change: transform;
}
.ucan-kart-forma { height: 82%; --forma-boyut: clamp(20px, 4.4vh, 50px); filter: drop-shadow(0 0 8px rgba(var(--forma-rgb), 0.8)); }

/* ================================================================ KURA TAMAMLANDI */
.tamamlandi {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  height: var(--alt-h);
  z-index: 25;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(6, 11, 43, 0.55), rgba(6, 11, 43, 0.97) 35%);
  border-top: 2px solid transparent;
  border-image: var(--altin-yatay) 1;
  animation: tamam-gir 0.6s var(--gecis-hizli) both;
}
@keyframes tamam-gir {
  from { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); }
  to { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
}
.tamamlandi::before {
  content: '';
  position: absolute;
  inset: -20% -30%;
  background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, 0.12) 50%, transparent 58%);
  animation: supurme-gec 3s ease-in-out 0.4s infinite;
}
.tamamlandi-gravur {
  position: absolute;
  inset: 0;
  background: url('../assets/img/alanya-kale.webp') no-repeat center 30% / 62% auto;
  opacity: 0.20;
  mix-blend-mode: screen;
  -webkit-mask-image: radial-gradient(ellipse 60% 90% at 50% 40%, #000 35%, transparent 100%);
  mask-image: radial-gradient(ellipse 60% 90% at 50% 40%, #000 35%, transparent 100%);
  pointer-events: none;
}
.tamamlandi-ic { position: relative; text-align: center; padding: 0 2vw; }
.tamamlandi-ust {
  font: 500 clamp(11px, 1.8vh, 20px)/1 var(--f-baslik);
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--elektrik-acik);
}
.tamamlandi-baslik {
  margin: 0.4vh 0 0.6vh;
  font: 700 clamp(38px, 9vh, 108px)/1 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  background: linear-gradient(180deg, #ffffff 0%, #f3e3b0 35%, #c9a24a 60%, #fff5d6 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 6px 22px rgba(0, 0, 0, 0.5));
  animation: baslik-vur 0.8s 0.25s var(--gecis-vurucu) both;
}
@keyframes baslik-vur {
  from { opacity: 0; transform: scale(1.6); }
  to { opacity: 1; transform: scale(1); }
}
.tamamlandi-alt {
  margin: 0;
  font: 700 clamp(11px, 1.7vh, 18px)/1 var(--f-govde);
  letter-spacing: 0.26em;
  color: var(--gumus);
}
.tamamlandi-ipucu {
  margin-top: 1.2vh;
  font: 600 clamp(10px, 1.3vh, 14px)/1.6 var(--f-govde);
  letter-spacing: 0.12em;
  color: var(--metin-soluk);
}

.konfeti { position: fixed; inset: 0; z-index: 26; pointer-events: none; opacity: 0; transition: opacity 0.4s; }
.konfeti--acik { opacity: 1; }
.flas { position: fixed; inset: 0; z-index: 35; background: #fff; opacity: 0; pointer-events: none; }

/* ================================================================ ARAÇ ÇUBUĞU (ticker barının sağ ucunda; çiplerin üstüne taşmaz) */
.arac-cubugu {
  flex: none;
  display: flex;
  align-items: stretch;
  gap: 0;
  height: 100%;
  padding: 0 0.3vw 0 0.5vw;
  background: rgba(6, 11, 43, 0.92);
  border-left: 1px solid var(--cam-kenar);
  opacity: 0.55;
  transition: opacity 0.2s;
}
.ticker:hover .arac-cubugu, .arac-cubugu:focus-within { opacity: 1; }
.arac-btn {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 0.35em;
  padding: 0 0.55vw;
  background: transparent;
  border: 0;
  color: var(--gumus);
  font: 600 clamp(9px, 1.15vh, 12px)/1 var(--f-govde);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.arac-btn svg { width: clamp(11px, 1.6vh, 16px); height: clamp(11px, 1.6vh, 16px); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.arac-btn:hover:not(:disabled) { color: #fff; background: rgba(30, 107, 255, 0.4); }
.arac-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.arac-btn--pasif { color: var(--kirmizi-acik); }

/* ================================================================ MODALLAR */
.yardim, .modal {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  background: rgba(3, 6, 20, 0.74);
  animation: modal-gir 0.2s ease-out;
}
@keyframes modal-gir { from { opacity: 0; } to { opacity: 1; } }
.panel {
  position: relative;
  width: min(620px, 90vw);
  padding: 3vh 2.4vw 2.6vh;
  background: linear-gradient(180deg, var(--lac-2), var(--lac-1));
  border: 1px solid var(--cam-kenar);
  border-top: 4px solid var(--kirmizi);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 2.6vh), calc(100% - 2.6vh) 100%, 0 100%);
  animation: panel-vur 0.28s var(--gecis-vurucu);
}
@keyframes panel-vur { from { transform: translateY(16px) scale(0.98); opacity: 0; } to { transform: none; opacity: 1; } }
.panel h2 {
  margin: 0 0 1.6vh;
  font: 700 clamp(22px, 3.6vh, 40px)/1 var(--f-baslik);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.kisayollar {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.9vh 1.6vw;
  margin: 0 0 2vh;
  font: 500 clamp(12px, 1.7vh, 17px)/1.3 var(--f-govde);
}
.kisayollar dt { font: 600 1.05em/1.3 var(--f-baslik); color: var(--elektrik-acik); white-space: nowrap; }
.kisayollar dd { margin: 0; color: var(--gumus); }
.modal-metin { margin: 0 0 2.2vh; font: 500 clamp(13px, 1.8vh, 18px)/1.4 var(--f-govde); color: var(--gumus); }
.modal-butonlar { display: flex; justify-content: flex-end; gap: 0.8vw; }
.modal-btn {
  padding: 1.1vh 1.8vw;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid var(--cam-kenar);
  color: #fff;
  font: 600 clamp(13px, 2vh, 20px)/1 var(--f-baslik);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
  cursor: pointer;
  transition: background 0.15s;
}
.modal-btn:hover { background: rgba(30, 107, 255, 0.45); }
.modal-btn--tehlike { background: var(--kirmizi); border-color: transparent; }
.modal-btn--tehlike:hover { background: var(--kirmizi-acik); }

/* ================================================================ BİLDİRİM / HATA */
.bildirim {
  position: fixed;
  left: 50%;
  top: calc(var(--ust-h) - 2.2vh);
  z-index: 45;
  transform: translateX(-50%);
  padding: 0.9vh 1.8vw;
  background: rgba(6, 11, 43, 0.94);
  border: 1px solid var(--elektrik-acik);
  border-left: 5px solid var(--elektrik);
  color: #fff;
  font: 600 clamp(12px, 1.7vh, 17px)/1 var(--f-govde);
  letter-spacing: 0.06em;
  white-space: nowrap;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  animation: bildirim-gir 0.25s var(--gecis-hizli);
  pointer-events: none;
}
@keyframes bildirim-gir { from { opacity: 0; transform: translate(-50%, 10px); } to { opacity: 1; transform: translate(-50%, 0); } }
.hata {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 60;
  padding: 1.4vh 2vw;
  background: var(--kirmizi);
  color: #fff;
  font: 600 16px/1.4 var(--f-govde);
  text-align: center;
}

/* ================================================================ akış durumu */
body.akis--calisiyor .rastgele-btn { opacity: 0.35; pointer-events: none; }
body.akis--calisiyor .harita .hucre--katilimci { cursor: default; }

/* ================================================================ hareket azaltma */
@media (prefers-reduced-motion: reduce) {
  .zemin-nefes, .zemin-isin, .zemin-cizgi, .zemin-yildiz-desen, .harita-tarama, .kiyi-isilti, .sahne-parcaciklar i { animation: none; }
}

/* --- R19: yansıtma modu (/kura) — projeksiyon ekranı: fare imleci gizli, çipler ve harita tıklanmaz (komutlar /mahalle'den) */
body.mod--kura { cursor: none; }
body.mod--kura .cipler .cip, body.mod--kura .harita-hucreler { pointer-events: none; }
