JSFiddle - React, Tailwind, and code Playground

HTML

<div id="name"/>
<div class="test_box">
    <p>Добрый день!
Приключилась ситуация, есть человек, с которым я изначально не поладил, и познакомился я с ним в наших любимых танках, теперь же, когда у меня с ним натянутые отношения, если их так можно назвать, он грозится заблокировать профиль по перманенту, якобы у него друг модератор и тп.
Чего мне ожидать? Возможно ли такое? или это всего лишь угрозы, которые не к чему не приведут?</p>
</div>

CSS

*{
   margin:0;  
 }

body {
    margin: 100px;
}
.test_box {
    border-radius: 5px;
    box-shadow: 0px 1px 10px #222;
    overflow-y: none;
    width: 250px;
    height: 20px;
    background: #222;
}
p {
    color: #fff;
    text-align: center;
    padding: 25px;
    width: 400px;
    
}
button {
    padding: 25px;
}
button.test_box:active {
    background: red;
}
#name::before {
    content: "Жалобы (1)";
    display: inline;
    border-radius: 5px;
    color: #222;
    text-shadow: 0px 1px 10px #222;
    background: gold;
    font-size: 15px;
    margin-top: 0px;
    padding: 5px;
    box-shadow: 0px 1px 10px gold;
}
p::selection {
    background: white;
    color: gold;
}
.test_box:active {
    width: 500px;
    height: 300px;
    transition: .5s;
    
}