/** * Micro FX - Styles * All transforms GPU-accelerated. No layout triggers. */ /* Custom cursor */ .mfx-cursor{position:fixed;top:0;left:0;pointer-events:none;z-index:2147483647;border-radius:50%;transition:width .15s,height .15s,opacity .15s,background .15s;border:1.5px solid var(--mfx-ring, rgba(255,255,255,.9));box-shadow:0 0 0 1px rgba(0,0,0,.25),0 1px 4px rgba(0,0,0,.3);will-change:transform;} .mfx-cursor--hidden{opacity:0;} .mfx-cursor--link{width:40px!important;height:40px!important;background:rgba(255,255,255,.2)!important;border:1px solid rgba(255,255,255,.4)!important;} /* Magnetic */ [data-fx~="magnetic"]{transition:transform .2s cubic-bezier(.25,.46,.45,.94);} /* Ripple */ [data-fx~="ripple"]{position:relative;overflow:hidden;} .mfx-ripple{position:absolute;border-radius:50%;transform:scale(0);animation:mfxRipple .6s ease-out forwards;pointer-events:none;} @keyframes mfxRipple{to{transform:scale(4);opacity:0;}} /* Tilt */ [data-fx~="tilt"]{transition:transform .15s ease-out;transform-style:preserve-3d;will-change:transform;} .mfx-glare{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .2s;border-radius:inherit;} /* Hover lift — gated by the settings toggle via mfx-no-lift on */ html:not(.mfx-no-lift) [data-fx~="lift"]{transition:transform .2s ease,box-shadow .2s ease;will-change:transform;} html:not(.mfx-no-lift) [data-fx~="lift"]:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,.08);} /* Text scramble */ [data-fx~="scramble"]{display:inline-block;} /* Page transition overlay */ .mfx-page-fade{position:fixed;inset:0;background:#fff;z-index:999998;pointer-events:none;opacity:0;transition:opacity .3s;} .mfx-page-fade--active{opacity:1;} .dm-dark .mfx-page-fade{background:#0f0f0f;} /* Hide real cursor when custom cursor active */ .mfx-cursor-active,.mfx-cursor-active *{cursor:none!important;} .mfx-cursor-active a,.mfx-cursor-active button,.mfx-cursor-active [role="button"]{cursor:none!important;} /* Reduced motion */ @media(prefers-reduced-motion:reduce){ [data-fx]{transition:none!important;transform:none!important;animation:none!important;} .mfx-cursor,.mfx-page-fade{display:none!important;} }