:root{--app-violet:#8b6cff;--app-violet-soft:#b7a5ff;--app-green:#9fff8b;--app-cyan:#58d9d1;--app-panel:#100e1d;--app-line:rgba(167,139,255,.14)}
html,body{background:#05040b!important}
.top-nav{background:rgba(7,6,17,.88)!important;border-bottom-color:var(--app-line)!important}
.top-nav .logo-area img{height:38px;filter:drop-shadow(0 0 16px rgba(88,217,209,.16))}
.top-nav .nav-links a:hover,.top-nav .nav-links a.active{color:var(--app-violet-soft)!important}
.btn-install-pwa{background:rgba(139,108,255,.1)!important;border-color:rgba(139,108,255,.34)!important;color:var(--app-violet-soft)!important;border-radius:10px!important}
.btn-install-pwa:hover{background:rgba(139,108,255,.2)!important}
.sidebar{background:linear-gradient(180deg,#0d0b17,#080711)!important;border-right-color:var(--app-line)!important}
.sidebar-tabs,.desk-pl-detail{border-color:var(--app-line)!important}
.sidebar-tab.active{color:var(--app-violet-soft)!important;border-bottom-color:var(--app-violet)!important}
.lib-add-btn,.pl-add-btn{background:linear-gradient(135deg,rgba(139,108,255,.16),rgba(88,217,209,.07))!important;border-color:rgba(139,108,255,.42)!important;color:#c8b9ff!important;border-style:solid!important}
.lib-add-btn:hover,.pl-add-btn:hover{background:rgba(139,108,255,.24)!important;transform:translateY(-1px)}
.search-input,.input-styled{background:#0b0914!important;border-color:var(--app-line)!important}.search-input:focus,.input-styled:focus{border-color:var(--app-violet)!important;box-shadow:0 0 0 3px rgba(139,108,255,.1)}
.track-item:hover,.playlist-item:hover,.desk-pl-track:hover{background:rgba(139,108,255,.08)!important}.track-item.playing,.playlist-item.active,.desk-pl-track.playing{background:linear-gradient(90deg,rgba(139,108,255,.16),rgba(88,217,209,.05))!important}
.track-item.playing .track-num,.track-item.playing .track-name,.desk-pl-track.playing .desk-pl-track-num,.desk-pl-track.playing .desk-pl-track-name{color:var(--app-violet-soft)!important}
.now-playing-area{background:radial-gradient(circle at 50% 38%,rgba(104,70,212,.24),transparent 32%),radial-gradient(circle at center,#100d20,#05040b 72%)!important}
.album-art{background:linear-gradient(145deg,#201740,#0c0a16)!important;border-color:rgba(139,108,255,.26)!important;box-shadow:0 25px 75px rgba(0,0,0,.7),0 0 45px rgba(104,70,212,.12)!important}
.progress-fill{background:linear-gradient(90deg,var(--app-violet),var(--app-cyan))!important}.progress-handle,.vol-slider::-webkit-slider-thumb{background:var(--app-violet-soft)!important}
.ctrl-btn.active{color:var(--app-violet-soft)!important}.ctrl-play,.desk-pl-play-btn{background:linear-gradient(135deg,var(--app-violet),#6f4fdd)!important;color:white!important;box-shadow:0 8px 28px rgba(123,92,255,.34)!important}.ctrl-play:hover,.desk-pl-play-btn:hover{background:linear-gradient(135deg,#9e84ff,#7a5be5)!important}
.modal-box,.bottom-sheet{background:#12101e!important;border-color:var(--app-line)!important}.genre-btn.selected{border-color:var(--app-violet)!important;background:rgba(139,108,255,.15)!important;color:var(--app-violet-soft)!important}
#mob-menu-sheet{background:#100e1d!important;border-color:var(--app-line)!important;box-shadow:0 18px 45px rgba(0,0,0,.65)!important}
.mobile-bottom-nav{background:rgba(7,6,17,.94)!important;border-top-color:var(--app-line)!important}
@media(max-width:700px){.top-nav{background:#080711!important}.now-playing-area{background:radial-gradient(circle at 50% 30%,rgba(104,70,212,.22),transparent 35%),#05040b!important}}

/* Páginas internas compartilhadas */
body{font-family:'Manrope','DM Sans',Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;background:radial-gradient(circle at 85% 0,rgba(105,68,218,.18),transparent 32%),#070611!important}
.global-nav,.top-nav{min-height:74px;background:rgba(8,7,17,.88)!important;border-color:var(--app-line)!important;backdrop-filter:blur(20px)}
.global-nav .logo-img,.top-nav .logo-area img{width:145px!important;height:54px!important;object-fit:contain!important}
.nav-links a{border-radius:10px!important}.nav-links a.active{color:var(--app-violet-soft)!important;background:rgba(139,108,255,.1)!important}
.page-container{background:linear-gradient(135deg,rgba(139,108,255,.035),transparent 45%)}
.sidebar-left{min-height:calc(100vh - 74px)!important;background:linear-gradient(180deg,rgba(18,15,33,.92),rgba(8,7,17,.8))!important;border-color:var(--app-line)!important;display:block!important}
.account-intro>span{font-size:10px;letter-spacing:.16em;color:var(--app-cyan);font-weight:800}.account-intro h1{font-size:clamp(2rem,3vw,3.2rem);line-height:.95;letter-spacing:-.055em;margin:18px 0}.account-intro h1 em{font-family:Georgia,serif;font-weight:400;color:var(--app-violet-soft)}.account-intro p{font-size:.86rem;line-height:1.7;color:#777187}
.main-content{padding-top:52px!important}.content-inner{max-width:640px!important}.section-card{padding:30px!important;border-radius:20px!important;background:linear-gradient(145deg,rgba(22,18,39,.96),rgba(12,10,22,.96))!important;border:1px solid var(--app-line)!important;box-shadow:0 22px 55px rgba(0,0,0,.18)}
.section-card h4{color:#aaa1ba!important;letter-spacing:.14em!important}.field-group label,.field label{color:#928a9f!important}.input-field,.field input,.field select,.field textarea{background:#0a0813!important;border:1px solid rgba(167,139,255,.16)!important;border-radius:11px!important;color:#f5f2ff!important}.input-field:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--app-violet)!important;box-shadow:0 0 0 3px rgba(139,108,255,.11)!important}
.pwd-toggle button{color:var(--app-violet-soft)!important}.status-badge{background:rgba(159,255,139,.1)!important;color:var(--app-green)!important;border:1px solid rgba(159,255,139,.2)}
.suporte-wrap{max-width:760px!important;padding-top:60px!important}.suporte-header .sh-icon{width:68px;height:68px;margin:0 auto 18px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(135deg,rgba(139,108,255,.2),rgba(88,217,209,.1));border:1px solid var(--app-line)}.suporte-header h1{font-size:clamp(2rem,5vw,3.4rem)!important;letter-spacing:-.05em}.suporte-header p{color:#837c8f!important}.faq-card,.form-card,.suporte-info{background:linear-gradient(145deg,#151225,#0d0b17)!important;border-color:var(--app-line)!important;border-radius:18px!important}.faq-card:hover{border-color:rgba(139,108,255,.55)!important;transform:translateY(-2px)}.faq-card .fc-title{color:#eee9ff!important}.faq-card .fc-desc{color:#716b7b!important}.btn-enviar{background:linear-gradient(135deg,var(--app-violet),#6f50de)!important;color:white!important;box-shadow:0 10px 30px rgba(123,92,255,.25)}
.hero{background:radial-gradient(circle at 50% 0,rgba(105,68,218,.24),transparent 55%),#070611!important}.hero-logo{background:linear-gradient(145deg,#1c1734,#0c0a16)!important;border-color:rgba(139,108,255,.35)!important}.hero h1 span,.detected-badge,.logo-area span{color:var(--app-violet-soft)!important}.detected-badge{background:rgba(139,108,255,.1)!important;border-color:rgba(139,108,255,.28)!important}.platform-card{background:linear-gradient(145deg,#151225,#0d0b17)!important;border-color:var(--app-line)!important}.platform-card.highlighted{border-color:rgba(139,108,255,.48)!important;box-shadow:0 18px 48px rgba(0,0,0,.25),0 0 30px rgba(139,108,255,.08)!important}.download-btn-primary,.download-btn-purple{background:linear-gradient(135deg,var(--app-violet),#6f50de)!important;color:white!important}.download-btn-secondary{color:var(--app-violet-soft)!important;border-color:rgba(139,108,255,.35)!important}.step-num{background:rgba(139,108,255,.13)!important;border-color:rgba(139,108,255,.32)!important;color:var(--app-violet-soft)!important}.info-box{border-left-color:var(--app-violet)!important;background:#100e1d!important}
@media(max-width:900px){.sidebar-left{min-height:auto!important;padding:28px 20px!important}.account-intro h1{font-size:2.5rem}.main-content{padding-top:26px!important}.section-card{padding:22px!important}.global-nav .logo-img{width:112px!important;height:44px!important}}

/* Playlists mobile — acabamento editorial da landing */
@media(max-width:768px){
  #app{background:#070611!important}
  #mob-view-playlists,#mob-view-detail{background:radial-gradient(circle at 88% 4%,rgba(110,74,225,.2),transparent 35%),#070611!important}
  .mob-pl-header{padding:26px 20px 20px!important;background:linear-gradient(180deg,rgba(18,14,34,.96),rgba(8,7,17,.84))!important;border-bottom:1px solid var(--app-line)!important;gap:7px!important}
  .mob-pl-title{font-size:1.75rem!important;letter-spacing:-.045em!important;line-height:1!important}
  .mob-pl-subtitle{font-size:.79rem!important;color:#898294!important;line-height:1.55!important;margin:3px 0 12px!important}
  .mob-pl-create-btn{padding:15px 18px!important;border:1px solid rgba(139,108,255,.38)!important;border-radius:14px!important;background:linear-gradient(135deg,rgba(139,108,255,.18),rgba(88,217,209,.08))!important;color:#d2c7ff!important;box-shadow:inset 0 1px rgba(255,255,255,.04),0 12px 32px rgba(0,0,0,.18)!important}
  .mob-pl-create-btn:active{background:rgba(139,108,255,.28)!important}
  .mob-pl-grid{padding:18px 16px 96px!important}
  .mob-pl-grid-inner{gap:14px!important}
  .mob-pl-card{min-height:145px!important;padding:18px 16px!important;border-radius:18px!important;background:linear-gradient(145deg,rgba(24,20,42,.96),rgba(11,10,20,.96))!important;border:1px solid rgba(167,139,255,.16)!important;box-shadow:0 16px 38px rgba(0,0,0,.22)!important;justify-content:flex-end!important;overflow:hidden!important}
  .mob-pl-card:before{content:"";position:absolute;inset:-55% -20% auto 18%;height:130px;background:radial-gradient(circle,rgba(139,108,255,.22),transparent 66%);pointer-events:none}
  .mob-pl-card-icon{font-size:2.25rem!important;color:var(--app-violet-soft)!important;margin-bottom:auto!important;position:relative!important}
  .mob-pl-card-name{font-size:.98rem!important;letter-spacing:-.02em!important;position:relative!important}
  .mob-pl-card-count{color:#746d80!important;position:relative!important}
  .mob-pl-card-del{top:12px!important;right:12px!important;background:rgba(5,4,11,.55)!important;border:1px solid rgba(255,255,255,.06)!important;color:#716a7d!important}
  .mob-detail-header{padding:22px 18px 20px!important;background:linear-gradient(155deg,rgba(27,21,50,.96),rgba(10,8,19,.96))!important;border-bottom:1px solid var(--app-line)!important;gap:7px!important}
  .mob-detail-back{color:var(--app-violet-soft)!important;margin-bottom:13px!important;font-weight:700!important}
  .mob-detail-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:17px;background:linear-gradient(135deg,rgba(139,108,255,.2),rgba(88,217,209,.1));border:1px solid rgba(167,139,255,.2);color:var(--app-violet-soft)!important;margin-bottom:8px!important}
  .mob-detail-name-wrap{justify-content:flex-start!important;margin:0!important}
  .mob-detail-name{font-size:1.5rem!important;letter-spacing:-.04em!important}
  .mob-detail-edit-btn{background:rgba(139,108,255,.13)!important;border:1px solid rgba(139,108,255,.22)!important;color:var(--app-violet-soft)!important;border-radius:9px!important}
  .mob-detail-meta{color:#7b7487!important;margin-bottom:7px!important}
  .mob-detail-actions{margin-top:10px!important}
  .mob-detail-play-btn{background:linear-gradient(135deg,var(--app-violet),#6e50dc)!important;color:#fff!important;box-shadow:0 10px 28px rgba(117,83,235,.25)!important}
  .mob-detail-add-btn{background:rgba(88,217,209,.07)!important;border:1px solid rgba(88,217,209,.25)!important;color:#86e9e2!important}
  .mob-detail-tracks{padding:15px 14px 96px!important}
  .empty-lib{color:#6e6878!important;gap:13px!important}.empty-lib span{width:62px;height:62px;display:grid;place-items:center;border-radius:20px;background:rgba(139,108,255,.08);border:1px solid rgba(139,108,255,.13);color:var(--app-violet-soft)}.empty-lib p{line-height:1.6}
  .mob-bottom-nav{background:rgba(8,7,17,.92)!important;border-top:1px solid var(--app-line)!important;box-shadow:0 -14px 40px rgba(0,0,0,.35)!important}
  .mob-tab{color:#625d6c!important}.mob-tab.active{color:var(--app-violet-soft)!important}.mob-tab.active .tab-icon{filter:drop-shadow(0 0 9px rgba(139,108,255,.55))}
}

/* Menu móvel interno */
@media(max-width:768px){
  #mob-menu-sheet{display:block;position:fixed;top:84px;left:14px;right:14px;z-index:600;padding:10px;background:linear-gradient(145deg,rgba(23,19,41,.985),rgba(9,8,18,.985));border:1px solid rgba(167,139,255,.2);border-radius:20px;box-shadow:0 28px 75px rgba(0,0,0,.62),0 0 42px rgba(112,75,225,.1);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-12px) scale(.985);transition:opacity .22s ease,transform .22s ease,visibility .22s}
  #mob-menu-sheet.open{opacity:1;visibility:visible;pointer-events:auto;transform:none}
  .mob-menu-heading{display:flex;align-items:center;justify-content:space-between;padding:8px 8px 13px;margin-bottom:4px;border-bottom:1px solid rgba(167,139,255,.12)}.mob-menu-heading small,.mob-menu-heading strong{display:block}.mob-menu-heading small{color:#6f687a;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase}.mob-menu-heading strong{margin-top:3px;color:#f2effa;font-size:1rem}.mob-menu-heading button{width:34px;height:34px;border:1px solid rgba(167,139,255,.14);border-radius:10px;background:rgba(255,255,255,.035);color:#a49cad;font-size:1.4rem;line-height:1}
  #mob-menu-sheet>a{display:flex;align-items:center;gap:13px;min-height:52px;padding:0 12px;color:#d0cad8;text-decoration:none;font-size:.88rem;font-weight:650;border:0;border-radius:12px;transition:.18s ease}
  #mob-menu-sheet>a+a{margin-top:3px}#mob-menu-sheet>a svg{width:19px;height:19px;color:#a994ff}#mob-menu-sheet>a:active{background:linear-gradient(90deg,rgba(139,108,255,.16),rgba(88,217,209,.06));color:#fff;transform:scale(.99)}#mob-menu-sheet>a.mob-menu-logout{color:#ff8f9b;margin-top:8px;border-top:1px solid rgba(255,255,255,.06);border-radius:0 0 12px 12px}#mob-menu-sheet>a.mob-menu-logout svg{color:#ff7181}
  #mob-menu-backdrop{display:block;position:fixed;inset:0;z-index:599;background:rgba(3,2,8,.62);backdrop-filter:blur(4px);opacity:0;visibility:hidden;pointer-events:none;transition:.2s ease}#mob-menu-backdrop.open{opacity:1;visibility:visible;pointer-events:auto}
}

/* Tocando agora — mesma identidade das playlists */
@media(max-width:768px){
  #mob-view-player{background:radial-gradient(circle at 50% 18%,rgba(112,75,225,.22),transparent 34%),radial-gradient(circle at 90% 72%,rgba(88,217,209,.06),transparent 30%),#070611!important}
  .mob-player-header{padding:12px 20px 0!important;min-height:76px!important}
  .mob-brand-center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:148px}
  .mob-player-header .mob-brand-logo{display:block!important;width:142px!important;height:48px!important;object-fit:contain!important;filter:drop-shadow(0 0 18px rgba(88,217,209,.2))!important}
  #mob-username{margin-top:-5px;color:#8fe6df!important;font-size:.68rem!important;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mob-header-btn{color:#766f82!important;width:42px;height:42px;border-radius:12px!important;display:grid!important;place-items:center!important}
  .mob-header-btn:active{color:var(--app-violet-soft)!important;background:rgba(139,108,255,.1)!important}
  .mob-player-body{padding:8px 22px 0!important;justify-content:center!important}
  .mob-album-art{width:min(70vw,292px)!important;height:min(70vw,292px)!important;border-radius:25px!important;background:radial-gradient(circle at 35% 25%,rgba(88,217,209,.11),transparent 38%),linear-gradient(145deg,#211943,#0c0a16)!important;border:1px solid rgba(167,139,255,.24)!important;color:#f2eeff!important;box-shadow:0 28px 80px rgba(0,0,0,.62),0 0 60px rgba(112,75,225,.14),inset 0 1px rgba(255,255,255,.05)!important;margin-bottom:27px!important}
  .mob-album-art.playing{animation:app-cover-pulse 3.4s ease-in-out infinite!important}
  @keyframes app-cover-pulse{0%,100%{box-shadow:0 28px 80px rgba(0,0,0,.62),0 0 35px rgba(112,75,225,.1),inset 0 1px rgba(255,255,255,.05)}50%{box-shadow:0 28px 80px rgba(0,0,0,.62),0 0 70px rgba(112,75,225,.24),inset 0 1px rgba(255,255,255,.05)}}
  .mob-song-info{margin-bottom:19px!important}
  .mob-song-title-wrap{gap:9px!important;margin-bottom:7px!important}
  .mob-song-title{font-size:1.22rem!important;letter-spacing:-.035em!important;color:#f5f2ff!important}
  .mob-song-artist{font-size:.82rem!important;color:#81798d!important}
  .mob-view-pl-btn{background:rgba(139,108,255,.14)!important;border:1px solid rgba(139,108,255,.28)!important;color:var(--app-violet-soft)!important;border-radius:9px!important}
  .mob-pl-badge{background:rgba(139,108,255,.13)!important;border:1px solid rgba(139,108,255,.2)!important;color:#bbaaff!important;padding:4px 11px!important;border-radius:99px!important}
  .mob-prog-wrap{padding:0 24px 11px!important}
  .mob-prog-track{height:4px!important;background:rgba(255,255,255,.1)!important}
  .mob-prog-fill{background:linear-gradient(90deg,var(--app-violet),var(--app-cyan))!important;box-shadow:0 0 12px rgba(139,108,255,.35)!important}
  .mob-prog-handle{background:#d6cdff!important;box-shadow:0 0 0 4px rgba(139,108,255,.14)!important}
  .mob-time-row{color:#696273!important}
  .mob-controls{padding:0 15px 17px!important}
  .mob-ctrl{color:#817a8d!important}.mob-ctrl:active,.mob-ctrl.active{color:var(--app-violet-soft)!important;background:rgba(139,108,255,.08)!important}
  .mob-ctrl-play{background:linear-gradient(135deg,var(--app-violet),#6e4fde)!important;color:white!important;box-shadow:0 10px 34px rgba(119,84,235,.42),0 0 0 1px rgba(255,255,255,.08)!important}
  .mob-ctrl-play:active{transform:scale(.94)!important;background:linear-gradient(135deg,#9d84ff,#7658e2)!important}
}
/* Logo do Player em movimento — desktop e celular */
.top-nav .logo-area img,
.mob-player-header .mob-brand-logo{
  animation:player-brand-float 5.2s ease-in-out infinite,player-brand-glow 4.4s ease-in-out infinite;
  transform-origin:center;
  will-change:transform,filter;
}
.top-nav .logo-area:hover img,
.top-nav .logo-area:focus-visible img{
  animation-play-state:paused;
  transform:translateY(-3px) scale(1.035);
}
@keyframes player-brand-float{
  0%,100%{transform:translateY(-4px) rotate(-.35deg)}
  50%{transform:translateY(5px) rotate(.35deg)}
}
@keyframes player-brand-glow{
  0%,100%{filter:drop-shadow(0 6px 13px rgba(88,217,209,.16))}
  50%{filter:drop-shadow(0 11px 23px rgba(139,108,255,.34))}
}
@media(prefers-reduced-motion:reduce){
  .top-nav .logo-area img,
  .mob-player-header .mob-brand-logo{
    animation:none;
    transform:none;
  }
}