/* 使用 Noto Serif SC 字体，营造古典感 */
body {
    font-family: 'Noto Serif SC', serif;
    transition: background-color 0.5s, color 0.5s;
}

/* 主题配色方案 */
.theme-jade { background-color: #f0f5f1; color: #1a3a3a; } /* 仿翡翠绿，搭配米白 */
.theme-imperial { background-color: #fdfaf2; color: #0d1b2a; } /* 仿乾隆蓝，搭配淡黄 */
.theme-crimson { background-color: #fff8f1; color: #5c1a1b; } /* 仿故宫红，搭配象牙白 */
.theme-parchment { background-color: #f5eeda; color: #4e342e; } /* 仿宣纸黄，搭配深棕 */

/* 不同主题下元素的颜色 */
.theme-jade .static-card { background-color: #d1e2d8; color: #1a3a3a; }
.theme-jade .header-decoration { border-color: #6a9c89; }
.theme-jade .day { color: #6a9c89; }

.theme-imperial .static-card { background-color: #fff8dc; color: #0d1b2a; }
.theme-imperial .header-decoration { border-color: #e6b800; }
.theme-imperial .day { color: #e6b800; }

.theme-crimson .static-card { background-color: #faebd7; color: #5c1a1b; }
.theme-crimson .header-decoration { border-color: #b94547; }
.theme-crimson .day { color: #b94547; }

.theme-parchment .static-card { background-color: #fffbf0; color: #4e342e; border: 1px solid #dcd1b8;}
.theme-parchment .header-decoration { border-color: #4e342e; }
.theme-parchment .day { color: #4e342e; }

/* 卡片样式 */
.static-card {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease;
}

.static-card:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.separator {
    /* 主题相关的颜色在下面定义 */
}
.theme-jade .separator { border-color: #c1d1c8; }
.theme-imperial .separator { border-color: #e6dca9; }
.theme-crimson .separator { border-color: #e8d7c7; }
.theme-parchment .separator { border-color: #dcd1b8; }

.theme-button {
    transition: all 0.2s ease;
    border: 2px solid transparent;
}
.theme-button.active {
    transform: scale(1.1);
    border-color: currentColor;
}

/* 竖排文字 */
.vertical-text {
    writing-mode: vertical-rl;
    text-orientation: mixed;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
    max-width: 100%;
    background: #000;
    margin-bottom: 20px;
    border-radius: 8px; /* Added for rounded corners */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Added for shadow */
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* 段落首行缩进 */
.static-card p:not(.opacity-80) {
    text-indent: 2em;
}
