/* Terrain Sûr — effets d'interface (actifs seulement si html.fx : animations autorisées, hors mode léger) */
.fx-hote{overflow:hidden;isolation:isolate}
.fx-onde{position:absolute;border-radius:50%;pointer-events:none;z-index:0;background:currentColor;opacity:.18;transform:scale(0);animation:fxOnde .6s cubic-bezier(.2,.8,.2,1) forwards}
.btn .fx-onde,.ts-fab .fx-onde{background:#fff;opacity:.28}
.btn > :not(.fx-onde),.ts-tab > :not(.fx-onde){position:relative;z-index:1}
@keyframes fxOnde{to{transform:scale(1);opacity:0}}

/* appui : léger enfoncement */
html.fx .btn,html.fx .une-chip,html.fx .sv-bub,html.fx .ts-tab svg{transition:transform .18s cubic-bezier(.2,.8,.2,1)}
html.fx .btn:active,html.fx .une-chip:active{transform:scale(.97)}

/* onglet choisi : l'icône rebondit */
.ts-tab.fx-pop svg{animation:fxPop .45s cubic-bezier(.3,1.6,.5,1)}
@keyframes fxPop{0%{transform:scale(.7) translateY(2px)}60%{transform:scale(1.18) translateY(-2px)}100%{transform:none}}

/* apparition douce au défilement */
html.fx .fx-r{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
html.fx .fx-r.fx-in{opacity:1;transform:none}

/* stories non vues : l'anneau tourne doucement */
html.fx .sv-bub:not(.vu) .sv-ring{background:conic-gradient(from var(--fx-a,200deg),var(--orange),var(--gold),var(--green),var(--orange));animation:fxTour 6s linear infinite}
@property --fx-a{syntax:"<angle>";inherits:false;initial-value:200deg}
@keyframes fxTour{to{--fx-a:560deg}}
/* pastille « Direct » qui respire */
html.fx .sv-live{animation:fxRespire 2s ease-in-out infinite}
@keyframes fxRespire{50%{box-shadow:0 0 0 2px var(--paper),0 0 0 6px rgba(217,58,43,.25)}}

@media (prefers-reduced-motion:reduce){
  .fx-onde{display:none}
  html.fx .fx-r{opacity:1;transform:none;transition:none}
  html.fx .sv-bub .sv-ring,html.fx .sv-live,.ts-tab.fx-pop svg{animation:none}
}

/* icônes d'onglets : pleines quand l'écran est ouvert (comme Instagram) */
.ts-tab[aria-current="page"] svg > :first-child{fill:currentColor;fill-opacity:.2}
