/* =====================================================================
 *  css/uni_jeu.css — UNITYDOM : 🎮 le réseau social « joué »
 *  stories 24 h · réactions émoji · XP / niveaux / série · défis · classement
 *  battles de sons · suggestions · onglets du fil · animations « +5 XP »
 * ===================================================================== */
/* ---------- niveau à côté des pseudos, barre d'XP ---------- */
.ujx-nv{display:inline-flex;align-items:center;gap:1px;margin-left:4px;padding:1px 6px;border-radius:999px;background:rgba(139,92,246,.18);color:#c4b5fd;font:900 10px Inter,Arial,sans-serif;vertical-align:1px;white-space:nowrap}
.ujx-bar{display:flex;align-items:center;gap:8px;margin-top:4px;text-decoration:none;color:#d1d5db;font:800 11.5px Inter,Arial,sans-serif;max-width:260px}
.ujx-lv{white-space:nowrap;color:#c4b5fd}.ujx-lv b{color:#fff}
.ujx-jauge{position:relative;display:block;flex:1;min-width:60px;height:7px;border-radius:9px;background:rgba(255,255,255,.1);overflow:hidden}
.ujx-jauge i{position:absolute;left:0;top:0;bottom:0;border-radius:9px;background:linear-gradient(90deg,#8b5cf6,#ff6b00);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.ujx-fx{white-space:nowrap;color:#ffb37a}
.ujx-bar.pulse .ujx-jauge i{box-shadow:0 0 12px #ff6b00}
/* ---------- onglets du fil ---------- */
.uff-tabs{position:sticky;top:0;z-index:6;padding:8px 0;margin:4px 0 6px;background:linear-gradient(#09090f 72%,rgba(9,9,15,0))}
.uff-tab-l,.ufs-tabs a.ujx-tab{flex-shrink:0;border:1px solid rgba(255,255,255,.1);background:#14141c;color:#d1d5db;border-radius:999px;padding:8px 14px;font:800 12.5px Inter,Arial,sans-serif;text-decoration:none;white-space:nowrap}
.ufs-tabs a.ujx-tab.on{background:#ff6b00;border-color:#ff6b00;color:#000}.uff-tab-l{margin-left:auto}
/* ---------- 📸 stories ---------- */
.ust-bar{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;padding:6px 2px 10px;margin:4px 0 2px}.ust-bar::-webkit-scrollbar{display:none}
.ust-r{flex-shrink:0;width:72px;border:0;background:none;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:5px;color:#d1d5db;font:800 11px Inter,Arial,sans-serif;position:relative}
.ust-r .ufs-av{box-shadow:0 0 0 2px #09090f,0 0 0 4px #3f3f4f;transition:transform .2s}
.ust-r.neuf .ufs-av{box-shadow:0 0 0 2px #09090f,0 0 0 4px #ff6b00,0 0 18px rgba(255,107,0,.45)}
.ust-r:hover .ufs-av{transform:scale(1.05)}
.ust-r b{max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ust-plus i{position:absolute;top:40px;left:46px;width:22px;height:22px;border-radius:50%;background:#ff6b00;color:#000;font:900 15px/22px Inter,Arial,sans-serif;font-style:normal;border:2px solid #09090f}
.ust-vide{align-self:center;color:#9ca3af;font-size:12.5px;white-space:nowrap}
.ust-v{position:fixed;inset:0;z-index:10000;background:#000;display:flex;justify-content:center;touch-action:none;-webkit-user-select:none;user-select:none}
.ust-v input{-webkit-user-select:text;user-select:text}
.ust-box{position:relative;width:100%;max-width:480px;height:100%;overflow:hidden;background:#000}
@media(min-width:700px){.ust-box{height:calc(100% - 40px);margin-top:20px;border-radius:22px}}
.ust-pg{position:absolute;top:10px;left:10px;right:10px;display:flex;gap:4px;z-index:3}.ust-pg span{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.3);overflow:hidden}.ust-pg i{display:block;height:100%;width:0;background:#fff}
.ust-pg span.ok i{width:100%}
.ust-hd{position:absolute;top:20px;left:10px;right:10px;display:flex;align-items:center;gap:9px;z-index:4;color:#fff;font:800 13.5px Inter,Arial,sans-serif;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.ust-hd small{color:rgba(255,255,255,.75);font-weight:700}.ust-hd .sp{flex:1}
.ust-hd button{border:0;background:rgba(0,0,0,.35);color:#fff;width:36px;height:36px;border-radius:50%;font:900 17px Inter,Arial,sans-serif;cursor:pointer}
.ust-ct{position:absolute;inset:0;display:grid;place-items:center;text-align:center;z-index:1}
.ust-ct.texte{padding:80px 28px;color:#fff;font:900 clamp(22px,6vw,30px)/1.25 Inter,Arial,sans-serif;word-break:break-word;white-space:pre-wrap}
.ust-ct img.ph{width:100%;height:100%;object-fit:contain}
.ust-cap{position:absolute;left:16px;right:16px;bottom:96px;z-index:2;color:#fff;font:800 15px/1.35 Inter,Arial,sans-serif;text-shadow:0 1px 8px rgba(0,0,0,.8);text-align:center;white-space:pre-wrap}
.ust-son{display:flex;flex-direction:column;align-items:center;gap:12px;padding:0 30px;color:#fff}
.ust-son .cv{width:min(68vw,280px);aspect-ratio:1;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#ff6b00,#8b5cf6);display:grid;place-items:center;font-size:60px;box-shadow:0 20px 60px rgba(0,0,0,.6);animation:ustTourne 14s linear infinite paused}
.ust-son .cv img{width:100%;height:100%;object-fit:cover}.ust-v.joue .ust-son .cv{animation-play-state:running;border-radius:50%}
@keyframes ustTourne{to{transform:rotate(360deg)}}
.ust-son b{font:900 20px Inter,Arial,sans-serif}.ust-son small{color:rgba(255,255,255,.7);font-weight:700}
.ust-son button{border:0;border-radius:999px;padding:12px 22px;background:#ff6b00;color:#000;font:900 14px Inter,Arial,sans-serif;cursor:pointer}
.ust-nav{position:absolute;top:70px;bottom:90px;width:34%;z-index:2;background:none;border:0;cursor:pointer}.ust-nav.g{left:0}.ust-nav.d{right:0;width:66%}
.ust-ft{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:12px;display:flex;flex-direction:column;gap:8px;background:linear-gradient(transparent,rgba(0,0,0,.65))}
.ust-re{display:flex;justify-content:center;gap:6px}.ust-re button{border:0;background:rgba(255,255,255,.12);border-radius:50%;width:44px;height:44px;font-size:22px;cursor:pointer;transition:transform .15s}.ust-re button:active,.ust-re button.on{transform:scale(1.25);background:rgba(255,107,0,.4)}
.ust-rep{display:flex;gap:8px}.ust-rep input{flex:1;min-width:0;border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.35);color:#fff;border-radius:999px;padding:11px 14px;font:14px Inter,Arial,sans-serif}.ust-rep button,.ust-vues{border:0;border-radius:999px;padding:10px 14px;background:#fff;color:#000;font:900 13px Inter,Arial,sans-serif;cursor:pointer}
.ust-vues{align-self:center;background:rgba(255,255,255,.15);color:#fff}
.ust-fly{position:absolute;z-index:6;font-size:42px;pointer-events:none;animation:ustFly 1.1s ease-out forwards}@keyframes ustFly{from{opacity:1;transform:translateY(0) scale(.6)}to{opacity:0;transform:translateY(-260px) scale(1.5)}}
.ust-cr .zone{border-radius:18px;min-height:230px;display:grid;place-items:center;padding:20px;color:#fff;font:900 22px/1.3 Inter,Arial,sans-serif;text-align:center;margin-bottom:10px;position:relative;overflow:hidden;background-size:cover;background-position:center}
.ust-cr .zone textarea{background:transparent!important;border:0!important;color:#fff;text-align:center;font:900 22px/1.3 Inter,Arial,sans-serif!important;min-height:120px!important;resize:none;outline:0}
.ust-cr .zone textarea::placeholder{color:rgba(255,255,255,.7)}
.ust-cr .tabs{display:flex;gap:6px;margin-bottom:10px}.ust-cr .tabs button{flex:1;border:1px solid #2a2a38;background:#0d0d14;color:#d1d5db;border-radius:999px;padding:9px;font:800 12.5px Inter,Arial,sans-serif;cursor:pointer}.ust-cr .tabs button.on{background:#ff6b00;color:#000;border-color:#ff6b00}
.ust-cr .fonds{display:flex;gap:8px;margin-bottom:10px}.ust-cr .fonds button{width:32px;height:32px;border-radius:50%;border:2px solid transparent;cursor:pointer}.ust-cr .fonds button.on{border-color:#fff}
.ust-cr .res button{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:0;background:#0d0d14;color:#fff;border-radius:12px;padding:8px;margin-bottom:6px;cursor:pointer;font:700 13px Inter,Arial,sans-serif}.ust-cr .res img,.ust-cr .res span.i{width:38px;height:38px;border-radius:9px;object-fit:cover;background:#23232f;display:grid;place-items:center}
.ust-cr input[type=search],.ust-cr input[type=text]{width:100%;padding:10px 12px;border-radius:12px;border:1px solid #2a2a38;background:#0d0d14;color:#fff;box-sizing:border-box;margin-bottom:8px;font:14px Inter,Arial,sans-serif}
.ust-cr .pub{width:100%;border:0;border-radius:999px;padding:13px;background:#ff6b00;color:#000;font:900 14px Inter,Arial,sans-serif;cursor:pointer}.ust-cr .pub:disabled{opacity:.5}
.ust-cr label.fic{display:block;text-align:center;padding:12px;border-radius:14px;border:1px dashed #3f3f4f;color:#d1d5db;font-weight:800;cursor:pointer;margin-bottom:10px}
.ust-qui{max-height:50vh;overflow:auto}.ust-qui div{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid #23232f;color:#fff;font-weight:700}.ust-qui small{margin-left:auto;color:#9ca3af}
/* ---------- 🔥 réactions ---------- */
.urx-b{flex:0 0 auto!important;min-width:44px;font-size:16px!important;position:relative}.urx-b sup{font-size:10px;color:#9ca3af}.urx-b.on{background:rgba(255,107,0,.12)!important}
.urx-sum{align-self:center;flex:0 0 auto;font:800 12px Inter,Arial,sans-serif;color:#d1d5db;white-space:nowrap;cursor:pointer;padding:0 4px}.urx-sum b{color:#fff}.urx-sum[hidden]{display:none}
.urx-pk{position:absolute;z-index:50;display:flex;gap:2px;padding:6px;border-radius:999px;background:#1d1d29;border:1px solid #2f2f3f;box-shadow:0 12px 34px rgba(0,0,0,.55);animation:urxIn .18s cubic-bezier(.2,.9,.3,1.3)}
.urx-pk button{border:0;background:none;font-size:27px;width:44px;height:44px;border-radius:50%;cursor:pointer;transition:transform .12s}.urx-pk button:hover,.urx-pk button:focus{transform:scale(1.35) translateY(-4px);background:rgba(255,255,255,.06)}.urx-pk button.on{background:rgba(255,107,0,.25)}
@keyframes urxIn{from{opacity:0;transform:translateY(8px) scale(.8)}to{opacity:1;transform:none}}
.urx-pop{animation:urxPop .35s ease}@keyframes urxPop{50%{transform:scale(1.45)}}
/* ---------- 🎮 XP gagnée, niveau supérieur ---------- */
.ujx-toast{position:fixed;right:16px;bottom:150px;z-index:10001;display:flex;flex-direction:column;align-items:flex-end;gap:6px;pointer-events:none}
.ujx-toast span{background:linear-gradient(135deg,#8b5cf6,#ff6b00);color:#fff;font:900 13px Inter,Arial,sans-serif;padding:8px 13px;border-radius:999px;box-shadow:0 10px 26px rgba(0,0,0,.45);animation:ujxIn 2.6s ease forwards}
.ujx-toast span.m{background:#fff;color:#000}
@keyframes ujxIn{0%{opacity:0;transform:translateY(16px) scale(.8)}12%{opacity:1;transform:none}80%{opacity:1}100%{opacity:0;transform:translateY(-24px)}}
.ujx-lvl{position:fixed;inset:0;z-index:10002;display:grid;place-items:center;background:rgba(0,0,0,.7);animation:ujxFond .3s ease}@keyframes ujxFond{from{opacity:0}}
.ujx-lvl>div{text-align:center;padding:28px 26px;border-radius:26px;background:radial-gradient(circle at 50% 0,#3b1d6e,#14141c 70%);border:1px solid #3f2a6b;color:#fff;max-width:320px;animation:ujxBoum .5s cubic-bezier(.2,.9,.3,1.4)}
@keyframes ujxBoum{from{transform:scale(.6);opacity:0}}
.ujx-lvl .e{font-size:64px;line-height:1}.ujx-lvl b{display:block;font:900 26px Unbounded,Inter,sans-serif;margin:8px 0 4px}.ujx-lvl p{color:#d1d5db;margin:0 0 14px}.ujx-lvl button{border:0;border-radius:999px;padding:12px 22px;background:#ff6b00;color:#000;font:900 14px Inter,Arial,sans-serif;cursor:pointer}
.ujx-conf{position:fixed;top:-10px;z-index:10003;width:9px;height:14px;border-radius:2px;animation:ujxTombe 1.8s linear forwards}@keyframes ujxTombe{to{transform:translateY(105vh) rotate(720deg)}}
/* ---------- défis, classement, profil ---------- */
.ujx-carte .ujx-df{display:flex;flex-direction:column;gap:9px}
.ujx-dfi{display:grid;grid-template-columns:1fr auto;gap:5px 10px;align-items:center;font:700 13.5px Inter,Arial,sans-serif;color:#fff}.ujx-dfi b{font-size:12.5px;color:#ffb37a}.ujx-dfi .ujx-jauge{grid-column:1/-1}.ujx-dfi.ok{opacity:.75}.ujx-dfi.ok b{color:#86efac}
.ujx-top{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.ujx-top li{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:14px;background:rgba(255,255,255,.035);font:800 13.5px Inter,Arial,sans-serif}.ujx-top li.moi{background:rgba(255,107,0,.14);outline:1px solid rgba(255,107,0,.4)}
.ujx-top li a{color:#fff;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.ujx-top li b{margin-left:auto;color:#ffb37a;white-space:nowrap}.ujx-top li small{color:#9ca3af}
.ujx-rg{width:26px;text-align:center;font-size:15px;color:#9ca3af;flex-shrink:0}
.ujx-moi{margin:10px 2px 0;color:#d1d5db;font-size:13px}.ujx-moi b{color:#fff}
.ujx-pro{margin:18px 0 6px;padding:16px;border-radius:22px;background:linear-gradient(135deg,rgba(139,92,246,.16),rgba(255,107,0,.1));border:1px solid rgba(139,92,246,.3)}
.ujx-pro-h{display:flex;gap:14px;align-items:center}.ujx-big{position:relative;flex-shrink:0;width:64px;height:64px;border-radius:20px;background:#14141c;display:grid;place-items:center;font-size:30px;border:1px solid rgba(255,255,255,.1)}
.ujx-big b{position:absolute;right:-6px;bottom:-6px;min-width:26px;height:26px;padding:0 6px;border-radius:999px;background:#8b5cf6;color:#fff;font:900 13px/26px Inter,Arial,sans-serif;text-align:center;border:2px solid #09090f}
.ujx-pro-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.ujx-pro-t>b{color:#fff;font:900 15px Inter,Arial,sans-serif}.ujx-pro-t small{color:#9ca3af;font-weight:700;font-size:11.5px}
.ujx-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.ujx-chips span{padding:6px 11px;border-radius:999px;background:rgba(0,0,0,.3);color:#d1d5db;font:700 12px Inter,Arial,sans-serif}.ujx-chips b{color:#fff}
.ujx-bdg{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-top:12px}.ujx-bdg::-webkit-scrollbar{display:none}
.ujx-bdg span{flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:3px;width:78px;padding:9px 4px;border-radius:16px;background:rgba(0,0,0,.3);font-size:24px;text-align:center}.ujx-bdg small{font:800 9.5px/1.2 Inter,Arial,sans-serif;color:#d1d5db}
.ujx-bdg-all{flex-wrap:wrap;overflow:visible}.ujx-bdg span.non{opacity:.45;filter:grayscale(1)}
table.ujx-tab{width:100%;border-collapse:collapse;margin-top:6px}.ujx-tab td{padding:8px 4px;border-bottom:1px solid rgba(255,255,255,.06);color:#d1d5db;font-size:13px}.ujx-tab b{color:#86efac}
/* ---------- 👥 suggestions ---------- */
.ujx-sg{background:#14141c;border:1px solid rgba(255,255,255,.07);border-radius:20px;padding:14px;margin-bottom:12px}.ujx-sg-t{display:block;color:#fff;font-size:14px;margin-bottom:10px}
.ujx-sg-l{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}.ujx-sg-l::-webkit-scrollbar{display:none}
.ujx-sg-i{flex-shrink:0;width:138px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:12px 8px;border-radius:16px;background:#0d0d14;border:1px solid #23232f}
.ujx-sg-i a{color:#fff;font-weight:900;text-decoration:none;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ujx-sg-i small{color:#9ca3af;font-size:11px;line-height:1.3;min-height:28px}.ujx-sg-i .uff-go{margin:4px 0 0}
.ujx-par{display:flex;align-items:center;gap:6px}.ujx-pile{display:inline-flex}.ujx-pile .ufs-av{margin-right:-7px;box-shadow:0 0 0 2px #14141c}.ujx-pile .ufs-av:last-child{margin-right:4px}
.uff-go.ok{background:rgba(34,197,94,.15);color:#86efac}
/* ---------- ⚔️ battles ---------- */
.ubt{background:radial-gradient(circle at 50% 0,rgba(255,107,0,.16),#14141c 60%);border-color:rgba(255,107,0,.3)}
.ubt-duo{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:start;margin-top:10px}
.ubt-c{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;min-width:0;padding:8px;border-radius:18px;transition:background .3s}
.ubt-c.moi{background:rgba(255,107,0,.12);outline:1px solid rgba(255,107,0,.45)}.ubt-c.win{background:rgba(250,204,21,.1);outline:1px solid rgba(250,204,21,.45)}
.ubt-cov{position:relative;width:100%;max-width:150px;aspect-ratio:1;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,#ff6b00,#8b5cf6);display:grid;place-items:center;text-decoration:none;font-size:40px}
.ubt-cov img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ubt-cov i{font-style:normal}
.ubt-cov em{position:absolute;right:7px;bottom:7px;width:34px;height:34px;border-radius:50%;background:#ff6b00;color:#000;display:grid;place-items:center;font:900 13px Inter,Arial,sans-serif;font-style:normal;box-shadow:0 4px 14px rgba(0,0,0,.5)}
.ubt-cr{position:absolute;top:6px;left:6px;font-size:26px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.ubt-t{color:#fff;font:900 14px Inter,Arial,sans-serif;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ubt-c small{color:#9ca3af;font-weight:700;font-size:12px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ubt-vs{align-self:center;margin-top:-30px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#000;color:#ff6b00;font:900 14px Unbounded,Inter,sans-serif;border:2px solid #ff6b00;box-shadow:0 0 22px rgba(255,107,0,.5)}
.ubt-v{border:0;border-radius:999px;padding:10px 18px;background:#ff6b00;color:#000;font:900 13px Inter,Arial,sans-serif;cursor:pointer;margin-top:4px;transition:transform .15s}.ubt-v:active{transform:scale(.94)}
.ubt-p{position:relative;display:block;width:100%;height:26px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:4px}.ubt-p i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,#8b5cf6,#ff6b00);transition:width .8s cubic-bezier(.2,.8,.2,1)}
.ubt-p b{position:relative;display:block;color:#fff;font:900 12.5px/26px Inter,Arial,sans-serif}
.ubt-msg{margin:8px 0 0;text-align:center;color:#d1d5db;font-size:12.5px;font-weight:700}
.ubt-bas{display:flex;gap:4px;margin-top:10px;border-top:1px solid rgba(255,255,255,.06);padding-top:6px}.ubt-bas .ufs-b{text-align:center;text-decoration:none}
@media(prefers-reduced-motion:reduce){.ujx-toast span,.urx-pk,.ujx-lvl>div,.ust-fly,.ujx-conf{animation:none}.ust-son .cv{animation:none}}
/* ---------- 🧠 IA du fil : FOMO ---------- */
.ufi-fomo{display:flex;align-items:center;gap:6px;margin:-2px 2px 10px;padding-bottom:9px;border-bottom:1px solid rgba(255,255,255,.06);color:#ffb37a;font:800 12.5px Inter,Arial,sans-serif}.ufi-fomo b{color:#fff}
/* ---------- 📸 stories : musique, en-tête transparent ---------- */
.ust-v{z-index:2147483000!important;background:#000}
.ust-flou{position:absolute;inset:-60px;background-size:cover!important;background-position:center!important;filter:blur(40px) brightness(.55);transform:scale(1.1)}
.ust-box{background:transparent}.ust-hd{top:calc(20px + env(safe-area-inset-top))}.ust-pg{top:calc(10px + env(safe-area-inset-top))}
.ust-hd button{background:transparent!important;width:38px;height:38px;font-size:19px;text-shadow:0 1px 8px rgba(0,0,0,.7)}
.ust-son b{color:#fff!important;text-shadow:0 2px 12px rgba(0,0,0,.6)}.ust-son small{color:rgba(255,255,255,.85)!important}
.ust-musk{position:absolute;z-index:3;left:12px;top:calc(68px + env(safe-area-inset-top));max-width:calc(100% - 24px);display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;background:rgba(0,0,0,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:700 12.5px Inter,Arial,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ust-musk.z{top:auto;bottom:12px;left:12px}.ust-musk[hidden]{display:none}
.ust-eq{display:inline-flex;align-items:flex-end;gap:2px;height:12px;flex-shrink:0}.ust-eq i{width:3px;background:#ff9a4d;border-radius:2px;height:4px}
.ust-v.joue .ust-eq i,.ust-cr .ust-eq i{animation:ustEq .9s ease-in-out infinite}.ust-eq i:nth-child(2){animation-delay:.25s}.ust-eq i:nth-child(3){animation-delay:.5s}
@keyframes ustEq{0%,100%{height:3px}50%{height:12px}}
.ust-cr .zone .ph{display:block}
.ust-addmus{width:100%;border:1px dashed #3f3f4f;background:#0d0d14;color:#fff;border-radius:14px;padding:11px;font:800 13px Inter,Arial,sans-serif;cursor:pointer;margin-bottom:10px}.ust-addmus[hidden]{display:none}
.ust-ext{background:#0d0d14;border:1px solid #2a2a38;border-radius:14px;padding:10px 12px;margin-bottom:10px;color:#d1d5db;font:700 12.5px Inter,Arial,sans-serif}
.ust-ext-t{display:flex;align-items:center;gap:6px;margin-bottom:6px;color:#fff}.ust-ext-t b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ust-ext-t .x{border:0;background:rgba(255,255,255,.1);color:#fff;width:26px;height:26px;border-radius:50%;cursor:pointer}
.ust-ext label{display:block}.ust-ext output{color:#ffb37a}.ust-ext input[type=range]{width:100%;accent-color:#ff6b00;margin:6px 0}
.ust-ecoute{border:0;border-radius:999px;padding:8px 14px;background:rgba(255,255,255,.1);color:#fff;font:800 12.5px Inter,Arial,sans-serif;cursor:pointer}.ust-ecoute.on{background:#ff6b00;color:#000}
/* ---------- 📃 playlists : mosaïque · ➕ ajouter à une playlist ---------- */
.ufs-mos{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;z-index:1}.ufs-mos img{position:static!important;width:100%;height:100%;object-fit:cover}
.ufs-b.ufs-pl{flex:0 0 auto;min-width:44px}
/* ---------- ✨ « Pour toi » (page d'un son) ---------- */
.upt{margin:26px 0 10px}.upt-t{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}.upt-t h2{margin:0;font:900 20px Unbounded,Inter,sans-serif;color:#fff}.upt-t span{color:#9ca3af;font-size:12.5px;font-weight:700}
.upt-l{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.upt-i{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;padding:8px;border-radius:16px;background:#14141c;border:1px solid rgba(255,255,255,.06)}.upt-i[hidden]{display:none}
.upt-cov{position:relative;width:64px;height:64px;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,#ff6b00,#8b5cf6);text-decoration:none}
.upt-cov img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}.upt-cov i{font-style:normal;font-size:24px}
.upt-cov em{position:absolute;z-index:2;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.35);color:#fff;font-style:normal;font-size:18px;opacity:0;transition:opacity .15s}.upt-cov:hover em,.upt-cov.uni-en-lecture em{opacity:1}
.upt-x{min-width:0;display:flex;flex-direction:column;gap:2px}.upt-ti{color:#fff;font:900 14.5px Inter,Arial,sans-serif;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.upt-ar{color:#9ca3af;font-size:12.5px;text-decoration:none;font-weight:700}
.upt-b{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}.upt-bd{font:800 10.5px Inter,Arial,sans-serif;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.07);color:#e5e7eb;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.upt-bd.live{background:rgba(255,0,85,.18);color:#ff8fab}.upt-bd.ami{background:rgba(236,72,153,.16);color:#f9a8d4}.upt-bd.top{background:rgba(250,204,21,.14);color:#fde68a}.upt-bd.feu{background:rgba(255,107,0,.16);color:#ffb37a}.upt-bd.neuf{background:rgba(34,197,94,.14);color:#86efac}.upt-bd.reco{background:rgba(139,92,246,.16);color:#c4b5fd}
.upt-bar{margin:0!important;border:0!important;padding:0!important;gap:2px}.upt-bar .ufs-b{flex:0 0 auto;padding:8px 6px}
.upt-plus{display:block;margin:12px auto 0}
/* ---------- 📣 pubs · 🎤 riddims · 🎛️ studios dans le fil ---------- */
.ufc-pub{border-color:rgba(255,107,0,.25)}.ufc-pub-t{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.ufc-pub-t span{font:900 11px Inter,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:999px;background:rgba(255,107,0,.18);color:#ffb37a}.ufc-pub-t small{color:#6b7280;font-weight:700;font-size:11px}
.ufc-pub-i{display:block;border-radius:16px;overflow:hidden;background:#000;margin-bottom:10px}.ufc-pub-i img{display:block;width:100%;max-height:520px;object-fit:cover}
.ufc-pub-ti{display:block;color:#fff;font:900 17px Inter,Arial,sans-serif}.ufc-pub-x{margin:6px 0 0;color:#d1d5db;font-size:14px;line-height:1.5}
.ufc-l{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-top:10px;padding-bottom:2px}.ufc-l::-webkit-scrollbar{display:none}
.ufc-c{flex:0 0 156px;scroll-snap-align:start;display:flex;flex-direction:column;gap:3px;text-decoration:none;color:#d1d5db;font-size:12px}
.ufc-im{position:relative;width:156px;height:156px;border-radius:16px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,#ff6b00,#000);font-size:42px;margin-bottom:4px}.ufc-im.st{background:linear-gradient(135deg,#0ea5e9,#111827)}
.ufc-im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}.ufc-im i{font-style:normal}.ufc-v{position:absolute;z-index:2;left:8px;top:8px;padding:3px 8px;border-radius:999px;background:#facc15;color:#000;font:900 10px Inter,Arial,sans-serif}
.ufc-c b{color:#fff;font:900 13.5px Inter,Arial,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ufc-c small{color:#9ca3af;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ufc-c .uff-cd{font-size:13px}.ufc-ok{color:#86efac;font-weight:800}.ufc-c em{font-style:normal;margin-top:4px;align-self:flex-start;padding:7px 11px;border-radius:999px;background:#ff6b00;color:#000;font:900 11.5px Inter,Arial,sans-serif}
/* ---------- 👀 visiteurs ---------- */
.uff-vis{align-items:center;flex-wrap:wrap;row-gap:10px}.uff-vis .t{flex:1 1 170px;min-width:170px}.uff-vis .t b{white-space:normal}.uff-vis-l{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;font-size:24px;background:linear-gradient(135deg,#ff6b00,#8b5cf6);flex-shrink:0}
.uff-vis .uff-go{margin-left:0;padding:9px 13px;font-size:12.5px}
.uff-join{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:10px 0;padding:14px 16px;border-radius:20px;background:linear-gradient(135deg,rgba(255,107,0,.16),rgba(139,92,246,.14));border:1px solid rgba(255,107,0,.3)}
.uff-join b{color:#fff;font:900 15px Inter,Arial,sans-serif}.uff-join span{color:#d1d5db;font-size:13px}
.ust-rejoindre{align-self:center;padding:12px 18px;border-radius:999px;background:#ff6b00;color:#000;font:900 13.5px Inter,Arial,sans-serif;text-decoration:none}
.ufc-offre{background:radial-gradient(circle at 100% 0,rgba(139,92,246,.22),#14141c 60%);border-color:rgba(139,92,246,.35)}
.ufc-of{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-top:10px}.ufc-of::-webkit-scrollbar{display:none}
.ufc-of-i{flex:0 0 132px;display:flex;flex-direction:column;gap:3px;padding:12px;border-radius:16px;background:#0d0d14;border:1px solid var(--c,#ff6b00);text-decoration:none;color:#d1d5db;font-size:12px}
.ufc-of-i b{color:#fff;font:900 14px Inter,Arial,sans-serif}.ufc-of-i em{font-style:normal;color:var(--c,#ff6b00);font:900 16px Inter,Arial,sans-serif;margin-top:4px}
.uff-vis-b{display:flex;gap:8px;flex-shrink:0}
/* 🔮 Flair : le jeu des dénicheurs */
.uff-bd.flair{border:1px solid rgba(167,139,250,.5);background:rgba(139,92,246,.18);color:#ddd6fe;cursor:pointer}
.uff-bd.flair.on,.uff-bd.flair:disabled{opacity:.8;cursor:default;background:rgba(139,92,246,.3)}
.ufl-carte{background:radial-gradient(circle at 0 0,rgba(139,92,246,.22),rgba(20,20,28,.95) 60%);border:1px solid rgba(139,92,246,.35)}
.ufl-j{letter-spacing:1px}.ufl-j i{opacity:.25;font-style:normal}
.ufl-p{margin:4px 0 10px;color:#d1d5db;font:600 13px/1.45 Inter,Arial,sans-serif}.ufl-p b{color:#fff}
.ufl-l{display:flex;flex-direction:column;gap:8px}
.ufl-i{display:flex;align-items:center;gap:10px;padding:8px;border-radius:16px;background:rgba(255,255,255,.04)}
.ufl-cov{position:relative;width:54px;height:54px;border-radius:12px;overflow:hidden;flex-shrink:0;display:grid;place-items:center;background:linear-gradient(135deg,#8b5cf6,#ff6b00);text-decoration:none;color:#fff}
.ufl-cov img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ufl-cov i{font-style:normal;font-size:20px}.ufl-cov em{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;background:rgba(0,0,0,.35);opacity:0;transition:opacity .15s}.ufl-cov:hover em{opacity:1}
.ufl-x{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.ufl-x b{font:900 13.5px Inter,Arial,sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ufl-x span{font:600 12px Inter,Arial,sans-serif;color:#9ca3af;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ufl-x small{font:800 11px Inter,Arial,sans-serif;color:#c4b5fd}
.ufl-b{flex-shrink:0;border:0;border-radius:999px;padding:9px 13px;font:900 12.5px Inter,Arial,sans-serif;cursor:pointer;background:linear-gradient(135deg,#8b5cf6,#6d28d9);color:#fff;box-shadow:0 6px 18px rgba(139,92,246,.35)}
.ufl-b.on{background:rgba(255,255,255,.1);box-shadow:none;color:#c4b5fd}.ufl-b:disabled{cursor:default;opacity:.85}
.ufl-tt{display:flex;align-items:center;gap:12px;margin:4px 0}.ufl-tt .e{font-size:40px}.ufl-tt b{display:block;font:900 18px Unbounded,Inter,sans-serif;color:#fff}.ufl-tt small{color:#c4b5fd;font:700 12.5px Inter,Arial,sans-serif}
.ufl-ls{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.ufl-ls li{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.035);font:700 13px Inter,Arial,sans-serif}
.ufl-ls li a{color:#fff;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ufl-ls li small{grid-column:1;color:#9ca3af;font-size:11.5px}.ufl-ls li b{grid-column:2;grid-row:1;color:#c4b5fd;text-align:right}.ufl-cd{grid-column:2;grid-row:2;font-size:11.5px;color:#9ca3af;text-align:right}

