/* =====================================================================
   v63 · YAYIN KATMANI
   1) yayın çubuğu (üst orta hap + scrub şeridi)
   2) alt bant (bölüm değişince lower-third)
   3) gündem yuvası + çapraz konuşma (JS: site/v63-yayin.js)
   Tüm sınıflar v63y- önekli. z: çubuk 45, alt bant 44 (sözleşme).
   ===================================================================== */

/* ---------- 1 · YAYIN ÇUBUĞU ---------- */
.v63y{
  position:fixed;z-index:45;top:16px;left:0;right:0;margin-inline:auto;width:max-content;max-width:calc(100vw - 32px);
  pointer-events:none;
  opacity:1;visibility:visible;
  transition:opacity .5s var(--v63-ease),visibility 0s linear 0s;
}
.v63y.is-off{opacity:0;visibility:hidden;transition:opacity .22s var(--v63-ease),visibility 0s linear .22s}

.v63y-pill{
  position:relative;height:44px;box-sizing:border-box;padding:0 18px 0 16px;
  border-radius:var(--v63-r-pill);
  background:var(--v63-surface);
  border:1px solid var(--v63-line-2);
  box-shadow:var(--v63-shadow),inset 0 1px 0 rgba(255,255,255,.06);
  -webkit-backdrop-filter:blur(14px) saturate(1.35);backdrop-filter:blur(14px) saturate(1.35);
  color:var(--v63-text);
  pointer-events:auto; /* hapın arkasındaki gizli içeriğe tık sızmasın */
}
.v63y-pill{transition:transform .6s var(--v63-ease)}
.v63y.is-off .v63y-pill{transform:translateY(-8px);transition-duration:.22s}
html[data-mode="day"] .v63y-pill{box-shadow:var(--v63-shadow),inset 0 1px 0 rgba(255,255,255,.9)}

.v63y-row{
  display:flex;align-items:center;height:31px;white-space:nowrap;
  font:500 10.5px/1 var(--v63-mono);letter-spacing:.12em;text-transform:uppercase;
  font-variant-numeric:tabular-nums;color:var(--v63-muted);
}
.v63y-row>*{flex:none}
.v63y-tally{margin-right:10px;transition:background-color .3s var(--v63-ease)}

/* program etiketi: 02 · İŞLER */
.v63y-prog{display:inline-flex;align-items:baseline;gap:7px;overflow:hidden}
.v63y-prog em{font-style:normal;color:var(--v63-muted);letter-spacing:.06em}
.v63y-prog b{font:800 12px/1 var(--v63-sans);font-stretch:118%;letter-spacing:.07em;color:var(--v63-text);display:inline-block}
.v63y-prog.is-cut b{animation:v63y-cut .32s var(--v63-cut) both}
@keyframes v63y-cut{from{clip-path:inset(0 100% 0 0);transform:translateX(-4px)}to{clip-path:inset(0 0 0 0);transform:none}}

.v63y-sep{display:block;width:1px;height:14px;margin:0 13px;background:var(--v63-line-2)}

.v63y-tc,.v63y-ist{display:inline-flex;align-items:baseline;gap:7px;contain:layout paint style}
.v63y-tc s,.v63y-ist s{text-decoration:none;color:var(--v63-muted);opacity:.8;font-size:9px;letter-spacing:.16em}
.v63y-tc span,.v63y-ist span{color:var(--v63-text-2);letter-spacing:.06em}
.v63y-tc .v63y-tcm{color:var(--v63-text)}
.v63y-tc span.v63y-tch{margin-right:-7px}

/* gündem yuvası */
.v63y-gd{position:relative;display:block;height:16px;width:var(--gd-w,300px);overflow:hidden;contain:strict}
.v63y-gdl{
  position:absolute;left:0;right:0;top:0;height:16px;display:flex;align-items:center;gap:8px;
  opacity:0;transform:translateY(70%);
  transition:opacity .42s var(--v63-ease),transform .42s var(--v63-ease);
  font:500 12.5px/16px "Instrument Sans",var(--v63-sans);letter-spacing:.005em;text-transform:none;color:var(--v63-text-2);
}
.v63y-gdl.is-cur{opacity:1;transform:none}
.v63y-gdl.is-old{opacity:0;transform:translateY(-70%)}
.v63y-gdl.is-snap{transition:none}
.v63y-gdl i{font:500 9px/1 var(--v63-mono);font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:var(--v63-muted);
  padding:3px 5px 2px;border:1px solid var(--v63-line);border-radius:4px;flex:none}
.v63y-gdl span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* olay satırı (çapraz konuşma) */
.v63y-gdl.is-ev{font:500 10.5px/16px var(--v63-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--v63-text)}
.v63y-gdl.is-ev b{color:var(--v63-tally);font-weight:500;flex:none}
.v63y-gdl.is-ev.is-past b{color:var(--v63-muted)}
.v63y-gdl.is-ev.is-cue b{color:var(--v63-y)}
html[data-mode="day"] .v63y-gdl.is-ev.is-cue b{color:#b07d00}

/* ilerlemeli gizleme (JS genişliği ölçer) */
.v63y.no-ist .v63y-ist,.v63y.no-ist .v63y-istsep{display:none}
.v63y.no-gd .v63y-gd,.v63y.no-gd .v63y-gdsep{display:none}
.v63y.no-tc .v63y-tc,.v63y.no-tc .v63y-tcsep{display:none}

/* ---------- scrub şeridi: hapın alt dudağı ---------- */
.v63y-rail{position:absolute;left:22px;right:22px;bottom:3px;height:12px;pointer-events:none}
.v63y-track{position:absolute;left:0;right:0;top:5px;height:1px;background:var(--v63-line);border-radius:1px}
.v63y-fill{position:absolute;left:0;top:0;width:100%;height:1px;background:var(--v63-text-2);opacity:.55;
  transform-origin:0 50%;transform:scaleX(0)}
.v63y-head{position:absolute;left:-1px;top:-4px;width:2px;height:9px;border-radius:1px;background:var(--v63-tally);
  box-shadow:0 0 0 2px var(--v63-surface-hi)}
.v63y-tick{
  position:absolute;top:-2px;width:16px;height:16px;margin:0 0 0 -8px;padding:0;border:0;background:none;cursor:pointer;
  pointer-events:auto;-webkit-tap-highlight-color:transparent;color:inherit;
}
.v63y-tick::before{content:"";position:absolute;left:7.5px;top:4px;width:1px;height:7px;background:var(--v63-muted);opacity:.7;
  transition:background-color .25s var(--v63-ease),opacity .25s,transform .25s var(--v63-snap)}
.v63y-tick.is-on::before{background:var(--v63-y);opacity:1}
html[data-mode="day"] .v63y-tick.is-on::before{background:#b07d00}
.v63y-tick:hover::before,.v63y-tick:focus-visible::before{opacity:1;background:var(--v63-text);transform:scaleY(1.45)}
.v63y-tick:focus-visible{outline:none}
.v63y-tick:focus-visible::after{content:"";position:absolute;inset:0;border-radius:4px;box-shadow:0 0 0 2px var(--v63-y)}
.v63y-tip{
  position:absolute;left:50%;top:calc(100% + 9px);transform:translate(-50%,-3px);opacity:0;pointer-events:none;
  padding:5px 8px 4px;border-radius:6px;white-space:nowrap;
  font:500 9.5px/1 var(--v63-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--v63-text);
  background:var(--v63-surface-hi);border:1px solid var(--v63-line-2);box-shadow:var(--v63-shadow);
  transition:opacity .18s var(--v63-ease),transform .22s var(--v63-ease);
}
.v63y-tip em{font-style:normal;color:var(--v63-muted);margin-right:6px}
.v63y-tick:hover .v63y-tip,.v63y-tick:focus-visible .v63y-tip{opacity:1;transform:translate(-50%,0)}

/* ---------- mobil: sol üst kompakt hap + en üstte 2px çizgi ---------- */
@media (max-width:760px){
  .v63y{top:calc(16px + env(safe-area-inset-top,0px));left:calc(16px + env(safe-area-inset-left,0px));right:auto;margin:0;
    max-width:calc(100vw - 160px)}
  .v63y-pill{padding:0 14px 0 13px;display:flex;align-items:center;overflow:hidden;-webkit-backdrop-filter:blur(12px) saturate(1.3);backdrop-filter:blur(12px) saturate(1.3)}
  .v63y-row{height:auto}
  .v63y-gd,.v63y-gdsep,.v63y-ist,.v63y-istsep{display:none}
  .v63y-tally{margin-right:9px}
  .v63y-prog em{letter-spacing:.04em}
  .v63y-prog{flex:0 1 auto;min-width:0}
  .v63y-prog b{min-width:0!important;overflow:hidden;text-overflow:ellipsis}
  .v63y.no-num .v63y-prog em{display:none}
  .v63y-sep{margin:0 9px;height:12px}
  .v63y-tc s,.v63y-tc .v63y-tch{display:none}
  .v63y-tc span{font-size:10px}
  .v63y-rail{position:fixed;left:0;right:0;top:env(safe-area-inset-top,0px);bottom:auto;height:2px}
  .v63y-track{top:0;height:2px;background:transparent}
  .v63y-fill{height:2px;opacity:.9;background:linear-gradient(90deg,var(--v63-r),var(--v63-y) 60%,var(--v63-g-live))}
  .v63y-head{top:-1px;height:4px;width:4px;left:-2px;border-radius:50%;box-shadow:none}
  .v63y-tick{pointer-events:none;top:0;height:2px;width:1px;margin:0}
  .v63y-tick::before{left:0;top:0;height:2px;width:1px;background:var(--v63-text);opacity:.35}
  .v63y-tick.is-on::before{opacity:0}
  .v63y-tip{display:none}
}

/* ---------- 2 · ALT BANT ---------- */
.v63y-lt{
  position:fixed;z-index:44;left:calc(32px + env(safe-area-inset-left,0px));bottom:calc(36px + env(safe-area-inset-bottom,0px));
  pointer-events:none;visibility:hidden;max-width:min(560px,calc(100vw - 64px));
}
.v63y-lt.is-in,.v63y-lt.is-out{visibility:visible}
.v63y-lt-plate{
  position:relative;display:flex;align-items:stretch;
  background:var(--v63-ink);color:var(--v63-paper);
  border:1px solid rgba(255,255,255,.14);border-radius:12px;overflow:hidden;
  box-shadow:0 26px 60px -30px rgba(0,0,0,.95);
  clip-path:inset(0 100% 0 0 round 12px);
}
html[data-mode="day"] .v63y-lt-plate{background:var(--v63-surface-hi);color:var(--v63-text);border-color:var(--v63-line-2);
  box-shadow:0 24px 50px -28px rgba(23,26,38,.55)}
.v63y-lt-no{
  position:relative;flex:none;display:flex;align-items:center;justify-content:center;min-width:62px;padding:0 18px 0 12px;
  background:var(--v63-y);color:#151109;
  font:800 22px/1 var(--v63-sans);font-stretch:112%;letter-spacing:.02em;font-variant-numeric:tabular-nums;
}
/* kanal imzası: çipin sağ kenarında R/G/B üç ince şerit */
.v63y-lt-no::after{content:"";position:absolute;top:0;bottom:0;right:0;width:6px;
  background:linear-gradient(90deg,var(--v63-r) 0 2px,var(--v63-g-live) 2px 4px,var(--v63-b) 4px 6px)}
.v63y-lt-body{display:flex;flex-direction:column;min-width:min(300px,60vw);padding:15px 22px 0 20px}
.v63y-lt-kick{font:500 9px/1 var(--v63-mono);letter-spacing:.2em;text-transform:uppercase;color:rgba(244,238,224,.55);
  display:flex;align-items:center;gap:7px;margin-bottom:8px}
html[data-mode="day"] .v63y-lt-kick{color:var(--v63-muted)}
.v63y-lt-kick .v63-tally{width:6px;height:6px}
.v63y-lt-title{display:block;font:800 34px/.95 var(--v63-sans);font-stretch:125%;letter-spacing:.005em;text-transform:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-bottom:1px}
.v63y-lt-sub{display:flex;align-items:center;gap:18px;justify-content:space-between;margin:13px -22px 0 -20px;padding:9px 22px 10px 20px;
  border-top:1px solid rgba(255,255,255,.1);
  font:500 13.5px/1.2 "Instrument Sans",var(--v63-sans);color:rgba(244,238,224,.78);white-space:nowrap}
html[data-mode="day"] .v63y-lt-sub{border-top-color:var(--v63-line);color:var(--v63-text-2)}
.v63y-lt-sub span{overflow:hidden;text-overflow:ellipsis}
.v63y-lt-sub em{font:500 9.5px/1 var(--v63-mono);font-style:normal;letter-spacing:.1em;color:rgba(244,238,224,.5);flex:none;font-variant-numeric:tabular-nums}
html[data-mode="day"] .v63y-lt-sub em{color:var(--v63-muted)}

/* RGB kanal silmesi */
.v63y-lt-wipe{position:absolute;left:0;right:0;top:50%;height:15px;margin-top:-8px;z-index:2;pointer-events:none}
.v63y-lt-wipe i{position:absolute;left:0;right:0;height:3px;border-radius:2px;transform:scaleX(0);transform-origin:0 50%;mix-blend-mode:normal}
.v63y-lt-wipe i:nth-child(1){top:0;background:var(--v63-r)}
.v63y-lt-wipe i:nth-child(2){top:6px;background:var(--v63-g-live)}
.v63y-lt-wipe i:nth-child(3){top:12px;background:var(--v63-b)}

.v63y-lt.is-in .v63y-lt-wipe i{animation:v63y-wipe .62s var(--v63-cut) both}
.v63y-lt.is-in .v63y-lt-wipe i:nth-child(2){animation-delay:.05s}
.v63y-lt.is-in .v63y-lt-wipe i:nth-child(3){animation-delay:.1s}
@keyframes v63y-wipe{
  0%{transform:scaleX(0);transform-origin:0 50%}
  45%{transform:scaleX(1);transform-origin:0 50%}
  46%{transform:scaleX(1);transform-origin:100% 50%}
  100%{transform:scaleX(0);transform-origin:100% 50%}
}
.v63y-lt.is-in .v63y-lt-plate{animation:v63y-plate .46s var(--v63-cut) .2s both}
@keyframes v63y-plate{from{clip-path:inset(0 100% 0 0 round 12px)}to{clip-path:inset(0 0 0 0 round 12px)}}
.v63y-lt.is-in .v63y-lt-no{animation:v63y-chip .5s var(--v63-snap) .34s both}
@keyframes v63y-chip{from{transform:translateX(-10px) scale(.9);opacity:0}to{transform:none;opacity:1}}
.v63y-lt.is-in .v63y-lt-title{animation:v63y-rise .5s var(--v63-ease) .4s both}
.v63y-lt.is-in .v63y-lt-kick{animation:v63y-fade .4s var(--v63-ease) .36s both}
.v63y-lt.is-in .v63y-lt-sub{animation:v63y-fade .45s var(--v63-ease) .52s both}
@keyframes v63y-rise{from{transform:translateX(-12px);opacity:0}to{transform:none;opacity:1}}
@keyframes v63y-fade{from{opacity:0}to{opacity:1}}

.v63y-lt.is-out .v63y-lt-plate{clip-path:inset(0 0 0 0 round 12px);animation:v63y-plate-out .42s var(--v63-cut) both}
.v63y-lt.is-out.is-fast .v63y-lt-plate{animation-duration:.2s}
@keyframes v63y-plate-out{from{clip-path:inset(0 0 0 0 round 12px)}to{clip-path:inset(0 100% 0 0 round 12px)}}

@media (max-width:760px){
  .v63y-lt{left:calc(16px + env(safe-area-inset-left,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));
    max-width:calc(100vw - 16px - 16px - 78px - 14px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px))}
  .v63y-lt-plate{border-radius:10px}
  .v63y-lt-no{min-width:42px;padding:0 10px 0 8px;font-size:16px}
  .v63y-lt-no::after{width:3px;background:linear-gradient(90deg,var(--v63-r) 0 1px,var(--v63-g-live) 1px 2px,var(--v63-b) 2px 3px)}
  .v63y-lt-body{padding:9px 14px 0 12px;min-width:0}
  .v63y-lt-kick{display:none}
  .v63y-lt-title{font-size:19px;font-stretch:115%}
  .v63y-lt-sub{margin:7px -14px 0 -12px;padding:6px 14px 7px 12px;font-size:12px}
  .v63y-lt-sub em{display:none}
}

/* ---------- hareket azaltma: hareket yok, anlık durumlar ---------- */
@media (prefers-reduced-motion:reduce){
  .v63y,.v63y.is-off,.v63y-pill{transition:none}
  .v63y.is-off .v63y-pill{transform:none}
  .v63y-gdl{transition:none;transform:none}
  .v63y-gdl.is-old{transform:none}
  .v63y-prog.is-cut b{animation:none}
  .v63y-tip,.v63y-tick::before{transition:none}
  .v63y-lt *{animation:none!important}
  .v63y-lt-wipe{display:none}
  .v63y-lt.is-in .v63y-lt-plate{clip-path:inset(0 0 0 0 round 12px)}
  .v63y-lt.is-out{visibility:hidden}
}