*{box-sizing:border-box;margin:0;padding:0}:root{--bg-color:black;--texte-color:#fff;--bg-popu-color:#141414;--bg-nav-color:#363535fc;--bg-HomePage-tendance:#2c2c2e;--bg-HomePage-tendance-hover:#484848;--border-modeSombre-clair:#2fd978}:root[data-theme=clair]{--bg-color:#fff;--texte-color:black;--bg-popu-color:#e4e2e2e3;--bg-nav-color:#e4e2e2e3;--bg-HomePage-tendance:#c5c3c3e3;--bg-HomePage-tendance-hover:#a19e9ee3;--bg-nav-laptob:#e4e2e2e3;--border-modeclair:#000;--border-modeSombre-clair:none}:root[data-theme=dark]{--bg-color:black;--texte-color:#fff;--bg-popu-color:#141414;--bg-nav-color:#363535fc;--bg-HomePage-tendance:#2c2c2e;--bg-HomePage-tendance-hover:#484848;--bg-nav-laptob:#141414;--border-modeSombre-clair:#2fd978}.signup-page{background:radial-gradient(circle at 50% 1%,#1a4d3a 0%,#0d2818 30%,#0a0a0a 70%);flex-direction:column;align-items:center;min-height:100vh;font-family:Montserrat,sans-serif;display:flex}.signup-page header{justify-content:center;align-items:center;margin-top:5%;display:flex}.signup-page header img{border-radius:50%;width:16%;animation:3s ease-in-out infinite pulse-logo}@keyframes pulse-logo{0%,to{filter:drop-shadow(0 0 1px #1ed760)}50%{filter:drop-shadow(0 0 14px #1ed760)}}.signup-page h1{text-align:center;font-size:42px;font-weight:700}.signup-page section{color:#fff;width:388px;height:698px}.signup-page button{color:#fff;background-color:#fff0;border:1px solid #7c7c7c;border-radius:50px;justify-content:space-around;align-items:center;width:324px;height:48px;margin-bottom:15px;font-size:15px;font-weight:700;display:flex}.signup-page .login-button:hover{border-color:#fff}.signup-page form{flex-direction:column;align-items:center;margin-top:15px;display:flex}.signup-page input{color:#fff;text-indent:10px;background-color:#0000;border:1px solid #7c7c7c;border-radius:5px;width:324px;height:48px;font-size:16px;font-weight:400}.signup-page input:hover{border-color:#fff}.signup-page #suivant{color:#121212;background-color:#1ed760;border:none;border-radius:50px;justify-content:space-around;align-items:center;width:324px;height:48px;font-size:15px;font-weight:700;display:flex}.signup-page #suivant:hover{color:#121212;background-color:#56e086;border:none}.signup-page #name{border:2px solid #24a87a;margin-bottom:18px}.signup-page div{flex-direction:column;align-items:center;display:flex}.signup-page label{align-self:flex-start;margin-bottom:6px;font-size:13px;font-weight:600}.signup-page hr{width:100%;height:2%}.signup-page p{text-align:center;align-items:center;width:324px;margin-top:5%;margin-bottom:5%;display:flex}.signup-page p:before,.signup-page p:after{content:"";background-color:#7c7c7c;flex:1;height:1.005px}.signup-page p:before{margin-right:1rem}.signup-page p:after{margin-left:1rem}@media (width<=767px){.signup-page header{margin-top:10%}.signup-page h1{font-size:2rem}.signup-page div{margin-top:5%;margin-left:5%;margin-right:5%}.signup-page header img{border-radius:50%;width:28%;animation:3s ease-in-out infinite pulse-logo}}body{background-color:var(--bg-color)}@media (width>=769px){.HomePage{background-color:var(--bg-color);color:var(--texte-color);padding:1.2rem 2rem 0 7rem;font-family:Montserrat,sans-serif}.HomePage header{justify-content:space-between;align-items:center;margin-bottom:1.2rem;display:flex}.HomePage header>div{gap:20px;display:flex}.HomePage section{background-color:#202020;border-radius:8px;height:88vh;margin-top:2rem;overflow:scroll}nav{background-color:var(--bg-nav-laptob);border-radius:0;flex-direction:column;justify-content:flex-start;align-items:center;gap:2rem;width:5.5rem;height:100vh;margin:0;padding-top:2rem;display:flex;position:fixed;inset:0 auto auto 0}nav div{cursor:pointer}.HomePage section{background-color:var(--bg-popu-color);border-radius:10px;margin-top:.5rem;margin-left:.6rem;margin-right:.6rem;overflow-y:scroll}.HomePage .container-section{height:83vh;padding:.5rem;overflow-y:scroll}.HomePage .container-section h2:first-child{padding-top:.5rem;padding-bottom:1.4rem;font-size:1.45rem}.HomePage .container-section .tendance{flex-wrap:wrap;gap:10px;display:flex}.HomePage .container-section .tendance>div:hover{background-color:var(--bg-HomePage-tendance-hover)}.HomePage .container-section .tendance>div{background-color:var(--bg-HomePage-tendance);border-radius:3px;align-items:center;gap:10px;width:12.5rem;display:flex}.HomePage .container-section .tendance>div img{object-fit:cover;border-radius:4px;flex-shrink:0;width:4.2rem;height:4.2rem}.HomePage .container-section .container-pop h2,.HomePage .container-section .container-rap h2,.HomePage .container-section .container-rb h2{padding-top:1.7rem;padding-bottom:1rem}.HomePage .container-section .container-pop>div,.HomePage .container-section .container-rap>div,.HomePage .container-section .container-rb>div{gap:30px;display:flex;overflow-x:scroll}.HomePage .container-section .container-pop img,.HomePage .container-section .container-rap img,.HomePage .container-section .container-rb img{width:8.2rem;height:8..2rem;object-fit:cover;cursor:pointer;border-radius:5px}.HomePage .container-section .container-pop>div>div>p:nth-child(2),.HomePage .container-section .container-rap>div>div>p:nth-child(2),.HomePage .container-section .container-rb>div>div>p:nth-child(2){cursor:pointer;font-size:.9rem;font-weight:700}.HomePage .container-section .container-pop>div>div>p:nth-child(3),.HomePage .container-section .container-rap>div>div>p:nth-child(3),.HomePage .container-section .container-rb>div>div>p:nth-child(3){cursor:pointer;font-size:.8rem}.HomePage nav div:first-child{position:relative}.HomePage nav div:first-child:after{content:"";background-color:#2fd978;width:.2rem;height:2.5rem;display:block;position:absolute;top:0;left:3.8rem}.loupeSVG{cursor:pointer}.HomePage .container-pop>div,.HomePage .container-rap>div,.HomePage .container-rb>div{scrollbar-width:none}.HomePage .container-pop>div::-webkit-scrollbar{display:none}.HomePage .container-rap>div::-webkit-scrollbar{display:none}.HomePage .container-rb>div::-webkit-scrollbar{display:none}.HomePage section,.HomePage .container-section{scrollbar-width:none}.HomePage section::-webkit-scrollbar{display:none}.HomePage .container-section::-webkit-scrollbar{display:none}}@media (width<=768px){.HomePage{background-color:var(--bg-color);color:var(--texte-color);padding-bottom:1.5rem;font-family:Montserrat,sans-serif}.HomePage header{justify-content:space-between;align-items:center;display:flex}.HomePage header div{justify-content:center;align-items:center;gap:10px;margin-top:.3rem;margin-left:.6rem;display:flex}.HomePage #welcome{font-size:1.8rem}.HomePage .loupeSVG{background-color:var(--bg-popu-color);border-radius:50%;margin-top:.3rem;margin-right:.6rem;padding:.4rem}.HomePage section{background-color:var(--bg-popu-color);border-radius:10px;margin-top:.5rem;margin-left:.6rem;margin-right:.6rem;overflow-y:scroll}.HomePage .container-section{height:83dvh;padding:.5rem;padding-bottom:calc(.5rem + env(safe-area-inset-bottom));overflow-y:scroll}nav{padding-bottom:env(safe-area-inset-bottom)}.HomePage .container-section h2:first-child{padding-top:.5rem;padding-bottom:1.4rem;font-size:1.45rem}.HomePage .container-section .tendance{flex-wrap:wrap;gap:5px;display:flex}.HomePage .container-section .tendance>div:hover{background-color:var(--bg-HomePage-tendance-hover)}.HomePage .container-section .tendance>div{background-color:var(--bg-HomePage-tendance);border-radius:3px;align-items:center;gap:8px;width:10rem;display:flex}.HomePage .container-section .tendance>div img{object-fit:cover;border-radius:4px;flex-shrink:0;width:3.5rem;height:3.5rem}.HomePage .container-section .container-pop h2,.HomePage .container-section .container-rb h2{padding-top:1.4rem;padding-bottom:1.4rem}.HomePage .container-section .container-pop>div,.HomePage .container-section .container-rap>div,.HomePage .container-section .container-rb>div{gap:30px;display:flex;overflow-x:scroll}.HomePage .container-section .container-pop img,.HomePage .container-section .container-rap img,.HomePage .container-section .container-rb img{object-fit:cover;border-radius:5px;width:7rem;height:7rem}.HomePage .container-section .container-pop>div>div>p:nth-child(2),.HomePage .container-section .container-rap>div>div>p:nth-child(2),.HomePage .container-section .container-rb>div>div>p:nth-child(2){font-size:.9rem;font-weight:700}.HomePage .container-section .container-pop>div>div>p:nth-child(3),.HomePage .container-section .container-rap>div>div>p:nth-child(3),.HomePage .container-section .container-rb>div>div>p:nth-child(3){font-size:.8rem}nav{background-color:var(--bg-nav-color);border-radius:100px;justify-content:space-around;margin-bottom:2%;margin-left:2%;margin-right:2%;display:flex;position:fixed;bottom:0;left:0;right:0}.HomePage nav div:first-child:after{content:"";background-color:#2fd978;width:auto;height:2px;display:block;position:relative;right:auto}nav div{cursor:pointer}.HomePage .container-pop>div,.HomePage .container-rap>div,.HomePage .container-rb>div{scroll-snap-type:x mandatory;scrollbar-width:none;gap:30px;padding-right:1.5rem;display:flex;overflow-x:scroll}.HomePage .container-pop>div::-webkit-scrollbar{display:none}.HomePage .container-rap>div::-webkit-scrollbar{display:none}.HomePage .container-rb>div::-webkit-scrollbar{display:none}.HomePage .container-pop>div>div,.HomePage .container-rap>div>div,.HomePage .container-rb>div>div{scroll-snap-align:start}}body{color:#fff;font-family:Montserrat,sans-serif}@media (width>=769px){.Lecteur{min-height:100vh;position:relative;overflow:hidden}.Lecteur .background-blur{filter:blur(25px)brightness(.6);z-index:-2;background-position:50%;background-size:cover;width:120%;height:120%;position:absolute;top:-10%;left:-10%}.Lecteur header{margin-bottom:2rem;padding:1.2rem}.Lecteur header>button{color:#2fd978;background-color:#fff0;border:2px solid #2fd978;border-radius:5px;padding:1rem 1.5rem;font-size:.9rem;font-weight:700}.Lecteur header>button:hover{color:#fff;background-color:#2fd978}.Lecteur div:nth-child(3){flex-direction:column;justify-content:center;align-items:center;display:flex}.Lecteur div:nth-child(3) img{border-radius:7px;width:30rem;height:30rem;margin-top:1.5rem;margin-bottom:3rem}.Lecteur div:nth-child(3) h1{color:#fff;font-size:1.9rem}.Lecteur .barre-progression{accent-color:#2fd978;width:17rem;margin-bottom:1.5rem}.Lecteur .btn-play{color:#000;background-color:#fff;border:none;border-radius:50%;padding:1rem}}.Lecteur div:first-child p,.Lecteur div:first-child h1{color:#fff}@media (width<=768px){.Lecteur{min-height:100vh;position:relative;overflow:hidden}.Lecteur .background-blur{filter:blur(25px)brightness(.6);z-index:-2;background-position:50%;background-size:cover;width:120%;height:120%;position:absolute;top:-10%;left:-10%}.Lecteur header{margin-bottom:2rem;padding:1.2rem}.Lecteur header>button{color:#2fd978;background-color:#fff0;border:2px solid #2fd978;border-radius:5px;padding:.3rem .5rem .4rem;font-size:.9rem;font-weight:700}.Lecteur header>button:hover{color:#fff;background-color:#2fd978}.Lecteur div:nth-child(3){flex-direction:column;justify-content:center;align-items:center;display:flex}.Lecteur div:nth-child(3) img{border-radius:7px;margin-top:1.5rem;margin-bottom:3rem}.Lecteur div:nth-child(3) h1{font-size:1.5rem}.Lecteur .barre-progression{accent-color:#2fd978;width:17rem;margin-bottom:1.5rem}.Lecteur .btn-play{color:#000;background-color:#fff;border:none;border-radius:50%;padding:1rem}}.mentions-legales>div{margin-left:.5rem}@media (width>=769px){.Reglage{background-color:var(--bg-color);color:var(--texte-color);padding:1.2rem 2rem 0 7rem;font-family:Montserrat,sans-serif}.Reglage header{justify-content:space-between;align-items:center;margin-bottom:1.2rem;display:flex}nav{background-color:var(--bg-nav-laptob);width:5.5rem;height:100vh;padding-top:2rem;padding-bottom:env(safe-area-inset-bottom);border-radius:0;flex-direction:column;justify-content:flex-start;align-items:center;gap:2rem;margin:0;display:flex;position:fixed;inset:0 auto auto 0}nav div{cursor:pointer}.Reglage nav div:nth-child(3){position:relative}.Reglage nav div:nth-child(3):after{content:"";background-color:#2fd978;width:.2rem;height:2.5rem;display:block;position:absolute;top:0;left:3.8rem}.Reglage>section{background-color:var(--bg-popu-color);border-radius:7px}section h2{margin-bottom:1rem;margin-left:.4rem;padding-top:.6rem}.container-blanc div:nth-child(2),.container-black div:nth-child(2){justify-content:center;padding-top:1rem;padding-bottom:.8rem;display:flex}.Reglage>section:nth-child(2)>div{justify-content:space-around;display:flex}.Reglage>section>div>div{flex-direction:column;justify-content:space-around;display:flex}.Blanc{border:1px solid var(--border-modeclair);background-color:#fff;border-radius:14px;justify-content:center;align-items:center;padding:3.7rem 7rem;display:flex}.container-blanc div:nth-child(2),.container-black div:nth-child(2){justify-content:center;padding-top:1rem;display:flex}.Blanc span:first-child{content:"";border:1px solid #000;border-radius:50%;width:4.5rem;height:4.5rem;display:block;position:relative}.Noir span:first-child{content:"";border:1px solid #2fd978;border-radius:50%;width:4.5rem;height:4.5rem;display:block;position:relative}.Noir{border:1px solid var(--border-modeSombre-clair);background-color:#000;border-radius:14px;justify-content:center;align-items:center;padding:3.7rem 7rem;display:flex}.Reglage>section:nth-child(4){height:26.6vh;overflow-y:scroll}section>div>p{margin-left:.4rem;font-size:1.2rem}p{font-size:1.2rem}.Reglage .mentions-legales div{padding-top:.5rem}.Reglage .mentions-legales p{color:#a1a1aa;margin:0 0 .4rem;line-height:1.6}.Reglage .mentions-legales a{color:#2fd978;text-decoration:none}.Reglage .mentions-legales a:hover{text-decoration:underline}.Reglage section:nth-child(2),.Reglage section:nth-child(3){margin-bottom:1.3rem}.Reglage section:nth-child(3)>div{align-items:center;gap:10px;display:flex}.Reglage section:nth-child(3){padding-bottom:1.2rem}}@media (width<=768px){.Reglage{margin-top:.3rem;margin-left:.6rem;margin-right:.6rem}.Reglage header{padding-bottom:.7rem}.Reglage>section{background-color:var(--bg-popu-color);color:var(--texte-color);border-radius:7px}section h2{margin-bottom:1rem;margin-left:.4rem;padding-top:.6rem}.container-blanc div:nth-child(2),.container-black div:nth-child(2){justify-content:center;padding-top:1rem;padding-bottom:.8rem;display:flex}.Reglage>section:nth-child(2)>div{justify-content:space-around;display:flex}.Reglage>section>div>div{flex-direction:column;justify-content:space-around;display:flex}.Blanc{border:solid 1px var(--border-modeclair);background-color:#fff;border-radius:14px;justify-content:center;align-items:center;padding:1rem 2.8rem;display:flex}.container-blanc div:nth-child(2),.container-black div:nth-child(2){justify-content:center;padding-top:1rem;display:flex}.Blanc span:first-child{content:"";border:1px solid #000;border-radius:50%;width:4.5rem;height:4.5rem;display:block;position:relative}.Noir span:first-child{content:"";border:1px solid #2fd978;border-radius:50%;width:4.5rem;height:4.5rem;display:block;position:relative}.Noir{border:1px solid var(--border-modeSombre-clair);background-color:#000;border-radius:14px;justify-content:center;align-items:center;padding:1rem 2.8rem;display:flex}.Reglage>section:nth-child(4){height:26.6vh;overflow-y:scroll}.Reglage nav div:nth-child(3):after{content:"";background-color:#2fd978;width:auto;height:2px;display:block;position:relative;right:auto}section>div>p{margin-left:.4rem}.Reglage section:nth-child(2),.Reglage section:nth-child(3){margin-bottom:1.3rem}.Reglage section:nth-child(3)>div{align-items:center;gap:10px;display:flex}.Reglage section:nth-child(3){padding-bottom:1.2rem}.Reglage .mentions-legales div{padding-top:.5rem}.Reglage .mentions-legales p{color:#a1a1aa;margin:0 0 .4rem;font-size:.9rem;line-height:1.6}.Reglage .mentions-legales a{color:#2fd978;text-decoration:none}.Reglage .mentions-legales a:hover{text-decoration:underline}}h1{color:var(--texte-color)}@media (width>=769px){.Recherche{background-color:var(--bg-color);color:var(--texte-color);padding:1.2rem 2rem 0 7rem;font-family:Montserrat,sans-serif}.Recherche header{justify-content:space-between;align-items:center;margin-bottom:1.2rem;display:flex}.Recherche header>div{gap:20px;display:flex}.Recherche section{border-radius:8px;height:88vh;margin-top:2rem;overflow:scroll}nav{background-color:var(--bg-nav-laptob);width:5.5rem;height:100vh;padding-top:2rem;padding-bottom:env(safe-area-inset-bottom);border-radius:0;flex-direction:column;justify-content:flex-start;align-items:center;gap:2rem;margin:0;display:flex;position:fixed;inset:0 auto auto 0}nav div{cursor:pointer}.Recherche nav div:nth-child(2){position:relative}.Recherche nav div:nth-child(2):after{content:"";background-color:#2fd978;width:.2rem;height:2.5rem;display:block;position:absolute;top:0;left:3.8rem}.barre-recherche{width:100%;position:relative}.barre-recherche input{background-color:var(--bg-popu-color);width:100%;color:var(--texte-color);border:1px solid #3a3a3a;border-radius:20px;padding:.8rem 2.8rem .8rem 1rem}.barre-recherche svg{pointer-events:none;position:absolute;top:50%;right:.8rem;transform:translateY(-50%)}#container-Search{height:83dvh;margin-top:1rem;padding:.5rem;overflow-y:scroll}.container-result-search{background-color:var(--bg-popu-color);color:var(--texte-color);border-radius:8px;align-items:center;gap:10px;margin-bottom:.8rem;display:flex}.container-result-search>img{border-top-left-radius:8px;border-bottom-left-radius:8px;width:9rem;height:9rem}}@media (width<=768px){.Recherche{margin-top:.3rem;margin-left:.6rem;margin-right:.6rem}.Recherche header{padding-bottom:.7rem}.Recherche>section{border-radius:7px}section h2{margin-bottom:1rem;margin-left:.4rem;padding-top:.6rem}.barre-recherche{width:100%;position:relative}.barre-recherche input{background-color:var(--bg-popu-color);width:100%;color:var(--texte-color);border:1px solid #3a3a3a;border-radius:20px;padding:.8rem 2.8rem .8rem 1rem}.barre-recherche svg{pointer-events:none;position:absolute;top:50%;right:.8rem;transform:translateY(-50%)}#container-Search{height:73.8vh;margin-top:1rem;padding:.5rem;overflow-y:scroll}.container-result-search{background-color:var(--bg-popu-color);color:var(--texte-color);border-radius:8px;align-items:center;gap:10px;margin-bottom:.8rem;display:flex}.container-result-search>img{border-top-left-radius:8px;border-bottom-left-radius:8px}.Recherche nav div:nth-child(2):after{content:"";background-color:#2fd978;width:auto;height:2px;display:block;position:relative;right:auto}section>div>p{margin-left:.4rem}.Recherche section:nth-child(2),.Recherche section:nth-child(3){margin-bottom:1.3rem}.Recherche section:nth-child(3)>div{align-items:center;gap:10px;display:flex}.Recherche section:nth-child(3){padding-bottom:1.2rem}}#container-Search{scrollbar-width:none}.Recherche #container-Search::-webkit-scrollbar{display:none}