@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#0e0a20;--panel:#1c1534;--line:#37284e;--muted:#b6a9c9;--lime:#ffcc68;--white:#fff7ff;--pink:#ff58c8;--cyan:#71e4ff}body{background:radial-gradient(ellipse at 85% 20%,#40174855,transparent 45%),radial-gradient(ellipse at 0 65%,#1e277955,transparent 40%),var(--bg);font-family:'DM Sans',sans-serif}header{height:92px;background:#100b25e8;border-color:#50315866;padding:0 4.5%;position:relative;z-index:1}.animation-mark{font-family:Outfit,sans-serif;font-size:27px;letter-spacing:-.7px}.animation-mark small{color:var(--cyan)}.animation-mark i{color:var(--pink);text-shadow:0 0 15px var(--pink)}.brand-sub{border-color:#60416a;color:#e2cde9}nav{background:#21162f;border-color:#62406c}nav button{color:#ddcce3}nav button.active{background:linear-gradient(110deg,#ff78d5,#ffbd8e);color:#260e31;font-weight:700;box-shadow:0 3px 18px #ed55bf35}.demo i{background:var(--pink)}main{padding-top:27px;max-width:1480px}.hero.stage-hero{display:block;position:relative;isolation:isolate;overflow:hidden;min-height:425px;border-radius:24px;border:1px solid #9361ad80;background:#080622 url('micro-folies-stage.png') left center/cover no-repeat;margin-bottom:17px;box-shadow:0 16px 80px #09001788}.stage-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 23%,#09072430 39%,#09072433);z-index:-1}.stage-copy{margin-left:42%;padding:37px 30px 31px;position:relative;max-width:660px}.eyebrow{color:var(--cyan);font-size:10px;letter-spacing:2px}.live-dot{background:#ff8bd9;box-shadow:0 0 12px #ff58c8;animation:liveGlow 2.4s infinite ease-in-out}.hero h1{font-family:Outfit,sans-serif;font-size:clamp(55px,6vw,88px);line-height:.98;letter-spacing:-3px;margin:22px 0 17px;font-weight:900}.hero h1 em{color:#ff9cde;text-shadow:0 0 35px #ff26bc50}.title-star{font-size:49px;display:inline-block;color:#ffd873;margin-left:18px;vertical-align:top;animation:starTurn 12s linear infinite}.hero p{color:#ede1f3;font-size:14px;line-height:1.65}.steps{gap:19px;color:#f1e1fb;font-size:11px;margin-top:20px}.steps b{background:#69408766;color:#ffde8a;border:1px solid #bf74cf77;width:23px;height:23px}.partners{color:#c7b8d7;margin-top:21px;font-size:10px}.partners strong{color:#fff0fc}.partner-logos{background:#0c0819a8;border:1px solid #a460af40;border-radius:10px;padding:5px 8px;gap:9px}.partner-logos img{width:43px;height:43px}.partner-logos span{color:#dcb6ef}.stage-sticker{position:absolute;left:28px;bottom:35px;background:#ffd075;color:#3f153d;padding:16px 19px;text-align:center;font-family:Outfit;font-size:12px;line-height:1.2;font-weight:800;transform:rotate(-9deg);border-radius:50%;box-shadow:0 0 0 5px #ffc96722}.equalizer{position:absolute;right:0;bottom:36px;height:30px;align-items:flex-end;gap:3px;display:flex;opacity:.7}.equalizer i{display:block;width:3px;height:calc(5px + mod(var(--i),5)*5px);height:18px;background:linear-gradient(var(--pink),var(--cyan));border-radius:2px;transform-origin:bottom;animation:beat 1s calc(var(--i)*-.17s) ease-in-out infinite}.equalizer i:nth-child(3n){height:28px}.equalizer i:nth-child(2n){height:10px}.session.session-strip{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(100deg,#201535,#231532);border:1px solid #65407066;border-radius:16px;padding:17px 23px;margin-bottom:30px}.session:before{display:none}.session-strip>div:first-child{display:flex;gap:19px;align-items:center;flex-wrap:wrap}.session .tag{color:var(--cyan);font-size:9px;display:flex;align-items:center;gap:8px}.session h2{font-size:17px;margin:0;letter-spacing:-.4px}.session p{margin:0;font-size:11px;color:var(--muted)}.session-bottom{border:0;margin:0;padding:0;gap:17px}.session-status{font-size:10px;color:#94e9cd;white-space:nowrap}.avatar{border-color:#251733;background:#b76b8b}.avatar:first-child{background:#b56c39}.avatar:nth-child(2){background:#6e619d}.section-top{margin-bottom:17px}.section-top h2{font-family:Outfit;font-size:27px;letter-spacing:-.6px}.section-top h2 span{font-family:'DM Sans';font-size:11px;color:var(--muted)}.mine{background:#291939;border-color:#68416f;color:#f1d8fa}.mine:hover{border-color:var(--pink);background:#3a214a}.search{border-radius:14px;background:#211733;border:1px solid #7f4d8e;box-shadow:0 0 24px #c530b30b;height:59px}.search span{color:#ff90dc}.search:focus-within{border-color:var(--pink);box-shadow:0 0 0 3px #ff58c819}.search input{font-size:14px}.search kbd{border:0;color:#c2a1d2;background:#352043;border-radius:5px;padding:6px 9px}.filters{gap:9px;padding:20px 0 23px;flex-wrap:wrap;overflow:visible}.chip{display:flex;align-items:center;gap:8px;min-height:44px;border-radius:12px;background:#241935;border-color:#5c366b;color:#e7cfef;font-size:11px;padding:10px 13px;transition:transform .16s,background .16s,border-color .16s}.chip:hover{transform:translateY(-2px);border-color:#f079d3}.chip .genre-icon{font-size:17px;color:#ff92de}.genre-count{font-size:9px;background:#ffffff12;padding:3px 6px;border-radius:6px;color:#cbb8db}.chip.active{background:linear-gradient(120deg,#ff89d9,#ffb7e8);border-color:#ff9ce2;color:#32103d;box-shadow:0 4px 16px #ff58c829;font-weight:700}.chip.active .genre-count{background:#5a195a18;color:#591950}.chip.active .genre-icon{color:#681d68}.chip[data-filter="Rock"] .genre-icon{color:#ffb56d}.chip[data-filter="Disco & funk"] .genre-icon{color:#6ee3ff}.chip[data-filter="Rap & RnB"] .genre-icon{color:#b9a0ff}.chip[data-filter="Festif & latino"] .genre-icon{color:#ffdb77}.chip[data-filter="Chanson française"] .genre-icon{color:#ff7b9b}.chip[data-filter="Soul & jazz"] .genre-icon{color:#8ff0cc}.grid{gap:13px}.song{background:linear-gradient(120deg,#241934,#1b142e);border:1px solid #5e3d705f;border-radius:14px;padding:16px;min-height:108px;box-shadow:0 4px 12px #03001022;transition:transform .18s,border-color .18s,box-shadow .18s;animation:cardIn .3s ease-out both}.song:hover{border-color:#f179cf;transform:translateY(-3px);box-shadow:0 8px 25px #d943ca18}.song:nth-child(3n+2) .cover{background:linear-gradient(140deg,#385d8b,#733ca0)}.song:nth-child(3n) .cover{background:linear-gradient(140deg,#9a493c,#a26c37)}.cover{width:53px;height:65px;border:1px solid #ffffff20;background:linear-gradient(140deg,#af3d8a,#5c2e8c);border-radius:9px}.cover-note{font-size:32px;font-family:Outfit;color:#ffdbf4;filter:drop-shadow(0 2px 5px #29103988)}.cover:before{right:-25px;bottom:-25px}.song-title{font-size:13px;line-height:1.3}.artist{color:#c2b0d1}.song-tags{font-size:9px;flex-wrap:wrap;gap:7px;color:#a497b9;line-height:1.4}.song-genre{color:#e2a1d4}.pick{width:32px;height:32px;background:#42204b;border-color:#a3549c;color:#ffb1eb}.bottom-note{color:#b7a0c9}.primary{background:linear-gradient(115deg,#ff78d2,#ffb783);color:#331135;box-shadow:0 4px 17px #f764bd25}.primary:hover{filter:brightness(1.08)}footer{border-color:#59356866;color:#9c87af}.dialog{background:linear-gradient(145deg,#301b42,#19102e);border:1px solid #be6bb88f;box-shadow:0 25px 100px #000a}.dialog h2{font-family:Outfit}.dialog input{background:#150d25;border-color:#754b83}.dialog input:focus{border-color:#ff8dd9}.selected{background:#160e27;border:1px solid #6a3c7144}.success-icon{background:linear-gradient(130deg,#ff84da,#ffdc91);color:#41203c}.celebrate{color:#ffcf7a;font-size:26px;position:absolute;right:35px;top:63px;transform:rotate(10deg);animation:float 3s ease-in-out infinite}.celebrate span{color:#71e4ff}.stat{background:linear-gradient(120deg,#291b3a,#1b132d);border-color:#784c8044}.stat strong{font-family:Outfit;color:#ffc3eb}.now{background:linear-gradient(140deg,#48204e,#24153e);border-color:#c25ea272}.now h3{font-family:Outfit}.now p{color:#ead0e8}.sidebox{background:#20132f;border-color:#65406e}.queue{background:linear-gradient(110deg,#241732,#1c132c);border-color:#60416a66}.queue .num{color:#ed94d4}.reference{color:#8ae2fa}.queue-actions button{border-color:#714a7d;color:#ebc5ec}.notice{color:#b2a0c3}.session-strip .live-dot{background:#8ee6cf;box-shadow:0 0 10px #80e8c2}.screen{isolation:isolate;position:relative;min-height:73vh;padding:45px 30px 45px 34%;grid-template-columns:1fr 290px;gap:25px;border-radius:23px;overflow:hidden;background:#090520 url('micro-folies-stage.png') left center/cover no-repeat;border:1px solid #8651a566}.screen h1{font-family:Outfit;font-size:clamp(50px,5vw,76px);letter-spacing:-2px;line-height:1}.screen h1 em{color:#ff9bdf;text-shadow:0 0 40px #ff37bc55}.screen p{color:#e6d4ee;font-size:14px}.screen .steps{gap:10px;flex-wrap:wrap;font-size:10px}.screen .partners{flex-direction:column;align-items:flex-start;font-size:10px;gap:10px}.screen .partner-logos img{height:52px;width:52px}.qrbox{transform:none;background:linear-gradient(145deg,#ff9cde,#c5a2ff);padding:21px;border-radius:20px;box-shadow:0 0 60px #f55bd42b,8px 8px 0 #7b3da029;border:1px solid #ffe0fb}.qrbox img{display:block;background:white;width:100%;border-radius:12px;box-shadow:0 0 0 6px #fff}.qrbox strong{font-family:Outfit;font-size:20px;margin-top:24px}.qrbox p{font-size:11px;color:#4e2857}.screen-controls{margin-top:20px;border-color:#56346966}#toast{background:#ffb3e5;color:#411339;box-shadow:0 7px 40px #0006}.modal{background:#080216bf}button:focus-visible,a:focus-visible{outline-color:#79e5ff}.stage-copy .partners{max-width:400px}.grid .song:active{transform:scale(.98)}
@keyframes beat{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}@keyframes liveGlow{0%,100%{opacity:1}50%{opacity:.5}}@keyframes starTurn{to{transform:rotate(360deg)}}@keyframes float{50%{transform:translateY(-7px) rotate(15deg)}}@keyframes cardIn{from{opacity:.5;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px){.stage-copy{margin-left:38%;padding-left:20px}.stage-copy .partners{font-size:9px}.session-strip>div:first-child{gap:12px}.session-strip>div:first-child p{display:none}.screen{padding-left:28%;grid-template-columns:1fr 260px}.screen h1{font-size:61px}.screen .steps{font-size:9px}.screen .partners{font-size:9px}.session .session-bottom{gap:10px}.equalizer{display:none}}
@media(max-width:800px){.session.session-strip{padding:16px}.session-strip>div:first-child{display:block}.session .tag{margin-bottom:8px}.session h2{font-size:15px}.session .avatars{display:none}.session .session-bottom{flex-direction:column;align-items:flex-end;gap:9px}.section-top h2 span{display:block;margin:7px 0 0}.screen{padding-left:20%;grid-template-columns:1fr 235px}.stage-sticker{bottom:35px;left:22px}.screen h1{font-size:53px}.hero h1{font-size:67px}.partners{gap:10px}}
@media(max-width:650px){header{height:80px;padding:0 16px;gap:7px}.animation-mark{font-size:20px}.animation-mark small{font-size:8px}.brand-sub{display:none}nav{border-color:#62406c;padding:4px}nav button{font-size:10px;padding:10px 8px}main{padding:18px 14px 25px}.hero.stage-hero{border-radius:19px;min-height:0;background-size:auto 310px;background-position:left top;background-color:#0a0625;margin-bottom:13px}.stage-hero:after{background:linear-gradient(180deg,transparent 90px,#0a0625bb 210px,#0a0625 280px);z-index:-1}.stage-copy{margin-left:0;max-width:none;padding:185px 23px 25px}.stage-copy .eyebrow{font-size:8px;letter-spacing:1.3px;justify-content:flex-start}.hero h1{font-size:59px;letter-spacing:-2.5px;margin:15px 0 13px}.hero h1 br{display:none}.hero h1 em{display:block}.title-star{font-size:32px;margin-left:14px}.hero p{font-size:13px;line-height:1.65}.steps{font-size:10px;gap:13px;margin-top:17px}.steps b{width:22px;height:22px;margin-right:5px}.stage-sticker{left:auto;right:16px;top:25px;bottom:auto;padding:16px 11px;font-size:11px;background:#ffd785;box-shadow:0 0 0 4px #ffd38525}.stage-copy .partners{max-width:none;font-size:9px;gap:12px;margin-top:19px}.partner-logos{padding:4px 6px;gap:6px}.partner-logos img{width:37px;height:37px}.partners>span{line-height:1.8;max-width:180px}.session.session-strip{padding:15px;margin-bottom:24px;border-radius:14px}.session .small{font-size:10px}.session-status{font-size:9px}.session h2{font-size:14px}.session .tag{font-size:8px;letter-spacing:1px}.section-top h2{font-size:23px}.section-top h2 span{font-size:10px;line-height:1.5;max-width:210px}.mine{font-size:10px;padding:11px 12px}.search{height:56px;padding:0 13px}.search input{font-size:12px}.filters{flex-wrap:nowrap;overflow-x:auto;gap:8px;margin-right:-14px;padding:17px 14px 20px 0;scroll-padding:14px}.chip{border-radius:12px;padding:10px 12px;font-size:11px;min-height:46px;flex-shrink:0}.chip .genre-icon{font-size:17px}.genre-count{font-size:9px}.grid{gap:10px}.song{min-height:106px;padding:14px}.song-title{font-size:14px}.song .artist{font-size:11px}.cover{width:51px;height:63px}.song-tags{font-size:9px;gap:7px;margin-top:8px}.pick{width:35px;height:35px}.song-genre{max-width:155px}.admin-top h1{font-size:32px}.stat strong{font-size:28px}.stat .small{font-size:9px}.screen{display:flex;flex-direction:column;min-height:0;padding:165px 23px 30px;gap:28px;background-size:auto 320px;background-position:left top;background-color:#090622}.screen:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 70px,#090622cc 230px,#090622 300px);z-index:-1}.screen h1{font-size:58px;margin:18px 0;letter-spacing:-2px}.screen h1 br{display:none}.screen h1 em{display:block}.screen p{font-size:13px}.screen .eyebrow{font-size:8px}.screen .steps{font-size:9px;gap:10px}.screen .partners{flex-direction:row;align-items:center;font-size:9px;margin-top:22px}.screen .partner-logos img{width:40px;height:40px}.qrbox{max-width:270px;width:100%;padding:22px}.qrbox p{font-size:11px}.screen-controls{gap:15px;align-items:flex-start}.screen-controls .primary{font-size:11px;flex-shrink:0}.screen-controls .small{font-size:9px;line-height:1.8}.fullscreen .screen{padding-top:130px;min-height:95dvh}.fullscreen .screen h1{font-size:52px}.dialog{border-radius:20px}.dialog input{font-size:16px}footer{line-height:1.7}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:650px){.stage-copy{padding-top:110px;padding-bottom:20px}.hero.stage-hero{background-size:auto 260px}.hero h1{font-size:47px;margin:13px 0 11px}.stage-copy .partners{margin-top:15px}.stage-copy .partner-logos img{width:32px;height:32px}.stage-copy .steps{margin-top:14px}.stage-sticker{font-size:10px;padding:14px 10px}.stage-copy .title-star{font-size:28px}.stage-copy .eyebrow{font-size:7px}.section-top h2{font-size:22px}}