:root {
    --liuqiu-blue: #014e8f;
    --liuqiu-dark-blue: #002b52;
}

body {
    font-family: 'Inter', -apple-system, sans-serif;
    background-color: var(--liuqiu-blue);
    color: white;
    margin: 0;
    -webkit-font-smoothing: antialiased;
}

/* 背景漸層 */
.bg-gradient-liuqiu {
    background: linear-gradient(180deg, var(--liuqiu-blue) 0%, var(--liuqiu-dark-blue) 100%);
    min-height: 100vh;
}

/* 毛玻璃效果 */
.glass-card {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 32px;
}

/* 隱藏捲軸 */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* 漸現動畫 */
.fade-in {
    opacity: 0;
    animation: fadeIn 1s ease-out forwards;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 圖表 Tab 啟用狀態 */
.chart-tab-active {
    background: rgba(255, 255, 255, 0.1);
    opacity: 1 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* 調整 Chart.js 的字體顏色 */
canvas {
    user-select: none;
}
:root {
    --liuqiu-blue: #014e8f;
    --liuqiu-dark-blue: #002b52;
}

body {
    font-family: 'Inter', -apple-system, sans-serif;
    background-color: var(--liuqiu-blue);
    color: white;
    margin: 0;
    -webkit-font-smoothing: antialiased;
}

/* 🌙 動態天氣背景類別 */
body.weather-sunny { background: linear-gradient(180deg, #014e8f 0%, #ff8c00 100%); }
body.weather-rainy { background: linear-gradient(180deg, #0f172a 0%, #334155 100%); }
body.weather-night { background: linear-gradient(180deg, #020617 0%, #1e1b4b 100%); }
body.weather-cloudy { background: linear-gradient(180deg, #1e293b 0%, #475569 100%); }

.glass-card {
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 32px;
}

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

.fade-in { opacity: 0; animation: fadeIn 1s ease-out forwards; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }

.chart-tab-active { background: rgba(255, 255, 255, 0.1); opacity: 1 !important; box-shadow: 0 4px 12px rgba(0,0,0,0.1); }