/* =========================================================
   MPDL Story Audio Manager v1
========================================================= */
.mpsp-audio-panel{position:relative;overflow:hidden;margin-bottom:18px;padding:clamp(18px,2.4vw,28px);border:1px solid var(--mpsp-border,rgba(216,108,255,.26));border-radius:var(--mpsp-radius-xl,26px);background:linear-gradient(180deg,rgba(255,255,255,.055),transparent),repeating-linear-gradient(135deg,rgba(255,255,255,.026) 0 1px,transparent 1px 7px),var(--mpsp-panel,rgba(34,22,45,.76));box-shadow:var(--mpsp-shadow,0 22px 70px rgba(0,0,0,.42));color:var(--mpsp-text,#f5ecff)}
.mpsp-audio-panel:before{content:"";pointer-events:none;position:absolute;inset:0;border-top:1px solid rgba(255,255,255,.12);background:radial-gradient(circle at 88% 0%,rgba(216,108,255,.15),transparent 15rem);opacity:.85}.mpsp-audio-panel>*{position:relative;z-index:1}.mpsp-audio-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}.mpsp-audio-badge{display:inline-flex;min-height:28px;align-items:center;padding:6px 10px;border:1px solid rgba(110,255,221,.29);border-radius:999px;color:var(--mpsp-accent-2,#6effdd);background:rgba(110,255,221,.07);font-size:.76rem;font-weight:800;letter-spacing:.08em}.mpsp-audio-player-box{padding:14px;border:1px solid var(--mpsp-line,rgba(255,255,255,.09));border-radius:var(--mpsp-radius-lg,20px);background:rgba(255,255,255,.04)}.mpsp-audio-player-box audio{display:block;width:100%;height:42px}.mpsp-audio-panel--missing,.mpsp-audio-panel--locked{background:linear-gradient(180deg,rgba(255,255,255,.045),transparent),rgba(255,255,255,.035)}
.mpdl-membership-paywall{margin:14px 0 0}
.mpdl-story-audio-admin .mpdl-story-audio-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:16px 0}.mpdl-story-audio-card,.mpdl-story-audio-panel{background:#fff;border:1px solid #dcdcde;border-radius:10px;padding:16px}.mpdl-story-audio-card strong{display:block;color:#1d2327}.mpdl-story-audio-card span{display:block;font-size:24px;font-weight:700;margin-top:8px}.mpdl-story-audio-settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:12px}.mpdl-story-audio-settings-grid label{display:block;font-weight:600}.mpdl-story-audio-settings-grid input{width:100%;margin-top:6px}.mpdl-story-audio-inline-form{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.mpdl-story-audio-filter-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:#fff;border:1px solid #dcdcde;border-radius:10px;padding:12px;margin:16px 0}.mpdl-story-audio-table audio{max-width:260px;width:100%}.mpdl-story-audio-status{display:inline-flex;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:700;background:#f3f4f6;color:#374151}.mpdl-story-audio-status.is-generated{background:#dcfce7;color:#166534}.mpdl-story-audio-status.is-missing{background:#fef3c7;color:#92400e}.mpdl-story-audio-status.is-outdated{background:#dbeafe;color:#1d4ed8}.mpdl-story-audio-status.is-failed{background:#fee2e2;color:#991b1b}.mpdl-story-audio-status.is-processing{background:#ede9fe;color:#5b21b6}.mpdl-story-audio-warning{margin-top:4px;color:#b45309;font-size:12px;font-weight:700}.mpdl-story-audio-muted,.mpdl-story-audio-small{color:#646970;font-size:12px}.mpdl-story-audio-table td{vertical-align:top}
@media(max-width:640px){.mpsp-audio-head{flex-direction:column}.mpdl-story-audio-inline-form,.mpdl-story-audio-filter-form{align-items:stretch;flex-direction:column}.mpdl-story-audio-filter-form input,.mpdl-story-audio-filter-form select,.mpdl-story-audio-filter-form .button{width:100%}}

/* Story Audio Manager v2 - playlist / multi part player */
.mpsp-audio-playlist {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid rgba(216, 108, 255, 0.18);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.045);
}

.mpsp-audio-playlist-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.mpsp-audio-playlist-head strong {
  color: var(--mpsp-text, #fff);
  font-weight: 850;
}

.mpsp-audio-playlist-head span {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 5px 10px;
  border: 1px solid rgba(110, 255, 221, 0.25);
  border-radius: 999px;
  color: var(--mpsp-accent-2, #6effdd);
  background: rgba(110, 255, 221, 0.07);
  font-size: 0.76rem;
  font-weight: 800;
}

.mpsp-audio-track-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
}

.mpsp-audio-track {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 15px;
  padding: 10px 12px;
  color: var(--mpsp-text, #fff);
  background: rgba(255, 255, 255, 0.045);
  cursor: pointer;
  text-align: left;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.mpsp-audio-track:hover,
.mpsp-audio-track.is-active {
  transform: translateY(-1px);
  border-color: rgba(110, 255, 221, 0.34);
  background: rgba(110, 255, 221, 0.08);
}

.mpsp-audio-track span {
  font-weight: 850;
}

.mpsp-audio-track em {
  color: var(--mpsp-muted, rgba(255,255,255,.65));
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.mpsp-audio-help {
  margin: 12px 0 0;
  color: var(--mpsp-muted, rgba(255,255,255,.65));
  font-size: 0.86rem;
  line-height: 1.5;
}

.mpdl-story-audio-small {
  margin-top: 4px;
  color: #667085;
  font-size: 12px;
}

/* =========================================================
   Story Audio Manager v2.1 - responsive floating active player
   Not: Ana Sesli Dinle panelini bozmaz; scroll sonrası kompakt kontrol gösterir.
========================================================= */
.mpsp-audio-floating {
  position: fixed;
  left: 50%;
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 10020;
  width: min(980px, calc(100vw - 32px));
  color: var(--mpsp-text, #f5ecff);
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-50%, 18px, 0) scale(.985);
  transition: opacity .22s ease, transform .22s ease;
}

.mpsp-audio-floating.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(-50%, 0, 0) scale(1);
}

.mpsp-audio-floating__glow {
  position: absolute;
  inset: auto 10% -16px;
  height: 42px;
  pointer-events: none;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(216,108,255,.40), transparent 68%);
  filter: blur(18px);
  opacity: .75;
}

.mpsp-audio-floating__inner {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid rgba(216,108,255,.34);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035)),
    repeating-linear-gradient(135deg, rgba(255,255,255,.026) 0 1px, transparent 1px 7px),
    rgba(30, 18, 42, .92);
  box-shadow: 0 24px 80px rgba(0,0,0,.44), 0 0 32px rgba(216,108,255,.16);
  backdrop-filter: blur(18px);
}

.mpsp-audio-floating__toggle,
.mpsp-audio-floating__actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.14);
  color: #fff;
  background: rgba(255,255,255,.075);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, opacity .18s ease;
}

.mpsp-audio-floating__toggle:hover,
.mpsp-audio-floating__actions button:hover:not(:disabled) {
  transform: translateY(-1px);
  border-color: rgba(110,255,221,.34);
  background: rgba(110,255,221,.10);
}

.mpsp-audio-floating__toggle {
  width: 48px;
  height: 48px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(216,108,255,.42), rgba(110,255,221,.14));
  font-weight: 900;
}

.mpsp-audio-floating__toggle span {
  position: relative;
  left: 1px;
  line-height: 1;
}

.mpsp-audio-floating__body {
  min-width: 0;
}

.mpsp-audio-floating__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.mpsp-audio-floating__top strong {
  color: #fff;
  font-weight: 900;
  letter-spacing: -.02em;
  white-space: nowrap;
}

.mpsp-audio-floating__top span {
  overflow: hidden;
  max-width: 60%;
  color: var(--mpsp-accent-2, #6effdd);
  font-size: .82rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mpsp-audio-floating__progress-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  gap: 10px;
  align-items: center;
  color: var(--mpsp-muted, rgba(255,255,255,.65));
  font-size: .78rem;
  font-weight: 800;
}

.mpsp-audio-floating__progress-row input[type="range"] {
  width: 100%;
  height: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  accent-color: var(--mpsp-accent-2, #6effdd);
  background: rgba(255,255,255,.13);
  cursor: pointer;
}

.mpsp-audio-floating__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.mpsp-audio-floating__actions button {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  font-size: 1.2rem;
  font-weight: 900;
  line-height: 1;
}

.mpsp-audio-floating__actions button:disabled {
  opacity: .38;
  cursor: not-allowed;
}

body.mpsp-audio-floating-active .mpsp-scroll-top {
  transform: translateY(-72px);
}

@media (max-width: 768px) {
  .mpsp-audio-floating {
    width: calc(100vw - 20px);
    bottom: max(12px, env(safe-area-inset-bottom));
  }

  .mpsp-audio-floating__inner {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
    border-radius: 20px;
  }

  .mpsp-audio-floating__actions {
    grid-column: 1 / -1;
    justify-content: space-between;
    padding-left: 58px;
  }

  .mpsp-audio-floating__actions button {
    width: 34px;
    height: 34px;
  }

  .mpsp-audio-floating__top {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 6px;
  }

  .mpsp-audio-floating__top span {
    max-width: 100%;
  }

  .mpsp-audio-floating__progress-row {
    grid-template-columns: 40px minmax(0, 1fr) 40px;
    gap: 8px;
  }
}

@media (max-width: 420px) {
  .mpsp-audio-floating__toggle {
    width: 44px;
    height: 44px;
    border-radius: 16px;
  }

  .mpsp-audio-floating__actions {
    padding-left: 54px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mpsp-audio-floating,
  .mpsp-audio-floating__toggle,
  .mpsp-audio-floating__actions button {
    transition: none;
  }
}


/* =========================================================
   Story Audio v3.2 - Safe Follow Along Highlight
   Not: Hikaye metnini kopyalamaz; gerçek içerik metni üzerinde cümleleri vurgular.
========================================================= */
.mpsp-rich-content.mpsp-follow-reading-ready {
  position: relative;
}

.mpsp-follow-label {
  display: inline-flex;
  margin-right: 0.35rem;
  color: var(--mpsp-accent-2, #6effdd);
  font-weight: 900;
}

.mpsp-follow-unit {
  display: inline;
  padding: 0.09em 0.16em;
  border-radius: 0.38em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}

.mpsp-follow-unit.is-read {
  color: rgba(245, 236, 255, 0.58);
}

.mpsp-follow-unit.is-active {
  color: #fff;
  background: linear-gradient(90deg, rgba(216,108,255,.34), rgba(110,255,221,.20));
  box-shadow: 0 0 0 1px rgba(216,108,255,.24), 0 0 22px rgba(216,108,255,.16);
  text-shadow: 0 0 14px rgba(255,255,255,.18);
}

.mpsp-follow-disabled-text {
  opacity: 0.88;
}

[data-bs-theme="light"] .mpsp-follow-unit.is-read {
  color: rgba(25, 15, 37, 0.50);
}

[data-bs-theme="light"] .mpsp-follow-unit.is-active {
  color: #190f25;
  background: linear-gradient(90deg, rgba(142,38,201,.18), rgba(0,143,120,.12));
  box-shadow: 0 0 0 1px rgba(142,38,201,.18), 0 0 18px rgba(142,38,201,.08);
}

@media (max-width: 575px) {
  .mpsp-follow-unit {
    padding: 0.08em 0.12em;
    border-radius: 0.32em;
  }
}


/* Story Audio Manager v3.3 sync calibration visual safety */
.mpsp-follow-unit {
  transition: background-color .22s ease, box-shadow .22s ease, color .22s ease, opacity .22s ease;
}

.mpsp-follow-unit.is-active {
  scroll-margin-top: 128px;
}
