How we can find missing identity values?

How to turn off animation in input

Funck

I have two questions. First question why here on the site after adding the code the result is completely different, the photo shows how I have on the live server. Second question, when I write a word in search and a table with choices pops up it appears with animation, as I understand scale animation. Can you advise how to remove it, I have already tried to put everywhere transition none, animation none, but nothing helps animation still remains

enter image description here

var content = [
  {
    title: "Java",
    url: "https://google.com"
  },
  {
    title: "fsdhfghgf",
    url: "https://google.com"
  },
  {
    title: "Jasdfsdsdfdsva",
    url: "https://google.com"
  },
  {
    title: "gfdgfdg",
    url: "https://google.com"
  },
  {
    title: "dsfdsgfdhgfh",
    url: "https://google .com"
  },
];

$('.ui.search')
  .search({
    source: content
  })
;

body {
    background: #efefef;
}

.ui.segment {
    background: none;
    border: none;
    box-shadow: none;
    width: 0px;
    margin: 0;
    padding: 0;
    height: 0;
}

.ui.input>input:focus {
    border: none;
}

.ui.input>input {
    border: none;
}

.prompt {
    position: absolute;
    left: 487px;
    top: 31px;
}

.ui.search .prompt {
    height: 40px;
    min-width: 713px;
    border-radius: 5px;
}


.result {
    position: relative;
    left: 487px;
    top: 60px;
    background-color: black;
    width: 713px;
}


.ui.search>.results {
    background: none;
    border: none;
    box-shadow: none;
    width: 0;
}


.ui.search>.results .result .title {
    color: red;
}


.ui.search>.results>.message .description {
    font-size: 0;
}

.ui.search>.results>.message .header {
    font-size: 0;
}

.ui.search>.results>.message {
    padding: 0;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel="stylesheet"/>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js"></script>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    
    <div class="ui segment">
        <div class="ui search">
            <div class="ui icon input">
                <input class="prompt" type="text" placeholder="?????">
                <i class="search icon"></i>
            </div>
            <div class="result">
            </div>
        </div>
    </div>


<script src="main.js"></script>

</body>
</html>