* { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; background: #07060D; }
  ::selection { background: rgba(255,46,131,0.30); color: #fff; }
  [data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
  [data-reveal].mk-in { opacity: 1 !important; transform: none !important; }
  @keyframes mkFloat { 0%,100% { transform: translateY(0) rotate(-0.4deg);} 50% { transform: translateY(-18px) rotate(0.4deg);} }
  @keyframes mkPulse { 0%,100% { opacity: .55; transform: scale(1);} 50% { opacity: .95; transform: scale(1.06);} }
  @keyframes mkShimmer { 0% { background-position: -120% 0;} 100% { background-position: 220% 0;} }
  @keyframes mkRise { 0% { transform: translateY(110%); opacity: 0;} 12% { opacity:.8;} 100% { transform: translateY(-30%); opacity: 0;} }
  @keyframes mkSpin { to { transform: rotate(360deg);} }
  @keyframes mkLiquid { 0%,100% { transform: scale(1.06) translateY(0);} 33% { transform: scale(1.1) translateY(-1.2%);} 66% { transform: scale(1.08) translateY(1%);} }
  @keyframes mkCaustic { 0% { transform: translate(-8%,-6%) rotate(0deg); opacity:.55;} 50% { transform: translate(6%,5%) rotate(8deg); opacity:.9;} 100% { transform: translate(-8%,-6%) rotate(0deg); opacity:.55;} }
  @keyframes mkRipple { 0% { background-position: 0% 0%, 0% 0%;} 100% { background-position: 120% 60%, -120% -40%;} }
  image-slot { display:block; }