body {
    margin: 0;
    font-family: 'Arial', 'Noto Sans KR', sans-serif; /* Noto Sans KR 유지 */
    /* 원래의 어두운 배경 그라데이션으로 복원 (카테고리 박스와 대비) */
    background: linear-gradient(135deg, #2c5364, #203a43, #0f2027);
    background-size: 400% 400%;
    animation: gradientAnimation 15s ease infinite;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    box-sizing: border-box;
}

@keyframes gradientAnimation {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.container {
    text-align: center;
    /* 패딩 조정 */
    padding: 40px 30px;
    /* 원래 투명도 및 둥근 모서리로 복원 */
    background: rgba(255, 255, 255, 0.9);
    border-radius: 20px;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2); /* 원래 그림자 유지 */
    width: 90%;
    max-width: 800px; /* 최대 너비 조정 */
    box-sizing: border-box;
}

h1 {
    margin-bottom: 40px;
    color: #333; /* 원래 색상 복원 */
    font-size: 2.5em; /* 원래 크기 복원 */
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1); /* 원래 그림자 복원 */
}

/* 게임 카테고리 박스 스타일 */
.game-category {
    background: #ffffff; /* 카테고리 박스 배경 (흰색) */
    border: 1px solid #dee2e6; /* 연한 회색 테두리 */
    border-radius: 15px; /* 박스 모서리 둥글게 */
    padding: 30px 25px; /* 박스 내부 여백 */
    margin-bottom: 30px; /* 카테고리 박스 사이 간격 */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08); /* 박스에 부드러운 그림자 */
    text-align: center; /* 내부 요소 가운데 정렬 */
}
.game-category:last-child {
    margin-bottom: 0;
}

h2 {
    margin-top: 0; /* 위쪽 마진 제거 */
    margin-bottom: 30px; /* 카테고리 제목 아래 여백 */
    color: #495057; /* 제목 색상 (짙은 회색) */
    font-size: 1.8em;
    border-bottom: 2px solid #ced4da; /* 회색 밑줄 */
    display: inline-block;
    padding-bottom: 10px; /* 텍스트와 밑줄 간격 */
}


.button-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px; /* 버튼 사이 간격 */
}

/* 게임 버튼 스타일 (원래 색상 복원) */
.game-button {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 15px 30px; /* 패딩 조정 */
    border: none;
    border-radius: 12px; /* 둥근 모서리 조정 */
    /* 원래의 빨간색/주황색 그라데이션으로 복원 */
    background: linear-gradient(45deg, #ff416c, #ff4b2b);
    color: #fff;
    font-size: 1.2em; /* 글자 크기 조정 */
    font-weight: normal; /* 기본 두께 */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    min-width: 190px; /* 최소 너비 조정 */
    text-align: center;
}

.game-button i {
    margin-right: 10px; /* 아이콘 간격 조정 */
    font-size: 1.2em; /* 아이콘 크기 유지 */
}

.game-button:hover {
    transform: translateY(-5px); /* 호버 시 위로 이동 */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3); /* 호버 시 그림자 강조 */
}


/* 반응형 디자인 */
@media (min-width: 768px) {
    h1 {
        font-size: 3em;
    }
    h2 {
        font-size: 2em;
    }
    .game-button {
        padding: 18px 35px;
        font-size: 1.3em;
        min-width: 210px;
    }
    .game-category {
        padding: 40px 35px; /* 큰 화면에서 박스 내부 여백 증가 */
    }
}