
/* StoryCampaign basic styling - minimal and theme-friendly */
.sc-stories{margin:12px 0}
.sc-stories__track{display:flex;gap:10px;overflow:auto;padding:6px 2px;scrollbar-width:thin}
.sc-story{background:transparent;border:0;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;min-width:74px}
.sc-story__ring{width:64px;height:64px;border-radius:999px;padding:3px;background:conic-gradient(from 180deg, #ff5a5f, #ffb400, #18a0fb, #8b5cf6, #ff5a5f);display:flex;align-items:center;justify-content:center}
.sc-story__img{width:58px;height:58px;border-radius:999px;object-fit:cover;background:#fff}
.sc-story__placeholder{width:58px;height:58px;border-radius:999px;background:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.sc-story__title{margin-top:6px;font-size:12px;max-width:74px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Modal */
.sc-modal{position:fixed;inset:0;display:none;z-index:9999}
.sc-modal.is-open{display:block}
.sc-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.sc-modal__dialog{position:relative;max-width:420px;margin:6vh auto 0;background:#111;border-radius:16px;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.sc-modal__close{position:absolute;top:10px;right:10px;z-index:2;border:0;background:rgba(255,255,255,.12);color:#fff;width:36px;height:36px;border-radius:999px;font-size:22px;cursor:pointer}
.sc-modal__content{display:flex;flex-direction:column}
.sc-modal__media{background:#000;display:flex;align-items:center;justify-content:center;min-height:520px}
.sc-modal__media img,.sc-modal__media video,.sc-modal__media iframe{width:100%;height:520px;object-fit:contain;border:0}
.sc-modal__footer{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:12px 14px;background:#0b0b0b;color:#fff}
.sc-modal__caption{font-size:14px;opacity:.95}
.sc-modal__link{background:#fff;color:#000;padding:8px 10px;border-radius:10px;text-decoration:none;font-weight:600}
@media (max-width:768px){
  .sc-modal__dialog{max-width:100vw;width:100vw;height:100vh;margin:0;border-radius:0}
  .sc-modal__media{min-height:100vh}
  .sc-modal__media img,.sc-modal__media video,.sc-modal__media iframe{height:100vh}
  .sc-modal__footer{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top, rgba(0,0,0,.65), rgba(0,0,0,0));}
  .sc-modal__caption{max-width:70vw}
}
@media (max-width:480px){
  .sc-modal__dialog{max-width:94vw}
  .sc-modal__media{min-height:64vh}
  .sc-modal__media img,.sc-modal__media video,.sc-modal__media iframe{height:64vh}
}

/* Progress bar like Instagram */
.sc-progress{position:absolute;top:0;left:0;right:0;display:flex;gap:6px;padding:10px 10px 0 10px;z-index:3}
.sc-progress__seg{flex:1;height:3px;background:rgba(255,255,255,.25);border-radius:999px;overflow:hidden}
.sc-progress__fill{height:100%;width:0;background:rgba(255,255,255,.95)}
.sc-modal__dialog{position:relative}
.sc-modal__tapzones{position:absolute;inset:0;display:flex;z-index:2}
.sc-modal__tapzone{flex:1;background:transparent;border:0}

.sc-modal__tapzone--left{cursor:pointer}
.sc-modal__tapzone--right{cursor:pointer}

.sc-modal__mute{border:0;background:rgba(255,255,255,.14);color:#fff;padding:8px 10px;border-radius:12px;cursor:pointer}
.sc-modal__mute.is-on{background:rgba(255,255,255,.28)}
.sc-modal__footer{gap:12px}
