:root{
  --rk-accent:#3b82f6;                /* buton + eq rengi */
  --rk-bg-a:rgba(17,24,39,.78);       /* cam üst gradient */
  --rk-bg-b:rgba(17,24,39,.64);
  --rk-text:#e5e7eb;                  /* metin */
  --rk-muted:#9ca3af;                 /* alt metin */
  --rkpro-bar-h:86px;                 /* sticky boşluğu */
  --rk-radius:22px;                   /* kart yuvarlaklık */
}
body{padding-bottom:var(--rkpro-bar-h)}
/* ------- BAR ------- */
.rkpro-radio{
  width:100%;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px 18px; color:var(--rk-text);
  border-radius:var(--rk-radius);
  background:linear-gradient(180deg,var(--rk-bg-a),var(--rk-bg-b));
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(10px);
  box-shadow:0 10px 30px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}
.rkpro-left{display:flex;align-items:center;gap:14px;min-width:0}
.rkpro-btn{
  inline-size:52px; block-size:52px; border-radius:9999px; border:none; cursor:pointer;
  display:grid; place-items:center; background:var(--rk-accent);
  box-shadow:0 6px 18px rgba(59,130,246,.35);
}
.rkpro-btn svg{width:22px;height:22px;fill:white}
.rkpro-meta{flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:4px}
.rkpro-sub{font-size:12px;color:var(--rk-muted)}
/* başlık ray + marquee */
.rkpro-title-rail{
  min-width:0; overflow:hidden; position:relative;
  mask-image:linear-gradient(90deg, transparent 0, black 24px, black calc(100% - 24px), transparent 100%);
  -webkit-mask-image:linear-gradient(90deg, transparent 0, black 24px, black calc(100% - 24px), transparent 100%);
}
.rkpro-title-track{ display:inline-flex; gap:48px; align-items:baseline; will-change:transform }
.rkpro-title{ font-weight:800; white-space:nowrap; display:inline-block; font-size:18px }
/* Marquee sadece gerektiğinde */
.rkpro-meta.is-marquee .rkpro-title-track{
  animation: rk-marquee var(--rk-marquee-dur,16s) linear infinite;
}
@keyframes rk-marquee{
  from{ transform: translateX(0) }
  to  { transform: translateX(calc(-1 * var(--rk-marquee-w, 600px))) }
}

/* ------- EQ ------- */
.rkpro-eq{height:36px; width:38%; min-width:240px; border-radius:10px; overflow:hidden}
/* ------- STICKY ------- */
.rkpro-sticky{
  position:fixed; left:0; right:0; bottom:0; z-index:9999;
  padding:10px calc(16px + env(safe-area-inset-right))
           calc(10px + env(safe-area-inset-bottom))
           calc(16px + env(safe-area-inset-left));
  pointer-events:none;               /* sadece içerideki bara tıklansın */
  transform: translateY(100%);       /* başlangıçta gizli */
  opacity:.0; transition:transform .35s ease, opacity .35s ease;
}
.rkpro-sticky.show{ transform:translateY(0); opacity:1 }
.rkpro-sticky .rkpro-radio{
  max-width:1180px; margin:0 auto; pointer-events:auto;
  background:rgba(15,15,15,.9); backdrop-filter:blur(12px);
  box-shadow:0 -2px 16px rgba(0,0,0,.45);
}
.rkpro-sticky .rkpro-btn{ inline-size:46px; block-size:46px }
.rkpro-sticky .rkpro-title{ font-size:16px }
.rkpro-sticky .rkpro-sub{ font-size:12px }
.rkpro-sticky .rkpro-title-rail{ max-width:calc(100vw - 220px) } /* buton+eq toleransı */

/* ------- RESPONSIVE ------- */
@media (max-width:960px){
  .rkpro-eq{ width:32%; min-width:180px }
}
@media (max-width:720px){
  .rkpro-eq{ display:none }
  :root{ --rkpro-bar-h:76px }
  .rkpro-title{ font-size:16px }
}
