/* Flashs des médias : carte, bulle flottante (ordinateur), message (téléphone), bloc « Médias ».
   La carte prend la police et la couleur du média ; tout le reste (boutons, heure) garde la police du site. */
.fl-logo{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background-size:cover;background-position:center;font:800 16px/1 'DM Sans',system-ui,sans-serif;flex:none}
.flc{--mc:#5b3df5;--mcon:#fff;position:relative;display:block;text-align:left;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:18px;overflow:hidden;line-height:1.45;font-size:15px}
.flc::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--mc)}
.flc .fl-hd{display:flex;align-items:center;gap:10px;padding:13px 14px 0 19px}
.flc .fl-who{min-width:0;flex:1;display:flex;flex-direction:column;gap:1px}
.flc .fl-nm{display:flex;align-items:center;min-width:0;font-size:15px;font-weight:700;line-height:1.2}.flc .fl-nt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.flc .fl-meta{display:flex;align-items:center;gap:7px;font:500 12px/1.2 'DM Sans',system-ui,sans-serif;color:var(--mute)}
.flc .fl-tag{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;font-weight:700;font-size:11.5px;letter-spacing:.01em;background:var(--mc);color:var(--mcon)}
.flc.lv-urgent .fl-tag{background:#e5484d;color:#fff}
.flc.lv-urgent .fl-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:#fff;animation:flblink 1.2s ease-in-out infinite}
.flc.lv-urgent{border-color:color-mix(in srgb,#e5484d 55%,var(--line))}
.flc.lv-urgent::before{background:#e5484d}
.flc .fl-bd{padding:9px 16px 14px 19px}
.flc .fl-h{font-size:1.2em;font-weight:700;line-height:1.22;letter-spacing:-.005em;margin:0 0 5px;overflow-wrap:anywhere}
.flc .fl-t{margin:0;overflow-wrap:anywhere;white-space:normal}
.flc .fl-b{font-weight:700}.flc .fl-i{font-style:italic}.flc .fl-s-1{font-size:.84em}.flc .fl-s1{font-size:1.3em;line-height:1.25}.flc .fl-s2{font-size:1.7em;line-height:1.15}
.flc .fl-lkw{padding:0 16px 13px 19px;flex:none}
.flc .fl-lk{display:inline-flex;align-items:center;gap:6px;margin-top:2px;padding:0 0 2px;border-bottom:2px solid var(--mc);color:var(--ink);font:600 13.5px/1.3 'DM Sans',system-ui,sans-serif;text-decoration:none}
.flc a.fl-lk:hover{background:color-mix(in srgb,var(--mc) 12%,transparent)}
.flc .fl-x{width:30px;height:30px;display:grid;place-items:center;border:0;border-radius:50%;background:none;color:var(--mute);padding:0;margin:-4px -4px 0 0}.flc .fl-x:hover{background:var(--bg);color:var(--ink)}
.flc .fl-ft{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0 14px 13px 19px;font-family:'DM Sans',system-ui,sans-serif}
.flc .fl-go,.flc .fl-mt{display:inline-flex;align-items:center;gap:7px;border-radius:999px;font:600 13.5px/1 'DM Sans',system-ui,sans-serif;padding:9px 14px;border:1px solid var(--line);background:none;color:var(--ink)}
.flc .fl-go{background:var(--mc);border-color:var(--mc);color:var(--mcon)}.flc .fl-go:hover:not(:disabled){filter:brightness(1.06)}
.flc .fl-mt{color:var(--mute);font-weight:500;padding:9px 10px;border-color:transparent}.flc .fl-mt:hover:not(:disabled){color:var(--ink);background:var(--bg)}
.flc button:disabled{cursor:default;opacity:.85}
@keyframes flblink{50%{opacity:.25}}

/* ---------- fil d'un média (panneau latéral) ---------- */
.flc.m-feed{flex:none;margin:0 0 12px;cursor:pointer;transition:transform .15s,box-shadow .15s}.flc.m-feed:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(20,10,60,.1)}
.flc.m-feed .fl-ft{padding-top:0;color:var(--mute);font-size:13px}.flc.m-feed .fl-cnt{font:500 12.5px/1.2 'DM Sans',system-ui,sans-serif;color:var(--mute);margin-right:auto}

/* ---------- ordinateur : bulle flottante ---------- */
.fl-dock{position:fixed;z-index:47;right:24px;bottom:92px;display:flex;flex-direction:column;align-items:flex-end;gap:14px;pointer-events:none}
.flb{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:12px;pointer-events:auto;opacity:0;transform:translateY(16px) scale(.55);transform-origin:100% 100%}
.flb.in{opacity:1;transform:none;transition:transform .5s cubic-bezier(.2,1.35,.3,1),opacity .25s}
.flb.out{opacity:0;transform:translateX(30px) scale(.6);transition:transform .26s ease-in,opacity .24s}
.flb-btn{position:relative;width:58px;height:58px;padding:0;border:0;border-radius:50%;background:none;cursor:pointer;box-shadow:0 0 0 3px var(--card),0 0 0 6px var(--mc),0 12px 28px rgba(20,10,60,.3);transition:transform .18s}
.flb-btn:hover{transform:scale(1.06)}
.flb-btn .flb-lg{width:58px;height:58px;font-size:23px}
.flb-btn::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--mc);opacity:0;pointer-events:none}
.flb.in:not(.open) .flb-btn::after{animation:flring 2.6s ease-out 2}
.flb.lv-urgent .flb-btn{box-shadow:0 0 0 3px var(--card),0 0 0 6px #e5484d,0 12px 28px rgba(229,72,77,.4)}
.flb.lv-urgent .flb-btn::after{border-color:#e5484d}
.flb.lv-urgent.in:not(.open) .flb-btn::after{animation:flring 1.5s ease-out infinite}
@keyframes flring{0%{transform:scale(.92);opacity:.7}100%{transform:scale(1.55);opacity:0}}
.flb-tz{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;padding:0;border-radius:999px;background:var(--ink);color:var(--bg);font:500 13.5px/1.2 'DM Sans',system-ui,sans-serif;box-shadow:0 8px 22px rgba(20,10,60,.28);transition:max-width .45s cubic-bezier(.2,.9,.3,1),opacity .3s,padding .3s;display:flex;align-items:center;gap:8px;pointer-events:none}
.flb-tz b{font-weight:700;flex:none}.flb-tz span{overflow:hidden;text-overflow:ellipsis;opacity:.9}
.flb.tz:not(.open) .flb-tz{max-width:300px;opacity:1;padding:11px 16px;pointer-events:auto}
.flb-card{display:none;flex-direction:column;position:absolute;right:0;bottom:calc(100% + 14px);width:min(370px,calc(100vw - 48px));max-height:min(72vh,540px);overflow:hidden;box-shadow:0 20px 56px rgba(20,10,60,.34);transform-origin:100% 100%}
.flb-card .fl-bd{overflow:auto;min-height:0;flex:0 1 auto}.flb-card .fl-hd,.flb-card .fl-lkw,.flb-card .fl-ft{flex:none}
.flb.open .flb-card{display:flex;animation:flcpop .25s cubic-bezier(.2,1.1,.3,1)}
@keyframes flcpop{from{opacity:0;transform:translateY(10px) scale(.94)}}
.flb-x{position:absolute;right:-6px;top:-10px;width:22px;height:22px;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--card);color:var(--mute);opacity:0;transition:opacity .15s;cursor:pointer}
.flb:hover .flb-x,.flb-x:focus-visible,.flb:focus-within .flb-x{opacity:1}.flb.open .flb-x{display:none}

/* ---------- téléphone : message en haut de l'écran ---------- */
.flt{position:fixed;z-index:93;left:10px;right:10px;top:calc(env(safe-area-inset-top) + 10px);transform:translateY(-140%);opacity:0;transition:transform .34s cubic-bezier(.2,.95,.3,1.1),opacity .25s;touch-action:pan-x;max-width:560px;margin:0 auto}
.flt.in{transform:none;opacity:1}.flt.out{transform:translateY(-140%);opacity:0}.flt.hold{transition:none}
.flt .flc{box-shadow:0 16px 40px rgba(20,10,60,.35)}
.flt .fl-t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px}
.flt .flc{border-radius:16px;font-size:14px}.flt .fl-hd{padding:10px 12px 0 16px;gap:9px}.flt .fl-nm{font-size:14px}.flt .fl-hd .fl-logo{width:30px;height:30px;font-size:13px}
.flt .fl-bd{padding:5px 14px 8px 16px}.flt .fl-h{font-size:1.1em;margin-bottom:3px}.flt .fl-ft{padding:0 12px 11px 16px}.flt .fl-go{padding:7px 12px;font-size:13px}
.flt .fl-bd{padding-bottom:6px}.flt .fl-lkw{padding:0 14px 8px 16px}.flt .fl-lk{font-size:12.5px;margin-top:0}
.flt-more{position:absolute;right:46px;top:14px;font:600 11.5px/1 'DM Sans',system-ui,sans-serif;color:var(--mute)}
.flt-pg{position:absolute;left:19px;right:14px;bottom:5px;height:3px;border-radius:3px;background:var(--mc);transform-origin:0 50%;animation:fltpg var(--ms,9s) linear forwards;opacity:.55;pointer-events:none}
.flt.lv-urgent .flt-pg{background:#e5484d}.flt.hold .flt-pg{animation-play-state:paused}
@keyframes fltpg{to{transform:scaleX(0)}}
@media (max-width:760px){.fl-dock{display:none}}
@media (min-width:761px){.flt{display:none}}
html[data-motion=off] .flb,html[data-motion=off] .flt{transition:none!important}
@media (prefers-reduced-motion:reduce){.flb,.flt{transition:none!important}.flb-btn::after,.flc.lv-urgent .fl-tag::before,.flt-pg{animation:none!important}}

/* ---------- bloc « Médias » (sous les tendances) ---------- */

/* ---------- bouton « Studio » dans l'espace d'un média ---------- */
.pstudio{display:flex;flex-direction:column;gap:2px;margin:10px 14px 14px;padding:14px 16px;border-radius:16px;background:linear-gradient(135deg,var(--v),var(--p));color:#fff;text-decoration:none}
.pstudio.hid{display:none}.pstudio b{font-size:15px}.pstudio span{font-size:13px;opacity:.92}.pstudio:hover{filter:brightness(1.07)}

/* Médias sur l'accueil : pastilles sur une ligne, alignées avec Tendances */
.mdesk{display:block}
/* la rangée des titres d'un média (à l'horizontale, sous le bandeau) */
.mdlh{display:flex;align-items:center;gap:12px;padding:6px 2px 2px;font:700 13px/1.2 'DM Sans',system-ui,sans-serif;color:var(--ink)}
.mdlh b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mdlh button{flex:none;border:0;background:none;padding:6px 2px;color:var(--mute);font:600 12.5px/1 'DM Sans',system-ui,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.mdlist{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;padding:6px 2px 10px;margin:0 -2px;scrollbar-width:none}
.mdlist::-webkit-scrollbar{display:none}
.mdli{flex:none;scroll-snap-align:start;width:min(250px,72vw);min-height:78px;display:flex;align-items:center;padding:12px 14px;text-align:left;border:1px solid var(--line);border-left:4px solid var(--mc,#5b3df5);border-radius:14px;background:var(--card);color:var(--ink);font:600 14px/1.3 'DM Sans',system-ui,sans-serif;cursor:pointer}
.mdli span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mdli:hover{border-color:color-mix(in srgb,var(--mc,#5b3df5) 55%,var(--line));border-left-color:var(--mc,#5b3df5)}
.mdli:focus-visible,.mdlh button:focus-visible{outline:3px solid color-mix(in srgb,var(--mc,#5b3df5) 55%,transparent);outline-offset:2px}
.mdl-empty{margin:0;padding:10px 2px;font:500 13px/1.3 'DM Sans',system-ui,sans-serif;color:var(--mute)}
.mdesk .mdrow{display:flex;align-items:center;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;padding:4px 2px 8px;margin:0 -2px;scrollbar-width:none}
.mdesk .mdrow::-webkit-scrollbar{display:none}
.mdesk .mhd{flex:none;font:700 13px/1 'DM Sans',system-ui,sans-serif;color:var(--ink);padding:0 4px 0 0;letter-spacing:.01em}
.mcard{--mc:#5b3df5;--mcon:#fff;position:relative;flex:none;scroll-snap-align:start;display:flex;align-items:center;gap:10px;max-width:min(330px,82vw);text-align:left;padding:5px 16px 5px 5px;border:1px solid var(--line);border-radius:999px;background:var(--card,#fff);color:var(--ink);cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s}
.mcard:hover{box-shadow:0 6px 18px rgba(20,10,60,.10);border-color:color-mix(in srgb,var(--mc) 55%,var(--line))}
.mcard:focus-visible{outline:3px solid color-mix(in srgb,var(--mc) 55%,transparent);outline-offset:2px}
.mcard .fl-logo{flex:none;width:36px;height:36px;font-size:15px;box-shadow:0 0 0 2px var(--card,#fff),0 0 0 4px var(--mc)}
.mcard .mc-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.mcard .mc-nm{font-weight:700;font-size:14px;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mcard .mc-h{font:500 12.5px/1.2 'DM Sans',system-ui,sans-serif;color:var(--mute);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}
.mcard .mc-h.none{opacity:.8}
.mcard .mc-dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--mc);animation:mcpulse 1.8s ease-in-out infinite}
.mcard.u .mc-dot{background:#e5484d}
.mcard.hot{border-color:color-mix(in srgb,var(--mc) 40%,var(--line))}
.mcard.hot .mc-h{color:var(--ink)}
@keyframes mcpulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--mc) 55%,transparent)}50%{box-shadow:0 0 0 6px transparent}}
@media (prefers-reduced-motion:reduce){.mcard .mc-dot{animation:none}.mcard{transition:none}}
#prsec.mdesk-on{padding:2px 20px 4px}
@media (max-width:760px){#prsec.mdesk-on{padding:2px 14px 4px}}

/* ---------- étoile de certification d'un média (logo au centre) ---------- */
.mmark{display:inline-flex;align-items:center;gap:.28em;flex:none;vertical-align:middle;margin-left:6px;line-height:1;height:var(--ms)}
.mmark i{display:grid;place-items:center;width:var(--ms);height:var(--ms);border-radius:30%;font-style:normal}
.mmark .mlogo{background:#fff center/cover no-repeat;box-shadow:0 0 0 1px rgba(30,20,70,.16)}
.mmark .mbd{background:var(--mc);color:var(--mcon)}.mmark .mbd svg{width:78%;height:78%}
.fl-dock{transition:right .25s}
@media (min-width:761px){body:has(#side.on) .fl-dock{right:428px}}

/* ---------- bloc « Médias » : icône + pastilles ---------- */
.mdesk .mhd{display:flex;align-items:center;gap:9px;padding:0 6px 0 0}
.mdic{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:#fff;background:linear-gradient(135deg,#5b3df5,#dc3d93);box-shadow:0 6px 16px rgba(91,61,245,.28);flex:none}
.mdesk .mhd b{font:700 13px/1.15 'DM Sans',system-ui,sans-serif}
.mcard .mc-nm{display:flex;align-items:center;gap:0}.mcard .mc-nt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.mcard .mc-live{flex:none;margin-left:8px;padding:2px 7px;border-radius:999px;background:#e5484d;color:#fff;font:700 10.5px/1.3 'DM Sans',system-ui,sans-serif;font-style:normal;letter-spacing:.02em;animation:mcpulse 1.4s ease-in-out infinite}
.mcard .mc-l{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:opacity .26s,transform .26s}
.mcard .mc-l.out{opacity:0;transform:translateX(-6px)}
.mcard.live{border-color:#e5484d}
@media (prefers-reduced-motion:reduce){.mcard .mc-l{transition:none}.mcard .mc-live{animation:none}}

/* ---------- en-tête du fil d'un média (panneau latéral) ---------- */
.mdh{flex:none;margin:0 0 14px;padding:14px 14px 14px 18px;border:1px solid var(--line);border-radius:18px;background:var(--card);position:relative;overflow:hidden}
.mdh::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--mc,#5b3df5)}
.mh-top{display:flex;align-items:center;gap:12px}.mh-lg{width:52px;height:52px;font-size:21px;box-shadow:0 0 0 3px var(--card),0 0 0 5px var(--mc,#5b3df5)}
.mh-tx{min-width:0;display:flex;flex-direction:column;gap:2px}.mh-nm{display:flex;align-items:center;font-size:17px;line-height:1.2}.mh-nm .mmark{margin-left:6px}
.mh-tx small{color:var(--mute);font:500 12.5px/1.3 'DM Sans',system-ui,sans-serif}.mh-fol{font-weight:600!important}
.mfol{margin-top:12px;padding:9px 18px;border-radius:999px;border:1px solid var(--mc,#5b3df5);background:var(--mc,#5b3df5);color:var(--mcon,#fff);font:700 13.5px/1 'DM Sans',system-ui,sans-serif;cursor:pointer}
.mfol.on{background:none;color:var(--ink);border-color:var(--line)}.mfol:hover:not(:disabled){filter:brightness(1.06)}
.mh-live{margin-top:12px;padding:12px;border-radius:14px;background:color-mix(in srgb,#e5484d 9%,var(--card));border:1px solid color-mix(in srgb,#e5484d 40%,var(--line));display:flex;flex-direction:column;gap:8px}
.mh-lt{align-self:flex-start;padding:2px 9px;border-radius:999px;background:#e5484d;color:#fff;font:700 11px/1.4 'DM Sans',system-ui,sans-serif;animation:mcpulse 1.4s ease-in-out infinite}
.mh-lb{display:flex;gap:8px;flex-wrap:wrap}.mh-play,.mh-talk{padding:9px 14px;border-radius:999px;border:1px solid #e5484d;font:700 13px/1 'DM Sans',system-ui,sans-serif;cursor:pointer}
.mh-play{background:#e5484d;color:#fff}.mh-talk{background:none;color:var(--ink)}
.mh-fr{width:100%;aspect-ratio:16/9;border:0;border-radius:10px;background:#000}

/* ---------- discussion d'une actualité : page à part, aux couleurs du média ---------- */
#side.pchat{--dmc:#5b3df5;--dmm:color-mix(in srgb,var(--dmc) 74%,#fff);background:linear-gradient(180deg,var(--bg) 0%,color-mix(in srgb,var(--dmc) 6%,var(--bg)) 45%,color-mix(in srgb,var(--dmc) 15%,var(--card)) 100%)}
#side.pchat[data-lt]{--dmm:color-mix(in srgb,var(--dmc) 52%,#4a3000)}
#side.pchat form button:not(.att){background:var(--dmm);color:#fff}#side.pchat .att{color:var(--dmm);border-color:color-mix(in srgb,var(--dmc) 22%,var(--line))}
#side.pchat .top{border-bottom:1px solid color-mix(in srgb,var(--dmc) 18%,var(--line))}
#side.pchat #st{display:flex;flex-direction:column;align-items:flex-start;gap:7px;-webkit-line-clamp:unset;font-size:18px;line-height:1.25}
#side.pchat .ptitle{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.ptag{display:inline-flex;align-items:center;gap:6px;padding:3px 12px 3px 3px;border:1px solid color-mix(in srgb,var(--dmc,#5b3df5) 40%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--dmc,#5b3df5) 10%,var(--card));color:var(--ink);font:700 12.5px/1 'DM Sans',system-ui,sans-serif;cursor:pointer}
.ptag:hover{background:color-mix(in srgb,var(--dmc,#5b3df5) 18%,var(--card))}
.ptag .ptag-lg{width:26px;height:26px;font-size:12px}.ptag .mmark{margin:0}
.pstc{flex:none;padding:10px 12px 0}.pstc.hid{display:none}
.pstc .flc{max-height:36vh;display:flex;flex-direction:column;margin:0;box-shadow:0 6px 18px rgba(20,10,60,.08)}
.pstc .flc .fl-bd{overflow:auto;min-height:0}.pstc .flc .fl-hd,.pstc .flc .fl-lkw{flex:none}
#side.thr .qrow,#side.pchat .qrow,#side.pro .qrow{display:none}

/* ---------- Amis : publication d'un média ; vidéos intégrées à la largeur de la carte, quel que soit l'écran ---------- */
.cv-c.cv-med{border-left:5px solid var(--mc,#5b3df5)}
.cv-c.cv-med .cv-nm{display:inline-flex;align-items:center}
.cv-c .ytc,.cv-c .ytc.on,.cv-c .lkc{width:100%;max-width:none}
.cv-c .ytc .ytt,.cv-c .ytc.on .ytt{width:100%;aspect-ratio:16/9;height:auto}
.cv-c .ytc .ytf{position:absolute;inset:0;width:100%;height:100%}
.pst:has(.ytc){display:block}

.rstudio{margin:0 0 12px;box-shadow:0 6px 18px rgba(124,58,237,.28)}
.mi-studio{display:block;font-weight:700;color:var(--v);text-decoration:none;padding:10px 14px}
.mi-studio.hid{display:none}.mi-studio:hover{background:var(--soft,#f3effe)}
.dwstudio{background:linear-gradient(135deg,var(--v),var(--p));color:#fff!important;font-weight:800;border-radius:14px;margin-bottom:6px;text-align:center}

/* discussion d'une actualité : la fenêtre du chat entre amis, aux couleurs du média ; en haut le titre seul */
#dmside.dmpo .top h2{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:17px;line-height:1.25}
#dmside.dmpo #dmcol{display:none}
.dmpost{margin-top:6px}.dmpost.hid{display:none}
#dmside .dsn .dmmed{display:inline-flex;align-items:center;gap:2px;border:0;background:none;padding:0;font:inherit;font-size:12.5px;color:var(--dmm,var(--v));font-weight:700;cursor:pointer;max-width:100%}
#dmside .dsn .dmmed span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#dmside .dsn .dmmed .mmark{margin-left:4px}
.dmp-r{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}
.dmp-l{flex:none}
.dmp-m{border:0;background:none;color:var(--dmm,var(--v));font:inherit;font-size:13px;font-weight:700;cursor:pointer;padding:4px 0;text-decoration:underline;text-underline-offset:3px}
.dmp-lk{font-size:13px;font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:var(--mc,var(--v));text-decoration-thickness:2px;text-underline-offset:3px}
.dmp-tx{margin-top:8px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--mc,var(--v)) 8%,var(--card));border-left:4px solid var(--mc,var(--v));max-height:34vh;overflow:auto;font-size:14px;line-height:1.45}
.dmp-tx.hid{display:none}.dmp-tx .dmp-h{display:block;margin-bottom:4px;font-size:15px}.dmp-tx p{margin:0;white-space:normal}
/* like sous la carte d'une actualité, dans le fil du média */
.flc.m-feed .fl-ft{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.flc.m-feed .fl-ft .fl-cnt{flex:1;min-width:0}
.fl-lk2{flex:none}
/* micro et caméra : seulement dans les chats entre amis (pas dans les sujets ni dans les discussions d'actualités) */
#dmside.dmpo #dmf .att.mic,#dmside.dmpo #dmf .att.vcam{display:none}
/* alertes par média */
.mh-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:12px}.mh-act .mfol{margin-top:0}
.mal-w{display:inline-flex;align-items:center;gap:8px;font:600 13px/1.2 'DM Sans',system-ui,sans-serif;color:var(--mute)}
.mal{max-width:100%;padding:8px 30px 8px 12px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:600 13px/1.2 'DM Sans',system-ui,sans-serif;cursor:pointer}.mal:focus-visible{outline:2px solid var(--mc,#5b3df5);outline-offset:2px}
.mmutes .mal{font-size:14px}
/* zone de message : pas de photo dans les sujets ni dans les discussions d'actualités ; le bouton photo reste entre amis */
#dmside.dmpo #dmf .att,#dmside.dmpo #dmf #dmatt{display:none}
/* chat entre amis : le champ prend toute la largeur, les boutons passent dessous (plus de champ écrasé entre 3 ronds) */
#dmside:not(.dmpo) #dmf{flex-wrap:wrap}
#dmside:not(.dmpo) #dmf textarea.mi{flex:1 1 100%;order:0}
#dmside:not(.dmpo) #dmf .att{order:1;width:50px}
#dmside:not(.dmpo) #dmf>button:not(.att){order:2;flex:1 1 0;min-width:0;margin-left:0}
/* carte d'actualité du fil du média : le compteur ne se fait plus écraser, la ligne passe sur deux rangs si besoin */
.flc.m-feed .fl-ft .fl-cnt{flex:1 0 auto;min-width:0;white-space:nowrap}
.flc.m-feed .fl-ft .echo{flex:none}
/* bulle d'une actualité commentée dans « Sujets du moment » : la couleur et le logo du média au-dessus du titre */
.b.mbub{align-content:center;gap:2px;padding:13%}
/* le logo du média : posé sur le bord, en haut à droite, un peu de travers (la même place que la couronne premium) */
.b.mbub .mbl{position:absolute;margin:0;left:calc(85.36% + 1.77px - var(--ms) / 2);top:calc(14.64% - 1.77px - var(--ms) / 2);rotate:16deg;z-index:3;pointer-events:none;filter:drop-shadow(0 2px 3px rgba(0,0,0,.3))}
.b.mbub .mbl i{box-shadow:0 0 0 2px #fff}
#field.waves .b.mbub span{-webkit-line-clamp:3;max-width:100%;overflow-wrap:anywhere}
/* anneau autour des bulles : un petit espace, un trait fin aux couleurs de la bulle (média : sa couleur) */
.b .rng{position:absolute;inset:-9px;border-radius:50%;pointer-events:none;opacity:0;transition:opacity .3s;background:conic-gradient(var(--rg,#5b3df5),color-mix(in srgb,var(--rg,#5b3df5) 38%,#fff),var(--rg,#5b3df5));-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 3.5px),#000 calc(100% - 3px))}
.b:hover .rng,.b:focus-visible .rng,.b:active .rng{opacity:.9}
.b.core .rng,.b.mbub .rng{opacity:.9;animation:rngp 3.8s ease-in-out infinite,rngs 11s linear infinite}
@keyframes rngp{0%,100%{scale:1;opacity:.55}50%{scale:1.045;opacity:1}}
@keyframes rngs{to{rotate:360deg}}
@media (prefers-reduced-motion:reduce){.b.core .rng,.b.mbub .rng{animation:none}}

/* ---------- Décor des chats entre amis : fonds d'écran (motifs du site, clairs pour garder le texte lisible) ---------- */
#dmmsgs.bgk-aurore,.lk-bg.bgk-aurore{background:linear-gradient(160deg,#fde7ef 0%,#ece6fd 55%,#dff1fb 100%)}
#dmmsgs.bgk-lavande,.lk-bg.bgk-lavande{background:linear-gradient(180deg,#f1ebff,#e2d8fb)}
#dmmsgs.bgk-menthe,.lk-bg.bgk-menthe{background:linear-gradient(180deg,#e9f9f1,#d3f0e3)}
#dmmsgs.bgk-peche,.lk-bg.bgk-peche{background:linear-gradient(180deg,#fff0e6,#ffe0cf)}
#dmmsgs.bgk-ciel,.lk-bg.bgk-ciel{background:linear-gradient(180deg,#e8f4ff,#d4e8fb)}
#dmmsgs.bgk-sable,.lk-bg.bgk-sable{background:linear-gradient(180deg,#f8f2e6,#efe5d0)}
#dmmsgs.bgk-rose,.lk-bg.bgk-rose{background:linear-gradient(180deg,#ffeef3,#fbd9e5)}
#dmmsgs.bgk-pois,.lk-bg.bgk-pois{background-color:#f4f0ff;background-image:radial-gradient(rgba(120,90,220,.16) 1.6px,transparent 1.8px);background-size:18px 18px}
#dmmsgs.bgk-quadrille,.lk-bg.bgk-quadrille{background-color:#fbfaf6;background-image:linear-gradient(rgba(90,110,160,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(90,110,160,.14) 1px,transparent 1px);background-size:22px 22px}
#dmmsgs.bgk-rayures,.lk-bg.bgk-rayures{background-color:#fff7f2;background-image:repeating-linear-gradient(135deg,rgba(255,140,100,.12) 0 10px,transparent 10px 20px)}
#dmmsgs.bgk-vagues,.lk-bg.bgk-vagues{background-color:#e6f3fb;background-image:radial-gradient(circle at 50% 100%,transparent 0 11px,rgba(60,140,200,.16) 12px 13.5px,transparent 14.5px),radial-gradient(circle at 0 100%,transparent 0 11px,rgba(60,140,200,.16) 12px 13.5px,transparent 14.5px),radial-gradient(circle at 100% 100%,transparent 0 11px,rgba(60,140,200,.16) 12px 13.5px,transparent 14.5px);background-size:28px 20px}
#dmmsgs[class*="bgk-"]{color:#241f3d}
/* bouton « Décor » de l'en-tête et fenêtre */
#dmlook.tcb.dmo{width:36px;height:32px;padding:0;justify-content:center}#dmlook.tcb.dmo::after{display:none}#dmside.dmpo #dmlook,#dmside.min #dmlook{display:none!important}
.lkp{max-height:min(78vh,620px);overflow:auto}.lk-t{font-size:13.5px;margin-top:4px}
.lk-bgs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.lk-bg{height:54px;border:2px solid var(--line);border-radius:12px;cursor:pointer;display:flex;align-items:flex-end;justify-content:flex-start;padding:4px 6px;color:#241f3d;font:600 11.5px/1.1 'DM Sans',system-ui,sans-serif;background-color:var(--bg)}
.lk-bg.on{border-color:var(--v);box-shadow:0 0 0 3px color-mix(in srgb,var(--v) 20%,transparent)}.lk-bg span{background:rgba(255,255,255,.7);border-radius:6px;padding:1px 4px}
.lk-fonts{display:flex;flex-direction:column;gap:6px}
.lk-f{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:8px 36px 8px 12px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);cursor:pointer;text-align:left}
.lk-f b{font-size:16px;font-weight:600}.lk-f small{font-size:12px;color:var(--mute)}
.lk-f.on{border-color:var(--v);background:color-mix(in srgb,var(--v) 8%,var(--card))}.lk-f.lock{opacity:.78}
.lk-cr{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:#d98a08;display:grid}

/* fonds photo (bibliothèque de l'équipe et fonds « Sponsorisé ») : un voile clair garde le texte lisible */
#dmmsgs.bgw{background-image:linear-gradient(rgba(255,255,255,.66),rgba(255,255,255,.66)),var(--wp);background-size:cover;background-position:center;background-color:#f4f0ff;color:#241f3d}
.lk-ph{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.lk-ph.hid,.lk-t.hid{display:none}
.lk-pc{display:flex;flex-direction:column;gap:3px;min-width:0}.lk-pc small{font-size:11.5px;color:var(--mute);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lk-pb{aspect-ratio:1/1;border:2px solid var(--line);border-radius:12px;cursor:pointer;background-size:cover;background-position:center;background-color:var(--bg);padding:0}
.lk-pb.on{border-color:var(--v);box-shadow:0 0 0 3px color-mix(in srgb,var(--v) 20%,transparent)}
.lk-sp{white-space:normal!important}.lk-sp i{font-style:normal;font-weight:700;color:#8a5a00;background:#fff1cf;border-radius:6px;padding:0 5px;margin-right:2px}.lk-sp a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
/* onglet « Mon média » (comptes médias) : nom du média, accès au Studio, toutes les publications */
.circv.mh-v:not(.hid){display:flex;flex-direction:column;gap:12px}
.circv.mh-v .mdh{margin:0}
.mh-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
.mh-wr{flex:1 1 220px;display:flex;flex-direction:column;gap:2px;padding:11px 14px;border-radius:14px;background:var(--mc,var(--v));color:var(--mcon,#fff);text-decoration:none}
.mh-wr b{font:700 15px 'DM Sans','Inter',sans-serif}.mh-wr span{font-size:12.5px;opacity:.88;line-height:1.35}
.mh-fr2{align-self:center;border:0;border-radius:999px;padding:8px 14px;background:color-mix(in srgb,var(--v) 10%,transparent);color:var(--v);font:700 13px 'DM Sans','Inter',sans-serif;cursor:pointer}
.mh-bk{display:block;margin:0 0 6px;padding:5px 10px}
.mh-h{margin:6px 2px 0;font:700 15px 'DM Sans','Inter',sans-serif;color:var(--mute)}
.circv.mh-v>.flc{margin:0}
/* arrivée depuis le bouton « Partager sur OloLoop » */
.shx .wl-t{font-size:clamp(22px,6vw,28px);margin-right:80px}
.shx-art{margin:0 0 14px;padding:12px 14px;border-radius:14px;background:var(--bg);border:1px solid var(--line)}.shx-art small{display:block;color:var(--mute);font-size:12.5px}.shx-art b{display:block;margin-top:2px;line-height:1.3;word-break:break-word}
.shx-in{width:100%;box-sizing:border-box;margin:0 0 6px;padding:13px 14px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:600 16px 'Inter','DM Sans',sans-serif}
.shx .ntc{display:block;margin:0 0 14px}
a.wl-go{text-align:center;text-decoration:none;box-sizing:border-box}
.pf-real{margin:0 0 6px;text-align:center;color:var(--mute);font-size:14px}
.pf-rn{display:flex;gap:8px;align-items:flex-start;font-size:14px;margin:4px 0 10px;line-height:1.4}.pf-rn input{margin-top:3px;width:auto}
/* sondages des médias */
.flc.sq-card,.flc.sq-card:hover{cursor:default;transform:none;box-shadow:none}
.sq{display:flex;flex-direction:column;gap:7px;padding:2px 14px 14px 19px;font-family:'DM Sans',system-ui,sans-serif}
.sq-o{display:block;width:100%;text-align:left;border:1.5px solid color-mix(in srgb,var(--mc,var(--v)) 45%,transparent);background:transparent;color:var(--ink);border-radius:12px;padding:10px 14px;font:600 14.5px/1.3 inherit;cursor:pointer;transition:background .15s,border-color .15s}
.sq-o:hover,.sq-o:focus-visible{background:color-mix(in srgb,var(--mc,var(--v)) 12%,transparent);border-color:var(--mc,var(--v))}
.sq.busy{opacity:.6;pointer-events:none}
.sq-r{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;border-radius:12px;padding:10px 14px;overflow:hidden;background:color-mix(in srgb,var(--mc,var(--v)) 7%,transparent);font:500 14.5px/1.3 inherit}
.sq-bar{position:absolute;left:0;top:0;bottom:0;width:0;background:color-mix(in srgb,var(--mc,var(--v)) 24%,transparent);transition:width .5s cubic-bezier(.2,.8,.2,1)}
.sq-r.me .sq-bar{background:color-mix(in srgb,var(--mc,var(--v)) 42%,transparent)}.sq-r.me .sq-tx{font-weight:700}
.sq-tx,.sq-pc{position:relative}.sq-pc{font-weight:700;font-variant-numeric:tabular-nums}
.sq-ft{margin:2px 0 0;font-size:12.5px;color:var(--mute)}.sq-st{align-self:flex-start;font-size:13px;font-weight:600;color:var(--v)}
@media (prefers-reduced-motion:reduce){.sq-bar{transition:none}}
/* choix au moment du Reloop */
.rlmenu{position:fixed;z-index:9500;min-width:230px;max-width:min(320px,calc(100vw - 16px));display:flex;flex-direction:column;padding:6px;border-radius:16px;background:var(--card,#fff);border:1px solid var(--line,rgba(0,0,0,.1));box-shadow:0 14px 36px rgba(20,10,60,.2);animation:rlmIn .14s ease-out}
.rlm-i{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:0;background:none;color:var(--ink);padding:10px 12px;border-radius:11px;cursor:pointer;font-family:'DM Sans',system-ui,sans-serif}
.rlm-i b{font-size:14.5px}.rlm-i span{font-size:12.5px;color:var(--mute)}.rlm-i:hover,.rlm-i:focus-visible{background:color-mix(in srgb,var(--v) 10%,transparent);outline:none}
@keyframes rlmIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.rlmenu{animation:none}}
/* média : « nouvelle actualité » (un balayage de lumière de gauche à droite, qui disparaît puis revient) et volet des derniers titres */
.mcard.new{border-color:color-mix(in srgb,var(--mc) 62%,var(--line));overflow:hidden;animation:mcglow 5.2s ease-in-out var(--d,0s) infinite}
.mcard.new::after{content:"";position:absolute;top:-30%;bottom:-30%;left:0;width:55%;border-radius:inherit;pointer-events:none;transform:translateX(-130%) skewX(-18deg);opacity:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--mc) 22%,transparent) 28%,color-mix(in srgb,var(--mc) 48%,transparent) 46%,color-mix(in srgb,#fff 88%,var(--mc)) 50%,color-mix(in srgb,var(--mc) 48%,transparent) 54%,color-mix(in srgb,var(--mc) 22%,transparent) 72%,transparent);animation:mcsweep 5.2s cubic-bezier(.5,.05,.25,1) var(--d,0s) infinite}
@keyframes mcsweep{0%{transform:translateX(-130%) skewX(-18deg);opacity:0}5%{opacity:1}38%{transform:translateX(230%) skewX(-18deg);opacity:1}44%{opacity:0}100%{transform:translateX(230%) skewX(-18deg);opacity:0}}
@keyframes mcglow{0%,52%,100%{box-shadow:0 0 0 3px color-mix(in srgb,var(--mc) 9%,transparent),0 2px 10px transparent}20%{box-shadow:0 0 0 4px color-mix(in srgb,var(--mc) 26%,transparent),0 6px 22px color-mix(in srgb,var(--mc) 30%,transparent)}}
.mcard.new .mc-dot{box-shadow:0 0 0 0 color-mix(in srgb,var(--mc) 55%,transparent)}
/* volet vertical : une carte de titres qui s'ouvre sous la pastille, en superposition (position fixe, placée par JS). Rien ne bouge autour. */
.mcard .mc-rv{position:fixed;z-index:80;top:0;left:0;display:block;width:max-content;max-width:min(330px,86vw);opacity:0;pointer-events:none;transform:translateY(-4px);transition:opacity .22s,transform .26s cubic-bezier(.2,.9,.25,1)}
.mcard .mc-rvi{display:flex;flex-direction:column;gap:4px;width:max-content;max-width:min(330px,86vw);padding:10px 14px 11px;border:1px solid color-mix(in srgb,var(--mc) 40%,var(--line));border-radius:14px;background:var(--card,#fff);box-shadow:0 12px 28px color-mix(in srgb,var(--mc) 18%,transparent)}
.mcard .mc-rt{font:600 11px/1.1 'DM Sans',system-ui,sans-serif;color:var(--mc);letter-spacing:.01em;white-space:nowrap}
.mcard .mc-rl{display:flex;flex-direction:column}
.mcard .mc-ri{font:600 13px/1.3 'DM Sans',system-ui,sans-serif;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.mcard.peek .mc-rv{opacity:1;transform:none}
.mcard.peek .mc-ri,.mcard.peek .mc-rt{animation:mcrise .45s ease-out both;animation-delay:calc(90ms + var(--i,0) * 70ms)}
.mcard.peek{animation:none}.mcard.peek::after{animation:none;opacity:0}
@keyframes mcrise{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.mcard.new{animation:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--mc) 18%,transparent)}.mcard.new::after{animation:none;opacity:0}.mcard .mc-rv{transition:none;transform:none}.mcard.peek .mc-ri,.mcard.peek .mc-rt{animation:none}}
.mcard .mc-rb{cursor:pointer;pointer-events:auto;border-radius:8px}
.mcard .mc-rb:hover,.mcard .mc-rb:focus-visible{color:var(--mc);text-decoration:underline;text-underline-offset:3px;outline:none}
.mcard:not(.peek) .mc-rb{pointer-events:none}
.mcard .mc-rn{color:var(--mute,#888);font-weight:500}

/* Volet d'un média : chaque actualité est séparée des autres ; le direct en premier, en rouge */
.mcard .mc-rl .mc-ri{padding:9px 2px;border-top:1px solid color-mix(in srgb,var(--mc) 18%,var(--line,#ddd))}
.mcard .mc-rl .mc-ri:first-child{border-top:0;padding-top:2px}
.mcard .mc-rlive{display:flex;flex-direction:column;gap:3px;padding:2px 2px 10px!important;border-top:0!important}
.mcard .mc-rlive em{font-style:normal;font-size:11.5px;font-weight:700;color:#e11d48}
.mcard .mc-rlive .mc-rlt{display:block;font:600 13px/1.3 'DM Sans',system-ui,sans-serif;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mcard .mc-rlive:hover .mc-rlt,.mcard .mc-rlive:focus-visible .mc-rlt{text-decoration:underline;text-underline-offset:3px}