body {
    font-family: 'Baloo Thambi 2', cursive, 'Noto Sans TC', sans-serif;
    background-color: #222f3e; /* Dark Slate Grey/Blue */
    color: #f1f2f6; /* Almost White */
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 100vh;
    margin: 0;
    padding: 15px;
    box-sizing: border-box;
    overflow-x: hidden;
    touch-action: manipulation; /* Prevent double-tap zoom etc. */
}

.container {
    background-color: #2c3a47; /* Slightly Lighter Slate */
    border: 1px solid #57606f;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
    width: 100%;
    max-width: 450px; /* Canvas will be primary content */
    text-align: center;
    margin: auto;
}

h1 {
    color: #f39c12; /* Orange */
    font-size: 2.2em;
    margin-bottom: 20px;
    text-shadow: 0 0 8px rgba(243, 156, 18, 0.5);
}
h2 {
    color: #1abc9c; /* Turquoise */
    font-size: 1.6em;
    margin-top: 20px;
    margin-bottom: 15px;
}

/* ... (登入、驗證碼、排行榜等通用樣式可以沿用，這裡僅列出遊戲特定或有調整的) ... */
label { display: block; margin-top: 10px; margin-bottom: 5px; font-weight: 500; text-align: left; color: #a4b0be; }
input[type="text"], input[type="password"] { width: calc(100% - 22px); padding: 10px; margin-bottom: 15px; border: 1px solid #57606f; background-color: #3c4a57; color: #f1f2f6; border-radius: 6px; box-sizing: border-box; font-size: 1em;}
input[type="text"]:focus, input[type="password"]:focus { border-color: #1abc9c; box-shadow: 0 0 0 0.2rem rgba(26, 188, 156, 0.25); outline: none; }
button { background: linear-gradient(45deg, #e74c3c, #c0392b); color: white; padding: 10px 18px; border: none; border-radius: 20px; cursor: pointer; font-size: 1em; font-weight: 600; margin: 10px 5px; transition: transform 0.15s ease, box-shadow 0.15s ease; box-shadow: 0 3px 10px rgba(0,0,0,0.3); }
button:hover { transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0,0,0,0.4); }
button:disabled { background: #7f8c8d; cursor: not-allowed; }
.error-message { color: #e74c3c; } .success-message { color: #2ecc71; } .info-message { color: #a4b0be; margin-top: 10px; font-size: 0.9em; }
#captcha-container { margin-bottom: 15px; text-align: left; } .captcha-line { display: flex; align-items: center; }
#captchaInput { width: 80px; padding: 8px; font-size: 0.9em; margin-right: 8px;}
#captchaDisplay { padding: 8px 12px; font-size: 1.1em; margin-right: 8px; background-color: rgba(255,255,255,0.1); border-radius: 4px;}
#refreshCaptchaBtn { padding: 6px 10px; font-size: 1.1em; background: #c0392b; }
.leaderboard-filters button { background: #8e44ad; }
.leaderboard-filters button.active { background: #e74c3c; }
#leaderboardTable { width: 100%; border-collapse: collapse; margin-top: 10px; font-size: 0.9em; }
#leaderboardTable th, #leaderboardTable td { border: 1px solid #57606f; padding: 8px; text-align: left; }
#leaderboardTable th { background-color: #2980b9; color: white; }
#leaderboardTable tbody tr:nth-child(even) { background-color: rgba(255, 255, 255, 0.03); }
.leaderboard-info { font-size: 0.85em; color: #bdc3c7; margin-bottom: 10px;}


/* Game Section Specific Styles */
#game-section {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #57606f;
}
.game-header {
    display: flex;
    justify-content: space-around; /* Changed for better spacing */
    align-items: center;
    margin-bottom: 15px;
    padding: 8px;
    background-color: rgba(0,0,0,0.2);
    border-radius: 8px;
    font-size: 0.95em;
}
.game-header p {
    margin: 0 5px;
}
.game-header span {
    font-weight: bold;
    color: #f1c40f; /* Yellow for values */
}
.game-instructions {
    font-size: 0.9em;
    color: #bdc3c7; /* Silver */
    margin-bottom: 20px;
}

#game-canvas-container {
    width: 100%;
    max-width: 320px; /* Adjust canvas size as needed */
    height: 320px;    /* Make it square */
    margin: 0 auto 20px auto;
    background-color: #1e272e; /* Darker background for canvas area */
    border-radius: 50%; /* Make the container circular if canvas is for circular items */
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative; /* For game messages overlaying it */
    border: 3px solid #57606f;
    overflow: hidden; /* Important if canvas draws outside bounds slightly */
    cursor: pointer; /* Indicate the whole area is clickable to shoot */
}
#gameCanvas {
    display: block; /* Removes extra space below canvas */
    background-color: transparent; /* Canvas itself is transparent */
}

#game-message-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(44, 58, 71, 0.9); /* Semi-transparent overlay */
    padding: 25px;
    border-radius: 10px;
    text-align: center;
    z-index: 100; /* Ensure it's on top of the canvas */
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}
#game-message-overlay h2 {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 1.8em;
}
#game-message-overlay button {
    margin: 10px;
    padding: 10px 25px;
    font-size: 1.1em;
}
#nextLevelBtn {
    background: linear-gradient(45deg, #2ecc71, #27ae60); /* Green for next */
}
#retryLevelBtn {
    background: linear-gradient(45deg, #e67e22, #d35400); /* Orange for retry */
}
.start-game-btn { /* 新增或修改開始遊戲按鈕樣式 */
    display: block; /* 或者 inline-block 如果希望和其他控制並排 */
    margin: 20px auto;
    padding: 12px 30px;
    font-size: 1.2em;
    background: linear-gradient(45deg, #2ecc71, #27ae60); /* 例如使用綠色 */
    color: white;
    border: none;
    border-radius: 25px;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(39, 174, 96, 0.3);
}
.start-game-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(39, 174, 96, 0.4);
}


#game-message-overlay {
    /* ... (樣式保持，確保按鈕能正確顯示) ... */
}
#game-message-overlay h2 { /* 修改ID選擇器 */
    color: #e74c3c; /* 例如失敗用紅色 */
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 1.8em;
}
#game-message-overlay #playAgainBtn { /* 修改ID選擇器 */
    background: linear-gradient(45deg, #e67e22, #d35400); /* Orange for retry */
    margin: 10px;
    padding: 10px 25px;
    font-size: 1.1em;
}