.nrp-scope{
  --bg:#0b0b0f;
  --card-bg:#151319;
  --accent-a:#ff3d8a;
  --accent-b:#c026ff;
  --cyan:#05d7e6;
  --text:#ffffff;
  display:block;
}
.nrp-scope *{box-sizing:border-box;}
.nrp-wrap{max-width:100%; margin:0 auto;}

.nrp-carousel-outer{position:relative;}
.nrp-carousel{
  display:flex;
  width:100%;
  overflow-x:auto;
  scroll-behavior:smooth;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  padding:4px 2px 10px;
}
.nrp-carousel::-webkit-scrollbar{display:none;}

.nrp-carousel-single{ max-width:220px; }

.nrp-reel-card{
  position:relative;
  aspect-ratio:9/16;
  height:auto;
  scroll-snap-align:start;
  overflow:hidden;
  background:var(--card-bg);
  cursor:pointer;
}
.nrp-carousel-single .nrp-reel-card{ flex:0 0 100%; }

.nrp-reel-card video{
  width:100%; height:100%; object-fit:cover; display:block;
}
.nrp-reel-card .nrp-play-badge{
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,0);
  transition:background .2s ease;
}
.nrp-play-badge svg{
  width:38px; height:38px; opacity:0; transition:opacity .2s ease;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.5));
}
@media (hover: hover) and (pointer: fine){
  .nrp-reel-card:hover .nrp-play-badge{background:rgba(0,0,0,.15);}
  .nrp-reel-card:hover .nrp-play-badge svg{opacity:1;}
}

.nrp-row-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:40px; height:40px; border-radius:50%;
  background:rgba(20,18,25,.85); border:1px solid rgba(255,255,255,.15);
  color:#fff; font-size:18px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:5; user-select:none;
}
@media (hover: hover) and (pointer: fine){
  .nrp-row-arrow:hover{background:rgba(255,61,138,.85);}
}
.nrp-row-left{left:-6px;}
.nrp-row-right{right:-6px;}

@media (max-width:768px){
  .nrp-row-arrow{width:34px; height:34px; font-size:16px;}
}

/* ---------------- FULLSCREEN REEL VIEWER ---------------- */
.nrp-reel-overlay{
  position:fixed; inset:0; background:rgba(5,4,8,.97);
  display:none; align-items:center; justify-content:center;
  z-index:9999;
}
.nrp-reel-overlay.active{display:flex;}

.nrp-reel-desktop{
  display:flex; align-items:center; justify-content:center;
  gap:20px; width:100%; height:100%;
}
.nrp-side-preview{
  width:190px; aspect-ratio:9/16; height:auto; border-radius:12px; overflow:hidden;
  opacity:.8; filter:brightness(.9);
  transition:opacity .3s ease, filter .3s ease; flex:0 0 auto; cursor:pointer;
}
@media (hover: hover) and (pointer: fine){
  .nrp-side-preview:hover{opacity:1; filter:none;}
}
.nrp-side-preview video{width:100%; height:100%; object-fit:cover;}

.nrp-main-player{
  position:relative;
  height:90vh;
  aspect-ratio:9/16;
  overflow:hidden;
  background:#000;
  flex:0 0 auto;
}

.nrp-slide-track{
  position:absolute; top:0; left:0; width:100%;
  display:flex; flex-direction:column;
  will-change:transform;
}
.nrp-slide-video{ width:100%; display:block; object-fit:contain; }

.nrp-top-controls{
  position:absolute; top:12px; right:12px;
  display:flex; align-items:center; gap:8px; z-index:30;
}
.nrp-icon-btn{
  width:34px; height:34px; border-radius:50%;
  border:1px solid rgba(255,255,255,.25);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}

.nrp-updown-controls{
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  display:none; flex-direction:column; gap:8px; z-index:30;
}

.nrp-nav-arrow{
  width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.2);
  color:#fff; font-size:22px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; flex:0 0 auto; z-index:20;
}
@media (hover: hover) and (pointer: fine){
  .nrp-nav-arrow:hover{background:linear-gradient(135deg,var(--accent-a),var(--accent-b));}
}

.nrp-buy-btn{
  position:absolute; bottom:16px; left:50%; transform:translateX(-50%);
  padding:6px 18px;
  font-weight:600; font-size:12px; letter-spacing:.2px;
  text-decoration:none; white-space:nowrap; z-index:10;
}

@media (max-width:768px){
  .nrp-main-player{ width:100vw; width:100dvw; height:100vh; height:100dvh; max-height:none; aspect-ratio:unset; }
  .nrp-main-player .nrp-slide-video{ object-fit:cover; }
  .nrp-side-preview, .nrp-nav-arrow{display:none;}
  .nrp-updown-controls{display:flex;}
}

.nrp-reel-overlay.nrp-single-reel .nrp-side-preview,
.nrp-reel-overlay.nrp-single-reel .nrp-nav-arrow,
.nrp-reel-overlay.nrp-single-reel .nrp-updown-controls{
  display:none;
}
