/* ============================================================
   LE FANTÔME LIY10 (assets/js/fantome.js) — 07/10/2026
   Un fantôme blanc tiré du logo : il apparaît en se matérialisant,
   flotte, cligne des yeux, rougit, sursaute, fait des pirouettes,
   pleure sans Internet, s'endort… et ouvre le pop-up de l'assistant.
   ============================================================ */
.liy-fantome {
  position: fixed; z-index: 8000; left: 0; top: 0;
  width: 64px; height: 75px;
  pointer-events: none;                 /* seul le personnage capte les gestes */
  will-change: transform;
}
.liy-fantome[data-mode="coin"] { left: auto; top: auto; right: 16px; bottom: calc(env(safe-area-inset-bottom, 0px) + 84px); }
.liy-fantome[data-mode="coin"][data-page="site"] { bottom: calc(env(safe-area-inset-bottom, 0px) + 18px); }
@media (min-width: 900px) { .liy-fantome[data-mode="coin"] { right: 24px; bottom: 24px; } }

.fa-perso {
  pointer-events: auto; display: block; padding: 0; margin: 0; border: 0; background: none; cursor: pointer;
  width: 64px; height: 75px; -webkit-tap-highlight-color: transparent;
  filter: drop-shadow(0 0 10px rgba(255,255,255,.55)) drop-shadow(0 6px 14px rgba(0,0,0,.22));
  transition: rotate .25s ease-out, filter .3s;
  animation: fa-flotte 3.2s ease-in-out infinite;
}
.fa-perso:focus-visible { outline: 3px solid var(--accent, #2E8BE0); outline-offset: 4px; border-radius: 20px; }
.fa-3d { display: block; transition: transform .25s cubic-bezier(.2,.8,.3,1); transform-style: preserve-3d; will-change: transform; }
.fa-svg { display: block; overflow: visible; }
.fa-corps { stroke: rgba(80,100,130,.12); stroke-width: 1; }
.fa-ombre-bas, .fa-ombre-cote { pointer-events: none; }
:root[data-theme="dark"] .fa-corps, .theme-sombre .fa-corps { stroke: none; }

/* l'ombre au sol : elle respire avec le flottement */
.fa-ombre { position: absolute; left: 14px; right: 14px; bottom: -10px; height: 8px; border-radius: 50%;
  background: rgba(0,0,0,.16); filter: blur(3px); animation: fa-ombre 3.2s ease-in-out infinite; }
.liy-fantome[data-mode="libre"] .fa-ombre { opacity: .5; }

@keyframes fa-flotte { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@keyframes fa-ombre  { 0%, 100% { transform: scaleX(1); opacity: 1; } 50% { transform: scaleX(.72); opacity: .55; } }

/* --- l'arrivée : il se matérialise ; le départ : il se dissout --- */
.liy-fantome.apparait .fa-perso { animation: fa-materialise 1.1s cubic-bezier(.2,.9,.3,1.3) both, fa-flotte 3.2s ease-in-out 1.1s infinite; }
@keyframes fa-materialise {
  0%   { opacity: 0; transform: scale(.4) translateY(30px); filter: blur(10px); }
  60%  { opacity: .9; transform: scale(1.12) translateY(-6px); filter: blur(1px); }
  100% { opacity: 1; transform: none; filter: drop-shadow(0 0 10px rgba(255,255,255,.55)) drop-shadow(0 6px 14px rgba(0,0,0,.22)); }
}
.liy-fantome.disparait .fa-perso { animation: fa-dissout .9s ease-in forwards; }
@keyframes fa-dissout { to { opacity: 0; transform: translateY(-40px) scale(.6); filter: blur(12px); } }
.liy-fantome.efface { opacity: 0; transition: opacity .3s; }
.liy-fantome.efface .fa-perso { pointer-events: none; }

/* --- les gestes : sursaut, pirouette, émotion qui « secoue » --- */
.liy-fantome.sursaute .fa-svg { animation: fa-sursaut .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes fa-sursaut { 0% { transform: scale(1); } 30% { transform: scale(1.18, .82) translateY(4px); } 60% { transform: scale(.9, 1.12) translateY(-10px); } 100% { transform: none; } }
.fa-perso.pirouette .fa-svg { animation: fa-pirouette .9s cubic-bezier(.5,0,.3,1); }
/* la pirouette, en 3D : un tour complet sur lui-meme, en perspective */
@keyframes fa-pirouette { 0% { transform: perspective(420px) rotateY(0) translateY(0); } 50% { transform: perspective(420px) rotateY(190deg) translateY(-14px) scale(.92); } 100% { transform: perspective(420px) rotateY(360deg) translateY(0); } }
.fa-perso.emu .fa-svg { animation: fa-emu .45s ease-out; }
@keyframes fa-emu { 0% { transform: scale(1); } 40% { transform: scale(1.1); } 100% { transform: scale(1); } }

/* --- le visage --- */
.fa-regard { transition: transform .12s linear; }
.fa-cligne { transform-box: fill-box; transform-origin: center; }
.liy-fantome.cligne .fa-cligne { animation: fa-clin .22s ease-in-out; }
@keyframes fa-clin { 50% { transform: scaleY(.08); } }
.fa-b, .fa-larme, .fa-coeurs, .fa-zzz { opacity: 0; transition: opacity .2s; }
.fa-joues { opacity: 0; transition: opacity .3s; }
.fa-antenne { transform-box: fill-box; transform-origin: 50% 100%; transition: transform .4s cubic-bezier(.3,1.6,.5,1); }
.fa-bout { transition: fill .3s; }

/* content : le sourire */
.liy-fantome[data-humeur="content"] .fa-b-sourire { opacity: 1; }
/* joie : grand sourire, yeux plissés, l'antenne s'agite */
.liy-fantome[data-humeur="joie"] .fa-b-joie { opacity: 1; }
.liy-fantome[data-humeur="joie"] .fa-cligne { transform: scaleY(.55); }
.liy-fantome[data-humeur="joie"] .fa-antenne { animation: fa-antenne .35s ease-in-out 3; }
.liy-fantome[data-humeur="joie"] .fa-joues { opacity: .7; }
@keyframes fa-antenne { 25% { transform: rotate(-18deg); } 75% { transform: rotate(18deg); } }
/* surpris : la bouche en O, les yeux grands */
.liy-fantome[data-humeur="surpris"] .fa-b-o { opacity: 1; }
.liy-fantome[data-humeur="surpris"] .fa-cligne { transform: scale(1.18); }
.liy-fantome[data-humeur="surpris"] .fa-antenne { transform: scaleY(1.25); }
/* timide (on le survole) : il rougit, regarde en bas, petite bouche */
.liy-fantome[data-humeur="timide"] .fa-b-neutre { opacity: 1; }
.liy-fantome[data-humeur="timide"] .fa-joues { opacity: .85; }
.liy-fantome[data-humeur="timide"] .fa-cligne { transform: translateY(3px) scaleY(.85); }
.liy-fantome.rougit .fa-perso { filter: drop-shadow(0 0 14px rgba(255,143,163,.75)) drop-shadow(0 6px 14px rgba(0,0,0,.22)); }
/* amour : des coeurs qui battent */
.liy-fantome[data-humeur="amour"] .fa-b-joie { opacity: 1; }
.liy-fantome[data-humeur="amour"] .fa-joues { opacity: .9; }
.liy-fantome[data-humeur="amour"] .fa-coeurs { opacity: 1; animation: fa-coeurs .6s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: center; }
@keyframes fa-coeurs { to { transform: translateY(-6px) scale(1.15); } }
/* triste (sans Internet, ou quand on le renvoie) : moue, larme, antenne qui tombe, gris */
.liy-fantome[data-humeur="triste"] .fa-b-triste { opacity: 1; }
.liy-fantome[data-humeur="triste"] .fa-larme { opacity: 1; animation: fa-larme 1.6s ease-in infinite; }
.liy-fantome[data-humeur="triste"] .fa-cligne { transform: translateY(3px); }
.liy-fantome[data-humeur="triste"] .fa-antenne { transform: rotate(24deg) translateY(2px); }
.liy-fantome[data-humeur="triste"] .fa-bout, .liy-fantome.hors-ligne .fa-bout { fill: #8A9399; }
.liy-fantome[data-humeur="triste"] .fa-perso { animation-duration: 5s; }
@keyframes fa-larme { 0% { transform: translateY(0); opacity: 0; } 20% { opacity: 1; } 100% { transform: translateY(16px); opacity: 0; } }
/* endormi : yeux fermés, Zzz, il respire lentement */
.liy-fantome[data-humeur="endormi"] .fa-b-neutre { opacity: 1; }
.liy-fantome[data-humeur="endormi"] .fa-cligne { transform: scaleY(.12); }
.liy-fantome[data-humeur="endormi"] .fa-zzz { opacity: 1; animation: fa-zzz 2.4s ease-in-out infinite; }
.liy-fantome[data-humeur="endormi"] .fa-perso { animation-duration: 6s; }
@keyframes fa-zzz { 0% { transform: translate(0,4px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translate(6px,-8px); opacity: 0; } }
/* il écoute (pop-up ouvert) : l'antenne s'allume */
.liy-fantome.ecoute .fa-bout { filter: drop-shadow(0 0 6px #F2762F); }

/* --- la bulle : le pop-up de la permission et les petits mots --- */
.fa-bulle {
  pointer-events: auto; position: absolute; right: 0; bottom: calc(100% + 14px);
  width: max-content; max-width: 260px; padding: 12px 14px; border-radius: 18px 18px 6px 18px;
  background: var(--surface, #fff); color: var(--texte, #111); font: 500 14px/1.45 'Poppins', system-ui, sans-serif;
  box-shadow: 0 12px 32px rgba(0,0,0,.22); border: 1px solid var(--bord, rgba(0,0,0,.08));
  transform-origin: 90% 100%;
}
.fa-bulle[hidden] { display: none; }
.liy-fantome.bulle-a-droite .fa-bulle { right: auto; left: 0; border-radius: 18px 18px 18px 6px; transform-origin: 10% 100%; }
.liy-fantome.bulle-en-bas .fa-bulle { bottom: auto; top: calc(100% + 14px); }
.fa-bulle.entre { animation: fa-bulle-entre .42s cubic-bezier(.3,1.5,.5,1); }
.fa-bulle.sort { animation: fa-bulle-sort .26s ease-in forwards; }
@keyframes fa-bulle-entre { from { opacity: 0; transform: scale(.4) translateY(10px); } }
@keyframes fa-bulle-sort { to { opacity: 0; transform: scale(.6) translateY(8px); } }
.fa-choix { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.fa-choix button { flex: 1 1 auto; border: 0; border-radius: 999px; padding: 9px 12px; font: 700 13px 'Poppins', system-ui, sans-serif; cursor: pointer; transition: transform .15s; }
.fa-choix button:hover { transform: translateY(-2px); }
.fa-oui { background: #1FBF74; color: #fff; box-shadow: 0 4px 0 #128A52; }
.fa-non { background: var(--surface-2, #EEF1F3); color: var(--texte, #111); }

/* --- le pop-up de l'assistant --- */
.fa-panneau {
  position: fixed; z-index: 8001; width: 340px; max-width: calc(100vw - 24px);
  background: var(--surface, #fff); color: var(--texte, #111); border-radius: 22px; padding: 14px;
  box-shadow: 0 24px 60px rgba(0,0,0,.3); border: 1px solid var(--bord, rgba(0,0,0,.08));
  font: 400 14px/1.5 'Poppins', system-ui, sans-serif;
  opacity: 0; transform: scale(.5); transition: opacity .22s, transform .32s cubic-bezier(.3,1.4,.5,1);
}
.fa-panneau.ouvert { opacity: 1; transform: none; }
.fa-panneau.feuille { left: 12px !important; right: 12px; bottom: calc(env(safe-area-inset-bottom, 0px) + 12px); top: auto !important;
  width: auto; transform: translateY(110%); transform-origin: 50% 100%; }
.fa-panneau.feuille.ouvert { transform: none; }
.fa-tete { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.fa-tete .fa-svg { filter: drop-shadow(0 0 6px rgba(46,139,224,.35)); animation: fa-flotte 3.2s ease-in-out infinite; }
.fa-tete .fa-b-sourire { opacity: 1; }
.fa-tete b { display: block; font-size: 15px; } .fa-tete small { color: var(--texte-3, #777); font-size: 12px; }
.fa-tete > div { flex: 1; }
.fa-fermer { border: 0; background: var(--surface-2, #EEF1F3); color: var(--texte, #111); width: 32px; height: 32px; border-radius: 50%; font-size: 20px; line-height: 1; cursor: pointer; }
.fa-message { background: var(--surface-2, #EEF1F3); border-radius: 6px 16px 16px 16px; padding: 10px 12px; color: var(--texte-2, #333); animation: fa-bulle-entre .4s .1s cubic-bezier(.3,1.5,.5,1) backwards; }
.fa-saisie { display: flex; gap: 8px; margin: 10px 0; }
.fa-saisie input { flex: 1; min-width: 0; border: 1.5px solid var(--bord, #ddd); border-radius: 999px; padding: 10px 14px; font: inherit; font-size: 16px; background: transparent; color: inherit; transition: border-color .2s, box-shadow .2s; }
.fa-saisie input:focus { outline: none; border-color: #2E8BE0; box-shadow: 0 0 0 4px rgba(46,139,224,.15); }
.fa-saisie button { border: 0; width: 42px; border-radius: 50%; background: #2E8BE0; color: #fff; cursor: pointer; transition: transform .15s; }
.fa-saisie button:hover { transform: scale(1.08) rotate(-8deg); }
.fa-actions { display: grid; gap: 6px; }
.fa-actions button { text-align: left; border: 0; border-radius: 12px; padding: 10px 12px; background: transparent; color: var(--texte, #111); font: 600 14px 'Poppins', system-ui, sans-serif; cursor: pointer; transition: background .15s, transform .15s; }
.fa-actions button:hover { background: var(--surface-2, #EEF1F3); transform: translateX(3px); }

@media (prefers-reduced-motion: reduce) {
  .fa-perso, .fa-ombre, .fa-tete .fa-svg { animation: none !important; }
}

/* ============================================================
   LA SCENE D'ARRIVEE (fantome.js, jouerScene) — 07/10/2026
   ============================================================ */
.liy-fantome.en-scene { opacity: 0; pointer-events: none; }
.liy-fantome.en-scene .fa-perso { pointer-events: none; }
.fa-scene {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0; z-index: 8500; overflow: hidden;
  background: radial-gradient(circle at 50% 28%, color-mix(in srgb, var(--fond, #fff) 70%, transparent), color-mix(in srgb, var(--fond, #fff) 88%, transparent));
  -webkit-backdrop-filter: blur(10px) saturate(1.3); backdrop-filter: blur(10px) saturate(1.3);
  transition: opacity .45s;
}
.fa-scene.part { opacity: 0; pointer-events: none; transition-delay: .25s; }
.fs-logo { position: absolute; z-index: 2; width: 104px; height: 104px; filter: drop-shadow(0 16px 30px rgba(0,0,0,.28)); }
.fs-logo svg { display: block; }
.fs-l { position: absolute; left: 0; top: 0; z-index: 2; opacity: 0; width: 30px; height: 30px; filter: drop-shadow(0 4px 8px rgba(0,0,0,.2)); }
.fs-l svg { display: block; }
.fs-fantome.liy-fantome { position: absolute; left: 0; top: 0; width: 84px; height: 98px; z-index: 3; opacity: 0; pointer-events: none;
  filter: drop-shadow(0 0 14px rgba(255,255,255,.6)) drop-shadow(0 10px 18px rgba(0,0,0,.22)); }
.fs-fantome .fa-svg { animation: fa-flotte 3.2s ease-in-out infinite; }
.fs-passer { position: absolute; top: calc(env(safe-area-inset-top, 0px) + 14px); right: 14px; z-index: 5;
  border: 0; border-radius: 999px; padding: 8px 14px; background: color-mix(in srgb, var(--texte, #111) 8%, transparent);
  color: var(--texte-2, #444); font: 600 13px 'Poppins', system-ui, sans-serif; cursor: pointer; }

.fs-bulle { position: absolute; z-index: 4; left: 50%; width: min(360px, calc(100vw - 32px)); translate: -50% 0;
  background: var(--surface, #fff); color: var(--texte, #111); border-radius: 22px; padding: 16px;
  box-shadow: 0 24px 60px rgba(0,0,0,.22); border: 1px solid var(--bord, rgba(0,0,0,.08));
  font: 500 15px/1.45 'Poppins', system-ui, sans-serif; transform-origin: 50% 0; }
.fs-bulle[hidden] { display: none; }
.fs-bulle::before { content: ''; position: absolute; top: -8px; left: 50%; width: 16px; height: 16px; translate: -50% 0; rotate: 45deg;
  background: inherit; border-left: 1px solid var(--bord, rgba(0,0,0,.08)); border-top: 1px solid var(--bord, rgba(0,0,0,.08)); }
.fs-bulle.entre { animation: fs-bulle .5s cubic-bezier(.3,1.45,.5,1) both; }
.fs-bulle.sort { animation: fs-bulle-sort .3s ease-in forwards; }
@keyframes fs-bulle { from { opacity: 0; transform: scale(.6) translateY(-14px); filter: blur(6px); } }
@keyframes fs-bulle-sort { to { opacity: 0; transform: scale(.85) translateY(-8px); } }
.fs-texte { text-align: center; margin-bottom: 12px; }
.fs-boutons { display: grid; gap: 8px; }
.fs-boutons.grille { grid-template-columns: 1fr 1fr; }
.fs-boutons button {
  display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap;
  border: 1.5px solid var(--bord, rgba(0,0,0,.1)); border-radius: 16px; padding: 12px 10px; cursor: pointer;
  background: var(--surface-2, #F2F5F8); color: var(--texte, #111); font: 600 14px 'Poppins', system-ui, sans-serif;
  animation: fs-touche .5s cubic-bezier(.3,1.45,.5,1) backwards; animation-delay: calc(.12s + var(--k) * 70ms);
  transition: transform .18s, box-shadow .18s, border-color .18s;
}
.fs-boutons.grille button { flex-direction: column; gap: 2px; padding: 12px 8px; }
.fs-boutons button:hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgba(0,0,0,.12); border-color: #2E8BE0; }
.fs-boutons button:active { transform: scale(.96); }
@keyframes fs-touche { from { opacity: 0; transform: translateY(14px) scale(.85); } }
.fs-boutons .fs-ic { font-size: 22px; line-height: 1; }
.fs-boutons small { color: var(--texte-3, #777); font-size: 11.5px; font-weight: 500; }
.fs-boutons .fs-large { grid-column: 1 / -1; flex-direction: row !important; gap: 10px !important;
  background: linear-gradient(135deg, #2E8BE0, #8B5CF6); color: #fff; border: 0; }
.fs-boutons .fs-large small { color: rgba(255,255,255,.85); }
.fs-principal { background: #1FBF74 !important; color: #fff !important; border: 0 !important; box-shadow: 0 5px 0 #128A52; }
.fs-g { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #fff; color: #4285F4; font-style: normal; font-weight: 800; }

/* --- on le déplace (fantome.js) : il se laisse prendre au doigt --- */
.fa-perso { touch-action: none; cursor: grab; }
.liy-fantome.tenu .fa-perso { cursor: grabbing; animation: none; filter: drop-shadow(0 0 16px rgba(255,255,255,.7)) drop-shadow(0 18px 26px rgba(0,0,0,.3)); }
.liy-fantome.tenu .fa-svg { transform: scale(1.12); transition: transform .15s; }
.liy-fantome.tenu .fa-ombre { opacity: .25; transform: scale(.6) translateY(14px); }

/* --- étourdi : on l'a fait tourner en rond ou secoué trop vite --- */
.fa-spirales, .fa-etoiles { opacity: 0; transition: opacity .2s; }
.fa-spirales path { transform-box: fill-box; transform-origin: center; }
.fa-etoiles { transform-box: view-box; transform-origin: 60px 16px; }
.liy-fantome[data-humeur="etourdi"] .fa-cligne { opacity: 0; }
.liy-fantome[data-humeur="etourdi"] .fa-spirales { opacity: 1; }
.liy-fantome[data-humeur="etourdi"] .fa-spirales path { animation: fa-spirale .7s linear infinite; }
.liy-fantome[data-humeur="etourdi"] .fa-etoiles { opacity: 1; animation: fa-etoiles 1.3s linear infinite; }
.liy-fantome[data-humeur="etourdi"] .fa-b-vague { opacity: 1; }
.liy-fantome[data-humeur="etourdi"] .fa-joues { opacity: .6; }
.liy-fantome[data-humeur="etourdi"] .fa-svg { animation: fa-titube .9s ease-in-out infinite; transform-origin: 50% 80%; }
.liy-fantome[data-humeur="etourdi"] .fa-antenne { animation: fa-antenne .5s ease-in-out infinite; }
@keyframes fa-spirale { to { transform: rotate(360deg); } }
@keyframes fa-etoiles { to { transform: rotate(360deg); } }
@keyframes fa-titube { 0%, 100% { transform: rotate(-9deg) translateX(-2px); } 50% { transform: rotate(9deg) translateX(2px); } }

/* --- LE FANTOME NE CHANGE PAS AVEC LE THEME, SES BULLES NON PLUS (Lionel, 07/10/2026) :
   toujours blanc, bulles blanches et texte foncé, en clair comme en sombre. --- */
.liy-fantome, .fa-bulle, .fs-bulle, .fa-panneau, .rch-bulle, .ecran-ia {
  --surface: #FFFFFF; --surface-2: #F1F4F7; --texte: #14181C; --texte-2: #3E4750; --texte-3: #6B7680; --bord: rgba(20,24,28,.10);
  color-scheme: light;
}
.fa-bulle, .fs-bulle, .fa-panneau, .rch-bulle { background: #FFFFFF; color: #14181C; }
.fa-corps { stroke: rgba(80,100,130,.12) !important; }

/* --- scene v2 (fantome.js) --- */
/* a l'ouverture native : le meme fond uni que la boule blanche, pour un passage sans couture */
.fa-scene.sans-voile { background: var(--fond, #fff); -webkit-backdrop-filter: none; backdrop-filter: none; transition: background .6s, backdrop-filter .6s; }
.fs-logo { transform-origin: 50% 50%; will-change: transform; }
/* la bulle A COTE du fantome (se connecter) : sa pointe a gauche */
.fs-bulle.cote { translate: 0 0; transform-origin: 0 30%; }
.fs-bulle.cote::before { top: 30px; left: -8px; translate: 0 0;
  border-left: 1px solid rgba(20,24,28,.10); border-top: 0; border-bottom: 1px solid rgba(20,24,28,.10); }
.fs-bulle.cote.entre { animation: fs-bulle-cote .55s cubic-bezier(.3,1.35,.5,1) both; }
@keyframes fs-bulle-cote { from { opacity: 0; transform: translateX(-18px) scale(.7); filter: blur(6px); } }
.fs-bulle.cote .fs-texte { text-align: left; }
.fs-boutons .fs-lien { background: none !important; border: 0 !important; color: var(--texte-2, #3E4750) !important;
  font-weight: 600; text-decoration: underline; text-underline-offset: 3px; padding: 6px !important; }
.fs-boutons .fs-lien:hover { transform: none; box-shadow: none; color: #2E8BE0 !important; }
.fs-bulle.cote .fs-boutons button { flex-wrap: nowrap; white-space: nowrap; font-size: 13.5px; padding: 11px 10px; }

/* --- il SOUFFLE les logiciels (fantome.js, scene) : joues gonflees, petite bouche ronde --- */
.liy-fantome[data-humeur="souffle"] .fa-b-o { opacity: 1; transform: scale(.55) translateY(-2px); transform-box: fill-box; transform-origin: center; }
.liy-fantome[data-humeur="souffle"] .fa-joues { opacity: .95; transform: scale(1.3); transform-box: fill-box; transform-origin: center; }
.liy-fantome[data-humeur="souffle"] .fa-cligne { transform: scaleY(.7); }
.fs-souffle { position: absolute; left: 0; top: 0; z-index: 4; width: 20px; height: 20px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255,255,255,.95), rgba(220,235,250,.4) 60%, transparent 72%);
  filter: blur(.5px); }
.fs-l { z-index: 2; }