The code to my white pearl cookie layout!

Code:

<style>main:before {
width: 100%;
height: 300px;
display: block;
content: "";
background-image: url('https://static.wikia.nocookie.net/cookierunkingdom/images/7/74/Loading_rover_001.png/revision/latest/scale-to-width-down/1000?cb=20230809101941');
background-position: center center;
background-size: cover;
}
@media only screen and (max-width: 600px) {
main:before{
height: 200px;
}
}
</style>
<style>
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url("https://static.wikia.nocookie.net/cookierunkingdom/images/8/88/Faded_Radiance_Gacha_animation.gif/revision/latest?cb=20230809110950"); display: inline-block; content:"" }
.blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; } /* blogs, bulletins */
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; } /* profile */ 
</style>
<style>
table.comments-table{
display: block;
height: 400px!important;
overflow-y: scroll;
}
</style>
<style>
 .profile .friends .person img {
        border-radius: 500px;
border: 2px: white
    }
</style>

<style>main{ 
background-color: #f2dce6;
border-radius: 25px;
border: 15px solid #f0b6d6;
box-shadow: inset 2px 3px 5px #f2dce6;
margin: 7em 0;
padding: 0.5em;
opacity: 1;
}</style>
<style>
:root {
      --logo-blue: #f797a4;
      --darker-blue: #f797a4;
      --lighter-blue: #f797a4;
      --even-lighter-blue: #f797a4;
      --lightest-blue: #f797a4;
      --dark-orange: #f797a4;
      --light-orange:#f797a4;
      --even-lighter-orange: #f797a4;
</style>
<style>
.contact .inner a img {
    font-size: 0;
}
.contact .inner a img:before {
    font-size: 1em;
    display: block
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
 /* Add to Friends */
 content: "🦪"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
 /* Add to Favorites */
 content: "🌕"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
 /* Send Message */
 content: "🦪"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
 /* Forward to Friend */
 content: "🌕"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
 /* Instant Message */
 content: "🦪"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
 /* Block User */
 content: "🌕"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
 /* Add to Group */
 content: "🦪"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
 /* Report 
Profile */
 content: "🌕"
}
</style>
<style>
<iframe width="0" height="0" src="https://www.youtube.com/embed/qmK24qy9gDE?loop=1&autoplay=1&controls=0&start=0&playlist=wON8K9cWKQ4&”title=" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="””">
 
</style>
<style>
body {
    background: url(https://img.freepik.com/free-vector/coral-pattern-concept_23-2148627617.jpg?w=740&t=st=1692386121~exp=1692386721~hmac=91219d390c76759cdfb90dc602b967ba18b873c567fb1732bfc5105a52bab9dc);
}</style>

Seashell pic for your boxes!
<img src="https://i.ibb.co/rksG4Hc/ls4je2upougt89ipqg75ihsav7-b1ba77cbc9e5bd82be211814fd9a9b78.png"/>