/* Three independent, composited colour pools. Text and charts remain stationary. */
.management-overview .mo-motion-card {position:relative;isolation:isolate;overflow:hidden}
.management-overview .mo-motion-card::after {display:none!important}
.management-overview .mo-mesh {position:absolute;z-index:-1;inset:-20%;overflow:hidden;pointer-events:none;opacity:.88;transition:opacity .65s ease}
.management-overview .mo-mesh-blob {
  position:absolute;display:block;left:-22%;top:-14%;width:112%;height:130%;pointer-events:none;
  background:radial-gradient(ellipse at center,var(--mo-blob-colour,#a5d4c6) 0,transparent 68%);
  opacity:var(--mo-blob-strength,.25);transform:translate3d(-8%,-6%,0) scale(1.08);
  --mo-blob-animation:mo-pool-mint;--mo-blob-duration:20s;--mo-blob-delay:-5s;
}
.management-overview .mo-mesh-blob:nth-child(2) {
  left:22%;top:12%;--mo-blob-colour:#d6b4e3;--mo-blob-animation:mo-pool-lilac;--mo-blob-duration:24s;--mo-blob-delay:-13s;
}
.management-overview .mo-mesh-blob:nth-child(3) {
  left:9%;top:30%;--mo-blob-colour:#f2c9a5;--mo-blob-animation:mo-pool-peach;--mo-blob-duration:18s;--mo-blob-delay:-9s;
}
.management-overview[data-mo-motion="enabled"] .mo-mesh-blob {
  animation:var(--mo-blob-animation) var(--mo-blob-duration) cubic-bezier(.45,0,.55,1) var(--mo-blob-delay) infinite alternate;
  animation-play-state:paused;
}
.management-overview[data-mo-motion="enabled"][data-mo-page-visible="true"] .mo-motion-card[data-mo-visible="true"] .mo-mesh-blob {animation-play-state:running}
.management-overview .mo-hero>.mo-mesh {inset:-24%;opacity:1;--mo-blob-strength:.9}
.management-overview .mo-hero .mo-mesh-blob:first-child {--mo-blob-colour:#79d6cc;--mo-blob-duration:18s}
.management-overview .mo-hero .mo-mesh-blob:nth-child(2) {--mo-blob-colour:#c39bdd;--mo-blob-duration:22s}
.management-overview .mo-hero .mo-mesh-blob:nth-child(3) {--mo-blob-colour:#ffc69b;--mo-blob-duration:20s}
.management-overview .mo-invoice-card>.mo-mesh {inset:37% -15% -52%;opacity:.85;--mo-blob-strength:.68;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 30%);mask-image:linear-gradient(to bottom,transparent,#000 30%)}
.management-overview .mo-invoice-card .mo-mesh-blob:first-child {left:-32%;top:-5%;--mo-blob-colour:#a9dfd1;--mo-blob-duration:16s;--mo-blob-delay:-4s}
.management-overview .mo-invoice-card .mo-mesh-blob:nth-child(2) {left:36%;top:-7%;--mo-blob-colour:#d5b0e5;--mo-blob-duration:20s;--mo-blob-delay:-10s}
.management-overview .mo-invoice-card .mo-mesh-blob:nth-child(3) {top:23%;--mo-blob-colour:#eac59e;--mo-blob-duration:18s;--mo-blob-delay:-7s}
.management-overview .mo-expenses>.mo-mesh {inset:-20%;--mo-blob-strength:.16}
.management-overview .mo-metric-inventory>.mo-mesh {--mo-blob-strength:.29}
.management-overview .mo-metric-inventory .mo-mesh-blob:first-child {--mo-blob-colour:#82c1b3;--mo-blob-delay:-10s}
.management-overview .mo-metric-receipts>.mo-mesh {--mo-blob-strength:.22}
.management-overview .mo-metric-receipts .mo-mesh-blob:nth-child(2) {--mo-blob-delay:-4s}
.management-overview .mo-metric-quarantine>.mo-mesh {--mo-blob-strength:.17}
.management-overview .mo-management>.mo-mesh {inset:0 -20% -70%;--mo-blob-strength:.2}
html[data-theme="dark"] .management-overview .mo-metric>.mo-mesh {--mo-blob-strength:.28}

/* Moving colour stays behind the graphite/milk surfaces instead of replacing
   their contrast. These limits also hold while a card is hovered or focused. */
html[data-theme] .management-overview .mo-dashboard .mo-motion-card>.mo-mesh {--mo-blob-strength:.12;opacity:.55}
html[data-theme] .management-overview .mo-dashboard .mo-hero>.mo-mesh {--mo-blob-strength:.16;opacity:.5}
html[data-theme] .management-overview .mo-dashboard .mo-invoice-card>.mo-mesh {--mo-blob-strength:.18;opacity:.6}
html[data-theme] .management-overview .mo-dashboard .mo-management>.mo-mesh {--mo-blob-strength:.09;opacity:.5}
html[data-theme="dark"] .management-overview .mo-dashboard .mo-metric>.mo-mesh {--mo-blob-strength:.1;opacity:.5}

@keyframes mo-pool-mint {
  0% {transform:translate3d(-14%,-9%,0) rotate(-12deg) scale(1.06);opacity:calc(var(--mo-blob-strength,.25) * .8)}
  50% {transform:translate3d(10%,12%,0) rotate(4deg) scale(1.2);opacity:var(--mo-blob-strength,.25)}
  100% {transform:translate3d(24%,-2%,0) rotate(14deg) scale(1.08);opacity:calc(var(--mo-blob-strength,.25) * .87)}
}
@keyframes mo-pool-lilac {
  0% {transform:translate3d(13%,8%,0) rotate(8deg) scale(1.17);opacity:var(--mo-blob-strength,.25)}
  50% {transform:translate3d(-13%,-11%,0) rotate(-10deg) scale(1.06);opacity:calc(var(--mo-blob-strength,.25) * .8)}
  100% {transform:translate3d(-23%,10%,0) rotate(-4deg) scale(1.22);opacity:calc(var(--mo-blob-strength,.25) * .92)}
}
@keyframes mo-pool-peach {
  0% {transform:translate3d(-4%,12%,0) rotate(-10deg) scale(1.12);opacity:calc(var(--mo-blob-strength,.25) * .82)}
  50% {transform:translate3d(15%,-14%,0) rotate(9deg) scale(1.26);opacity:var(--mo-blob-strength,.25)}
  100% {transform:translate3d(-18%,-3%,0) rotate(2deg) scale(1.05);opacity:calc(var(--mo-blob-strength,.25) * .9)}
}

/* Pointer classes support a mouse on touch-first devices; touch gets pressed feedback. */
.management-overview .mo-motion-card.is-mo-hovered>.mo-mesh,
.management-overview .mo-motion-card:focus-within>.mo-mesh {opacity:1}
.management-overview .mo-invoice-card {transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .55s ease,border-color .4s ease}
.management-overview .mo-invoice-card.is-mo-hovered,
.management-overview .mo-invoice-card:focus-visible {transform:translateY(-5px);border-color:#acd6c58c;box-shadow:0 15px 30px #1e312921,inset 0 0 0 1px #bce1d54a}
.management-overview .mo-invoice-art {transition:transform .7s cubic-bezier(.22,1,.36,1)}
.management-overview .mo-invoice-card.is-mo-hovered .mo-invoice-art,
.management-overview .mo-invoice-card:focus-visible .mo-invoice-art {transform:translateY(-8px) rotate(-5deg) scale(1.06)}
.management-overview :is(.mo-invoice-card,.mo-management-link,.mo-expense-row,.mo-primary-button,.mo-soft-button,.mo-year-button,.mo-icon-button,.mo-metric-action).is-mo-pressed {transform:translateY(1px) scale(.985);box-shadow:inset 0 0 0 2px #88b6a970}
.management-overview .mo-invoice-card.is-mo-pressed .mo-invoice-art {transform:translateY(-2px) scale(.98)}

/* Motion is automatic, with the device's reduced-motion preference respected. */
@media (prefers-reduced-motion:reduce) {
  .management-overview .mo-motion-card.is-mo-hovered,
  .management-overview .mo-motion-card:focus-visible,
  .management-overview .is-mo-pressed,
  .management-overview .mo-metric-action:is(:hover,:focus-visible,:active),
  .management-overview .mo-invoice-card:is(.is-mo-hovered,.is-mo-pressed,:focus-visible) .mo-invoice-art {transform:none!important}
  .management-overview .mo-mesh-blob {animation:none!important}
}