/* Hareket (TASARIM-PLANI 5; sahibi P8). hareket.js, ucus.js ve yolculuk.js'in sınıfları, sayfalar arası geçiş (5.7) ve
   hareket azaltma kuralları (5.8). Yalnız token değişkenleri; yeni renk yok. Bölüm düzenleri (uçuşun yüksekliği, sticky
   sahne, metin yerleşimi, yolculuğun yatay kipi) sayfa CSS'lerindedir; burada yalnız hareketin durumları ve JS'in kurduğu
   katmanlar durur. Hepsi JS'siz, WebGL'siz ve hareket azaltmada etkisizdir: bileşenler son hâlleriyle okunur. */

/* ---------- Sayfalar arası geçiş: pus silmesi (5.7) ----------
   Giden sayfa --sure-sayfa-cikis içinde yukarıdan aşağı yumuşak kenarlı bir pus-gok silmesiyle örtülür; gelen sayfa
   --sure-sayfa-giris içinde pustan netleşir (başlık dahil bütün sayfa). Aynı fotoğraf iki sayfada varsa yerinde dönüşür:
   ana sayfanın GES kartı → Çalışma alanlarının öz-tüketim görseli (foto-ges; giden sayfada ad yalnız görünürken hareket.js
   pageswap'te verir). Yalnız hareket serbestken; hareket azaltmada geçiş hiç tanımlanmaz. Desteklemeyen tarayıcıda normal
   gezinme olur. */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition { background: var(--pus-gok); }
  ::view-transition-group(root) { animation-duration: var(--sure-sayfa-giris, 420ms); }
  ::view-transition-old(root) {
    -webkit-mask-image: linear-gradient(transparent 0 38%, #000 62% 100%); mask-image: linear-gradient(transparent 0 38%, #000 62% 100%);
    -webkit-mask-size: 100% 260%; mask-size: 100% 260%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    animation: var(--sure-sayfa-cikis, 280ms) cubic-bezier(.4, 0, .2, 1) both hareket-pus-sil;
  }
  ::view-transition-new(root) { animation: var(--sure-sayfa-giris, 420ms) var(--ease-giris) 60ms both hareket-pustan; }
  .ayna-gorsel[data-alt-ad="ges-oz-tuketim"] .ayna-kadraj { view-transition-name: foto-ges; }
  ::view-transition-group(foto-ges) { animation-duration: var(--sure-sayfa-giris, 420ms); animation-timing-function: var(--ease-giris); }
}
@keyframes hareket-pus-sil { from { -webkit-mask-position: 0 100%; mask-position: 0 100%; } to { -webkit-mask-position: 0 0; mask-position: 0 0; } }
@keyframes hareket-pustan { from { opacity: 0; filter: blur(8px); } }

/* ---------- Satır maskesi (data-satir, SplitText) ----------
   Maske kutusu inen harfleri (ğ, ş, ç, y) kırpmasın diye alt pay taşır. İlk ekrandaki H1 (giriş) JS gelene kadar gizli
   bekler, böylece açılışta metin önce görünüp sonra kaybolmaz; JS gelmezse 2,4 sn sonra yine görünür (açılış bütçesi). */
.satir-mask { padding-bottom: .12em; margin-bottom: -.12em; }
@media (prefers-reduced-motion: no-preference) {
  html.js h1[data-satir]:not(.satir-hazir) { visibility: hidden; animation: hareket-yedek 0s linear 2.4s forwards; }
}
@keyframes hareket-yedek { to { visibility: visible; } }

/* ---------- Sayaç: sayı kutusu son değerin genişliğini baştan ayırır (birim kaymaz) ---------- */
.sayac-sayi { display: inline-block; }

/* ---------- Damga (ucus.js kaydırmayla indirir, geri kaydırınca bekletir; hareket.js tek seferlik GSAP) ---------- */
.damga-indi { transform-origin: 20px 50%; animation: hareket-damga var(--sure-damga, 500ms) var(--ease-etiket) both; }
@keyframes hareket-damga { from { opacity: 0; transform: scale(1.15) rotate(-4deg); } }
.damga-bekliyor:not(.onay-halkasi) { opacity: .4; }

/* ---------- Uçuş durumları (ucus.js; kök .ucus[data-ucus-etkin]) ---------- */
[data-ucus-etkin] .cip,
[data-ucus-etkin] .cip::before,
[data-ucus-etkin] .onay-halkasi::before { transition: border-color var(--sure-etiket) var(--ease-etiket), background-color var(--sure-etiket) var(--ease-etiket), color var(--sure-etiket) var(--ease-etiket), box-shadow var(--sure-etiket) var(--ease-etiket); }

/* Halka rayı: etkin halka yeşil, geçilenler koyu; 6/6'da (data-tamam) ray tek kesintisiz hatta döner. Sıfır özgüllük
   (:where): rayın kendi çizimi ana-sayfa.css'tedir ve bunları ezebilir. --ray-x rayın düğüm ekseni, --ucus-p ilerleme. */
:where(.halka-ray) a[aria-current="step"] { color: var(--link); }
:where(.halka-ray) a.gecti { color: var(--ink-secondary); }
:where([data-ucus-etkin] .halka-ray) ol { position: relative; }
:where([data-ucus-etkin] .halka-ray) ol::before,
:where([data-ucus-etkin] .halka-ray) ol::after { content: ""; position: absolute; top: 12px; bottom: 12px; left: var(--ray-x, 11px); width: 2px; border-radius: 2px; pointer-events: none; }
:where([data-ucus-etkin] .halka-ray) ol::before { background: var(--line); }
:where([data-ucus-etkin] .halka-ray) ol::after { background: var(--accent); transform-origin: 50% 0; transform: scaleY(var(--ucus-p, 0)); will-change: transform; }
:where([data-ucus-etkin] .halka-ray[data-tamam]) ol::after { left: calc(var(--ray-x, 11px) - 1px); width: 4px; background: var(--energy); transform: none; transition: background-color var(--sure-etiket) var(--ease-etiket), width var(--sure-etiket) var(--ease-etiket); }
/* 6/6: düğümler tek hattın üstünde enerji rengine döner (halka halka ayrı değil, tek zincir) */
:where([data-ucus-etkin] .halka-ray[data-tamam]) .halka-ray-no { border-color: var(--energy); transition: border-color var(--sure-etiket) var(--ease-etiket), background-color var(--sure-etiket) var(--ease-etiket); }
:where(.halka-ray) .halka-ray-tamam:not([hidden]) { animation: hareket-damga var(--sure-damga, 500ms) var(--ease-etiket) both; }

/* Sahne katmanı: poster kipinin fotoğrafları (süzülme, ışık, dijital ikiz), pus beyazı, halka 05 şema plakası, okuma pusu.
   Motor kipinde fotoğraflar ve okuma pusu gizlidir (tuval çizer). Motor istenen sahneyi henüz çizmiyorsa (doku inmedi,
   doğrudan atlama) o sahnenin fotoğrafı yedek poster olarak tuvalin üstüne gelir (.yedek), motor yetişince 0,6 sn'de söner;
   DOM görseli metnin ardındayken (yedek, tam taşan şema plakası) okuma pusu da DOM'dadır ([data-ucus-dom]). */
.ucus-katman { --ucus-pus: var(--pus-gok); position: absolute; inset: 0; overflow: hidden; pointer-events: none; contain: strict; }  /* z-index yok: DOM sırasıyla tuvalin üstünde, rozet ve künyenin altında */
[data-ucus-kip="poster"] .ucus-katman { background: var(--pus-kagit); }
.ucus-foto { position: absolute; inset: 0; overflow: hidden; opacity: 0; visibility: hidden; }
.ucus-foto.etkin { opacity: 1; visibility: visible; }
/* Devir (yedek → motor): yedek 1 sn'de doğrusal söner. Yedek motorun kadrajında olduğundan (ucus.js kadrajAfin) yalnız
   işleme farkı (hava perspektifi, keskinleştirme) çapraz geçer; doğrusal eğri farkı zamana eşit yayar, sıçrama olmaz. */
[data-ucus-kip="motor"] .ucus-foto { transition: opacity 1s linear, visibility 0s linear 1s; }
[data-ucus-kip="motor"] .ucus-foto:not(.yedek) { opacity: 0; visibility: hidden; }
[data-ucus-kip="motor"] .ucus-foto.yedek { opacity: 1; visibility: visible; transition: opacity .3s var(--ease-giris); }
/* Motor kipinde DOM okuma pusu yalnız DOM görseli metnin ardındayken; görsel motora devrederken pus da yedekle aynı 1 sn'de
   söner (anında kaybolsaydı metin bölgesi motorun pusuna bir karede sıçrardı) */
[data-ucus-kip="motor"]:not([data-ucus-dom]) .ucus-okuma { opacity: 0 !important; visibility: hidden; transition: opacity 1s linear, visibility 0s linear 1s; }
.ucus-foto picture, .ucus-foto img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.ucus-foto img { object-fit: cover; transform: scale(1.04); }   /* süzülme (ölçek, kayma) ucus.js'ten satır içi gelir */
[data-ucus-kip="poster"] .ucus-foto.etkin img, .ucus-foto.yedek img { will-change: transform; }
/* Poster kipinde dijital ikiz: aynı kadrajlı SVG (kâğıt sürümü, panel dış hattı ayıklanmış), opaklığı ikiz değeri. Dikey
   kırpımda (dar, dik ekran) ucus.js kırpımın eşlemesiyle yerleştirir. Arazi posteri halka 01–03'te çizimdir: kâğıt zemin,
   ikiz ve parsel katmanı; arşiv fotoğrafı kurulum taramasıyla (190–232) belirir (opaklığı ucus.js'ten). */
.ucus-foto .ucus-foto-ikiz { opacity: 0; mix-blend-mode: multiply; }
.ucus-foto[data-sahne="arazi"] { background: var(--pus-kagit); }
/* Işık: panellerin üzerinden bir kez geçen yumuşak parıltı (kaydırmaya bağlı, supur 0 → 1) */
.ucus-foto::after { content: ""; position: absolute; inset: -10% -50%; background: linear-gradient(105deg, transparent 40%, var(--parilti) 50%, transparent 60%); mix-blend-mode: soft-light; opacity: calc(var(--ucus-isik-o, 0) * .85); transform: translateX(calc((var(--ucus-isik, 0) * 2 - 1) * 55%)); }
/* Okuma pusu (poster kipi; motorda gölgelendiricidedir, 6.9): metnin ardında %90 pus, kenarda 120 px yumuşak geçiş; kart yok */
.ucus-okuma { --kenar: linear-gradient(transparent, rgb(0 0 0 / .3) 40px, rgb(0 0 0 / .78) 84px, #000 120px, #000 calc(100% - 120px), rgb(0 0 0 / .78) calc(100% - 84px), rgb(0 0 0 / .3) calc(100% - 40px), transparent);
  position: absolute; background: var(--ucus-pus); opacity: .9; transition: opacity var(--sure-etiket) var(--ease-etiket);
  -webkit-mask-image: var(--kenar), linear-gradient(90deg, transparent, rgb(0 0 0 / .3) 40px, rgb(0 0 0 / .78) 84px, #000 120px, #000 calc(100% - 120px), rgb(0 0 0 / .78) calc(100% - 84px), rgb(0 0 0 / .3) calc(100% - 40px), transparent);
  mask-image: var(--kenar), linear-gradient(90deg, transparent, rgb(0 0 0 / .3) 40px, rgb(0 0 0 / .78) 84px, #000 120px, #000 calc(100% - 120px), rgb(0 0 0 / .78) calc(100% - 84px), rgb(0 0 0 / .3) calc(100% - 40px), transparent);
  -webkit-mask-composite: source-in; mask-composite: intersect; }
/* Motor kipinde DOM okuma pusu görünür olunca (yedek poster, pafta penceresi açılırken) 0,5 sn'de belirir */
@starting-style { .ucus[data-ucus-dom] .ucus-okuma { opacity: 0; } }
.ucus-beyaz { position: absolute; inset: 0; background: var(--ucus-pus); opacity: 0; transition: background-color .6s linear; will-change: opacity; }
/* Tarama çizgisi (arazi → kablo, ucus.js TARAMA): kâğıt yaprak yukarıdan iner; boyu sahne + 2 × 64 px. Kenarlarda ince
   green-600 çizgi ve parilti-kenar ışığı (%30), kâğıda geçiş kenardan 64 px içeri. Alt çizgi araziyi örter, yaprak sahneyi
   tam örtünce sahne değişir, üst çizgi kabloyu açar. Konum satır içi transform (kaydırmaya bağlı). */
.ucus-tarama { --k: 64px; position: absolute; left: 0; right: 0; top: 0; height: calc(100% + 2 * var(--k)); visibility: hidden; will-change: transform;
  background: linear-gradient(transparent, var(--pus-kagit) var(--k), var(--pus-kagit) calc(100% - var(--k)), transparent); }
/* Kenar çizgileri okuma sınırından (--tarama-sol: metin sütunu + 24 px, ucus.js) 48 px'lik yumuşak girişle başlar: metni ve
   halka rayını kesmez. Yaprak (kâğıt) tam genişliktedir; metin onun üstünde okunur. */
.ucus-tarama::before, .ucus-tarama::after { content: ""; position: absolute; left: var(--tarama-sol, 0px); right: 0; height: 1.5px; background: var(--green-600);
  box-shadow: 0 0 14px 3px color-mix(in srgb, var(--parilti-kenar) 30%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 48px); mask-image: linear-gradient(90deg, transparent, #000 48px); }
.ucus-tarama::before { top: 0; }
.ucus-tarama::after { bottom: 0; }
/* Eşli geçiş örtüsü (kablo → maket-hendek, yalnız motor cephesi yokken): kutu plakanın UV'sidir, dönüşümü motorun ya da
   kablo posterinin izdüşümünden (ucus.js, satır içi matrix). Pus beyazının tepesinde (ESLI_ORTU) pusun üstüne biner; cephe
   programı gelince .3 sn'de söner, cephe devralır. Figür yaması yok: işçi motorun figür katmanıdır. */
.ucus-ortu { position: absolute; left: 0; top: 0; transform-origin: 0 0; visibility: hidden; will-change: transform; }
.ucus-ortu.acik { visibility: visible; }
/* Örtü kendi katmanında (opaklık değişimi yeniden boyamaz); opaklığı 0 iken görünmez (çizilmez) */
.ucus-ortu > div { position: absolute; inset: 0; opacity: 0; will-change: opacity; }
.ucus-ortu.acik > div { visibility: hidden; transition: opacity .3s var(--ease-giris), visibility 0s linear .3s; }
.ucus-ortu.acik > div.on { visibility: visible; transition: opacity .3s var(--ease-giris), visibility 0s; }
.ucus-ortu img { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; max-width: none; }   /* genel img kuralı sıkıştırmasın */
/* Halka 06 kağıt zeminde biter: pencere kağıda erir (2.4, 510–530) */
[data-ucus-sahne="alpedo"] .ucus-katman { --ucus-pus: var(--pus-kagit); }
.ucus-plaka { position: absolute; inset: 0; display: grid; place-items: center; padding: 14vh 5vw 14vh 44vw; opacity: 0; visibility: hidden; will-change: opacity; }
.ucus-plaka > svg, .ucus-plaka > img { display: block; width: 100%; max-width: 760px; height: auto; max-height: 100%; overflow: visible; }
.ucus-plaka > img { width: auto; max-width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); background: var(--pus-kagit); transform-origin: 60% 50%; will-change: transform; }   /* maket plakası (P5 posteri) */
/* Maket plakası (görsel) sahneyi tam kaplar: kart ve gölge yok; ölçek 1,00 → 1,08 ve yanal kayma ucus.js'ten (merkez köken) */
.ucus-plaka.ucus-plaka--resim { padding: 0; }
.ucus-plaka--resim > img { width: 100%; height: 100%; max-width: none; aspect-ratio: auto; border-radius: 0; box-shadow: none; transform-origin: 50% 50%; }
/* Halka 06: alpedo sağda 44vw × 76vh, 32 px köşeli pencerede; metin solda kağıt zeminde. Künye pencerenin altında. */
@media (min-width: 900px) and (min-aspect-ratio: 1/1) {
  .ucus-foto[data-sahne="alpedo"] { inset: 12vh 4vw 12vh 52vw; border-radius: 32px; box-shadow: var(--shadow-lg); }
  [data-ucus-kip="poster"][data-ucus-sahne="alpedo"] [data-ucus-kunye] { left: 52vw; right: auto; bottom: max(8px, calc(12vh - 44px)); }
}
@media (max-width: 899px) {
  .ucus-plaka { padding: 72px 16px 40px; }
}
/* Künye sahnede kalır; uçuşta rozet sağ üsttedir (künyede rozet yok): metin kendi iç payıyla başlar, ek satır (şematik
   canlandırma, şema notu) alta iner. Uçuş sonunda (data-ucus-bitti) rozet ve künye ucus.js'te söner. */
.ucus[data-ucus-etkin] [data-ucus-kunye] { flex-direction: column; align-items: flex-start; gap: 2px; padding-left: 12px; transition: opacity var(--sure-etiket) var(--ease-etiket); }
/* Künye parçaları (" · " arası, ucus.js) bölünmez: satır yalnız ayraçta kırılır ("2× büyütüldü" yetim kalmaz) */
.ucus[data-ucus-etkin] [data-ucus-kunye] .kunye-parca { white-space: nowrap; }
/* Rozet ve künye yalnız görünen bir görsel varken durur (pus beyazında söner): opaklık ucus.js'ten, geçiş burada.
   İki görsel birlikte görünürken (kurulum taraması, eşli cephe) iki rozet "önceki → sonraki" sırasıyla yan yana. */
.ucus[data-ucus-etkin] [data-ucus-rozet] { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 4px 6px; max-width: calc(100% - 24px); transition: opacity var(--sure-etiket) var(--ease-etiket); }
.ucus-rozet-ok { font-size: 12px; line-height: 1; color: var(--ink-secondary); }
@media (max-width: 600px) {   /* dar ekranda iki rozet alt alta (önceki üstte), ok yok */
  .ucus[data-ucus-etkin] [data-ucus-rozet] { flex-direction: column; align-items: flex-end; }
  .ucus-rozet-ok { display: none; }
}
/* Pafta penceresi (halka 01, ucus.js PAFTA): motor kipinde arazi penceresinin çerçevesi (P9 [data-ucus-pencere], gölge) */
@media (min-width: 900px) and (min-aspect-ratio: 1/1) {
  .ucus[data-ucus-etkin][data-ucus-kip="motor"][data-ucus-sahne="arazi"] .ucus-pencere { opacity: var(--ucus-pencere-o, 0); }
}
@media (max-width: 600px) {
  .ucus[data-ucus-etkin] [data-ucus-kunye] { position: absolute; left: 12px; right: auto; bottom: 12px; max-width: calc(100% - 24px); margin: 0; padding: 4px 10px; border-radius: var(--radius-sm); background: var(--surface-card); box-shadow: var(--shadow-sm); font-size: 10px; line-height: 13px; letter-spacing: .06em; }
}

/* ---------- Uçuş güzergâhları (ucus.js; etiketlerin görünümü P9'un ana-sayfa.css'inde, sözleşme k2/p9/kontrat.md) ----------
   Halka 01'de kalan adaylardan TM'ye kesikli ENH güzergâhları (68–82 kaydırmayla çizilir); uzun olan parselle birlikte elenir.
   Noktalar motorun izdüşümüyle her karede yazılır; katman etiket kabındadır (mobilde kapla birlikte gizli). */
.ucus-cizim { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; opacity: 0; pointer-events: none; transition: opacity var(--sure-etiket) var(--ease-etiket); }
.ucus-rota { fill: none; stroke: var(--ikiz-secili); stroke-width: 2; stroke-dasharray: 7 6; stroke-linecap: round; transition: stroke var(--sure-etiket) var(--ease-etiket), opacity var(--sure-etiket) var(--ease-etiket); }
.ucus-rota.elendi { stroke: var(--ikiz-elenen); opacity: .7; }
/* TM simgesi (güzergâhların ucu, ucus.js): kâğıt zemin dairesi eş yükselti çizgilerini örter; rakamsız 3 kapasite halkası
   2 px ve kâğıt haleli; kutu 28 px. Bu simge varken etiketin içindeki küçük halka SVG'si gizlenir ([data-ucus-tm]). */
[data-ucus-tm] .ucus-tm-halka { display: none; }
.ucus-tm { opacity: 0; transition: opacity var(--sure-etiket) var(--ease-etiket); }
.ucus-tm.gorunur { opacity: 1; }
.ucus-tm-zemin { fill: var(--pus-kagit); stroke: none; }
.ucus-tm-hale { fill: none; stroke: var(--pus-kagit); stroke-width: 5; opacity: .85; }
.ucus-tm-h { fill: none; stroke: var(--sky-600); stroke-width: 2; }
.ucus-tm-h:nth-of-type(5) { opacity: .4; }
.ucus-tm-h:nth-of-type(6) { opacity: .65; }
.ucus-tm-kutu { fill: var(--surface-card); stroke: var(--ink); stroke-width: 2; }
.ucus-tm-arti { fill: none; stroke: var(--ink); stroke-width: 2; stroke-linecap: round; }
@media (prefers-reduced-motion: no-preference) {
  .ucus-tm.gorunur :is(.ucus-tm-h, .ucus-tm-hale) { transform-box: fill-box; transform-origin: center; animation: hareket-tm-halka 1.1s var(--ease-giris) both; }
  .ucus-tm.gorunur :is(.ucus-tm-h, .ucus-tm-hale):nth-of-type(3n + 3) { animation-delay: .15s; }
  .ucus-tm.gorunur :is(.ucus-tm-h, .ucus-tm-hale):nth-of-type(3n + 2) { animation-delay: .3s; }
}
@keyframes hareket-tm-halka { from { opacity: 0; transform: scale(.45); } }
/* TM hapı simgenin altında: halkaların dış hattından (44 + 2,5 px) 8 px aşağıda, sapsız. Güzergâhlar TM'ye hep üstten ve
   soldan gelir; hap ne halkaların ne güzergâhın üstüne biner (P9'un genel data-yon="sol" yerleşimini simge varken ezer). */
.ucus-etiketler[data-ucus-tm] .ucus-etiket--tm[data-yon] { transform: translate(-50%, 54.5px); }
.ucus-etiketler[data-ucus-tm] .ucus-etiket--tm[data-yon]::after { display: none; }

/* ---------- Parsel katmanı (ucus.js .ucus-parsel; halka 01–03) ----------
   Dar ekranda motorun üstünde, poster kipinde ve arazi yedek posterinde her ekranda: sözlükteki parsel poligonlarının
   izdüşümü. Renkler parsel lejantıyla (ana-sayfa.css .halka-lejant) aynı: aday gök, elendi gri tarama, seçildi yeşil.
   Durum değişimi 0,4 sn (plan 2.4); katman yedek posterle birlikte 0,3 sn'de belirir ve söner. */
.ucus-parsel { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; opacity: 0; transition: opacity .3s var(--ease-giris);
  /* Okuma sınırı (--parsel-sol, ucus.js: metin sütunu + 24 px): katman orada 48 px'lik yumuşak geçişle başlar; metnin ve
     halka rayının ardında parsel çizgisi kalmaz. Dar ekranda sınır yok (-48px: geçiş görüntünün dışında). */
  -webkit-mask-image: linear-gradient(90deg, transparent var(--parsel-sol, -48px), #000 calc(var(--parsel-sol, -48px) + 48px));
  mask-image: linear-gradient(90deg, transparent var(--parsel-sol, -48px), #000 calc(var(--parsel-sol, -48px) + 48px)); }
.ucus-parsel.acik { opacity: 1; }
.ucus-parsel-p { transition: opacity .4s var(--ease-etiket); }
.ucus-parsel-p[data-durum="gizli"] { opacity: 0; }
.ucus-parsel-hale { fill: none; stroke: var(--pus-kagit); stroke-width: 5; stroke-linejoin: round; opacity: .5; }
.ucus-parsel-alan { fill: none; stroke: none; stroke-linejoin: round; transition: fill .4s var(--ease-etiket), stroke .4s var(--ease-etiket), stroke-width .4s var(--ease-etiket); }   /* gizliyken dolgusuz: belirirken siyahtan geçmez */
[data-durum="aday"] > .ucus-parsel-alan { fill: color-mix(in srgb, var(--sky-500) 22%, transparent); stroke: var(--sky-600); stroke-width: 2; }
[data-durum="elendi"] > .ucus-parsel-alan { fill: url(#ucus-parsel-tarama); stroke: var(--graphite-400); stroke-width: 1.5; }
[data-durum="secildi"] > .ucus-parsel-alan { fill: color-mix(in srgb, var(--green-600) 18%, transparent); stroke: var(--green-600); stroke-width: 2.6; }
.ucus-parsel-tz { fill: var(--pus-kagit); opacity: .45; }
.ucus-parsel-tc { stroke: var(--graphite-500); stroke-width: 1.5; }
.ucus-parsel-ic { stroke: var(--green-600); stroke-width: 1.6; opacity: .7; }
.ucus-parsel-imar { fill: url(#ucus-parsel-imar-d); stroke: none; opacity: 0; }
.ucus-parsel-tarim { fill: url(#ucus-parsel-tarim-d); stroke: none; opacity: 0; }
.ucus-parsel-td { fill: var(--sky-700); opacity: .55; }
/* TM erişim halkası (kapasite tespiti): TM'den kadraja yayılan kesikli halka, çok hafif gök dolgu */
.ucus-parsel-erisim { fill: color-mix(in srgb, var(--sky-500) 8%, transparent); stroke: var(--sky-600); stroke-width: 1.5; stroke-dasharray: 2 6; stroke-linecap: round; opacity: 0; }
.ucus-parsel-tmy { fill: var(--ink); stroke: var(--pus-kagit); stroke-width: 3px; paint-order: stroke; font: 700 12px/1 var(--font-sans); letter-spacing: .06em; text-anchor: middle; }
.ucus-parsel-sinir { fill: none; stroke: var(--ikiz-guzergah); stroke-width: 2; opacity: 0; }
/* Parsel odağı (halka 02–03): seçili blok dışındaki sahneye kâğıt örtüsü (çift yönlü yol, blok delik); opaklık ucus.js'ten */
.ucus-parsel-odak { fill: var(--pus-kagit); fill-rule: evenodd; stroke: none; opacity: 0; }
/* Kesikli sınırın yürüyen ucu (90–112) */
.ucus-parsel-uc { fill: var(--ikiz-secili); stroke: var(--pus-kagit); stroke-width: 2; opacity: 0; }
/* Halka 03 mühendislik katmanı (yalnız seçili blokta, clipPath): eş yükselti ikiz SVG'sinin kâğıt çizgileriyle aynı renk;
   fotoğrafın üstünde okunsun diye altında ince kâğıt halesi (posterde kâğıt zemin vardı); sıra hatları ikiz yeşili; inverter ve
   trafo ayak izleri kâğıt zeminli; AC hattı enerji renginde kesikli (tek hat şemasının akış çizgisi). Opaklıklar ucus.js'ten
   (belirme), taban opaklık burada. */
.ucus-muh { visibility: hidden; }
.ucus-muh path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.ucus-muh-es-hale { stroke: var(--pus-kagit); stroke-width: 3; stroke-opacity: .4; }
.ucus-muh-es { stroke: var(--ikiz-es-kagit); stroke-width: 1.1; stroke-opacity: .7; }
.ucus-muh-es-ana { stroke: var(--ikiz-es-kagit); stroke-width: 1.8; stroke-opacity: .7; }
.ucus-muh-sira { stroke: var(--ikiz-secili); stroke-width: 1.4; stroke-opacity: .9; }
.ucus .ucus-muh .ucus-muh-inv { fill: var(--pus-kagit); stroke: var(--sky-700); stroke-width: 1.6; }
.ucus .ucus-muh .ucus-muh-trafo { fill: var(--pus-kagit); stroke: var(--ink); stroke-width: 2; }
.ucus-muh-ac { stroke: var(--energy); stroke-width: 1.6; stroke-dasharray: 5 4; }
@media (max-width: 899px) {   /* dar ekranda imar, sınır ve sıralar kalın: mobil ölçekte seçilir */
  .ucus-parsel-sinir { stroke-width: 3; }
  .ucus-parsel-ic { stroke-width: 2.2; opacity: .85; }
  .ucus-muh-sira { stroke-width: 1.8; }
}
.ucus-parsel-kose { fill: none; stroke: var(--green-600); stroke-width: 3; stroke-linecap: square; opacity: 0; transition: opacity .4s var(--ease-etiket); }
.ucus-parsel-n { transition: opacity .4s var(--ease-etiket); }
.ucus-parsel-n[data-durum="gizli"] { opacity: 0; }
.ucus-parsel-n circle { fill: var(--sky-700); stroke: var(--pus-kagit); stroke-width: 2; transition: fill .4s var(--ease-etiket), stroke .4s var(--ease-etiket); }
.ucus-parsel-n text { fill: var(--ink-on-action); font: 700 11px/1 var(--font-sans); font-variant-numeric: tabular-nums; text-anchor: middle; dominant-baseline: central; }
.ucus-parsel-n[data-durum="elendi"] circle { fill: var(--graphite-100); stroke: var(--graphite-400); }
.ucus-parsel-n[data-durum="elendi"] text { fill: var(--ink-secondary); }
.ucus-parsel-n[data-durum="secildi"] circle { fill: var(--green-700); }

/* ---------- Yolculuk hattı (yolculuk.js; ol[data-yolculuk][data-yol-etkin]) ----------
   Kalem geçene kadar dallar ve düğümler gizli; kalem geçerken anında yanar. Geçiş ve canlandırma yok: hızlı kaydırmada aynı anda
   ~100 SVG yolu geçişte kalıyor ve her karede (ScrollTrigger'ın kaydırma okumasında zorunlu) stil hesabı istiyordu; açılışı zaten
   kalemin kırpması yumuşak gösterir. JS yoksa ya da hareket azaltmada data-yol-etkin konmaz: hat sayfa CSS'indeki tam çizili hâlindedir.
   İlerleme değişkenleri kalıtımsız kayıtlıdır (sözleşme Sürüm 2): yolculuk.js --yol-p'yi yalnız tüketicisine (.yol-pencere,
   .yol-olcek-cizgi i) yazar; --maske-sol (sayfa-hakkimizda.css) px'e hesaplanır. Böylece her karede bölümün alt ağacı yeniden
   stil hesabına girmez ve pencere maskesi yalnız değeri gerçekten değişince yeniden çizilir. */
@property --yol-p { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --maske-sol { syntax: "<length>"; inherits: false; initial-value: 0px; }
[data-yol-etkin] :is(.yol-dal, .yol-dugum):not(.yandi) { opacity: 0; }

/* ---------- Hareket azaltma (5.8): JS'in kurduğu katmanlar hiç görünmez, damgalar durağandır ---------- */
@media (prefers-reduced-motion: reduce) {
  .damga-indi, :where(.halka-ray) .halka-ray-tamam { animation: none; }
  .ucus-katman, .ucus-etiketler { display: none !important; }
  [data-yol-etkin] :is(.yol-dal, .yol-dugum) { opacity: 1 !important; animation: none !important; }
}
html.hareket-yok .ucus-katman, html.hareket-yok .ucus-etiketler { display: none !important; }
