body {
    font-family: Arial, sans-serif;
    text-align: center;
    padding: 2vw;
    background-image: url('./images/area1.jpg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

h1 {
    font-size: 8vw;
    color: #fff;
    text-shadow: 2px 2px 4px #000;
}

button {
    padding: 6vw 12vw;
    font-size: 6vw;
    width: 70%;
    background-color: rgba(229, 242, 157, 0.5);
}



#controls {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}



#areaSelect, #selectButton {
    flex: 1;
    margin: 4vw 2vw;
    padding: 4vw;
    width: 70%; 
    font-size: 6vw;
    border-radius: 25px; /* 添加圆角 */
    background-color: rgba(229, 242, 157, 0.5);
}

#result {
    border: 1px solid #000;
    padding: 1em;
    background-color: rgba(245, 238, 168, 0.5);
    color: #000;
    font-size: 5vw;
    height: 40vw; /* Adjust height as necessary to match the image layout */
    width: 70%; /* Adjust width as necessary to match the image layout */
    border-radius: 25px; /* 添加圆角 */
    margin: auto;
    font-family: 'Courier New', Courier, monospace;
    font-weight: bold;
}

.no-underline {
    text-decoration: none; /* 去掉下划线 */
}