.choujiang-btn {
    font-size: 20px;
    padding: 10px 20px;
    background-color: rgb(0, 128, 0);
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: block;
    width: calc(100% - 40px);
    box-sizing: border-box;
    text-align: center;
    margin: 10px auto 0;

    /* 鼠标经过效果 */
    transition: background-color 0.3s ease;

    &:hover {
        background-color: #45a049;
    }

    /* 点击效果 */

    &:active {
        background-color: #2e8b57;
    }
}

.random-btn {
    font-size: 20px;
    padding: 10px 20px;
    background-color: #800080;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: block;
    width: calc(100% - 40px);
    box-sizing: border-box;
    text-align: center;
    margin: 20px auto 0;

    /* 鼠标经过效果 */
    transition: background-color 0.3s ease;

    &:hover {
        background-color: #9932CC;
    }

    /* 点击效果 */

    &:active {
        background-color: #7B68EE;
    }
}

.input-container {
    font-size: 22px;
    margin: 10px;
    text-align: center;
}

.input-container input {
    width: 180px;
    height: 40px;
    font-size: 26px;
    padding: 5px;
    border: 1px solid #ccc;
}

.link-foot {
    text-decoration: none;
    color: #bbb;
    border-bottom: 1px solid #888;
    padding-bottom: 5px;
    margin: 0 10px;
}

.footer {
    margin-top: 10px;
    margin-bottom: 20px;
    font-size: 18px;
    color: #bbb;
    text-align: center;
    line-height: 1.5;
}

.footer a {
    text-decoration: none;
    color: inherit;
    margin: 0 10px;
}

.footer a:hover {
    color: #999;
    text-decoration: underline;
}

#info {
    display: none;
    position: absolute;
    left: 50%;
    height: auto;
    transform: translateX(-50%);
    width: 86%;
}

.report-text {
    width: 90%;
    height: auto;
    text-align: center;
}

.btn {
    width: 72px;
    /*height: 65px;*/
    padding: 10px 20px;
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: inline-block;
    text-align: center;
}

.btn-more {
    background-color: #007BFF;
    margin-left: 10px;
}

.btn-suiyuan {
    background-color: rgb(128, 0, 128);
    margin-left: 10px;
}

.result-title {
    color: red;
    font-weight: bold;
    text-align: center;
}

.result-xm {
    color: rgb(128, 0, 128);
    font-weight: bold;
    text-align: center;
}

.result-box {
    border: 1px solid #ccc;
    padding: 15px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    margin-top: 20px;
    width: 90%;
}


.random-p {
    display: inline-block;
    vertical-align: middle; /* 使p标签与input垂直居中 */
    margin-left: 2px; /* 左侧添加一些间距，使其与input分开一些 */
    cursor: pointer; /* 当鼠标悬停时显示手形图标，表明可以点击 */
    font-size: 16px;
}

/* 可选：为input添加一些样式，以便与p标签更好地对齐 */
.input-container input {
    vertical-align: middle;
    margin-right: 5px; /* 右侧添加一些间距，以便与p标签分开一些 */
}

.btn-close {
    background-color: #ffffff; /* 红色背景，可根据需要调整 */
    color: black; /* 白色文字，可根据需要调整 */
    border: none; /* 无边框 */
    padding: 3px 3px; /* 内边距 */
    cursor: pointer; /* 鼠标悬停时变为手形图标 */
    font-size: 18px;
}


/*底部测试，鼠标经过样式*/
.more_test_list li:hover {
    background-color: #f0f0f0;
    color: #333;
}

/*底部测试，鼠标经过样式*/
.more_test_list li:active {
    background-color: #e0e0e0;
    color: #555;
}


/*更多测试，更多欢乐测试*/
.moretest-link {
    background-color: #E0E0E0;
    color: black;
    display: inline-block;
    padding: 10px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; /* 防止父样式影响 */


    line-height: 20px; /* 假设高度（包括padding）大约是30px */
    text-align: center;

    transition: background-color 0.3s ease; /* 平滑过渡效果 */
}

.moretest-link:hover {
    background-color: #DDEBF7; /* 浅蓝色或你选择的hover颜色 */
}

.moretest-link:active {
    background-color: #E5E5E5; /* 更深的灰色或你选择的active颜色 */
}

.title-li:first-child a {
    display: block;
    width: 100%;
}


/* 额外的图标样式（如果需要） */
.emoji {
    margin: 0 5px; /* 图标和文本之间的间距 */
}