*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}
:root{
  --primary-gold:#FFD700;
  --dark-gold:#B8860B;
  --light-gold:#FFF8DC;
  --accent-gold:#DAA520;
  --gradient-gold:linear-gradient(135deg,#FFD700 0%,#DAA520 50%,#B8860B 100%);
  --gradient-dark:linear-gradient(135deg,#1a1a1a 0%,#2d2d2d 50%,#404040 100%);
  --bg-primary:#121212;
  --bg-secondary:#1e1e1e;
  --bg-card:rgba(30,30,30,0.95);
  --bg-overlay:rgba(0,0,0,0.8);
  --text-primary:#ffffff;
  --text-secondary:#cccccc;
  --text-muted:#999999;
  --shadow-gold:0 4px 20px rgba(255,215,0,0.3);
  --shadow-dark:0 8px 32px rgba(0,0,0,0.6);
  --border-radius:12px;
  --border-radius-lg:20px;
  --transition-fast:0.2s cubic-bezier(0.4,0,0.2,1);
  --transition-smooth:0.3s cubic-bezier(0.4,0,0.2,1);
  --transition-bounce:0.4s cubic-bezier(0.68,-0.55,0.265,1.55);
  --transition-luxury:1.5s cubic-bezier(0.4,0,0.2,1);
  --transition-elegant:1.5s cubic-bezier(0.25,0.46,0.45,0.94);
}
:where(a,button,input,textarea,select,.thumbnail-item,.icon-btn,.capa-video,.botao-baixar-item,.botaoConversor_conversorPlaylistYoutube_actionButton,.status,.progresso,.barra-progresso){transition:all var(--transition-smooth);} 
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;
  background:var(--bg-primary);
  color:var(--text-primary);
  line-height:1.6;
  overflow-x:hidden;
  position:relative;
  min-height:100vh;
}
body::before{
  content:'';
  position:fixed;
  inset:0;
  background:
    radial-gradient(circle at 25% 25%,rgba(255,215,0,0.08) 0%,transparent 60%),
    radial-gradient(circle at 75% 75%,rgba(218,165,32,0.06) 0%,transparent 60%),
    radial-gradient(circle at 50% 50%,rgba(255,215,0,0.03) 0%,transparent 80%);
  animation:backgroundPulse 15s ease-in-out infinite alternate;
  pointer-events:none;
  z-index:-1;
}
@keyframes backgroundPulse{
  0%{opacity:0.4;transform:scale(1);} 
  50%{opacity:0.7;transform:scale(1.05);} 
  100%{opacity:1;transform:scale(1.1);} 
}
.caixaPrincipal_conversorPlaylistYoutube_container{
  min-height:auto;
  padding:clamp(15px,4vw,40px);
  display:flex;
  align-items:flex-start;
  justify-content:center;
  margin-left:0;
  padding-top:0;
  margin-top:5rem;
  transition:all var(--transition-elegant);
}
.conteudoInterno_conversorPlaylistYoutube_wrapper{
  width:100%;
  max-width:min(90vw,700px);
  background:var(--bg-card);
  backdrop-filter:blur(25px);
  border-radius:var(--border-radius-lg);
  border:1px solid rgba(255,215,0,0.25);
  box-shadow:var(--shadow-dark),0 0 60px rgba(255,215,0,0.1),inset 0 1px 0 rgba(255,255,255,0.1);
  padding:clamp(20px,5vw,40px);
  position:relative;
  overflow:hidden;
  animation:slideInUp 0.8s cubic-bezier(0.25,0.46,0.45,0.94);
  transition:all var(--transition-elegant),transform var(--transition-luxury),box-shadow var(--transition-luxury);
}
.conteudoInterno_conversorPlaylistYoutube_wrapper::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:4px;
  background:var(--gradient-gold);
}
.conteudoInterno_conversorPlaylistYoutube_wrapper::after{
  content:'';
  position:absolute;
  top:-50%;
  left:-50%;
  width:200%;
  height:200%;
  background:conic-gradient(from 0deg,transparent,rgba(255,215,0,0.03),transparent 90deg);
  animation:rotate 20s linear infinite;
  pointer-events:none;
  z-index:-1;
}
@keyframes rotate{
  from{transform:rotate(0deg);} 
  to{transform:rotate(360deg);} 
}
.cabecalho_conversorPlaylistYoutube_header{
  text-align:center;
  margin-bottom:clamp(25px,6vw,40px);
  animation:slideInDown 0.8s ease-out;
  transition:all var(--transition-elegant);
}
@keyframes slideInDown{
  from{opacity:0;transform:translateY(-40px) scale(0.95);} 
  to{opacity:1;transform:translateY(0) scale(1);} 
}
@keyframes slideInUp{
  from{opacity:0;transform:translateY(40px) scale(0.95);} 
  to{opacity:1;transform:translateY(0) scale(1);} 
}
.titulo_conversorPlaylistYoutube_heading{
  font-size:clamp(1.8rem,6vw,3rem);
  font-weight:800;
  background:var(--gradient-gold);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  margin-bottom:12px;
  text-shadow:0 4px 20px rgba(255,215,0,0.4);
  letter-spacing:-0.02em;
  line-height:1.1;
  transition:all var(--transition-luxury),transform var(--transition-elegant);
}
.subtitulo_conversorPlaylistYoutube_subheading{
  font-size:clamp(1rem,3vw,1.2rem);
  color:var(--text-secondary);
  font-weight:500;
  opacity:0.9;
  transition:all var(--transition-elegant);
}
.grupoEntrada_conversorPlaylistYoutube_inputContainer{
  margin-bottom:20px;
  animation:slideInUp 0.8s ease-out 0.2s both;
  transition:all var(--transition-elegant);
}
.url-input-wrap{
  position:relative;
  display:flex;
  align-items:center;
}
.url-input-wrap.valid .campoUrl_conversorPlaylistYoutube_urlField{
  border-color:var(--primary-gold);
  box-shadow:var(--shadow-gold),0 0 0 1px rgba(255,215,0,0.2);
  background:rgba(255,215,0,0.05);
}
.url-input-wrap.invalid .campoUrl_conversorPlaylistYoutube_urlField{
  border-color:#ff4757;
  box-shadow:0 0 0 1px rgba(255,71,87,0.3);
  background:rgba(255,71,87,0.03);
}
.url-input-wrap.valid #url_status_icon::before{content:'✅';}
.url-input-wrap.invalid #url_status_icon::before{content:'❌';}
.campoUrl_conversorPlaylistYoutube_urlField{
  width:100%;
  padding:clamp(14px,3vw,20px) 60px clamp(14px,3vw,20px) clamp(16px,3vw,22px);
  font-size:clamp(14px,3.5vw,16px);
  border:2px solid transparent;
  border-radius:var(--border-radius);
  background:rgba(255,255,255,0.06);
  color:var(--text-primary);
  backdrop-filter:blur(10px);
  font-weight:500;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  caret-color:var(--primary-gold);
  transition:all var(--transition-luxury),transform var(--transition-elegant),box-shadow var(--transition-elegant);
}
.campoUrl_conversorPlaylistYoutube_urlField::placeholder{
  color:var(--text-muted);
  opacity:0.8;
}
.campoUrl_conversorPlaylistYoutube_urlField:focus{
  outline:none;
  border-color:var(--primary-gold);
  background:rgba(255,255,255,0.1);
  box-shadow:var(--shadow-gold),0 0 0 1px rgba(255,215,0,0.2);
  transform:translateY(-2px) scale(1.01);
}
#url_status_icon{
  position:absolute;
  right:clamp(12px,3vw,18px);
  font-size:clamp(18px,4vw,22px);
  transition:all var(--transition-elegant),transform var(--transition-luxury);
}
.url-actions{
  display:flex;
  flex-direction:column;
  gap:clamp(8px,2vw,12px);
  margin-bottom:25px;
  animation:slideInUp 0.8s ease-out 0.3s both;
}
.icon-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:clamp(8px,2vw,10px);
  padding:clamp(12px,3vw,16px);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:var(--border-radius);
  font-weight:700;
  font-size:clamp(14px,3.5vw,16px);
  cursor:pointer;
  position:relative;
  overflow:hidden;
  backdrop-filter:blur(12px);
  white-space:nowrap;
  width:100%;
  text-transform:none;
  letter-spacing:0;
  background:rgba(255,255,255,0.06);
  box-shadow:0 4px 15px rgba(0,0,0,0.25),inset 0 1px 0 rgba(255,255,255,0.08);
  transition:all var(--transition-luxury),transform var(--transition-elegant),box-shadow var(--transition-elegant);
}
.icon-btn:disabled{
  opacity:0.5;
  cursor:not-allowed;
  transform:none!important;
}
.icon-btn::before{
  content:none;
  display:none;
  margin:0;
  font-size:0;
}
.icon-btn::after{
  content:'';
  position:absolute;
  left:-20%;
  top:-200%;
  width:60%;
  height:500%;
  transform:rotate(25deg);
  background:linear-gradient(90deg,rgba(255,255,255,0.18),rgba(255,255,255,0));
  opacity:0;
  transition:opacity var(--transition-smooth);
}
.icon-btn:not(:disabled):hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(0,0,0,0.35);
}
.icon-btn:not(:disabled):hover::after{
  opacity:1;
}
#btn_paste_url{
  background: linear-gradient(135deg, #f4d03f 0%, #e8c547 50%, #d4ac0d 100%);
  color: #1b1611;
  border: 1px solid #d4ac0d;
  box-shadow: 
    0 8px 25px rgba(244, 208, 63, 0.35),
    0 4px 12px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
}
#btn_paste_url::before{
  content:none;
  display:none;
}
#btn_paste_url:not(:disabled):hover{
  background: 
    radial-gradient(ellipse at top, rgba(255, 255, 255, 0.4) 0%, transparent 50%),
    linear-gradient(135deg, #b8801e 0%, #c59a2a 15%, #d2a642 30%, #fff8dc 45%, #fffaed 55%, #d2a642 70%, #c59a2a 85%, #b8801e 100%);
  transform: translateY(-2px);
  animation: goldGlowHover 1.5s ease-in-out infinite alternate;
  box-shadow: 
    0 0 35px rgba(191, 149, 63, 0.6),
    0 12px 35px rgba(170, 119, 28, 0.5),
    0 6px 16px rgba(0, 0, 0, 0.35),
    inset 0 2px 1px rgba(255, 248, 220, 0.8),
    inset 0 -2px 4px rgba(184, 128, 30, 0.35);
}

#btn_paste_url:not(:disabled):hover::after {
  animation: goldShineHover 1.5s ease-in-out infinite;
}

#btn_paste_url:not(:disabled):active{
  background: 
    radial-gradient(ellipse at top, rgba(255, 255, 255, 0.25) 0%, transparent 50%),
    linear-gradient(135deg, #9d6b19 0%, #a8791f 15%, #b58935 30%, #f0e6b8 45%, #f5ebca 55%, #b58935 70%, #a8791f 85%, #9d6b19 100%);
  transform: translateY(-1px);
  animation: none;
  box-shadow: 
    0 0 25px rgba(191, 149, 63, 0.4),
    0 6px 20px rgba(170, 119, 28, 0.4),
    0 3px 8px rgba(0, 0, 0, 0.4),
    inset 0 1px 1px rgba(240, 230, 184, 0.7),
    inset 0 -1px 3px rgba(157, 107, 25, 0.4);
}

@keyframes goldGlowHover {
  0%, 100% { 
    box-shadow: 
      0 0 35px rgba(191, 149, 63, 0.6),
      0 12px 35px rgba(170, 119, 28, 0.5),
      0 6px 16px rgba(0, 0, 0, 0.35),
      inset 0 2px 1px rgba(255, 248, 220, 0.8),
      inset 0 -2px 4px rgba(184, 128, 30, 0.35);
  }
  50% { 
    box-shadow: 
      0 0 45px rgba(191, 149, 63, 0.8),
      0 12px 35px rgba(170, 119, 28, 0.7),
      0 6px 16px rgba(0, 0, 0, 0.35),
      inset 0 2px 1px rgba(255, 248, 220, 0.9),
      inset 0 -2px 4px rgba(184, 128, 30, 0.35);
  }
}

@keyframes goldShineHover {
  0% { 
    transform: translateX(-100%) translateY(-100%) rotate(45deg);
    opacity: 0;
  }
  50% { 
    opacity: 0.8;
  }
  100% { 
    transform: translateX(100%) translateY(100%) rotate(45deg);
    opacity: 0;
  }
}
#btn_clear_url{
  background:linear-gradient(135deg,#737373 0%,#5f5f5f 50%,#4b4b4b 100%);
  color:#ffffff;
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 8px 24px rgba(0,0,0,0.3),inset 0 1px 0 rgba(255,255,255,0.08);
}
#btn_clear_url::before{
  content:none;
  display:none;
}
#btn_clear_url:not(:disabled):hover{
  filter:brightness(1.04);
  transform:translateY(-2px);
  box-shadow:0 14px 32px rgba(0,0,0,0.35);
}
#btn_clear_url:not(:disabled):active{
  transform:translateY(-1px);
}
.carregando_playlist_youtube_spinner{
  text-align:center;
  margin:30px 0;
  animation:fadeInScale 0.5s ease-out;
  color:var(--text-secondary);
  padding:25px 20px;
  background:linear-gradient(145deg,rgba(40,40,40,0.7),rgba(30,30,30,0.9));
  border-radius:var(--border-radius);
  border:1px solid rgba(255,215,0,0.2);
  backdrop-filter:blur(10px);
  box-shadow:0 8px 25px rgba(0,0,0,0.3);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
@keyframes fadeInScale{
  from{opacity:0;transform:translateY(20px) scale(0.95);} 
  to{opacity:1;transform:translateY(0) scale(1);} 
}
.spinner{
  width:clamp(40px,8vw,50px);
  height:clamp(40px,8vw,50px);
  border:3px solid rgba(255,215,0,0.2);
  border-top:3px solid var(--primary-gold);
  border-radius:50%;
  animation:spin 1s linear infinite;
  margin:0 auto 15px;
  box-shadow:0 0 15px rgba(255,215,0,0.3);
}
@keyframes spin{
  0%{transform:rotate(0deg);} 
  100%{transform:rotate(360deg);} 
}
.carregando_playlist_youtube_spinner p{
  font-size:clamp(13px,3vw,15px);
  font-weight:500;
  margin:0;
  color:var(--text-primary);
  text-align:center;
  width:100%;
}
#scan_progress_wrapper{
  margin:20px 0;
  padding:18px;
  background:linear-gradient(145deg,rgba(35,35,35,0.8),rgba(25,25,25,0.9));
  border-radius:var(--border-radius);
  border:1px solid rgba(255,215,0,0.2);
  backdrop-filter:blur(10px);
  animation:slideInUp 0.5s ease-out;
  box-shadow:0 4px 15px rgba(0,0,0,0.3);
  display:flex;
  align-items:center;
  gap:12px;
}
.barra-progresso{
  height:clamp(8px,2vw,12px);
  background:rgba(255,255,255,0.1);
  border-radius:clamp(4px,1vw,6px);
  overflow:hidden;
  position:relative;
  box-shadow:inset 0 2px 4px rgba(0,0,0,0.4);
  border:1px solid rgba(255,255,255,0.1);
  flex:1;
}
.progresso{
  height:100%;
  background:linear-gradient(90deg,var(--primary-gold) 0%,var(--accent-gold) 50%,var(--primary-gold) 100%);
  border-radius:clamp(4px,1vw,6px);
  position:relative;
  box-shadow:0 0 10px rgba(255,215,0,0.5);
  overflow:hidden;
  transition:width 0.4s cubic-bezier(0.4,0,0.2,1);
}
.progresso::after{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.4),transparent);
  animation:progressShimmer 1.5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes progressShimmer{
  0%{left:-100%;}
  100%{left:100%;}
}
#scan_progress_wrapper .status{
  font-size:clamp(11px,2.5vw,13px);
  font-weight:700;
  color:var(--primary-gold);
  text-transform:uppercase;
  letter-spacing:0.5px;
  padding:4px 12px;
  border-radius:12px;
  background:rgba(255,215,0,0.15);
  border:1px solid rgba(255,215,0,0.3);
  white-space:nowrap;
  min-width:48px;
  text-align:center;
}
.status{
  font-size:clamp(11px,2.5vw,13px);
  font-weight:700;
  color:var(--primary-gold);
  text-transform:uppercase;
  letter-spacing:0.5px;
}
.informacaoPlaylist_conversorPlaylistYoutube_infoBox{
  background:linear-gradient(135deg,rgba(255,215,0,0.1),rgba(218,165,32,0.06));
  border:1px solid rgba(255,215,0,0.25);
  border-radius:var(--border-radius);
  padding:clamp(16px,4vw,22px);
  text-align:center;
  margin:20px 0;
  backdrop-filter:blur(15px);
  animation:slideInUp 0.6s ease-out;
  color:var(--text-primary);
  font-weight:600;
  font-size:clamp(14px,3vw,16px);
  box-shadow:0 4px 15px rgba(255,215,0,0.1);
}
.botaoConversor_conversorPlaylistYoutube_actionButton{
  width:clamp(220px,80%,520px);
  padding:clamp(12px,3.5vw,22px);
  font-size:clamp(14px,3.8vw,20px);
  font-weight:700;
  border:none;
  border-radius:var(--border-radius);
  background:var(--gradient-gold);
  color:var(--bg-primary);
  cursor:pointer;
  position:relative;
  overflow:hidden;
  margin:25px auto;
  text-transform:uppercase;
  letter-spacing:1px;
  animation:slideInUp 0.8s ease-out 0.5s both;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow:0 8px 25px rgba(255,215,0,0.3),0 4px 15px rgba(0,0,0,0.2);
}
.botaoConversor_conversorPlaylistYoutube_actionButton:disabled{
  opacity:0.6;
  cursor:not-allowed;
  transform:none!important;
}
.botaoConversor_conversorPlaylistYoutube_actionButton::before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.4),transparent);
}
.botaoConversor_conversorPlaylistYoutube_actionButton:not(:disabled):hover{
  transform:translateY(-4px) scale(1.02);
  box-shadow:0 16px 40px rgba(255,215,0,0.5),0 8px 25px rgba(0,0,0,0.3);
}
.botaoConversor_conversorPlaylistYoutube_actionButton:not(:disabled):hover::before{left:100%;}
.botaoConversor_conversorPlaylistYoutube_actionButton:not(:disabled):active{transform:translateY(-2px) scale(1.01);} 
@media (max-width:360px){
  .botaoConversor_conversorPlaylistYoutube_actionButton{
    padding:10px 14px;
    font-size:13px;
    border-radius:12px;
    letter-spacing:.6px;
  }
}
.lista-thumbnails{
  margin-top:25px;
  animation:slideInUp 0.8s ease-out 0.4s both;
  display:flex;
  flex-direction:column;
  gap:clamp(12px,3vw,20px);
}
.thumbnail-item{
  background:linear-gradient(145deg,rgba(45,45,45,0.9) 0%,rgba(35,35,35,0.95) 50%,rgba(25,25,25,0.98) 100%);
  border:1px solid rgba(255,215,0,0.2);
  border-radius:clamp(12px,3vw,20px);
  padding:clamp(16px,4vw,24px);
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:clamp(16px,4vw,24px);
  align-items:center;
  backdrop-filter:blur(20px);
  position:relative;
  overflow:hidden;
  box-shadow:0 8px 32px rgba(0,0,0,0.4),0 4px 16px rgba(255,215,0,0.05),inset 0 1px 0 rgba(255,255,255,0.1);
}
.thumbnail-item::before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,215,0,0.08),transparent);
}
.thumbnail-item:hover{
  border-color:rgba(255,215,0,0.5);
  transform:translateY(-6px) scale(1.02);
  box-shadow:0 20px 50px rgba(255,215,0,0.2),0 12px 35px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,0,0.2);
}
.thumbnail-item:hover::before{left:100%;}
.capa-video{
  width:clamp(80px,20vw,120px);
  height:clamp(80px,20vw,120px);
  object-fit:cover;
  border-radius:clamp(8px,2vw,16px);
  border:3px solid transparent;
  background:linear-gradient(var(--bg-secondary),var(--bg-secondary)) padding-box,var(--gradient-gold) border-box;
  box-shadow:0 8px 25px rgba(0,0,0,0.6),0 4px 15px rgba(255,215,0,0.2),inset 0 1px 0 rgba(255,255,0,0.1);
  flex-shrink:0;
  position:relative;
  overflow:hidden;
}
.capa-video::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(45deg,rgba(255,215,0,0.1) 0%,transparent 50%,rgba(255,215,0,0.05) 100%);
  opacity:0;
}
.thumbnail-item:hover .capa-video{
  transform:scale(1.08) rotate(2deg);
  box-shadow:0 12px 35px rgba(255,215,0,0.4),0 8px 25px rgba(0,0,0,0.6),inset 0 2px 4px rgba(255,255,255,0,0.2);
}
.thumbnail-item:hover .capa-video::before{opacity:1;}
.thumbnail-item .info{
  display:flex;
  flex-direction:column;
  gap:clamp(10px,2.5vw,16px);
  min-width:0;
  flex:1;
}
.thumbnail-item .titulo{
  font-weight:600;
  color:var(--text-primary);
  font-size:clamp(14px,3.5vw,18px);
  line-height:1.4;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  line-clamp: 2;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  text-shadow:0 2px 8px rgba(0,0,0,0.3);
}
.thumbnail-item .acoes{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:clamp(10px,2.5vw,14px);
  justify-self:end;
  min-width:clamp(80px,20vw,110px);
}
.botao-baixar-item{
  padding:clamp(8px,2vw,12px) clamp(14px,3.5vw,20px);
  background:var(--gradient-gold);
  color:var(--bg-primary);
  border:none;
  border-radius:clamp(15px,4vw,25px);
  font-weight:700;
  font-size:clamp(11px,2.5vw,14px);
  cursor:pointer;
  min-width:clamp(75px,18vw,100px);
  text-transform:uppercase;
  letter-spacing:0.5px;
  box-shadow:0 6px 20px rgba(255,215,0,0.4),0 3px 10px rgba(0,0,0,0.3);
  position:relative;
  overflow:hidden;
  text-align:center;
}
.botao-baixar-item::before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.4),transparent);
}
.botao-baixar-item:disabled{
  opacity:0.6;
  cursor:not-allowed;
  transform:none!important;
}
.botao-baixar-item:not(:disabled):hover{
  transform:translateY(-3px) scale(1.08);
  box-shadow:0 12px 30px rgba(255,215,0,0.5),0 6px 20px rgba(0,0,0,0.4);
}
.botao-baixar-item:not(:disabled):hover::before{left:100%;}
.botao-baixar-item:not(:disabled):active{transform:translateY(-1px) scale(1.04);} 
.botao-baixar-item[data-done="1"]{
  background:linear-gradient(135deg,#4CAF50,#45a049);
  color:#fff;
  box-shadow:0 6px 20px rgba(76,175,80,0.4),0 3px 10px rgba(0,0,0,0.3);
}
.thumbnail-item .status{
  font-size:clamp(10px,2.5vw,12px);
  font-weight:700;
  color:var(--primary-gold);
  text-align:center;
  padding:clamp(4px,1vw,8px) clamp(8px,2vw,14px);
  border-radius:clamp(10px,2.5vw,20px);
  background:rgba(255,215,0,0.15);
  border:1px solid rgba(255,215,0,0.3);
  min-width:clamp(60px,15vw,90px);
  backdrop-filter:blur(10px);
  box-shadow:0 2px 8px rgba(255,215,0,0.2);
  display:none;
}
.thumbnail-item.downloading .status{display:block;}
.thumbnail-item .barra-progresso{
  height:clamp(4px,1vw,8px);
  margin:clamp(6px,1.5vw,10px) 0 0 0;
  background:rgba(255,255,255,0.08);
  border-radius:clamp(2px,0.5vw,4px);
  overflow:hidden;
  box-shadow:inset 0 1px 3px rgba(0,0,0,0.4);
  grid-column:1 / -1;
  display:none;
}
.thumbnail-item.downloading .barra-progresso{display:block;}
.thumbnail-item .progresso{
  height:100%;
  background:var(--gradient-gold);
  border-radius:clamp(2px,0.5vw,4px);
  position:relative;
  box-shadow:0 1px 4px rgba(255,215,0,0.4);
  overflow:hidden;
  transition:width 0.4s cubic-bezier(0.4,0,0.2,1);
}
@media (max-width:480px){
  .caixaPrincipal_conversorPlaylistYoutube_container{
    padding:10px;
    padding-top:0;
    margin-top:5rem;
  }
  .conteudoInterno_conversorPlaylistYoutube_wrapper{
    padding:20px 16px;
    margin-top:10px;
    border-radius:16px;
  }
  .thumbnail-item{
    grid-template-columns:1fr;
    grid-template-areas:"capa" "info" "acoes" "progresso";
    gap:16px;
    padding:20px;
    text-align:center;
  }
  .capa-video{
    grid-area:capa;
    width:100px;
    height:100px;
    justify-self:center;
    margin-bottom:8px;
  }
  .thumbnail-item .info{
    grid-area:info;
    text-align:center;
    gap:12px;
  }
  .thumbnail-item .titulo{
    font-size:15px;
    line-height:1.3;
  }
  .thumbnail-item .acoes{
    grid-area:acoes;
    flex-direction:row;
    justify-content:center;
    align-items:center;
    width:100%;
    gap:12px;
  }
  .botao-baixar-item{
    padding:10px 16px;
    font-size:12px;
    min-width:85px;
  }
  .thumbnail-item .status{
    font-size:11px;
    padding:6px 12px;
    min-width:70px;
  }
  .thumbnail-item .barra-progresso{
    grid-area:progresso;
    height:6px;
    margin:12px 0 0 0;
  }
}
@media (min-width:481px) and (max-width:768px){
  .conteudoInterno_conversorPlaylistYoutube_wrapper{
    max-width:85vw;
    padding:32px 28px;
  }
  .capa-video{width:100px;height:100px;}
  .thumbnail-item{gap:20px;padding:20px;}
}
@media (min-width:769px){
  .caixaPrincipal_conversorPlaylistYoutube_container{
    padding:40px;
    padding-top:0;
    margin-top:5rem;
  }
  .conteudoInterno_conversorPlaylistYoutube_wrapper{
    max-width:750px;
    padding:45px;
  }
  .thumbnail-item:hover{transform:translateY(-8px) scale(1.03);} 
  .capa-video{width:110px;height:110px;}
}
@media (min-width:1200px){.conteudoInterno_conversorPlaylistYoutube_wrapper{max-width:800px;}
.thumbnail-item{padding:28px;gap:28px;}
.capa-video{width:120px;height:120px;}
}
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:6px;}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#2b2b2b,#3a3a3a);border-radius:6px;border:1px solid rgba(255,255,255,0.08);box-shadow:none;} 
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#3a3a3a,#4a4a4a);} 

.campoUrl_conversorPlaylistYoutube_urlField:focus,
.botaoConversor_conversorPlaylistYoutube_actionButton:focus,
.icon-btn:focus,
.botao-baixar-item:focus{
 outline:2px solid var(--primary-gold);
 outline-offset:2px;
}
.area-botao-ver-mais{display:none!important;}
.lista-thumbnails.mostrar-todas .thumbnail-item{display:flex;}
.icon-btn > *{position:relative;z-index:1;}
html{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.24) var(--bg-secondary);}





































.modal-limite-conversao-playlist {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    backdrop-filter: blur(5px);
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn 0.3s ease;
    padding: 10px;
    overflow-y: auto;
}

.modal-limite-conversao-conteudo {
    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
    border-radius: 20px;
    padding: 25px;
    max-width: 600px;
    width: 100%;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    border: 2px solid #333;
    animation: slideUp 0.3s ease;
    position: relative;
    margin: auto;
}

.modal-limite-conversao-header {
    text-align: center;
    margin-bottom: 20px;
}

.modal-limite-conversao-header i {
    color: #bbb !important;
}

.modal-limite-conversao-header h2 {
    color: #fff;
    font-size: 20px;
    margin: 0;
    font-weight: 600;
    line-height: 1.3;
}

.modal-limite-conversao-corpo {
    color: #ddd;
}

#modal_limite_conversao_mensagem {
    text-align: center;
    font-size: 14px;
    margin-bottom: 20px;
    line-height: 1.6;
}

.modal-limite-opcoes {
    display: flex;
    gap: 12px;
    align-items: stretch;
    margin: 20px 0;
}

.modal-limite-opcao {
    flex: 1;
    background: #2a2a2a;
    border-radius: 15px;
    padding: 18px;
    text-align: center;
    border: 2px solid #444;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.modal-limite-opcao.destaque {
    background: linear-gradient(145deg, #2d2d2d 0%, #1f1f1f 50%, #2d2d2d 100%);
    border: 3px solid #e6a84e;
    transform: scale(1.05);
    box-shadow: 
        0 0 30px rgba(230, 168, 78, 0.6),
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        0 10px 30px rgba(0, 0, 0, 0.5);
    position: relative;
    overflow: hidden;
}

.modal-limite-opcao.destaque::before {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(45deg, #e6a84e, #f4c560, #e6a84e, #d4963d);
    background-size: 300% 300%;
    border-radius: 15px;
    z-index: -1;
    animation: borderGlow 3s ease infinite;
    opacity: 0.6;
}

@keyframes borderGlow {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

.modal-limite-opcao i {
    font-size: 32px;
    margin-bottom: 10px;
    display: block;
    color: #bbb;
}

.modal-limite-opcao.destaque i {
    color: #e6a84e;
    font-size: 42px;
    filter: drop-shadow(0 4px 12px rgba(230, 168, 78, 0.6));
    animation: iconPulse 2s ease-in-out infinite;
}

@keyframes iconPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.modal-limite-opcao h3 {
    margin: 8px 0;
    font-size: 17px;
    color: #fff;
}

.modal-limite-opcao.destaque h3 {
    color: #f4c560;
    font-size: 20px;
    text-shadow: 0 2px 10px rgba(230, 168, 78, 0.5);
    font-weight: 700;
    letter-spacing: 0.5px;
}

.modal-limite-opcao p {
    margin: 8px 0 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: #ddd;
}

.modal-limite-opcao.destaque p {
    color: #fff;
    font-weight: 500;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

.modal-limite-divisor {
    font-size: 18px;
    font-weight: bold;
    color: #e6a84e;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    text-shadow: 0 2px 10px rgba(230, 168, 78, 0.5);
}

.btn-upgrade-ultra {
    margin-top: 15px;
    background: linear-gradient(135deg, #f4c560 0%, #e6a84e 50%, #d4963d 100%);
    color: #1a1a1a;
    border: none;
    padding: 14px 24px;
    border-radius: 30px;
    font-weight: 800;
    cursor: pointer;
    font-size: 15px;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: 
        0 4px 15px rgba(230, 168, 78, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: relative;
    overflow: hidden;
}

.btn-upgrade-ultra::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    transition: left 0.5s ease;
}

.btn-upgrade-ultra:hover::before {
    left: 100%;
}

.btn-upgrade-ultra i {
    color: #1a1a1a !important;
    font-size: 22px !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}

.btn-upgrade-ultra:hover {
    transform: scale(1.08) translateY(-2px);
    box-shadow: 
        0 8px 25px rgba(230, 168, 78, 0.6),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.btn-upgrade-ultra:active {
    transform: scale(1.02) translateY(0);
}

.btn-fechar-modal-limite {
    width: 100%;
    background: #333;
    color: #fff;
    border: none;
    padding: 12px;
    border-radius: 10px;
    font-size: 14px;
    cursor: pointer;
    margin-top: 15px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn-fechar-modal-limite:hover {
    background: #444;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 768px) {
    .modal-limite-conversao-playlist {
        padding: 10px;
    }
    
    .modal-limite-conversao-conteudo {
        padding: 20px 15px;
        width: 100%;
        max-width: 95%;
        max-height: calc(100vh - 20px);
    }
    
    .modal-limite-conversao-header h2 {
        font-size: 18px;
    }
    
    .modal-limite-conversao-header i {
        font-size: 36px !important;
    }
    
    #modal_limite_conversao_mensagem {
        font-size: 13px;
        margin-bottom: 15px;
    }
    
    .modal-limite-opcoes {
        flex-direction: column;
        gap: 12px;
        margin: 15px 0;
    }
    
    .modal-limite-opcao {
        padding: 15px 12px;
        width: 100%;
    }
    
    .modal-limite-opcao.destaque {
        transform: scale(1);
    }
    
    .modal-limite-opcao i {
        font-size: 28px;
        margin-bottom: 8px;
    }
    
    .modal-limite-opcao.destaque i {
        font-size: 36px;
    }
    
    .modal-limite-opcao h3 {
        font-size: 16px;
    }
    
    .modal-limite-opcao.destaque h3 {
        font-size: 18px;
    }
    
    .modal-limite-opcao p {
        font-size: 12px;
    }
    
    .modal-limite-divisor {
        font-size: 16px;
        padding: 10px 0;
    }
    
    .btn-upgrade-ultra {
        width: 100%;
        padding: 13px 20px;
        font-size: 14px;
    }
    
    .btn-upgrade-ultra i {
        font-size: 20px !important;
    }
    
    .btn-fechar-modal-limite {
        padding: 11px;
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .modal-limite-conversao-conteudo {
        padding: 15px 12px;
    }
    
    .modal-limite-conversao-header h2 {
        font-size: 16px;
    }
    
    .modal-limite-conversao-header i {
        font-size: 32px !important;
    }
    
    #modal_limite_conversao_mensagem {
        font-size: 12px;
    }
    
    .modal-limite-opcao {
        padding: 12px 10px;
    }
    
    .modal-limite-opcao i {
        font-size: 24px;
    }
    
    .modal-limite-opcao.destaque i {
        font-size: 32px;
    }
    
    .modal-limite-opcao h3 {
        font-size: 14px;
    }
    
    .modal-limite-opcao.destaque h3 {
        font-size: 16px;
    }
    
    .modal-limite-opcao p {
        font-size: 11px;
    }
    
    .modal-limite-divisor {
        font-size: 15px;
    }
    
    .btn-upgrade-ultra {
        font-size: 13px;
        padding: 12px 18px;
    }
}

@media (max-width: 360px) {
    .modal-limite-conversao-conteudo {
        padding: 12px 10px;
    }
    
    .modal-limite-conversao-header h2 {
        font-size: 15px;
    }
    
    .modal-limite-opcao i {
        font-size: 22px;
    }
    
    .modal-limite-opcao.destaque i {
        font-size: 28px;
    }
    
    .modal-limite-opcao h3 {
        font-size: 13px;
    }
    
    .modal-limite-opcao.destaque h3 {
        font-size: 15px;
    }
    
    .modal-limite-opcao p {
        font-size: 10px;
    }
}

/* Estilo para itens com erro */
.thumbnail-item.error {
    border-left: 3px solid #ff4444;
    background: rgba(255, 68, 68, 0.1);
}

/* Botão de tentar novamente destacado */
.botao-baixar-item[style*="background-color: rgb(255, 152, 0)"],
.botao-baixar-item[style*="background: rgb(255, 152, 0)"] {
    animation: pulse-retry 2s ease-in-out infinite;
}

@keyframes pulse-retry {
    0%, 100% { 
        transform: scale(1); 
        box-shadow: 0 0 0 0 rgba(255, 152, 0, 0.7);
    }
    50% { 
        transform: scale(1.05); 
        box-shadow: 0 0 0 8px rgba(255, 152, 0, 0);
    }
}

/* Responsividade para botão "Baixar todas" */
@media (max-width: 768px) {
    #botao_converter_playlist_para_mp3 {
        font-size: 14px !important;
        padding: 12px 20px !important;
        white-space: normal !important;
        line-height: 1.4 !important;
        min-height: 48px !important;
    }
    
    #botao_converter_playlist_para_mp3 span {
        display: block;
        text-align: center;
    }
}

@media (max-width: 480px) {
    #botao_converter_playlist_para_mp3 {
        font-size: 12px !important;
        padding: 10px 15px !important;
    }
    
    .informacaoPlaylist_conversorPlaylistYoutube_infoBox {
        font-size: 13px !important;
        padding: 10px !important;
        line-height: 1.5 !important;
    }
}
/* =========================================
   SEÇÕES DE INSTRUÇÕES E INFO (Exclusivas Playlist)
   ========================================= */

#playlist-instructions-unique,
#playlist-details-unique,
.playlist-UNIQUE-instructions,
.playlist-UNIQUE-details {
  width: 100%;
  max-width: min(90vw, 700px);
  margin: 40px auto;
  padding: 40px;
  background: var(--bg-card);
  border: 1px solid rgba(255, 215, 0, 0.15);
  border-radius: var(--border-radius-lg);
  box-shadow: var(--shadow-dark);
  backdrop-filter: blur(10px);
  position: relative;
  overflow: hidden;
  animation: slideInUp 0.8s ease-out;
}

#playlist-instructions-unique::before,
#playlist-details-unique::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--gradient-gold);
}

.playlist-section-header {
  text-align: center;
  margin-bottom: 30px;
}

.playlist-section-icon {
  font-size: 3.5rem !important; /* Reduzido de 4rem */
  line-height: 1 !important;
  background: var(--gradient-gold);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 25px;
  display: inline-block;
  filter: drop-shadow(0 4px 15px rgba(255, 215, 0, 0.4));
}

.playlist-section-title {
  font-size: 2.2rem;
  color: var(--text-primary);
  margin-bottom: 15px;
  font-weight: 800;
}

.playlist-section-subtitle {
  color: var(--text-secondary);
  font-size: 1.15rem;
  max-width: 700px;
  margin: 0 auto;
}

/* --- Steps Grid (Instruções) --- */
.playlist-steps-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
  margin-top: 35px;
}

.playlist-step-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: var(--border-radius);
  padding: 25px;
  position: relative;
  transition: all var(--transition-smooth);
}

.playlist-step-card:hover {
  background: rgba(255, 255, 255, 0.06);
  transform: translateY(-5px);
  border-color: rgba(255, 215, 0, 0.3);
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

.playlist-step-number {
  font-size: 3.5rem;
  font-weight: 800;
  color: rgba(255, 255, 255, 0.05);
  position: absolute;
  top: 10px;
  right: 20px;
  line-height: 1;
}

.playlist-step-text {
  font-size: 1.1rem;
  line-height: 1.6;
  color: var(--text-secondary);
  position: relative;
  z-index: 1;
}

.playlist-step-text strong {
  color: var(--primary-gold);
}

/* --- Info Grid (Detalhes) --- */
.playlist-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 25px;
}

.playlist-info-card {
  display: flex;
  flex-direction: column;
  align-items: center; /* Centraliza horizontalmente no eixo cruzado */
  text-align: center; /* Garante que textos fiquem centralizados */
  gap: 15px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: var(--border-radius);
  padding: 25px;
  border: 1px solid rgba(255, 255, 255, 0.05);
  transition: all var(--transition-smooth);
}

.playlist-info-card:hover {
  background: rgba(255, 215, 0, 0.05);
  border-color: rgba(255, 215, 0, 0.3);
  transform: translateY(-5px);
}

.playlist-info-icon-wrapper {
  width: 54px; /* Reduzido de 60px */
  height: 54px; /* Reduzido de 60px */
  border-radius: 18px;
  background: rgba(255, 215, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-gold);
  margin-bottom: 12px;
  margin-left: auto; /* Centraliza caso align-items falhe */
  margin-right: auto;
}

.playlist-info-icon-wrapper i {
    font-size: 1.8rem !important; /* Reduzido de 2rem */
}

.playlist-info-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-primary);
}

.playlist-info-desc {
  font-size: 0.95rem;
  color: var(--text-secondary);
  line-height: 1.6;
}

/* --- Footer Icons (Small) --- */
/* --- Footer Info (Flexible) --- */
.playlist-footer-info {
    margin-top: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap; /* Quebra linha se necessário */
}

.footer-item {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--text-secondary);
    font-size: 0.95rem;
    background: rgba(255,255,255,0.03);
    padding: 10px 20px;
    border-radius: 50px;
    border: 1px solid rgba(255,255,255,0.05);
}

.footer-item i {
    color: var(--primary-gold);
    font-size: 1.1rem;
    filter: drop-shadow(0 2px 4px rgba(255, 215, 0, 0.3));
}

.footer-item strong {
    color: #fff;
}


/* --- Mobile Fixes --- */
@media (max-width: 768px) {
  #playlist-instructions-unique,
  #playlist-details-unique,
  .playlist-UNIQUE-instructions,
  .playlist-UNIQUE-details {
    padding: 25px 20px;
    margin: 20px auto;
    border-radius: 16px;
  }
  
  .playlist-section-title {
    font-size: 1.6rem;
  }
  
  .playlist-steps-grid,
  .playlist-info-grid {
    grid-template-columns: 1fr; /* Stack on mobile */
    gap: 15px;
  }
  
  .playlist-step-card,
  .playlist-info-card {
    padding: 20px;
  }
}

/* --- Desktop Sizing Match --- */
@media (min-width: 769px) {
  #playlist-instructions-unique,
  #playlist-details-unique,
  .playlist-UNIQUE-instructions,
  .playlist-UNIQUE-details {
    max-width: 750px;
  }
}

@media (min-width: 1200px) {
  #playlist-instructions-unique,
  #playlist-details-unique,
  .playlist-UNIQUE-instructions,
  .playlist-UNIQUE-details {
    max-width: 800px;
  }
}