/* =====================================================================
   v63 · CANLI YAYIN — çekirdek
   Tek görsel dil: kurgu odası + canlı yayın grafiği.
   Bu dosya tüm eski katmanlardan (index.html <style>, review.css,
   explore61.css) SONRA yüklenir; @layer kullanmaz (katmansız kurallar
   her zaman kazanır). Bileşen dosyaları: v63-giris / v63-yayin / v63-duvar.
   ===================================================================== */

/* ---------- tokenlar ---------- */
:root{
  --v63-r:#d92c50; --v63-g:#0a8577; --v63-b:#2f5bff;
  --v63-g-hi:#19d3c5;            /* gece için parlak kanal yeşili */
  --v63-y:#ffce1f;               /* damga sarısı (64 kez elle yazılmıştı) */
  --v63-tally:#ff3b5e;           /* CANLI / PROGRAM ışığı = NLE oynatma kafası */
  --v63-ink:#0b0d16;             /* yayın grafiklerinin koyu zemini */
  --v63-paper:#f4eee0;
  --v63-mono:"Azeret Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --v63-sans:"Archivo","Helvetica Neue",Arial,sans-serif;
  --v63-ease:cubic-bezier(.2,.7,.3,1);
  --v63-snap:cubic-bezier(.2,1.5,.35,1);
  --v63-cut:cubic-bezier(.7,0,.2,1);
  --v63-r-pill:999px; --v63-r-panel:18px; --v63-r-card:14px; --v63-r-chip:10px;
}
html[data-mode="night"],html:not([data-mode]){
  --v63-bg:#0a0c16;
  --v63-text:#f4eee0; --v63-text-2:#ccd4e6; --v63-muted:#9aa3bd;
  --v63-line:rgba(255,255,255,.12); --v63-line-2:rgba(255,255,255,.22);
  --v63-surface:rgba(14,17,30,.72); --v63-surface-hi:rgba(22,26,44,.9);
  --v63-shadow:0 22px 50px -26px rgba(0,0,0,.9);
  --v63-g-live:var(--v63-g-hi);
}
html[data-mode="day"]{
  --v63-bg:#e9ecf4;
  --v63-text:#171a26; --v63-text-2:#2c3145; --v63-muted:#5b6178;
  --v63-line:rgba(23,26,38,.12); --v63-line-2:rgba(23,26,38,.24);
  --v63-surface:rgba(255,255,255,.78); --v63-surface-hi:rgba(255,255,255,.95);
  --v63-shadow:0 20px 44px -26px rgba(23,26,38,.45);
  --v63-g-live:var(--v63-g);
}

/* ---------- ortak ilkel parçalar ---------- */
.v63-mono{font-family:var(--v63-mono);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.v63-tally{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--v63-tally);
  box-shadow:0 0 0 0 rgba(255,59,94,.55);flex:none}
.v63-tally.is-on{animation:v63-tally 1.8s var(--v63-ease) infinite}
.v63-tally.is-idle{background:var(--v63-muted);box-shadow:none;animation:none}
@keyframes v63-tally{0%{box-shadow:0 0 0 0 rgba(255,59,94,.55)}70%,100%{box-shadow:0 0 0 7px rgba(255,59,94,0)}}

/* corner-pin köşeleri: kapsayıcıya .v63-pinned + içine <i class="v63-pin"> ×4 */
.v63-pin{position:absolute;width:14px;height:14px;pointer-events:none;border:0 solid var(--pin-c,var(--v63-y));
  opacity:0;transition:opacity .22s var(--v63-ease),transform .32s var(--v63-snap);z-index:4}
.v63-pin:nth-of-type(1){top:8px;left:8px;border-top-width:2px;border-left-width:2px;transform:translate(6px,6px)}
.v63-pin:nth-of-type(2){top:8px;right:8px;border-top-width:2px;border-right-width:2px;transform:translate(-6px,6px)}
.v63-pin:nth-of-type(3){bottom:8px;left:8px;border-bottom-width:2px;border-left-width:2px;transform:translate(6px,-6px)}
.v63-pin:nth-of-type(4){bottom:8px;right:8px;border-bottom-width:2px;border-right-width:2px;transform:translate(-6px,-6px)}
.v63-pinned:is(:hover,:focus-visible,.is-pinned) .v63-pin{opacity:1;transform:none}

/* =====================================================================
   ÖNCE BUNLAR — v62'den kalan, görünümü bozan artıklar
   ===================================================================== */

/* 1) gece: hero'nun arkasında düz #1d1912 panel + 7px sert gölge kalıyordu */
html[data-mode] body .hero.glass{background:none;border:0;box-shadow:none}

/* 2) gece: gövde sıcak #14110b ama görünen zemin lacivert -> theme-color da yanlıştı */
html[data-mode="night"] body{background:var(--v63-bg)}

/* 3) Uzmanlık rafının sağ kenarı KREM renge soluyordu */
html[data-mode="night"] body .trackwrap::after{background:linear-gradient(90deg,transparent,rgba(10,12,22,.92))}
html[data-mode="day"] body .trackwrap::after{background:linear-gradient(90deg,transparent,rgba(233,236,244,.95))}

/* 4) pit başlığı koyu zeminde koyu yazıydı (okunmuyordu) */
html[data-mode] body .pithead{color:var(--v63-muted);border-bottom:1px solid var(--v63-line)}
html[data-mode] body .pithead #pitmsg{font-family:var(--v63-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase}

/* 5) arama kutusunun odağı gece görünmüyordu */
html[data-mode] body .search:focus-visible,html[data-mode] body .search:focus{
  outline:none;border-color:var(--v63-y);box-shadow:0 0 0 3px rgba(255,206,31,.28),var(--v63-shadow)}

/* 6) gündüz: hero hâlâ koyu video üstünde; başlık/rol koyu kalıyordu */
html[data-mode="day"] body .cinein h1{color:var(--v63-paper)}
html[data-mode="day"] body .cinein .idrole{color:var(--v63-paper)}
html[data-mode="day"] body .cinein .lead{color:#e6e9f3}

/* 7) "Uzmanlık" başlığı gövde boyutunda çıkıyordu; diğer bölümlerin damgasına eşitle */
html[data-mode] body #uzmanlik .section-heading{
  display:inline-flex;width:fit-content;align-items:center;background:var(--v63-y);color:#151109;
  padding:9px 16px;border-radius:11px;transform:rotate(-1.2deg);
  font:800 11px/1.2 var(--v63-sans);letter-spacing:.14em;text-transform:uppercase;
  box-shadow:0 10px 26px -10px rgba(0,0,0,.7);margin:0 0 10px}

/* 8) reduced-motion kullanıcıları yine de 24px kayma alıyordu */
@media (prefers-reduced-motion:reduce){
  [data-reveal],[data-reveal].in{transition:none!important;transform:none!important;opacity:1!important}
}

/* 9) sabit menü butonu hero barının üst kenarını kesiyordu; yayın çubuğu için de yer aç */
html[data-mode] body .glassbar{margin-top:78px}
@media (max-width:760px){html[data-mode] body .glassbar{margin-top:72px}}

/* 10) showreel canlıyken sol üstteki "döngüde oynuyor" etiketi YouTube başlığıyla çakışıyordu —
       bu bilgi artık yayın çubuğunda ("▶ SHOWREEL · YAYINDA") */
.reel.live .reeltag{opacity:0;pointer-events:none;transition:opacity .4s}

/* 11) "Rastgele izle" boş filtrede sessizdi -> hafif "hayır" sarsıntısı + ipucu metni (JS) */
.rulet.bos{animation:v63-hayir .42s var(--v63-ease)}
@keyframes v63-hayir{20%{transform:translateX(-5px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
@media (prefers-reduced-motion:reduce){.rulet.bos{animation:none;outline:2px solid var(--v63-tally)}}

/* 12) performans: opak zemin üstünde görünmeyen / her karede yeniden hesaplanan bulanıklıklar.
       185 öğede backdrop-filter vardı; kart, oynat düğmesi, yıl etiketi ve fizik çiplerinde kaldırıldı. */
html[data-mode] body .wall .wcard,html[data-mode] body .whead .playb,html[data-mode] body .whead .yr,
html[data-mode] body .pchip,html[data-mode] body .modesw{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* 13) erişilebilirlik: görsel olarak gizli, ekran okuyucuda okunan metin */
.v63-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
#icerik:focus{outline:none}

/* 14) mobilde yükleme sırasında sayfa anlık 404–427px'e genişleyebiliyordu (zamanlamaya bağlı);
       kökte kırpma: yatay kaydırma hiç oluşmaz, sticky öğeler etkilenmez (clip kaydırma kabı yaratmaz) */
html{overflow-x:clip}