* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    display: flex;
    height: 100vh;
    background-image: linear-gradient(200deg, #fa2ec7, #d1ef7e);
    justify-content: center;
        /* 使内容水平居中 */
        align-items: center;
        /* 使内容垂直居中 */
}

.box {
    margin: auto;
    width: 1000px;
    height: 700px;
    border: #fff 4px solid;
    background-color: rgba(255, 255, 255, 0.5);
    border-radius: 80px;
    color: #fff;
    text-align: center;
    color: #333;
        /* 调整文字颜色 */
}

 table {
     width: 90%;
     border-collapse: collapse;
     /* 合并边框 */
 }

 th,
 td {
     padding: 15px;
     text-align: center;
     /* 左对齐文本 */
     font-size: 18px;
     /* 字体大小 */
 }

 th {
     width: 30%;
     /* 调整表头宽度 */
    
 }

 input[type="text"],
 input[type="password"] {
     width: 100%;
     /* 输入框占满整个单元格 */
     padding: 8px;
     /* 内边距 */
     font-size: 16px;
     /* 输入框字体大小 */
     border: 1px solid #ccc;
     /* 边框样式 */
     border-radius: 4px;
     /* 圆角边框 */
 }

 input[type="text"]:focus,
 input[type="password"]:focus {
     border-color: #007bff;
     /* 聚焦时边框颜色 */
     outline: none;
     /* 去掉轮廓 */
 }

 input[type="submit"] {
     margin-top: 20px;
     /* 上方间距 */
     padding: 10px 20px;
     /* 内边距 */
     font-size: 18px;
     /* 字体大小 */
     color: white;
     /* 字体颜色 */
     background-color: #007bff;
     /* 背景颜色 */
     border: none;
     /* 无边框 */
     border-radius: 5px;
     /* 圆角 */
     cursor: pointer;
     /* 鼠标指针变为手型 */
     transition: background-color 0.3s, transform 0.2s;
     /* 动画效果 */
 }

 input[type="submit"]:hover {
     background-color: #0056b3;
     /* 悬停时背景颜色 */
     transform: scale(1.05);
     /* 悬停时放大 */
 }

 input[type="submit"]:active {
     transform: scale(0.95);
     /* 点击时缩小 */
 }

 p {
    padding: 30px;
    margin-left: 30px;
    font-size: 28px;
    font-family:Fantasy;
    text-align: left;
 }