/* ===========================================================================
   World Lore: "The Atlas"
   ---------------------------------------------------------------------------
   The page is ordinary blocks carrying wam-wl- classes (see
   blocks/template-world-lore.html); world-lore.js adds the PRIME / RELIC
   switch and the continent tabs on top. Without the script the PRIME lore
   simply reads top to bottom.

   The logos (wam-tl-) come from the [wam_telorn] shortcode as inline SVG with
   named parts, which is what lets their pieces move:
     PRIME   the needle swings and settles on north, the dashed ring turns,
             a band of light crosses the gold now and then;
     RELIC   the four pantheon petals open, the bloom turns slowly against its
             ring of marks, Morph's heart breathes, the pantheon gems glow in
             turn.
   The great compasses sweep a beam of light around their runes.
   =========================================================================== */


.wam-wl {
  --wl-gold: #e7bf62;
  --wl-ivory: #f6ecd4;
  --wl-amber: #ffc04d;
  --wl-orange: #ff8a1f;
  --wl-astral: #c9c4ff;
  --wl-astral-deep: #7d6fe0;
  --wl-cyan: #59e6ff;
  --wl-pink: #ff4fd8;
  --wl-red: #e04848;
  --wl-faint: rgba(255, 255, 255, 0.5);
  --wl-accent: var(--wl-gold);
  --wl-serif: "Cinzel", Georgia, serif;
  --wl-tech: "Chakra Petch", var(--wam-font);
  background: var(--wam-surface);
  padding-bottom: clamp(70px, 9vw, 100px);
  transition: background-color 0.6s var(--wam-ease);
}
.wam-wl[data-edition="relic"] { --wl-accent: var(--wl-orange); background: #120b07; }
.wp-site-blocks:has(> .wam-wl[data-edition="relic"]) { background: #120b07; }

/* The layout owns every gap: no theme block gap, no stray figure margins. */
.wam-wl .wp-block-group > *,
.wam-wl .wp-block-list > * { margin-block: 0; }
.wam-wl .wp-block-image { margin: 0; }
.wam-wl p { margin: 0; }
.wam-wl :focus-visible { outline-color: var(--wl-accent); }

.wam-wl-head,
.wam-wl-panels { width: min(100% - 48px, 1180px); margin-inline: auto; }
.wam-wl-head { display: grid; justify-items: center; gap: 22px; padding-block: 56px 34px; text-align: center; }
.wam-wl-prime .wam-eyebrow { color: var(--wl-gold); }

/* ---------------------------------------------------------- the switch -- */

.wam-wl-switch {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: min(100%, 560px);
  padding: 6px;
  border-radius: 18px;
  background: var(--wam-surface-2);
  border: 1px solid var(--wam-line);
}
.wam-wl-switch button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 16px;
  border: 0;
  border-radius: 13px;
  background: none;
  cursor: pointer;
  color: var(--wl-faint);
  font: 600 0.95rem/1 var(--wam-font);
  letter-spacing: 0.04em;
  white-space: nowrap;
  transition: color 0.3s ease;
}
.wam-wl-switch button b { font-weight: 800; letter-spacing: 0.12em; }
.wam-wl-switch .wam-tl-mark { width: 30px; height: 30px; flex: none; color: currentColor; transition: transform 0.5s var(--wam-spring); }
.wam-wl-switch .wam-tl-word { height: 21px; }
.wam-wl-switch button:hover { color: var(--wam-white); }
.wam-wl-switch button[data-edition="prime"][aria-selected="true"] { color: var(--wl-ivory); }
.wam-wl-switch button[data-edition="prime"][aria-selected="true"] .wam-tl-mark { color: var(--wl-gold); }
.wam-wl-switch button[data-edition="relic"][aria-selected="true"] { color: #ece9ff; }
.wam-wl-switch button[data-edition="relic"][aria-selected="true"] .wam-tl-mark { color: var(--wl-astral); filter: drop-shadow(0 0 6px rgba(125, 111, 224, 0.6)); }
.wam-wl-switch button[aria-selected="false"] .wam-tl-mark { opacity: 0.6; }
.wam-wl-thumb {
  position: absolute;
  z-index: -1;
  top: 6px;
  bottom: 6px;
  left: 6px;
  width: calc(50% - 6px);
  border-radius: 13px;
  background: linear-gradient(180deg, #3a3020, #2a2318);
  box-shadow: inset 0 0 0 1px rgba(231, 191, 98, 0.45), 0 6px 18px rgba(0, 0, 0, 0.35);
  transition: transform 0.55s var(--wam-spring), background 0.4s ease, box-shadow 0.4s ease;
}
.wam-wl[data-edition="relic"] .wam-wl-thumb {
  transform: translateX(100%);
  background: linear-gradient(180deg, #262046, #17142c);
  box-shadow: inset 0 0 0 1px rgba(201, 196, 255, 0.5), 0 0 22px rgba(125, 111, 224, 0.3);
}

/* ------------------------------------------------------------- panels -- */

.wam-wl-panel { display: grid; gap: 56px; }
.wam-wl-panel:not(.is-on),
.wam-wl-panel[hidden] { display: none; }
/* Only when the reader switches: the page itself arrives at rest. */
.wam-wl.is-switched .wam-wl-panel.is-on { animation: wl-panel-in 0.6s var(--wam-ease) both; }
.wam-wl[data-dir="back"] .wam-wl-panel.is-on { animation-name: wl-panel-in-back; }
@keyframes wl-panel-in { from { opacity: 0; translate: 60px 0; filter: blur(6px); } }
@keyframes wl-panel-in-back { from { opacity: 0; translate: -60px 0; filter: blur(6px); } }

.wam-wl-block { display: grid; gap: 22px; scroll-margin-top: 110px; }
.wam-wl .wam-sec-head .wam-wl-title { margin: 0; }

/* --------------------------------------------------------------- hero -- */

.wam-wl-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 44px;
  align-items: center;
  padding: 34px;
  border-radius: 24px;
  background: radial-gradient(700px 320px at 0% 50%, rgba(231, 191, 98, 0.12), transparent 70%), var(--wam-surface-2);
  border: 1px solid var(--wam-line);
  overflow: hidden;
}
.wam-wl-hero-mark { position: relative; display: grid; place-items: center; min-height: 250px; }
.wam-wl-hero-mark .wam-tl-great { position: absolute; --size: 330px; opacity: 0.2; }
.wam-wl-hero-mark .wam-tl-lockup { position: relative; width: clamp(240px, 31vw, 400px); height: auto; }
.wam-wl-hero-text { display: grid; gap: 16px; }
.wam-wl-lede { color: var(--wam-faded); font-size: 1.08rem; line-height: 1.7; }
.wam-wl-pills { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.wam-wl-pills li {
  padding: 6px 13px;
  border-radius: 999px;
  background: rgba(231, 191, 98, 0.1);
  box-shadow: inset 0 0 0 1px rgba(231, 191, 98, 0.35);
  color: var(--wl-ivory);
  font-size: 0.82rem;
  font-weight: 600;
}

/* ------------------------------------------------------------- notice -- */

.wam-wl-notice {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  column-gap: 14px;
  row-gap: 2px;
  margin-top: -22px;
  padding: 16px 18px;
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(255, 192, 77, 0.13), rgba(255, 192, 77, 0.04));
  box-shadow: inset 3px 0 0 var(--wl-amber);
  color: var(--wam-faded);
}
.wam-wl-notice::before {
  content: "";
  grid-row: span 2;
  width: 26px;
  height: 26px;
  margin-top: 2px;
  background: var(--wl-amber);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h12M6 22h12M7 2c0 5 10 6 10 10S7 17 7 22M17 2c0 5-10 6-10 10s10 5 10 10' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 2h12M6 22h12M7 2c0 5 10 6 10 10S7 17 7 22M17 2c0 5-10 6-10 10s10 5 10 10' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
  animation: wl-turn 6s ease-in-out infinite;
}
@keyframes wl-turn { 0%, 42% { rotate: 0deg; } 50%, 92% { rotate: 180deg; } 100% { rotate: 360deg; } }
.wam-wl-notice-title { color: var(--wl-amber); font-weight: 700; }

/* -------------------------------------------------------------- atlas -- */

.wam-wl-ctabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.wam-wl-ctab {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 11px 16px;
  border: 0;
  border-radius: 12px;
  background: var(--wam-surface-2);
  box-shadow: inset 0 0 0 1px var(--wam-line);
  cursor: pointer;
  color: var(--wam-faded);
  font: 600 0.95rem/1.2 var(--wam-font);
  transition: background-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}
.wam-wl-ctab:hover { color: var(--wam-white); background: var(--wam-surface-3); }
.wam-wl-ctab[aria-selected="true"] { color: #1a1200; background: var(--wl-gold); box-shadow: 0 8px 20px rgba(231, 191, 98, 0.25); }
.wam-wl-ctab-n { font-size: 0.72rem; font-weight: 800; opacity: 0.6; }

.wam-wl-continents { display: grid; gap: 56px; }
.wam-wl-continents.is-tabbed .wam-wl-continent:not(.is-on) { display: none; }
.wam-wl-continents.is-tabbed .wam-wl-continent.is-on { animation: wl-rise 0.55s var(--wam-ease) both; }
@keyframes wl-rise { from { opacity: 0; translate: 0 16px; } }

.wam-wl-continent {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 32px;
  align-items: start;
  scroll-margin-top: 110px;
}
.wam-wl-continent.is-tall { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }

.wam-wl-map { position: relative; border-radius: 16px; overflow: hidden; background: #2a2a20; box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45); }
.wam-wl-map img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; cursor: zoom-in; transition: scale 0.8s var(--wam-ease); }
.wam-wl-continent.is-tall .wam-wl-map img { aspect-ratio: 724 / 1024; }
.wam-wl-map:hover img { scale: 1.04; }

.wam-wl-ctext { display: grid; gap: 14px; align-content: start; color: var(--wam-faded); }
.wam-wl .wam-wl-cname { margin: 0; font: 700 clamp(1.7rem, 3vw, 2.3rem)/1.1 var(--wl-serif); letter-spacing: 0.02em; color: var(--wl-ivory); }
.wam-wl-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.wam-wl-facts li {
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  box-shadow: inset 0 0 0 1px var(--wam-line);
  color: var(--wam-white);
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
}
.wam-wl-facts strong { display: block; margin-bottom: 2px; color: var(--wl-faint); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.wam-wl .wam-wl-sub { margin: 6px 0 0; color: var(--wl-ivory); font-size: 1.02rem; font-weight: 700; }
.wam-wl-jump a { color: var(--wl-gold); font-weight: 700; text-decoration: none; }
.wam-wl-jump a:hover { text-decoration: underline; }

.wam-wl-uncharted {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 320px;
  border-radius: 16px;
  background: radial-gradient(circle at 50% 45%, #2b2618, var(--wam-surface-2) 70%);
  border: 1px dashed rgba(231, 191, 98, 0.35);
  color: var(--wl-gold);
  text-align: center;
}
.wam-wl-uncharted .wam-tl-mark { width: 86px; height: 86px; opacity: 0.55; animation: tl-spin 40s linear infinite; }
.wam-wl-uncharted span { font: 700 1.2rem/1 var(--wl-serif); letter-spacing: 0.3em; }
.wam-wl-uncharted small { color: var(--wl-faint); }

/* ------------------------------------------------------------ DM note -- */

.wam-wl-dm { display: grid; gap: 8px; padding: 22px 24px; border-radius: 18px; background: var(--wam-surface-2); border: 1px solid var(--wam-line); color: var(--wam-faded); }

/* ----------------------------------------------------------------- war -- */

.wam-wl-war { padding: 34px; border-radius: 24px; background: linear-gradient(160deg, #2a1414, var(--wam-surface-2) 55%); border: 1px solid var(--wam-line); }
.wam-wl-war-text { max-width: 80ch; color: var(--wam-faded); }
.wam-wl-board-head { display: grid; gap: 4px; margin-top: 10px; }
.wam-wl .wam-wl-board-head h3 { margin: 0; color: var(--wam-white); font: 700 1.25rem/1.3 var(--wam-font); }
.wam-wl-board-head p { color: var(--wl-faint); }
.wam-wl-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.wam-wl-side { display: grid; gap: 10px; align-content: start; padding: 14px; border-radius: 16px; background: rgba(0, 0, 0, 0.25); box-shadow: inset 0 3px 0 var(--side); }
.wam-wl-side-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; color: var(--side); font-weight: 800; }
.wam-wl-count { padding: 1px 9px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); color: var(--wam-white); font-size: 0.78rem; }
.wam-wl-kin { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.wam-wl-kin li {
  display: grid;
  padding: 6px 11px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  font-size: 0.86rem;
  line-height: 1.25;
  transition: background-color 0.2s ease, translate 0.2s var(--wam-ease);
}
.wam-wl-kin li:hover { background: rgba(255, 255, 255, 0.12); translate: 0 -2px; }
.wam-wl-kin strong { font-weight: 600; }
.wam-wl-kin em { color: var(--wl-faint); font-size: 0.72rem; font-style: normal; }
.wam-wl-side.is-veterans { --side: var(--wl-gold); }
.wam-wl-side.is-brigade { --side: var(--wl-cyan); }
.wam-wl-side.is-neutral { --side: #b9b9c4; }
.wam-wl-side.is-enslaved { --side: var(--wl-red); }
.wam-wl-side.is-absent { --side: #8a8a9c; }
.wam-wl-side.is-hated { --side: #c79bf2; }

/* -------------------------------------------------- Gezerit, teasers -- */

.wam-wl-gezerit .wam-wl-map img { aspect-ratio: 4 / 3; max-height: 680px; }
.wam-wl-gezerit .wp-element-caption { display: flex; gap: 10px; align-items: baseline; margin: 10px 0 0; color: var(--wl-faint); text-align: left; }
.wam-wl-gezerit .wp-element-caption strong { color: var(--wl-ivory); font: 700 1.05rem var(--wl-serif); letter-spacing: 0.1em; }
.wam-wl-gezerit .wam-wl-map { overflow: visible; background: none; box-shadow: none; }
.wam-wl-gezerit .wam-wl-map img { border-radius: 16px; box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45); }

.wam-wl-teasers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.wam-wl-teaser { display: grid; gap: 8px; align-content: start; padding: 24px; border-radius: 18px; background: var(--wam-surface-2); border: 1px dashed rgba(231, 191, 98, 0.35); color: var(--wam-faded); }
.wam-wl .wam-wl-teaser h3 { margin: 0; color: var(--wl-ivory); font: 700 1.35rem/1.2 var(--wl-serif); }
.wam-wl-teaser-art { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 6px; }
.wam-wl-teaser-art img { display: block; height: 150px; width: auto; border-radius: 12px; background: #fff; }
.wam-wl-teaser-art .is-pixel img { background: #000; image-rendering: pixelated; }
.wam-wl-teaser-art .wp-element-caption { margin: 4px 0 0; color: var(--wl-faint); font-size: 0.75rem; }

/* --------------------------------------------- RELIC, under construction -- */
/* Hub theming, not RELIC's own look: the RELIC logo sits in the middle of it
   in its true colours. */

.wam-wl-construct {
  position: relative;
  isolation: isolate;
  min-height: 620px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 28px;
  background: radial-gradient(circle at 50% 45%, #2b1405, #0d0705 75%);
  border: 1px solid rgba(255, 138, 31, 0.25);
}
.wam-wl-holo {
  position: absolute;
  inset: -60px;
  z-index: -2;
  background-image: linear-gradient(to right, rgba(255, 138, 31, 0.12) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 138, 31, 0.12) 1px, transparent 1px);
  background-size: 46px 46px;
  animation: wl-drift 14s linear infinite;
  -webkit-mask: radial-gradient(ellipse at center, #000 30%, transparent 75%);
          mask: radial-gradient(ellipse at center, #000 30%, transparent 75%);
}
@keyframes wl-drift { to { transform: translate(46px, 46px); } }
.wam-wl-construct::after { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; background: repeating-linear-gradient(180deg, rgba(0, 0, 0, 0.22) 0 1px, transparent 1px 3px); }
.wam-wl-tape {
  position: absolute;
  left: -10%;
  z-index: 1;
  width: 120%;
  height: 48px;
  overflow: hidden;
  display: flex;
  align-items: center;
  color: #1b0d00;
  background: linear-gradient(115deg, var(--wl-orange), var(--wl-amber) 22%, #ff6a00 38%, var(--wl-cyan) 50%, var(--wl-orange) 62%, var(--wl-amber) 80%, #ff6a00);
  background-size: 300% 100%;
  animation: wl-holo 7s linear infinite;
  box-shadow: 0 0 28px rgba(255, 138, 31, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.25) inset;
  opacity: 0.92;
}
.wam-wl-tape::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, rgba(0, 0, 0, 0.12) 0 18px, transparent 18px 36px); }
.wam-wl-tape.t1 { top: 16%; rotate: -8deg; }
.wam-wl-tape.t2 { top: 50%; rotate: 6deg; }
.wam-wl-tape.t3 { bottom: 12%; rotate: -4deg; height: 40px; opacity: 0.8; }
@keyframes wl-holo { to { background-position: 300% 0; } }
.wam-wl-tape-track {
  position: relative;
  display: flex;
  align-items: center;
  gap: 22px;
  width: max-content;
  padding-left: 22px;
  white-space: nowrap;
  font: 700 1rem/1 var(--wl-tech);
  letter-spacing: 0.32em;
  animation: wl-crawl 26s linear infinite;
}
.wam-wl-tape.t2 .wam-wl-tape-track { animation-direction: reverse; animation-duration: 22s; }
.wam-wl-tape.t3 .wam-wl-tape-track { animation-duration: 34s; }
.wam-wl-tape-track .wam-wl-tri { width: 20px; height: 18px; flex: none; }
@keyframes wl-crawl { to { transform: translateX(-50%); } }
.wam-wl-err { position: absolute; z-index: 2; color: var(--wl-amber); filter: drop-shadow(0 0 10px rgba(255, 192, 77, 0.65)); animation: wl-blink 2.4s ease-in-out infinite; }
.wam-wl-err .wam-wl-tri { display: block; width: 100%; height: 100%; }
.wam-wl-err.e1 { top: 8%; left: 9%; width: 54px; height: 50px; }
.wam-wl-err.e2 { top: 30%; right: 8%; width: 40px; height: 37px; animation-delay: -0.8s; }
.wam-wl-err.e3 { bottom: 26%; left: 14%; width: 34px; height: 31px; animation-delay: -1.5s; }
.wam-wl-err.e4 { bottom: 6%; right: 18%; width: 60px; height: 55px; animation-delay: -0.4s; }
.wam-wl-err.e5 { top: 66%; left: 46%; width: 26px; height: 24px; animation-delay: -1.1s; }
@keyframes wl-blink { 0%, 100% { opacity: 1; scale: 1; } 50% { opacity: 0.3; scale: 0.92; } }
.wam-wl-core {
  position: relative;
  z-index: 4;
  display: grid;
  justify-items: center;
  gap: 12px;
  margin: 0 16px;
  padding: 34px 38px;
  border-radius: 22px;
  background: rgba(13, 7, 5, 0.86);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 138, 31, 0.35);
  box-shadow: 0 0 60px rgba(255, 138, 31, 0.18);
  text-align: center;
  overflow: hidden;
}
.wam-wl-core .wam-tl-great { position: absolute; top: 50%; left: 50%; --size: 360px; translate: -50% -50%; opacity: 0.16; }
.wam-wl-core .wam-tl-lockup { position: relative; width: clamp(220px, 30vw, 360px); height: auto; }
.wam-wl-core-title {
  position: relative;
  margin-top: 6px !important;
  color: var(--wl-orange);
  font: 700 clamp(1.4rem, 3vw, 2rem)/1 var(--wl-tech);
  letter-spacing: 0.24em;
  text-transform: uppercase;
  text-shadow: -2px 0 rgba(89, 230, 255, 0.5), 2px 0 rgba(255, 79, 216, 0.4);
  animation: wl-jitter 5s steps(1) infinite;
}
@keyframes wl-jitter { 0%, 86%, 100% { translate: 0 0; } 88% { translate: -4px 1px; } 91% { translate: 3px -1px; } }
.wam-wl-core-note { position: relative; color: rgba(255, 225, 194, 0.75); }

/* ------------------------------------------------------------- phones -- */

@media (max-width: 960px) {
  .wam-wl-hero { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .wam-wl-pills { justify-content: center; }
  .wam-wl-continent,
  .wam-wl-continent.is-tall { grid-template-columns: 1fr; }
  .wam-wl-continent.is-tall .wam-wl-map img { max-height: 560px; aspect-ratio: auto; }
  .wam-wl-board,
  .wam-wl-teasers { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .wam-wl-head,
  .wam-wl-panels { width: calc(100% - 32px); }
  .wam-wl-switch button { padding: 11px 8px; gap: 7px; font-size: 0.82rem; }
  .wam-wl-switch .wam-tl-mark { width: 24px; height: 24px; }
  .wam-wl-switch .wam-tl-word { height: 16px; }
  .wam-wl-hero,
  .wam-wl-war { padding: 22px 16px; }
  .wam-wl-hero-mark { min-height: 200px; }
  .wam-wl-hero-mark .wam-tl-great { --size: 250px; }
  .wam-wl-construct { min-height: 540px; }
  .wam-wl-core { padding: 26px 18px; }
}

@media (prefers-reduced-motion: reduce) {
  .wam-wl *, .wam-wl *::before, .wam-wl *::after { animation: none !important; transition-duration: 0.01ms !important; }
}