/* Overlay › Overlay’ler (kuzgun-overlay-araclar.js). Renkler kabuğun belirteçlerinden (--kz-*, --ov-*): açık temada da doğru. */
.kzx-panel{display:flex;flex-direction:column;gap:22px}
.kzx-intro h2{margin:0;font-size:22px;font-weight:700;letter-spacing:-.3px;color:var(--kz-text)}
.kzx-intro p{margin:6px 0 0;max-width:760px;font-size:15px;line-height:1.5;color:var(--kz-muted)}
.kzx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.kzx-card{display:flex;flex-direction:column;min-width:0;padding:0;border:1px solid var(--ov-line);border-radius:14px;background:var(--kz-card);color:var(--kz-text);text-align:left;cursor:pointer;overflow:hidden;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.kzx-card:hover,.kzx-card:focus-visible{transform:translateY(-3px);border-color:var(--kz-gold);box-shadow:0 14px 34px -18px rgba(0,0,0,.55);outline:none}
.kzx-card:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--kz-gold) 40%,transparent)}
.kzx-thumb{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#141019}
.kzx-thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .35s ease}
.kzx-card:hover .kzx-thumb img{transform:scale(1.04)}
.kzx-live{position:absolute;left:10px;top:10px;display:inline-flex;align-items:center;gap:7px;padding:5px 10px 5px 9px;border-radius:999px;background:rgba(12,10,18,.78);color:#fff;font:600 12px/1 Inter,system-ui,sans-serif;font-style:normal;letter-spacing:.2px}
.kzx-live i{width:8px;height:8px;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 0 rgba(61,220,132,.6);animation:kzx-nabiz 2s ease-out infinite}
@keyframes kzx-nabiz{0%{box-shadow:0 0 0 0 rgba(61,220,132,.55)}70%{box-shadow:0 0 0 7px rgba(61,220,132,0)}100%{box-shadow:0 0 0 0 rgba(61,220,132,0)}}
.kzx-body{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}
.kzx-body strong{font-size:16.5px;font-weight:650;line-height:1.25}
.kzx-body small{font-size:13.5px;line-height:1.45;color:var(--kz-muted);flex:1}
.kzx-go{display:inline-flex;align-items:center;gap:7px;margin-top:6px;font-size:14px;font-weight:600;color:var(--kz-lilac)}
.kzx-go i{font-size:15px;transition:transform .18s ease}
.kzx-card:hover .kzx-go i{transform:translateX(3px)}

.kzx-eski{padding:18px 20px;border:1px dashed var(--ov-line);border-radius:14px;background:var(--ov-item)}
.kzx-eski-head{display:flex;gap:14px;align-items:flex-start}
.kzx-eski-head>i{flex:none;font-size:24px;color:var(--kz-gold);margin-top:2px}
.kzx-eski-head h3{margin:0;font-size:16.5px;font-weight:650;color:var(--kz-text)}
.kzx-eski-head p{margin:4px 0 0;font-size:14px;line-height:1.5;color:var(--kz-muted)}
.kzx-eski-list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.kzx-eski-list li{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--ov-line);border-radius:10px;background:var(--kz-card)}
.kzx-eski-list li>i{flex:none;font-size:20px;color:var(--kz-lilac)}
.kzx-eski-list li>span{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.kzx-eski-list strong{font-size:14.5px;font-weight:600}
.kzx-eski-list small{font-size:12.5px;line-height:1.4;color:var(--kz-muted)}
.kzx-eski-list button{flex:none;min-height:36px;padding:0 16px;border:1px solid var(--ov-line);border-radius:8px;background:transparent;color:var(--kz-text);font:600 13.5px Inter,system-ui,sans-serif;cursor:pointer}
.kzx-eski-list button:hover{border-color:var(--kz-gold);color:var(--kz-gold)}
.kzx-eski-not{display:flex;gap:8px;align-items:flex-start;margin:12px 0 0;font-size:12.5px;line-height:1.45;color:var(--kz-muted)}
.kzx-eski-not i{font-size:15px;margin-top:1px}

/* Bu sekmede araç çubuğundaki “OBS bağlantısı” ve “Kaydet” alertlere ait: karışmasın diye gizli. */
.kz-overlay[data-kzo-view="overlays"] .kz-overlay-toolbar-actions{visibility:hidden}

@media (max-width:600px){
  .kzx-panel{gap:16px}
  .kzx-intro h2{font-size:19px}
  .kzx-intro p{font-size:14px}
  .kzx-grid{grid-template-columns:1fr 1fr;gap:12px}
  .kzx-body{padding:10px 12px 12px}
  .kzx-body strong{font-size:14.5px}
  .kzx-body small{display:none}
  .kzx-go{font-size:13px;margin-top:2px}
  .kzx-live{left:6px;top:6px;padding:4px 8px;font-size:11px}
  .kzx-eski{padding:14px}
  .kzx-eski-list li{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){.kzx-card,.kzx-thumb img,.kzx-go i{transition:none}.kzx-live i{animation:none}}