body {
    font-family: Arial, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, 
        #36C7F2 0%, 
        #36C7F2 70%, 
        #7BEA24 70%, 
        #7BEA24 85%, 
        #926C4D 85%, 
        #926C4D 100%
    ); /* Inversed brown and green: sky, grass, dirt */
    margin: 0;
    padding: 20px;
    color: #000; /* Black text for better contrast on lighter backgrounds */
    position: relative; /* For positioning the tree */
}

body::before {
    content: '';
    position: absolute;
    bottom: 15%; /* Positioned on the "ground" layer */
    right: 10%; /* On the right side; adjust as needed */
    width: 8px;
    height: 8px;
    background: #8B4513; /* Brown for trunk pixel */
    box-shadow:
        0 -8px #8B4513,
        0 -16px #8B4513,
        0 -24px #8B4513, /* Trunk */
        -8px -32px #228B22, 0 -32px #228B22, 8px -32px #228B22,
        -16px -40px #228B22, -8px -40px #228B22, 0 -40px #228B22, 8px -40px #228B22, 16px -40px #228B22,
        -8px -48px #228B22, 0 -48px #228B22, 8px -48px #228B22,
        0 -56px #228B22; /* Green foliage pixels */
    image-rendering: pixelated;
    transform: scale(4); /* Scale up for visibility; adjust size */
    transform-origin: bottom center;
    z-index: -1; /* Behind content */
}

h1 {
    color: #FFD700; /* Gold-like color for headings */
    text-shadow: 2px 2px #000; /* Blocky shadow for a 3D Minecraft effect */
}

.button {
    display: inline-block;
    padding: 10px 20px;
    margin: 20px;
    background-color: #32CD32; /* Lime green like grass blocks */
    color: #FFF;
    text-decoration: none;
    border-radius: 0; /* Square edges for blocky look */
    border: 2px solid #000;
    box-shadow: 3px 3px #000; /* Simple shadow to mimic Minecraft blocks */
}

form {
    max-width: 400px;
    margin: 0 auto;
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent dark overlay for readability */
    padding: 20px;
    border: 2px solid #000;
    border-radius: 0;
}

label {
    display: block;
    margin: 10px 0;
    color: #FFF;
}

textarea {
    width: 100%;
    height: 100px;
    border: 2px solid #000;
    border-radius: 0;
}

.skin-gallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.skin-item {
    margin: 20px;
    text-decoration: none;
    border: 4px solid #8B4513; /* Brown like dirt/wood for a frame */
    background-color: #FFF;
    box-shadow: 3px 3px #000;
    border-radius: 0;
}

.skin-item img {
    width: 150px;
    height: auto;
    image-rendering: pixelated; /* Enhance pixelated Minecraft skin look */
}

.skin-detail img {
    width: 300px;
    height: auto;
    margin: 20px;
    border: 4px solid #8B4513;
    background-color: #FFF;
    box-shadow: 3px 3px #000;
    border-radius: 0;
    image-rendering: pixelated;
}