/* public/style.css */
body {
    color: #e5e5e5;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-image: url('./background.jpg'); 
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    position: relative;
    z-index: 1;
}
body::before {
    content: '';
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.75);
    z-index: -1;
}
.card { transition: all 0.3s; cursor: pointer; }
.card:hover { transform: translateY(-5px); border-color: #ef4444; }
.hidden { display: none; }
.fade-in { animation: fadeIn 0.5s; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
input:focus, textarea:focus { outline: none; border-color: #ef4444; }
/* public/style.css 末尾追加 */

/* --- 滚动条美化 --- */
.custom-scrollbar::-webkit-scrollbar {
    width: 8px;
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: #1f2937; /* gray-800 */
    border-radius: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
    background: #4b5563; /* gray-600 */
    border-radius: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #6b7280; /* gray-500 */
}
@media (max-width: 640px) {
    header {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    header button {
        position: relative;
        top: auto;
        right: auto;
        margin-top: 10px;
    }
}