/* --- 全局字体与间距优化 --- */
/* 注意：平台限制，不能使用 `html`, `body`, `*{}` 选择器 */

/* 主要文本区域的段落样式 */
text p {
    font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif; /* 优雅的字体，中文显示更佳 */
    line-height: 1.7; /* 舒适的行高，便于阅读 */
    margin-bottom: 1.2em; /* 段落间距 */
    color: #333; /* 默认文本颜色，柔和不刺眼 */
    font-size: 1rem; /* 基础字号 */
}

/* --- 对话颜色规范 --- */
/* 根据你的要求，为不同角色对话定义颜色 */
.user-dialogue {
    color: #00008B; /* 深蓝色 - 用户/房东的对话 */
    font-weight: bold; /* 强调房东的言语 */
    border-left: 3px solid #00008B; /* 左侧边框，增加视觉区分 */
    padding-left: 0.8em;
}

.key-female-dialogue {
    color: #FF1493; /* 深粉色 - 关键女性角色的对话（如当前主要互动租客） */
    font-weight: bold; /* 强调重要女性角色 */
    border-left: 3px solid #FF1493;
    padding-left: 0.8em;
}

.other-female-dialogue {
    color: #FFA07A; /* 浅橙色 - 其他女性角色的对话 */
    border-left: 3px solid #FFA07A;
    padding-left: 0.8em;
}

.male-dialogue {
    color: #ADD8E6; /* 浅蓝色 - 男性角色的对话 */
    border-left: 3px solid #ADD8E6;
    padding-left: 0.8em;
}

/* --- 状态栏、记忆区与分支区样式 --- */
/* 为状态栏、记忆区和剧情分支的容器添加统一风格 */
status, memory, branches {
    display: block; /* 确保这些自定义标签能独占一行并应用样式 */
    margin-top: 2em; /* 与上方内容的间距 */
    padding: 1.5em;
    border: 1px solid #d0d0d0; /* 柔和的边框 */
    border-radius: 10px; /* 圆角边框 */
    background-color: #fcfcfc; /* 浅背景色，区分于正文 */
    box-shadow: 0 4px 12px rgba(0,0,0,0.05); /* 轻微阴影，增加层次感 */
    transition: all 0.3s ease-in-out; /* 平滑过渡效果 */
}

/* 折叠面板 (details) 样式 */
details {
    margin-bottom: 1em; /* 折叠面板之间的间距 */
    background-color: #ffffff; /* 内部背景色 */
    border: 1px solid #e9e9e9; /* 更浅的边框 */
    border-radius: 8px;
    padding: 0.8em 1.2em;
    transition: all 0.2s ease-out;
}

details:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.08); /* 鼠标悬停时的阴影效果 */
}

/* 折叠面板标题 (summary) 样式 */
summary {
    font-weight: bold;
    cursor: pointer; /* 鼠标指针变为手型，提示可点击 */
    padding: 0.5em 0;
    outline: none; /* 移除点击时的焦点框 */
    user-select: none; /* 防止双击选中文字 */
    color: #555; /* 默认标题颜色 */
    transition: color 0.2s ease;
    display: flex; /* 启用flex布局 */
    align-items: center; /* 垂直居中对齐内容 */
}

summary:hover {
    color: #333; /* 鼠标悬停时颜色变深 */
}

/* 特定 summary 颜色（沿用主提示词中的inline style，保持一致性） */
details summary[style*="color:#00008B"] { /* 房东信息标题 */
    color: #00008B;
}

details summary[style*="color:#FF1493"] { /* 当前主要互动租客标题 */
    color: #FF1493;
}

/* 为 summary 添加小图标，指示折叠状态 */
summary::before {
    content: '▶'; /* 未展开时的箭头图标 */
    display: inline-block;
    margin-right: 0.8em;
    font-size: 0.9em;
    color: #888;
    transition: transform 0.2s ease-out; /* 旋转动画 */
}

details[open] summary::before {
    content: '▼'; /* 展开时的箭头图标 */
    transform: rotate(0deg); /* 确保展开时箭头向下 */
}

/* 折叠面板内部段落样式 */
details p {
    margin: 0.6em 0;
    padding-left: 1.5em; /* 缩进，区分于标题 */
    border-left: 2px solid #f0f0f0; /* 左侧细线，增加结构感 */
    color: #444;
}

details b {
    color: #222; /* 加粗文字颜色更深 */
}

/* 剧情推荐分支的特殊样式 */
branches details {
    background-color: #e6f7ff; /* 浅蓝色背景，突出分支选择 */
    border-color: #a6d9f7;
}

branches summary {
    color: #007bff; /* 蓝色标题 */
}

branches summary::before {
    color: #007bff;
}

/* 确保HTML代码在主提示词中不空行 */
/* 这是AI风月平台的要求，这里仅作注释提醒 */
/* <details><summary>标题</summary><p>内容</p></details> */