示例：
/* 基础重置与魔法少女背景 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', 'Helvetica Neue', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
body {
    background: #1a0a20;
    display: flex;
    justify-content: center;
    padding: 20px 0;
    min-height: 100vh;
}
.container {
    max-width: 428px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* 时间卡片 — 粉金渐变 */
.time-box {
    background: linear-gradient(145deg, #fff0f5, #ffe0ec);
    border-radius: 36px;
    padding: 18px 24px;
    box-shadow: 0 10px 18px -6px rgba(80, 10, 30, 0.15), inset 0 1px 0 #fff8fa;
    color: #3a1020;
    font-size: 1rem;
    font-weight: 600;
    border-left: 6px solid #e8a0c0;
    backdrop-filter: blur(4px);
    border: 1px solid rgba(220, 140, 180, 0.3);
}

/* 正文容器 */
.narrative-text {
    margin: 16px 0;
    line-height: 1.85;
    background: transparent;
    border: none;
    padding: 0 2px;
    box-shadow: none;
    color: inherit;
    font-size: 1.0rem !important;
}
.narrative-text,
.narrative-text * {
    font-size: 1.0rem !important;
    line-height: 1.85 !important;
}

/* 所有卡片 — 暖紫半透 */
.glass-card {
    background: rgba(40, 15, 30, 0.65);
    backdrop-filter: blur(12px);
    border-radius: 36px;
    padding: 18px 20px;
    margin-bottom: 18px;
    border: 1px solid rgba(220, 160, 200, 0.25);
    box-shadow: 0 8px 18px rgba(0,0,0,0.2), inset 0 0 0 1px rgba(255, 240, 245, 0.05);
}
.content-box {
    background: rgba(30, 12, 22, 0.5);
    backdrop-filter: blur(4px);
    border-radius: 28px;
    padding: 20px;
    margin-top: 14px;
    border: 1px solid rgba(220, 180, 210, 0.2);
    color: #f0e0ec;
    line-height: 1.65;
    font-weight: 500;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.1), 0 4px 8px rgba(0,0,0,0.1);
}

/* 折叠标题 — 粉紫金配色 */
.section-title {
    padding: 12px 22px;
    border-radius: 40px;
    font-weight: 800;
    font-size: 1.2rem;
    border-bottom: 3px solid;
    margin-bottom: 6px;
    color: #fff5fa;
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-shadow: 0 2px 4px rgba(0,0,0,0.3);
    letter-spacing: 1.5px;
    box-shadow: 0 6px 0 rgba(0,0,0,0.2), 0 4px 10px rgba(0,0,0,0.2);
    transition: 0.15s;
}
.section-title::after {
    content: '';
    width: 8px;
    height: 8px;
    border-right: 2px solid #ffe0f0;
    border-bottom: 2px solid #ffe0f0;
    transform: rotate(45deg);
    margin-left: 10px;
    opacity: 0.9;
    transition: 0.2s;
}
details[open] .section-title::after {
    transform: rotate(-135deg);
    margin-bottom: -4px;
}
details summary::-webkit-details-marker { display: none; }

/* 标题配色 */
.title-daily { background: linear-gradient(145deg, #d08060, #e0a080, #f0c0a0); border-bottom-color: #c07050; }
.title-event { background: linear-gradient(145deg, #6a5a8a, #8a7aaa, #aa9aca); border-bottom-color: #5a4a7a; }
.title-user { background: linear-gradient(145deg, #b85a8a, #d080a0, #e8a0c0); border-bottom-color: #c06090; }
.title-interact { background: linear-gradient(145deg, #a04080, #c060a0, #e080c0); border-bottom-color: #b05090; }
.title-memory { background: linear-gradient(145deg, #6a8a8a, #80a0a0, #a0c0c0); border-bottom-color: #709090; }
.title-option { background: linear-gradient(145deg, #c07080, #e090a0, #f0b0c0); border-bottom-color: #d08090; }

/* 日常区小标题 — 柔和暖色 */
.daily-label {
    font-weight: 700;
    color: #f0c080;
    text-shadow: 0 0 4px rgba(240, 180, 100, 0.5);
}

/* 事件区小标题 — 柔和蓝紫色 */
.event-label {
    font-weight: 700;
    color: #b0a0e0;
    text-shadow: 0 0 4px rgba(160, 140, 220, 0.5);
}

/* 好感度发光 — 清晰桃红 */
.favor-value {
    color: #ff5c7a;
    font-weight: 800;
    text-shadow: 0 0 4px rgba(255, 80, 110, 0.6);
    font-size: 1.05rem;
}

/* 堕落值发光 — 清晰紫色 */
.corrupt-value {
    color: #b860e0;
    font-weight: 800;
    text-shadow: 0 0 4px rgba(170, 80, 220, 0.6);
    font-size: 1.05rem;
}

/* 记忆区 */
.memory-item {
    padding: 8px 0;
    border-bottom: 1px dashed rgba(220, 180, 200, 0.25);
    color: #e0d0d8;
    font-weight: 500;
}
.inner-summary {
    background: rgba(60, 25, 40, 0.9);
    border-radius: 40px;
    padding: 10px 20px;
    cursor: pointer;
    list-style: none;
    color: #e0c0d0;
    font-weight: 700;
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    border: 1px solid #c0a0b0;
    box-shadow: inset 0 1px 2px #fff0f5, 0 2px 4px rgba(0,0,0,0.2);
}
.inner-summary::after {
    content: '▼';
    font-size: 0.8rem;
    color: #c0a0b0;
}
details[open] .inner-summary::after {
    content: '▲';
}
.inner-content {
    padding: 6px 0;
}

/* 选项区 */
.option-item {
    margin: 10px 0;
    color: #f0e0e8;
    line-height: 1.6;
    font-weight: 600;
}
.option-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, #d0b0c0, transparent);
    margin: 8px 0;
}

/* 响应式 */
@media (max-width: 450px) {
    .section-title { font-size: 1.1rem; padding: 14px 18px; }
}