/* Market Wize site chat widget + homepage notice box. INTERNAL DRAFT 17.10.2026.
   Uses the MW design tokens from styles.css (:root --ink, --red, ...) with fallbacks, so it also works standalone.
   Launcher: MW Site A/B look and markup (Appeal Central mascot + "Need help?" pill, or pill with the mascot inside). z-index via --mwc-z (40). */
.mwc { position: fixed; z-index: var(--mwc-z, 40); right: calc(1.25rem + env(safe-area-inset-right, 0px)); bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px)); font-family: var(--sans, "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif); color: var(--ink, #1d1d1f); pointer-events: none; }
.mwc { --mwc-z: 40; /* same stacking as the live .mw-intake and the MW Site mockup decision (mobile nav sits at 41/42) */
  --mwc-ink: var(--ink, #1d1d1f); --mwc-soft: var(--ink-soft, #515154); --mwc-red: var(--red, #e10600); letter-spacing: -0.012em; }
/* accent (Nir 17.10.2026): red by default on the homepage and the rest of the site, blue only on /appeals.
   Set <html data-accent="red|blue"> or <script src="mw-chat.js" data-accent="red|blue">; the JS copies the resolved value to .mwc and the hero box.
   red = the MW --red token (#e10600). blue = the Appeal Central --blue-deep (#1E8CFF) for borders, rings and glows, and the AC --link (#074C8F)
   for text on white and fills under white text, because white on #1E8CFF is only about 3.4:1. */
.mwc, .mwc-hero {
  --mwc-accent: var(--red, #e10600); --mwc-accent-ink: var(--red, #e10600);
  --mwc-accent-soft: var(--red-soft, rgba(225, 6, 0, 0.08)); --mwc-accent-ring: rgba(225, 6, 0, 0.3); --mwc-accent-glow: rgba(225, 6, 0, 0.3);
}
html[data-accent="blue"] .mwc-hero:not([data-accent="red"]), .mwc[data-accent="blue"], .mwc-hero[data-accent="blue"] {
  --mwc-accent: #1E8CFF; --mwc-accent-ink: #074C8F;
  --mwc-accent-soft: rgba(30, 140, 255, 0.1); --mwc-accent-ring: rgba(30, 140, 255, 0.35); --mwc-accent-glow: rgba(30, 140, 255, 0.3);
}
.mwc > * { pointer-events: auto; }
.mwc[hidden], .mwc-launcher[hidden], .mwc-panel[hidden] { display: none !important; }
/* mobile backdrop (live .mw-intake-backdrop): hidden on desktop, dims the page on phones while the panel is open, tap closes */
.mwc-backdrop { display: none; }
.mwc-backdrop[hidden] { display: none !important; }
/* head buttons: Start over (live mw-intake.js) beside Close */
.mwc-head-btns { display: flex; align-items: center; gap: .35rem; flex: 0 0 auto; }
.mwc-restart { border: 0; background: transparent; color: var(--mwc-soft); font: inherit; font-size: .8125rem; cursor: pointer; padding: .35rem .5rem; border-radius: 980px; }
.mwc-restart:hover, .mwc-restart:focus-visible { color: var(--mwc-accent-ink); outline: 2px solid var(--mwc-accent-ring); outline-offset: 1px; }
.mwc-restart[hidden] { display: none !important; }
.mwc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* launcher: same A/B look and markup as the MW Site mockup (/workspace/mw-onesite-mockup-v1/mw-chat.css), switched by .mwc[data-launcher]
   A = Appeal Central mascot (assets/mascot.svg) in a white circle beside a text pill; B = pill with the mascot small inside it, in place of the chat icon.
   Launcher art (Nir 17:29) ported natively from MW Site's mockup v7.2 override (mockup/bot-avatar-override.css/.js), same markup and CSS values.
   widget/assets/mw-mascot-badge.png and mw-mascot-glasses.png stay in the folder but are no longer used. */
/* Optical centering (from the v7.2 override). The bubble tail sits bottom left, so the SVG's geometric center is not its visual center.
   Measured on a 590px render: ink centroid at x 288.3, y 263.8 (canvas center 295, 295), so the art is moved
   1.1% right and 5.3% down (of the art size) to put the centroid on the slot center. Seen from that centroid,
   the farthest ink (the tail tip) is 0.64 of the art size away, so the art is 68% of the slot diameter:
   0.68 x 0.64 = 0.435 of the diameter, which keeps the tail inside the circle with air. */
.mwc {
  --mwc-av: url("assets/mascot.svg"); /* relative to this CSS file, so it also works from /now/ pages that load ../mw-chat.css */
  --mwc-av-scale: 0.68;
  --mwc-av-ox: 0.011;
  --mwc-av-oy: 0.053;
}
.mwc-launcher {
  appearance: none; border: 0; padding: 0; margin: 0; background: none;
  display: inline-flex; align-items: center; gap: 0.45rem;
  font: inherit; color: var(--mwc-ink); cursor: pointer;
  transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
}
.mwc-launcher:hover { transform: translateY(-2px); }
.mwc-launcher:focus-visible { outline: none; }
.mwc-launcher:focus-visible .mwc-launcher-pill { outline: 3px solid var(--mwc-accent-ring); outline-offset: 3px; }
.mwc-launcher-pill {
  display: inline-flex; align-items: center; gap: 0.6rem;
  height: 3.25rem; padding: 0 1.25rem 0 0.4rem;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 980px;
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.06);
  font-size: 0.98rem; font-weight: 700; letter-spacing: -0.02em;
  transition: box-shadow 0.25s ease;
}
.mwc-launcher:hover .mwc-launcher-pill { box-shadow: 0 16px 36px rgba(0, 0, 0, 0.16), 0 1px 2px rgba(0, 0, 0, 0.06); }
/* launcher B: the mascot replaces the small chat icon in the pill (slot 2.45rem). The chat icon svg stays in the markup, hidden. */
.mwc-launcher-ico {
  --d: 2.45rem;
  display: grid; place-items: center;
  width: 2.45rem; height: 2.45rem;
  border-radius: 50%;
  color: #fff;
  background-image: var(--mwc-av);
  background-repeat: no-repeat;
  background-color: #fff;
  background-size: calc(var(--d) * var(--mwc-av-scale)) calc(var(--d) * var(--mwc-av-scale));
  background-position:
    calc(50% + var(--d) * var(--mwc-av-scale) * var(--mwc-av-ox))
    calc(50% + var(--d) * var(--mwc-av-scale) * var(--mwc-av-oy));
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08), 0 4px 10px rgba(0, 0, 0, 0.1);
}
.mwc-launcher-ico svg { display: block; width: 1.2rem; height: 1.2rem; visibility: hidden; }
/* launcher A: img.mwc-mascot shows the mascot (JS sets src, CSS content as a backstop), centered optically through
   asymmetric padding (art box = scale x diameter). Sizes 4rem, 3.6rem on phones. */
.mwc-mascot {
  --d: 4rem;
  --art: calc(var(--d) * var(--mwc-av-scale));
  --pad: calc((var(--d) - var(--art)) / 2);
  display: none;
  box-sizing: border-box;
  width: var(--d); height: var(--d);
  padding:
    calc(var(--pad) + var(--art) * var(--mwc-av-oy))
    calc(var(--pad) - var(--art) * var(--mwc-av-ox))
    calc(var(--pad) - var(--art) * var(--mwc-av-oy))
    calc(var(--pad) + var(--art) * var(--mwc-av-ox));
  border-radius: 50%;
  background: #fff;
  object-fit: contain;
  content: var(--mwc-av);
  filter: none;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.04);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}
.mwc-launcher:hover .mwc-mascot { transform: rotate(-6deg) scale(1.04); }
/* A: mascot beside a text pill (pill drops its own icon) */
.mwc[data-launcher="a"] .mwc-mascot { display: block; order: 2; }
.mwc[data-launcher="a"] .mwc-launcher-pill { order: 1; padding: 0 1.2rem; height: 2.85rem; }
.mwc[data-launcher="a"] .mwc-launcher-ico { display: none; }
/* B: pill only (the mascot sits inside it, in .mwc-launcher-ico) */
.mwc[data-launcher="b"] .mwc-mascot { display: none; }
/* the panel replaces the launcher while open (the engine panel sits in the flow, so display none instead of the mockup's opacity) */
.mwc.is-open .mwc-launcher { display: none; }

/* RED skin (default, every page except /appeals; Nir 19:29): the live MW red M "Need help?" launcher.
   Markup, CSS values and images copied from the live site (mw-site-Oct-V-16.1: mw-intake.js + styles.css "Need help? soft chat
   (Sep-V-4.7)", assets/need-help-launcher.png 320x320 and need-help-launcher-icon.png 160x160). Class names are namespaced
   .mwc-red-* (live: .mw-intake-*) so the site's leftover .mw-intake rules can never restyle the engine. Plate with a dismiss x;
   after dismiss it collapses to the orb (sessionStorage "mw-need-help-launcher", same key as live). No mascot on this skin. */
.mwc[data-skin="red"]:not(.is-open) { right: 0.85rem; bottom: calc(0.85rem + env(safe-area-inset-bottom, 0px)); }
.mwc-red-launcher { position: relative; display: inline-flex; flex-direction: column; align-items: flex-end; gap: 0; }
.mwc-red-launcher[hidden] { display: none !important; }
.mwc.is-open .mwc-red-launcher { display: none; }
.mwc-red-plate {
  display: inline-flex; flex-direction: column; align-items: center;
  padding: 0; border: 0; background: transparent; cursor: pointer; font: inherit;
  -webkit-tap-highlight-color: transparent;
  filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.18));
}
.mwc-red-plate:focus-visible { outline: 2px solid var(--red, #e10600); outline-offset: 4px; border-radius: 1rem; }
.mwc-red-art-wrap {
  display: block; width: 6.5rem; height: 6.5rem; border-radius: 1.15rem; overflow: hidden;
  background: rgba(255, 255, 255, 0.42);
  backdrop-filter: blur(10px) saturate(1.05); -webkit-backdrop-filter: blur(10px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.55);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
}
.mwc-red-art { display: block; width: 100%; height: 100%; object-fit: contain; transform-origin: 50% 42%; }
@media (prefers-reduced-motion: no-preference) {
  @keyframes mwc-red-glasses {
    0%, 100% { transform: rotate(0deg) translateY(0); }
    18% { transform: rotate(-4.5deg) translateY(-2px); }
    36% { transform: rotate(4deg) translateY(0); }
    54% { transform: rotate(-3.2deg) translateY(-2px); }
    72% { transform: rotate(2.4deg) translateY(0); }
    88% { transform: rotate(-1.2deg) translateY(-1px); }
  }
  .mwc-red-art { animation: mwc-red-glasses 3.6s ease-in-out infinite; }
  .mwc.is-open .mwc-red-art { animation: none; }
}
@media (prefers-reduced-motion: reduce) { .mwc-red-art { animation: none !important; } }
.mwc-red-plate-x {
  position: absolute; top: -0.35rem; right: -0.35rem; z-index: 2;
  width: 1.55rem; height: 1.55rem; border-radius: 50%;
  border: 1px solid var(--line, #d2d2d7); background: rgba(255, 255, 255, 0.92); color: var(--ink-soft, #515154);
  font: inherit; font-size: 1.05rem; line-height: 1; cursor: pointer;
  display: grid; place-items: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12); padding: 0;
}
.mwc-red-plate-x:hover, .mwc-red-plate-x:focus-visible { color: var(--red, #e10600); outline: none; }
.mwc-red-orb {
  display: none; width: 3.35rem; height: 3.35rem; border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.35); background: rgba(255, 255, 255, 0.22);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  padding: 0.2rem; cursor: pointer; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
  opacity: 0.55; transition: opacity 0.2s ease, transform 0.2s ease;
}
.mwc-red-orb:hover, .mwc-red-orb:focus-visible { opacity: 0.88; outline: none; transform: translateY(-1px); }
.mwc-red-orb-img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }
.mwc-red-launcher[data-mode="plate"] .mwc-red-plate-x { display: grid; }
.mwc-red-launcher[data-mode="plate"] .mwc-red-plate { display: inline-flex; }
.mwc-red-launcher[data-mode="plate"] .mwc-red-orb { display: none; }
.mwc-red-launcher[data-mode="orb"] .mwc-red-plate, .mwc-red-launcher[data-mode="orb"] .mwc-red-plate-x { display: none !important; }
.mwc-red-launcher[data-mode="orb"] .mwc-red-orb { display: grid; place-items: center; }
/* red skin bot avatar: the red M icon (need-help-launcher-icon.png, round art) */
.mwc[data-skin="red"] .mwc-avatar { border-radius: 50%; }

/* panel */
.mwc-panel { position: relative; width: min(24rem, calc(100vw - 1.7rem)); height: min(40rem, calc(100vh - 2rem)); display: flex; flex-direction: column; background: var(--paper, #fff); border: 1px solid var(--line, #d2d2d7); border-radius: 1.35rem; box-shadow: 0 18px 48px rgba(0,0,0,.16); overflow: hidden; }
.mwc-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .85rem 1rem; border-bottom: 1px solid var(--line, #d2d2d7); background: var(--paper-soft, #f5f5f7); }
.mwc-head-text { display: flex; flex-direction: column; }
.mwc-head strong { font-size: 1.05rem; font-weight: 800; letter-spacing: -.03em; }
.mwc-sub { font-size: .78rem; font-weight: 600; color: var(--mwc-accent-ink); letter-spacing: -.01em; }
.mwc-close { border: 0; background: transparent; color: var(--ink-soft, #515154); font: inherit; font-size: .875rem; font-weight: 600; cursor: pointer; padding: .5rem .6rem; min-height: 2.75rem; border-radius: .45rem; }
.mwc-close:hover, .mwc-close:focus-visible { color: var(--mwc-accent-ink); }
.mwc-log { flex: 1 1 auto; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .7rem; }
.mwc-msg { max-width: 92%; padding: .72rem .9rem; border-radius: 1.1rem; font-size: .93rem; line-height: 1.45; letter-spacing: -.012em; white-space: pre-wrap; overflow-wrap: anywhere; }
.mwc-msg-bot { align-self: flex-start; background: var(--paper-soft, #f5f5f7); border-bottom-left-radius: .35rem; position: relative; margin-left: 2.25rem; max-width: calc(92% - 2.25rem); }
/* bot avatar: the Appeal Central mascot (assets/mascot.svg), beside each bot message and in the panel head */
.mwc-avatar { display: block; width: 1.75rem; height: 1.75rem; object-fit: contain; flex: none; }
.mwc-msg-bot > .mwc-avatar { position: absolute; left: -2.25rem; bottom: 0; }
.mwc-head-id { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.mwc-head-avatar { width: 2.25rem; height: 2.25rem; }
.mwc-msg-user { align-self: flex-end; background: var(--mwc-accent-ink); color: #fff; border-bottom-right-radius: .35rem; }
.mwc-disclaimer { font-size: .8rem; color: var(--ink-soft, #515154); background: #fff; border: 1px solid var(--line, #d2d2d7); }
.mwc-wait { color: var(--ink-soft, #515154); font-style: italic; }
.mwc-chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.mwc-chip { border: 1px solid var(--mwc-accent); background: #fff; color: var(--mwc-accent-ink); border-radius: 980px; padding: .55rem .85rem; font: inherit; font-size: .85rem; font-weight: 600; cursor: pointer; min-height: 2.5rem; }
.mwc-chip:hover, .mwc-chip:focus-visible { background: var(--mwc-accent-soft); }
.mwc-foot { border-top: 1px solid var(--line, #d2d2d7); padding: .7rem 1rem .8rem; display: flex; flex-direction: column; gap: .45rem; }
.mwc-form { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "q q" "a s"; gap: .45rem; align-items: center; }
.mwc-input { grid-area: q; width: 100%; border: 1px solid var(--line, #d2d2d7); border-radius: 1rem; padding: .65rem .85rem; font: inherit; font-size: .93rem; background: var(--paper-soft, #f5f5f7); resize: none; min-height: 2.9rem; max-height: 8rem; color: inherit; }
.mwc-input:focus { outline: 2px solid var(--mwc-accent-ring); border-color: var(--mwc-accent); background: #fff; }
.mwc-attach { grid-area: a; justify-self: start; display: inline-flex; align-items: center; gap: .35rem; border: 1px solid var(--line, #d2d2d7); background: #fff; color: var(--ink, #1d1d1f); border-radius: 980px; padding: .45rem .8rem; font: inherit; font-size: .82rem; font-weight: 600; cursor: pointer; min-height: 2.5rem; }
.mwc-attach-ico { font-weight: 800; color: var(--mwc-accent-ink); }
.mwc-send { grid-area: s; border: 0; border-radius: 980px; background: var(--mwc-accent-ink); color: #fff; font: inherit; font-weight: 700; font-size: .875rem; padding: .7rem 1.2rem; cursor: pointer; min-height: 2.5rem; }
.mwc-send:disabled { opacity: .55; cursor: default; }
.mwc-file { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: var(--ink-soft, #515154); }
.mwc-file[hidden] { display: none; }
.mwc-file-x { border: 0; background: transparent; cursor: pointer; font-size: 1rem; color: var(--ink-soft, #515154); min-width: 2rem; min-height: 2rem; }
.mwc-consent { margin: 0; font-size: .72rem; line-height: 1.35; color: var(--ink-soft, #515154); }
.mwc-error { margin: 0; font-size: .8rem; color: #b00500; }
.mwc-error:empty { display: none; }
.mwc-handoff { align-self: stretch; border: 1px solid var(--mwc-accent); border-radius: 1rem; padding: .8rem; display: grid; gap: .5rem; background: #fff; }
.mwc-handoff-title { margin: 0; font-weight: 800; font-size: .92rem; letter-spacing: -.02em; }
.mwc-doors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; } /* WhatsApp us, Talk to us, Book a call */
.mwc-doors .mwc-cta { padding-left: .5rem; padding-right: .5rem; font-size: .875rem; }
.mwc-cta { display: flex; align-items: center; justify-content: center; text-align: center; text-decoration: none !important; border-radius: 980px; padding: .65rem .9rem; font: inherit; font-weight: 700; font-size: .86rem; cursor: pointer; min-height: 2.6rem; border: 0; }
.mwc-cta-primary { background: var(--mwc-accent-ink); color: #fff !important; }
.mwc-cta-secondary { background: #fff; color: var(--ink, #1d1d1f) !important; border: 1px solid var(--line, #d2d2d7); }
.mwc-lead { display: grid; gap: .45rem; }
.mwc-field { display: grid; gap: .2rem; font-size: .8rem; font-weight: 600; }
.mwc-field input, .mwc-field textarea { font: inherit; font-size: .9rem; font-weight: 400; border: 1px solid var(--line, #d2d2d7); border-radius: .7rem; padding: .55rem .7rem; color: inherit; }
.mwc-check { display: grid; grid-template-columns: auto 1fr; gap: .5rem; font-size: .76rem; line-height: 1.35; align-items: start; }
.mwc-check input { width: 1.15rem; height: 1.15rem; margin-top: .1rem; accent-color: var(--mwc-accent-ink); }
.mwc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.mwc-lead-msg { margin: 0; font-size: .8rem; }
.mwc-lead-done { margin: 0; font-weight: 600; font-size: .9rem; }

/* homepage notice box: plain HTML form[data-mw-hero-paste] in index.html, enhanced by mw-chat.js */
.mwc-hero-up[hidden] { display: none; }
.mwc-hero { margin-top: 2rem; max-width: 40rem; padding: 1.1rem 1.15rem 1rem; border: 1px solid var(--line, #d2d2d7); border-radius: 1.35rem; background: var(--paper, #fff); box-shadow: 0 18px 48px rgba(0,0,0,.08); display: grid; gap: .55rem; }
.mwc-hero-label { font-weight: 800; font-size: 1.2rem; letter-spacing: -.03em; }
.mwc-hero-hint { margin: 0; font-size: .95rem; color: var(--ink-soft, #515154); line-height: 1.4; }
.mwc-hero-input { width: 100%; border: 1px solid var(--line, #d2d2d7); border-radius: 1rem; padding: .8rem .95rem; font: inherit; font-size: 1rem; background: var(--paper-soft, #f5f5f7); resize: vertical; min-height: 6.5rem; color: inherit; }
.mwc-hero-input:focus { outline: 2px solid var(--mwc-accent-ring); border-color: var(--mwc-accent); background: #fff; }
.mwc-hero-row { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.mwc-hero-up { border: 1px solid var(--mwc-accent); color: var(--mwc-accent-ink); background: #fff; border-radius: 980px; padding: .7rem 1.1rem; font: inherit; font-weight: 600; font-size: .95rem; cursor: pointer; min-height: 2.75rem; }
.mwc-hero-file { font-size: .85rem; color: var(--ink-soft, #515154); flex: 1 1 8rem; }
.mwc-hero-go { margin-left: auto; cursor: pointer; }
.mwc-hero-note { margin: 0; font-size: .76rem; color: var(--ink-soft, #515154); }

@media (max-width: 767.98px) {
  .mwc { right: calc(1rem + env(safe-area-inset-right, 0px)); left: auto; bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); }
  .mwc.is-open { left: 0; right: 0; bottom: 0; }
  .mwc.is-open .mwc-panel { width: 100vw; height: min(88vh, calc(100vh - 3rem)); border-radius: 1.35rem 1.35rem 0 0; }
  .mwc-backdrop { display: block; position: fixed; inset: 0; z-index: -1; background: rgba(29, 29, 31, 0.26); border: 0; } /* live values */
  .mwc-launcher-pill { height: 3.1rem; font-size: 0.95rem; }
  .mwc[data-launcher="a"] .mwc-launcher-pill { height: 2.7rem; padding: 0 1rem; }
  .mwc-mascot { --d: 3.6rem; }
  .mwc.is-hero-visible:not(.is-open) .mwc-launcher, .mwc.is-hero-visible:not(.is-open) .mwc-red-launcher { opacity: 0; pointer-events: none; transform: translateY(12px) scale(0.92); }
  .mwc[data-skin="red"]:not(.is-open) { right: 0.65rem; bottom: calc(0.65rem + env(safe-area-inset-bottom, 0px)); } /* live mobile launcher spot */
  .mwc-red-art-wrap { width: 5.75rem; height: 5.75rem; }
  .mwc-hero-go { margin-left: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .mwc-launcher, .mwc-mascot, .mwc-launcher-pill, .mwc-red-orb { transition: none !important; }
}
