/* =====================================================================
   v63 · DUVAR — iş duvarı = kurgu odasının BIN'i
   kart HUD'u · odak modu · dağıtma · PROGRAM monitörü · BIN sayacı · VU metre
   Eski katmanlar ağır: seçiciler #isler / html[data-mode] body ile güçlendirildi.
   ===================================================================== */

/* ------------------------------------------------------------ ortak */
.v63-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* kanal (tür) rozeti — kartta ve PROGRAM monitöründe aynı */
html[data-mode] body #isler .v63-hud-ty{display:inline-flex;align-items:center;height:15px;padding:0 5px;
  border-radius:3px;font:500 8.5px/1 var(--v63-mono);letter-spacing:.12em;color:#fff;background:var(--v63-b)}
html[data-mode] body #isler .v63-hud-ty.is-vfx{background:var(--v63-g)}

/* =====================================================================
   1) KART HUD'U  — hover (fare) · :focus-visible (herkes) · rulet (.rl)
   ===================================================================== */
html[data-mode] body #isler .wall .wcard{--hud:0}
@media (hover:hover){html[data-mode] body #isler .wall .wcard:hover{--hud:1}}
html[data-mode] body #isler .wall .wcard:is(:focus-visible,.rl){--hud:1}

html[data-mode] body #isler .wall .whead{container-type:inline-size}
html[data-mode] body #isler .v63-hud{position:absolute;inset:0;z-index:6;pointer-events:none;border-radius:inherit;
  display:block;margin:0;padding:0}

/* corner-pin köşeleri (core .v63-pin ilkeli; alttakiler HUD şeridinin üstünde durur) */
html[data-mode] body #isler .v63-hud .v63-pin{--pin-c:var(--v63-y);width:12px;height:12px;
  opacity:var(--hud);transition:opacity .18s var(--v63-ease),transform .34s var(--v63-snap)}
html[data-mode] body #isler .v63-hud .v63-pin:nth-of-type(1){top:9px;left:9px;
  transform:translate(calc((1 - var(--hud))*7px),calc((1 - var(--hud))*7px))}
html[data-mode] body #isler .v63-hud .v63-pin:nth-of-type(2){top:9px;right:9px;
  transform:translate(calc((var(--hud) - 1)*7px),calc((1 - var(--hud))*7px))}
html[data-mode] body #isler .v63-hud .v63-pin:nth-of-type(3){bottom:37px;left:9px;
  transform:translate(calc((1 - var(--hud))*7px),calc((var(--hud) - 1)*7px))}
html[data-mode] body #isler .v63-hud .v63-pin:nth-of-type(4){bottom:37px;right:9px;
  transform:translate(calc((var(--hud) - 1)*7px),calc((var(--hud) - 1)*7px))}

/* alt HUD şeridi */
html[data-mode] body #isler .v63-hud-bar{position:absolute;left:0;right:0;bottom:0;height:28px;
  display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 7px 0 10px;
  background:rgba(11,13,22,.88);box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  font:500 9.5px/1 var(--v63-mono);font-variant-numeric:tabular-nums;letter-spacing:.07em;
  color:var(--v63-paper);white-space:nowrap;text-transform:uppercase;
  transform:translateY(calc((1 - var(--hud))*101%));transition:transform .3s var(--v63-ease)}
html[data-mode] body #isler .v63-hud-l{display:inline-flex;align-items:center;gap:7px;min-width:0;overflow:hidden}
html[data-mode] body #isler .v63-hud-k{color:rgba(244,238,224,.5)}
html[data-mode] body #isler .v63-hud-no{font-weight:500;color:var(--v63-paper);margin-left:-3px}
html[data-mode] body #isler .v63-hud-yr{color:rgba(244,238,224,.78);padding-left:7px;
  box-shadow:inset 1px 0 0 rgba(255,255,255,.18)}
html[data-mode] body #isler .v63-hud-r{flex:none;display:inline-flex;align-items:center;height:17px;padding:0 7px;
  border-radius:3px;background:var(--v63-r);color:#fff;font-size:9px;letter-spacing:.1em;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset}
html[data-mode] body #isler .v63-hud-r.is-off{background:none;color:rgba(244,238,224,.55);
  box-shadow:0 0 0 1px rgba(255,255,255,.22) inset;letter-spacing:.08em}
@container (max-width:205px){html[data-mode] body #isler .v63-hud-yr{display:none}}
@container (max-width:150px){html[data-mode] body #isler .v63-hud-k{display:none}
  html[data-mode] body #isler .v63-hud-no{margin-left:0}}

/* yıl rozeti HUD'a taşınır; sağ üst köşe pin'e kalır */
html[data-mode] body #isler .wall .whead .yr{opacity:calc(1 - var(--hud));transition:opacity .2s var(--v63-ease)}

/* kanal kayması çerçevesi: beyaz çekirdek + kırmızı sola, mavi sağa kaymış hat (RGB misregistration) */
html[data-mode] body #isler .wall .wcard .whead{
  box-shadow:0 0 0 0 rgba(244,238,224,0),0 0 0 0 rgba(217,44,80,0),0 0 0 0 rgba(47,91,255,0),0 18px 40px -18px rgba(0,0,0,.8);
  transition:box-shadow .34s var(--v63-snap),opacity .26s var(--v63-ease) .08s,filter .26s var(--v63-ease) .08s}
html[data-mode="day"] body #isler .wall .wcard .whead{
  box-shadow:0 0 0 0 rgba(23,26,38,0),0 0 0 0 rgba(217,44,80,0),0 0 0 0 rgba(47,91,255,0),0 16px 34px -18px rgba(23,26,38,.45)}
@media (hover:hover){
  html[data-mode] body #isler .wall .wcard:hover .whead{
    box-shadow:0 0 0 1px rgba(244,238,224,.92),-2px -1px 0 1px var(--v63-r),2px 1px 0 1px var(--v63-b),0 26px 50px -20px rgba(0,0,0,.9)}
  html[data-mode="day"] body #isler .wall .wcard:hover .whead{
    box-shadow:0 0 0 1px var(--v63-ink),-2px -1px 0 1px var(--v63-r),2px 1px 0 1px var(--v63-b),0 24px 44px -22px rgba(23,26,38,.55)}
}
html[data-mode] body #isler .wall .wcard:is(:focus-visible,.rl) .whead{
  box-shadow:0 0 0 1px rgba(244,238,224,.92),-2px -1px 0 1px var(--v63-r),2px 1px 0 1px var(--v63-b),0 26px 50px -20px rgba(0,0,0,.9)}
html[data-mode="day"] body #isler .wall .wcard:is(:focus-visible,.rl) .whead{
  box-shadow:0 0 0 1px var(--v63-ink),-2px -1px 0 1px var(--v63-r),2px 1px 0 1px var(--v63-b),0 24px 44px -22px rgba(23,26,38,.55)}
/* klavye odağı: halka artık kartın başlığında; kartın kendi taslağı sakinleşsin */
html[data-mode] body #isler .wall .wcard:focus-visible{outline:2px solid var(--v63-y);outline-offset:6px;border-radius:16px}
html[data-mode="day"] body #isler .wall .wcard:focus-visible{outline-color:var(--v63-b)}

/* rulet kazananı: tally yanıp söner, ardından lightbox açılır */
html[data-mode] body #isler .wall .wcard.rlwin .v63-hud-r{animation:v63-hud-win .35s steps(2,jump-none) 2}
@keyframes v63-hud-win{0%{background:var(--v63-r)}100%{background:var(--v63-y);color:#151109}}

/* =====================================================================
   2) ODAK MODU — bir kart hover'dayken diğerleri geri çekilir (yalnız fare)
   ===================================================================== */
html[data-mode] body #isler .wall .wcard>.wbody{transition:opacity .26s var(--v63-ease) .08s,filter .26s var(--v63-ease) .08s}
@media (hover:hover){
  html[data-mode] body #isler .wall:has(.wcard:hover) .wcard:not(:hover)>:is(.whead,.wbody){
    opacity:.45;filter:saturate(.35);transition-delay:0s}
}
html[data-mode] body #isler .wall:has(.wcard:focus-visible) .wcard:not(:focus-visible)>:is(.whead,.wbody){
  opacity:.45;filter:saturate(.35);transition-delay:0s}

/* ilk girişte dağıtma — kartın transform'una (eğim) dokunmaz: ayrı translate/scale */
@keyframes v63-deal{
  0%{opacity:0;translate:0 22px;scale:.965}
  60%{opacity:1}
  100%{opacity:1;translate:0 0;scale:1}}
@keyframes v63-deal-rgb{
  0%{box-shadow:0 0 0 0 rgba(244,238,224,0),-7px 0 0 0 rgba(217,44,80,.55),7px 0 0 0 rgba(47,91,255,.55),0 18px 40px -18px rgba(0,0,0,0)}
  100%{box-shadow:0 0 0 0 rgba(244,238,224,0),0 0 0 0 rgba(217,44,80,0),0 0 0 0 rgba(47,91,255,0),0 18px 40px -18px rgba(0,0,0,.8)}}
html[data-mode] body #isler .wall .wcard.v63-deal:not(.fx-deal){animation:v63-deal .62s var(--v63-ease) var(--v63-dd,0ms) backwards}
html[data-mode] body #isler .wall .wcard.v63-deal:not(.fx-deal) .whead{animation:v63-deal-rgb .7s var(--v63-ease) calc(var(--v63-dd,0ms) + 60ms) backwards}

/* =====================================================================
   3) PROGRAM MONİTÖRÜ — öne çıkan iş
   sol: bilgi paneli (tally · başlık · İZLE) · sağ: 16:9 program monitörü (resmin kendi oranında)
   ===================================================================== */
html[data-mode] body #isler .feat.v63-program{
  --pgm:0;
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) min(46%,560px);grid-template-rows:minmax(0,1fr) auto;
  column-gap:48px;row-gap:22px;align-items:end;
  min-height:0;padding:16px 16px 16px 38px;margin-bottom:22px;text-align:left;
  background:var(--v63-ink);color:var(--v63-paper);
  border:1px solid rgba(255,255,255,.13);border-radius:var(--v63-r-panel);
  box-shadow:0 34px 70px -34px rgba(0,0,0,.92),inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:none;-webkit-backdrop-filter:none;overflow:hidden;isolation:isolate;
  transition:border-color .3s var(--v63-ease),box-shadow .3s var(--v63-ease)}
html[data-mode="day"] body #isler .feat.v63-program{background:var(--v63-surface-hi);color:var(--v63-text);
  border-color:rgba(23,26,38,.14);box-shadow:0 30px 60px -32px rgba(23,26,38,.5),inset 0 1px 0 #fff}
@media (hover:hover){html[data-mode] body #isler .feat.v63-program:hover{--pgm:1}}
html[data-mode] body #isler .feat.v63-program:focus-visible{--pgm:1;outline:2px solid var(--v63-y);outline-offset:4px}
html[data-mode="day"] body #isler .feat.v63-program:focus-visible{outline-color:var(--v63-b)}
@media (hover:hover){
  html[data-mode] body #isler .feat.v63-program:hover{border-color:rgba(255,59,94,.5);
    box-shadow:0 40px 80px -34px rgba(0,0,0,.95),0 0 0 1px rgba(255,59,94,.3)}
  html[data-mode="day"] body #isler .feat.v63-program:hover{border-color:rgba(217,44,80,.45);
    box-shadow:0 34px 64px -30px rgba(23,26,38,.55),0 0 0 1px rgba(217,44,80,.25)}
}
html[data-mode] body #isler .feat.v63-program::after{display:none}
/* monitörün odaya vuran ışığı: resmin kendisinden, tek seferlik bulanık katman (backdrop değil) */
html[data-mode] body #isler .feat.v63-program::before{content:"";display:block;position:absolute;z-index:0;pointer-events:none;
  top:-12%;bottom:-12%;right:-3%;width:50%;background:var(--pgm-img,none) center/cover no-repeat;
  filter:blur(56px) saturate(1.6);opacity:.3;transform:translateZ(0)}
html[data-mode="day"] body #isler .feat.v63-program::before{opacity:.22}

/* monitör: resim (.fthumb) + kılavuz katmanı (.v63-mon) aynı ızgara alanında üst üste */
html[data-mode] body #isler .feat.v63-program>.fthumb,
html[data-mode] body #isler .feat.fthumbed>span.v63-mon{grid-column:2;grid-row:1 / 3;align-self:center;
  position:relative;inset:auto;width:100%;height:auto;aspect-ratio:16/9;border-radius:10px;margin:0;display:block}
html[data-mode] body #isler .feat.v63-program>.fthumb{z-index:1;opacity:1;background-size:cover;background-position:center;
  filter:saturate(1.02) brightness(.93);box-shadow:0 0 0 1px rgba(255,255,255,.1),0 24px 50px -24px rgba(0,0,0,.9);
  transition:filter .5s var(--v63-ease)}
html[data-mode="day"] body #isler .feat.v63-program>.fthumb{box-shadow:0 0 0 1px rgba(23,26,38,.18),0 22px 44px -24px rgba(23,26,38,.6)}
html[data-mode] body #isler .feat.v63-program>.fthumb::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(11,13,22,.42),rgba(11,13,22,0) 30%);box-shadow:inset 0 0 70px rgba(0,0,0,.28)}
@media (hover:hover){html[data-mode] body #isler .feat.v63-program:hover>.fthumb{filter:saturate(1.1) brightness(1.03)}}
html[data-mode] body #isler .feat.fthumbed>span.v63-mon{z-index:2;pointer-events:none}

/* corner-pin köşeleri: boşta kâğıt rengi, soluk · hover/odak: sarı, yerine oturur */
html[data-mode] body #isler .v63-mon .v63-pin{--pin-c:var(--v63-y);width:18px;height:18px;
  opacity:calc(.3 + var(--pgm)*.7);transition:opacity .2s var(--v63-ease),transform .36s var(--v63-snap),border-color .2s}
html[data-mode] body #isler .feat.v63-program:not(:hover):not(:focus-visible) .v63-mon .v63-pin{--pin-c:rgba(244,238,224,.95)}
html[data-mode] body #isler .v63-mon .v63-pin:nth-of-type(1){top:10px;left:10px;transform:translate(calc((1 - var(--pgm))*5px),calc((1 - var(--pgm))*5px))}
html[data-mode] body #isler .v63-mon .v63-pin:nth-of-type(2){top:10px;right:10px;transform:translate(calc((var(--pgm) - 1)*5px),calc((1 - var(--pgm))*5px))}
html[data-mode] body #isler .v63-mon .v63-pin:nth-of-type(3){bottom:10px;left:10px;transform:translate(calc((1 - var(--pgm))*5px),calc((var(--pgm) - 1)*5px))}
html[data-mode] body #isler .v63-mon .v63-pin:nth-of-type(4){bottom:10px;right:10px;transform:translate(calc((var(--pgm) - 1)*5px),calc((var(--pgm) - 1)*5px))}

/* title-safe / action-safe + merkez artı */
html[data-mode] body #isler .v63-safe{position:absolute;inset:0;opacity:calc(var(--pgm)*.95);transition:opacity .35s var(--v63-ease)}
html[data-mode] body #isler .v63-safe>span{position:absolute;display:block}
html[data-mode] body #isler .v63-safe-a{inset:5%;border:1px solid rgba(244,238,224,.34);border-radius:2px}
html[data-mode] body #isler .v63-safe-t{inset:10%;border:1px dashed rgba(244,238,224,.26);border-radius:1px}
html[data-mode] body #isler .v63-safe-a::before,html[data-mode] body #isler .v63-safe-t::before{
  position:absolute;left:50%;transform:translateX(-50%);top:4px;white-space:nowrap;
  font:500 7.5px/1 var(--v63-mono);letter-spacing:.16em;color:rgba(244,238,224,.6);text-shadow:0 1px 3px rgba(0,0,0,.7)}
html[data-mode] body #isler .v63-safe-a::before{content:"ACTION SAFE"}
html[data-mode] body #isler .v63-safe-t::before{content:"TITLE SAFE"}
html[data-mode] body #isler .v63-safe-x{left:50%;top:50%;width:28px;height:28px;margin:-14px 0 0 -14px}
html[data-mode] body #isler .v63-safe-x::before,html[data-mode] body #isler .v63-safe-x::after{content:"";position:absolute;
  background:rgba(244,238,224,.75);box-shadow:0 0 3px rgba(0,0,0,.6)}
html[data-mode] body #isler .v63-safe-x::before{left:0;right:0;top:50%;height:1px;margin-top:-.5px}
html[data-mode] body #isler .v63-safe-x::after{top:0;bottom:0;left:50%;width:1px;margin-left:-.5px}

/* monitörün sağ üstü: iş künyesi (duvardaki kartından) */
html[data-mode] body #isler .v63-mon-meta{position:absolute;top:13px;right:40px;display:inline-flex;align-items:center;gap:8px;
  height:21px;padding:0 3px 0 8px;border-radius:5px;background:rgba(11,13,22,.72);
  font:500 9.5px/1 var(--v63-mono);letter-spacing:.14em;color:rgba(244,238,224,.86);font-variant-numeric:tabular-nums}

/* ● PROGRAM tally (".star" öğesi korunur; kendi metni ikincil etiket olur) */
html[data-mode] body #isler .feat.v63-program .star{position:absolute;left:38px;top:30px;z-index:3;
  display:inline-flex;align-items:center;gap:12px;margin:0;padding:0;transform:none;writing-mode:horizontal-tb;
  background:none;border:0;border-radius:0;box-shadow:none;width:auto;height:auto;
  font:500 10px/1 var(--v63-mono);letter-spacing:.16em;text-transform:uppercase;color:rgba(244,238,224,.62)}
html[data-mode="day"] body #isler .feat.v63-program .star{color:var(--v63-muted)}
html[data-mode] body #isler .v63-pgm{display:inline-flex;align-items:center;gap:8px;height:24px;padding:0 10px 0 9px;
  border-radius:5px;background:var(--v63-r);color:#fff;font:500 10.5px/1 var(--v63-mono);letter-spacing:.18em;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 8px 22px -8px rgba(217,44,80,.9)}
html[data-mode] body #isler .v63-pgm .v63-tally{width:7px;height:7px;background:#fff}
html[data-mode] body #isler .v63-pgm .v63-tally.is-on{animation:v63-pgm-dot 1.8s var(--v63-ease) infinite}
@keyframes v63-pgm-dot{0%{box-shadow:0 0 0 0 rgba(255,255,255,.7)}70%,100%{box-shadow:0 0 0 6px rgba(255,255,255,0)}}

/* başlık + açıklama */
html[data-mode] body #isler .feat.v63-program>span:not(.fthumb):not(.star):not(.v63-mon):not(.go){
  grid-column:1;grid-row:1;align-self:end;position:relative;z-index:2;padding-top:64px}
html[data-mode] body #isler .feat.v63-program h3{margin:0 0 12px;color:inherit;
  font-size:clamp(26px,2.6vw,40px);line-height:1.04;letter-spacing:-.025em;text-wrap:balance;
  text-shadow:var(--sx,3px) var(--sy,3px) 0 rgba(47,91,255,.55)}
html[data-mode="day"] body #isler .feat.v63-program h3{text-shadow:var(--sx,3px) var(--sy,3px) 0 rgba(47,91,255,.28)}
html[data-mode] body #isler .feat.v63-program p{margin:0;color:rgba(244,238,224,.8);font-size:15.5px;line-height:1.5;max-width:44ch}
html[data-mode="day"] body #isler .feat.v63-program p{color:var(--v63-text-2)}

/* birincil İZLE düğmesi */
html[data-mode] body #isler .feat.v63-program .go{grid-column:1;grid-row:2;position:relative;z-index:2;
  justify-self:start;align-self:end;margin:0 0 22px;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding:0 28px 0 22px;
  border:0;border-radius:12px;background:var(--v63-y);color:#151109;white-space:nowrap;
  font:800 14px/1 var(--v63-sans);letter-spacing:.1em;text-transform:uppercase;
  box-shadow:0 16px 34px -14px rgba(255,206,31,.65),inset 0 -2px 0 rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.5);
  transition:transform .28s var(--v63-snap),box-shadow .28s var(--v63-ease),filter .2s}
html[data-mode="day"] body #isler .feat.v63-program .go{box-shadow:0 14px 28px -14px rgba(138,100,0,.55),inset 0 -2px 0 rgba(0,0,0,.16),inset 0 0 0 1px rgba(23,26,38,.2)}
html[data-mode] body #isler .feat.v63-program .go::before{content:"";width:0;height:0;flex:none;margin-right:2px;
  border-left:10px solid currentColor;border-top:6.5px solid transparent;border-bottom:6.5px solid transparent}
@media (hover:hover){html[data-mode] body #isler .feat.v63-program:hover .go{filter:brightness(1.06) saturate(1.05);color:#151109;transform:translateY(-2px);
  box-shadow:0 22px 40px -14px rgba(255,206,31,.8),inset 0 -2px 0 rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.5)}}
html[data-mode] body #isler .feat.v63-program:active .go{transform:translateY(1px)}

@media (max-width:760px){
  html[data-mode] body #isler .feat.v63-program{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;
    row-gap:18px;padding:58px 12px 14px}
  html[data-mode] body #isler .feat.v63-program>.fthumb,
  html[data-mode] body #isler .feat.fthumbed>span.v63-mon{grid-column:1;grid-row:1}
  html[data-mode] body #isler .feat.v63-program>span:not(.fthumb):not(.star):not(.v63-mon):not(.go){grid-row:2;padding:0 8px}
  html[data-mode] body #isler .feat.v63-program .go{grid-row:3;justify-self:stretch;margin:0;height:52px}
  html[data-mode] body #isler .feat.v63-program .star{left:20px;top:20px;gap:10px}
  html[data-mode] body #isler .feat.v63-program::before{top:-10%;bottom:auto;height:70%;right:-10%;width:120%}
  html[data-mode] body #isler .v63-mon-meta{top:9px;right:38px}
  html[data-mode] body #isler .v63-safe-a::before,html[data-mode] body #isler .v63-safe-t::before{display:none}
}
@media (max-width:360px){html[data-mode] body #isler .feat.v63-program .star{font-size:0;letter-spacing:0;gap:0}}

/* =====================================================================
   4) BIN SAYACI  — "BIN · 49/49 KLİP"
   ===================================================================== */
html[data-mode] body #isler .wbar .v63-bin{margin-left:auto;position:relative;overflow:hidden;
  display:inline-flex;align-items:center;gap:9px;height:36px;padding:0 13px 0 12px;
  border:1px solid var(--v63-line-2);border-radius:9px;background:var(--v63-surface);
  font:500 10.5px/1 var(--v63-mono);font-variant-numeric:tabular-nums;letter-spacing:.1em;
  color:var(--v63-muted);white-space:nowrap;transition:border-color .25s var(--v63-ease)}
html[data-mode] body #isler .v63-bin-k{color:var(--v63-text);font-weight:500}
html[data-mode] body #isler .v63-bin-sep{width:1px;height:12px;background:var(--v63-line-2)}
html[data-mode] body #isler .v63-bin-v{display:inline-flex;align-items:baseline}
html[data-mode] body #isler .v63-bin-n{display:inline-block;min-width:2ch;text-align:right;color:var(--v63-text)}
html[data-mode] body #isler .v63-bin-t{color:var(--v63-muted)}
html[data-mode] body #isler .v63-bin-u{color:var(--v63-muted);letter-spacing:.12em}
html[data-mode] body #isler .v63-bin-bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--v63-line)}
html[data-mode] body #isler .v63-bin-bar i{display:block;height:100%;background:var(--v63-g-live);transform-origin:left center;
  transition:transform .45s var(--v63-ease),background .25s}
html[data-mode] body #isler .v63-bin.is-filtered{border-color:rgba(255,206,31,.55)}
html[data-mode] body #isler .v63-bin.is-filtered .v63-bin-bar i{background:var(--v63-y)}
html[data-mode] body #isler .v63-bin.is-filtered .v63-bin-n{color:var(--v63-y)}
html[data-mode="day"] body #isler .v63-bin.is-filtered .v63-bin-n{color:var(--v63-text)}
html[data-mode] body #isler .v63-bin.is-empty{border-color:rgba(217,44,80,.6)}
html[data-mode] body #isler .v63-bin.is-empty .v63-bin-n,html[data-mode] body #isler .v63-bin.is-empty .v63-bin-u{color:var(--v63-r);letter-spacing:.04em}
html[data-mode] body #isler .v63-bin.is-tick.is-down .v63-bin-n{animation:v63-tick-dn .34s var(--v63-snap)}
html[data-mode] body #isler .v63-bin.is-tick.is-up .v63-bin-n{animation:v63-tick-up .34s var(--v63-snap)}
@keyframes v63-tick-dn{0%{transform:translateY(-70%);opacity:0}100%{transform:none;opacity:1}}
@keyframes v63-tick-up{0%{transform:translateY(70%);opacity:0}100%{transform:none;opacity:1}}
@media (max-width:760px){
  html[data-mode] body #isler .wbar .v63-bin{height:34px;padding:0 10px;gap:7px;font-size:10px;letter-spacing:.06em}
}

/* =====================================================================
   5) VU METRE — hero sayaçları
   ===================================================================== */
html[data-mode] body .stats .ct.v63-vu-on{display:grid!important;grid-template-columns:auto minmax(0,1fr);
  grid-template-rows:auto auto;column-gap:16px;align-content:start}
html[data-mode] body .stats .ct.v63-vu-on>b{grid-column:2;grid-row:1}
html[data-mode] body .stats .ct.v63-vu-on>span:not(.v63-vu){grid-column:2;grid-row:2}
html[data-mode] body .stats .ct>span.v63-vu{grid-column:1;grid-row:1 / 3;align-self:stretch;
  display:flex;gap:3px;margin:0;padding:1px 0 2px;position:relative;
  --vu-off:rgba(255,255,255,.085);--vu-g:var(--v63-g-hi);--vu-y:var(--v63-y);--vu-r:var(--v63-tally)}
html[data-mode="day"] body .stats .ct>span.v63-vu{--vu-off:rgba(23,26,38,.1);--vu-g:var(--v63-g);--vu-y:var(--v63-y);--vu-r:var(--v63-r)}
html[data-mode] body .stats .v63-vu-ch{display:flex;flex-direction:column-reverse;gap:2px;width:6px}
html[data-mode] body .stats .v63-vu-ch i{display:block;flex:1 1 0;min-height:2px;border-radius:1px;background:var(--vu-off);
  transition:background-color .24s linear,box-shadow .24s linear}
html[data-mode] body .stats .v63-vu-ch i.on,html[data-mode] body .stats .v63-vu-ch i.pk{transition:background-color .04s linear,box-shadow .04s linear}
html[data-mode] body .stats .v63-vu-ch i.z-g:is(.on,.pk){background:var(--vu-g)}
html[data-mode] body .stats .v63-vu-ch i.z-y:is(.on,.pk){background:var(--vu-y)}
html[data-mode] body .stats .v63-vu-ch i.z-r:is(.on,.pk){background:var(--vu-r)}
html[data-mode="night"] body .stats .v63-vu-ch i.on{box-shadow:0 0 6px -1px currentColor}
html[data-mode="night"] body .stats .v63-vu-ch i.z-g{color:var(--vu-g)}
html[data-mode="night"] body .stats .v63-vu-ch i.z-y{color:var(--vu-y)}
html[data-mode="night"] body .stats .v63-vu-ch i.z-r{color:var(--vu-r)}
html[data-mode] body .stats .v63-vu-ch i.pk{box-shadow:0 0 0 1px rgba(255,255,255,.35),0 0 8px 0 currentColor}
html[data-mode="day"] body .stats .v63-vu-ch i.pk{box-shadow:0 0 0 1px rgba(23,26,38,.35)}
/* ton göstergesi: iki kanal eşit, sabit — küçük "0 VU" referans çentiği */
html[data-mode] body .stats .v63-vu.is-tone::after{content:"";position:absolute;right:-5px;width:3px;height:1px;
  bottom:calc(2px + (100% - 3px) * 8 / 14 - 1px);background:var(--v63-muted);opacity:0;transition:opacity .4s .6s}
html[data-mode] body .stats .v63-vu.is-tone.is-steady::after{opacity:.9}
/* ayraçlar gündüz de görünsün */
html[data-mode="day"] body .stats .ct+.ct{border-left-color:var(--v63-line-2)!important}

@media (max-width:760px){
  html[data-mode] body .stats{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 0!important;
    max-width:none;width:100%}
  html[data-mode] body .stats .ct.v63-vu-on{padding:2px 14px 2px 0!important;column-gap:12px;min-width:0}
  html[data-mode] body .stats .ct.v63-vu-on:nth-child(2){padding-left:16px!important}
  html[data-mode] body .stats .ct.v63-vu-on:nth-child(3){grid-column:1 / -1;border-left:0!important;padding:16px 0 2px!important;
    border-top:1px solid var(--v63-line)!important}
  html[data-mode] body .stats .ct.v63-vu-on>span:not(.v63-vu){line-height:1.45}
  html[data-mode] body .stats .v63-vu-ch{width:4px}
}

/* =====================================================================
   hareket azaltma · dokunmatik
   ===================================================================== */
@media (prefers-reduced-motion:reduce){
  html[data-mode] body #isler .v63-hud .v63-pin,html[data-mode] body #isler .v63-hud-bar,
  html[data-mode] body #isler .v63-mon .v63-pin,html[data-mode] body #isler .v63-safe,
  html[data-mode] body #isler .wall .wcard .whead,html[data-mode] body #isler .wall .wcard>.wbody,
  html[data-mode] body #isler .feat.v63-program>.fthumb,html[data-mode] body #isler .feat.v63-program .go,
  html[data-mode] body .stats .v63-vu-ch i{transition:none!important}
  html[data-mode] body #isler .wall .wcard.v63-deal,html[data-mode] body #isler .wall .wcard.v63-deal .whead,
  html[data-mode] body #isler .v63-bin .v63-bin-n,html[data-mode] body #isler .wall .wcard.rlwin .v63-hud-r,
  html[data-mode] body #isler .v63-pgm .v63-tally{animation:none!important}
}