/* ============================================
   皮套操控叙事引擎 - 全局样式表
   适用场景：App端 / 移动端优先
   版本：2.4 (全局左对齐版)
   ============================================ */

/* --- 1. 全局根变量与基础排版 --- */
:root {
    --font-main: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', 'Georgia', 'KaiTi', serif;
    --font-ui: 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', sans-serif;
    
    /* 字号设置 */
    --fs-body: 21px;          /* 正文 */
    --fs-h1: 29px;            /* 主标题 */
    --fs-h2: 25px;            /* 区块标题 */
    --fs-h3: 22px;            /* 子标题 */
    --fs-detail: 19px;        /* 折叠区内正文 */
    --fs-small: 17px;         /* 辅助说明 */
    --fs-table: 18px;         /* 表格内容 */
    
    /* 色板 */
    --c-bg: #faf7f2;                    /* 米白底 */
    --c-surface: #ffffff;               /* 卡片白 */
    --c-border: #d9cec3;                /* 暖灰边框 */
    --c-border-light: #e8e0d5;          /* 浅边框 */
    --c-text: #3a322c;                  /* 主文字（深褐） */
    --c-text-soft: #6b5e52;             /* 次级文字 */
    --c-accent: #8b5e3c;                /* 强调色（皮革棕） */
    --c-accent-soft: #b8977e;           /* 浅强调 */
    --c-male: #2c5f7c;                  /* 男性对话 */
    --c-female: #a64d79;                /* 女性对话 */
    --c-think: #5a6b5d;                 /* 思维链 */
    --c-memory: #4a5b6b;               /* 记忆区 */
}

/* --- 2. 正文排版 --- */
body, .narrative-body, .output-content {
    font-family: var(--font-main);
    font-size: var(--fs-body);
    line-height: 1.8;
    color: var(--c-text);
    background-color: var(--c-bg);
    padding: 16px 12px;
    word-break: break-word;
    letter-spacing: 0.02em;
    text-align: left; /* 全局左对齐 */
}

p {
    margin: 0 0 1.2em 0;
    text-indent: 0; /* 移除首行缩进，全文左对齐 */
}

/* --- 3. 折叠卡片（Details块）--- */
details {
    margin: 20px 0;
    border: 1px solid var(--c-border);
    border-radius: 10px;
    background: var(--c-surface);
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    overflow: hidden;
    transition: all 0.2s ease;
}

details[open] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}

/* 折叠标题栏 */
summary {
    font-family: var(--font-ui);
    font-size: var(--fs-h3);
    font-weight: 600;
    padding: 16px 20px;
    cursor: pointer;
    user-select: none;
    background: linear-gradient(135deg, #f5f1ec 0%, #ede4d8 100%);
    border-bottom: 1px solid var(--c-border-light);
    letter-spacing: 0.03em;
    color: var(--c-accent);
    list-style: none;
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: left;
}

summary::-webkit-details-marker { display: none; }
summary::before {
    content: "▸";
    display: inline-block;
    font-size: 19px;
    transition: transform 0.2s;
    color: var(--c-accent-soft);
}
details[open] > summary::before {
    transform: rotate(90deg);
}

/* 折叠内容区（默认） */
details > *:not(summary) {
    padding: 18px 20px;
    font-size: var(--fs-detail);
    text-align: left; /* 强制内容左对齐 */
}

/* --- 4. 各专属区块主题色 --- */

/* 思维链 */
details.think-block {
    border-color: #b8c5b0;
}
details.think-block summary {
    background: linear-gradient(135deg, #edf2ea 0%, #dce4d5 100%);
    color: var(--c-think);
}
details.think-block summary::before { content: "🧠 "; }

/* 当前情况 */
details.status-block {
    border-color: #c4b7a6;
}
details.status-block summary {
    background: linear-gradient(135deg, #fcf9f5 0%, #f3ece2 100%);
    color: #7a6248;
}
details.status-block summary::before { content: "📋 "; }

/* 玩家状态面板 */
details.player-block {
    border-color: #b8a9c4;
}
details.player-block summary {
    background: linear-gradient(135deg, #f6f3f8 0%, #e8e1ef 100%);
    color: #5e4a6e;
}
details.player-block summary::before { content: "📊 "; }

/* NPC状态 */
details.npc-block {
    border-color: #b5c7d6;
}
details.npc-block summary {
    background: linear-gradient(135deg, #f2f6f9 0%, #dce7f0 100%);
    color: #3d5a6e;
}
details.npc-block summary::before { content: "👥 "; }

/* 记忆回廊 */
details.memory-block {
    border-color: #a6bcc9;
}
details.memory-block summary {
    background: linear-gradient(135deg, #eef3f7 0%, #d6e2ed 100%);
    color: var(--c-memory);
}
details.memory-block summary::before { content: "🌌 "; }

/* 行动建议 */
details.suggestion-block {
    border-color: #c5c0a8;
}
details.suggestion-block summary {
    background: linear-gradient(135deg, #faf9f3 0%, #f0ede0 100%);
    color: #6b6538;
}
details.suggestion-block summary::before { content: "💡 "; }

/* ========== 5. 状态栏强制左对齐 ========== */

/* 玩家状态面板 & NPC状态总览 — 内容区强制左对齐 */
details.player-block > *:not(summary),
details.npc-block > *:not(summary) {
    text-align: left;
    direction: ltr; /* 恢复从左向右排列 */
}

/* 状态栏内的表格、段落、标题全面左对齐 */
details.player-block tbody td,
details.npc-block tbody td {
    text-align: left;
}

details.player-block tbody td:first-child,
details.npc-block tbody td:first-child {
    text-align: left;
    font-weight: 600;
}

details.player-block details summary,
details.npc-block details summary {
    direction: ltr;
    text-align: left;
}

details.player-block p,
details.npc-block p,
details.player-block h3,
details.npc-block h3,
details.player-block h4,
details.npc-block h4 {
    text-align: left;
    direction: ltr;
}

/* 标题前的Emoji移到左侧 */
details.player-block h3::before,
details.npc-block h3::before {
    float: left;
    margin-right: 8px;
}

/* --- 6. 通用表格样式 --- */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 14px 0;
    font-size: var(--fs-table);
    font-family: var(--font-ui);
    background: var(--c-surface);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

thead th {
    background: #f0ebe2;
    color: var(--c-text);
    font-weight: 700;
    padding: 14px 10px;
    text-align: left;
    border-bottom: 2px solid var(--c-border);
    white-space: nowrap;
    letter-spacing: 0.03em;
}

tbody td {
    padding: 12px 10px;
    border-bottom: 1px solid var(--c-border-light);
    vertical-align: top;
    line-height: 1.6;
    text-align: left;
}

tbody tr:nth-child(even) {
    background: #fdfbf8;
}

tbody tr:hover {
    background: #f8f4ed;
}

thead th:first-child { border-radius: 8px 0 0 0; }
thead th:last-child { border-radius: 0 8px 0 0; }
tbody tr:last-child td:first-child { border-radius: 0 0 0 8px; }
tbody tr:last-child td:last-child { border-radius: 0 0 8px 0; }

/* --- 7. 对话染色 --- */
span.male-speech {
    color: var(--c-male);
    font-weight: 600;
}

span.female-speech {
    color: var(--c-female);
    font-weight: 600;
}

p:has(span.male-speech) {
    border-left: 4px solid var(--c-male);
    padding-left: 14px;
    background: linear-gradient(90deg, rgba(44,95,124,0.04) 0%, transparent 60%);
    text-align: left;
}
p:has(span.female-speech) {
    border-left: 4px solid var(--c-female);
    padding-left: 14px;
    background: linear-gradient(90deg, rgba(166,77,121,0.04) 0%, transparent 60%);
    text-align: left;
}

/* --- 8. NPC折叠档案内嵌美化 --- */
details.npc-block details {
    margin: 8px 0;
    border-color: #d0dde8;
}
details.npc-block details summary {
    font-size: var(--fs-detail);
    background: linear-gradient(135deg, #f6f9fb 0%, #e9f0f5 100%);
    padding: 10px 14px;
}

/* --- 9. 小字辅助说明 --- */
.meta-note, .small-text {
    font-size: var(--fs-small);
    color: var(--c-text-soft);
    font-style: italic;
}

/* --- 10. 记忆区强制样式 --- */
details.memory-block table {
    font-size: var(--fs-small);
}
details.memory-block thead th {
    font-size: var(--fs-small);
    padding: 8px 8px;
}
details.memory-block tbody td {
    font-size: var(--fs-small);
    padding: 8px 8px;
}

/* --- 11. 响应式微调 --- */
@media (max-width: 480px) {
    :root {
        --fs-body: 20px;
        --fs-h1: 27px;
        --fs-h2: 23px;
        --fs-h3: 21px;
        --fs-detail: 18px;
        --fs-small: 16px;
        --fs-table: 17px;
    }
    
    summary {
        padding: 14px 16px;
    }
    
    details > *:not(summary) {
        padding: 14px 16px;
    }
    
    table {
        font-size: 16px;
    }
    
    thead th, tbody td {
        padding: 10px 8px;
    }
}