/* 天下聊聊天室 · 站内样式（本地文件，无外链字体/CDN） */
:root {
  --paper: #f3e8d6;
  --paper-deep: #eadfc9;
  --paper-card: #faf3e6;
  --ink: #3a2318;
  --ink-soft: #6b4a34;
  --brand: #8a4b32;
  --brand-hover: #b8743f;
  --line: #d8c3a5;
  --line-soft: #e4d4b8;
  --speaker-a: #6b4226;
  --speaker-b: #9c5245;
  --nav-bg: #2f1c12;
  --nav-ink: #f3e8d6;
  --ok: #4c6b3a;
  --warn: #9c4b2f;
  --font-sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "SF Mono", Menlo, Consolas, "Hiragino Sans GB", ui-monospace, monospace;
}

* { box-sizing: border-box; min-width: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-sans);
  line-height: 1.75;
  font-size: 16px;
  overflow-x: hidden;
}
img, svg { max-width: 100%; display: block; }
a { color: var(--brand); text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 2px; }
a:hover, a:focus-visible { color: var(--brand-hover); }
.skip-link {
  position: absolute; left: -9999px; top: 0; background: var(--nav-ink); color: var(--nav-bg); padding: .5rem 1rem; z-index: 50;
}
.skip-link:focus { left: .5rem; top: .5rem; }

/* 顶部导航 */
.site-nav { background: var(--nav-bg); color: var(--nav-ink); }
.site-nav .nav-inner {
  max-width: 920px; margin: 0 auto; padding: .7rem 1rem;
  display: flex; align-items: center; gap: .9rem; flex-wrap: wrap;
}
.site-nav .brand { font-weight: 700; font-size: 1.05rem; color: var(--nav-ink); text-decoration: none; letter-spacing: .02em; }
.site-nav .brand:hover { color: var(--brand-hover); }
.site-nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: .15rem; flex-wrap: wrap; overflow-x: auto; }
.site-nav li { flex: none; }
.site-nav a.nav-link {
  display: inline-block; padding: .35rem .6rem; color: var(--nav-ink); text-decoration: none; border-radius: .3rem; font-size: .92rem;
}
.site-nav a.nav-link:hover, .site-nav a.nav-link[aria-current="page"] { background: rgba(243,232,214,.15); color: var(--brand-hover); }

/* 面包屑 */
.crumb { max-width: 920px; margin: 0 auto; padding: .7rem 1rem 0; font-size: .85rem; color: var(--ink-soft); }
.crumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: .3rem; margin: 0; padding: 0; }
.crumb li:not(:last-child)::after { content: "›"; margin-left: .3rem; color: var(--line); }
.crumb a { color: var(--ink-soft); text-decoration: underline; text-decoration-color: var(--line-soft); }
.crumb [aria-current="page"] { color: var(--ink); }

main { max-width: 920px; margin: 0 auto; padding: 1rem 1rem 3rem; }
main.narrow { max-width: 740px; }
h1 { font-size: 1.5rem; line-height: 1.4; margin: .6rem 0 .5rem; color: var(--ink); }
h2 { font-size: 1.18rem; margin: 1.6rem 0 .6rem; color: var(--brand); }
h3 { font-size: 1.02rem; margin: 1.2rem 0 .4rem; color: var(--ink-soft); }
p { margin: 0 0 1rem; }
.lead { font-size: 1.02rem; color: var(--ink-soft); }
.page-desc { color: var(--ink-soft); margin-bottom: 1.2rem; }

/* 卡片网格 */
.grid { display: grid; gap: .9rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.card {
  background: var(--paper-card); border: 1px solid var(--line-soft); border-radius: .5rem; padding: .9rem 1rem;
  min-width: 0;
}
.card h3 { margin-top: 0; }
.card h3 a { text-decoration: none; color: var(--ink); }
.card h3 a:hover { color: var(--brand); }
.card p { margin-bottom: .4rem; font-size: .93rem; color: var(--ink-soft); }
.card .meta { font-family: var(--font-mono); font-size: .78rem; color: var(--ink-soft); }
.tag-row { display: flex; flex-wrap: wrap; gap: .3rem; margin: .4rem 0; }
.tag { font-size: .76rem; background: var(--paper-deep); border: 1px solid var(--line); border-radius: 1rem; padding: .1rem .55rem; color: var(--ink-soft); font-family: var(--font-mono); }

/* 作品 / 期数 列表 */
.ep-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .6rem; }
.ep-list li { background: var(--paper-card); border: 1px solid var(--line-soft); border-radius: .5rem; padding: .8rem 1rem; }
.ep-list a { text-decoration: none; font-weight: 600; color: var(--ink); }
.ep-list a:hover { color: var(--brand); }
.ep-list .ep-summary { color: var(--ink-soft); font-size: .92rem; margin-top: .3rem; }
.ep-read-mark { font-family: var(--font-mono); font-size: .76rem; color: var(--ok); margin-left: .4rem; }

/* 对话体正文 */
.dialogue { margin: 1.4rem 0; }
.turn { margin: 0 0 1.1rem; max-width: 42rem; }
.turn .speaker { display: block; font-family: var(--font-mono); font-weight: 700; font-size: .82rem; letter-spacing: .04em; margin-bottom: .2rem; }
.turn.sp-a .speaker { color: var(--speaker-a); }
.turn.sp-b .speaker { color: var(--speaker-b); }
.turn .line { margin: 0; white-space: pre-line; }
.beat {
  font-style: italic; color: var(--ink-soft); text-align: center; margin: 1.3rem auto; max-width: 34rem;
  font-size: .92rem; border-top: 1px dashed var(--line); border-bottom: 1px dashed var(--line); padding: .5rem 0;
}
.read-progress-bar { position: sticky; top: 0; height: 3px; background: var(--line-soft); z-index: 10; }
.read-progress-bar > span { display: block; height: 100%; background: var(--brand); width: 0%; }

/* 工具区 */
.tool-panel { background: var(--paper-card); border: 1px solid var(--line-soft); border-radius: .6rem; padding: 1rem; margin-bottom: 1.2rem; }
.field-row { display: flex; flex-wrap: wrap; gap: .8rem; margin-bottom: .8rem; }
.field { display: flex; flex-direction: column; gap: .3rem; min-width: 0; flex: 1 1 10rem; }
.field label { font-size: .82rem; color: var(--ink-soft); }
select, input[type="text"], input[type="date"], input[type="number"], textarea {
  font-family: var(--font-sans); font-size: .95rem; padding: .45rem .55rem; border: 1px solid var(--line);
  border-radius: .35rem; background: #fff; color: var(--ink); width: 100%;
}
textarea { resize: vertical; min-height: 4.5rem; }
fieldset { border: 1px solid var(--line); border-radius: .4rem; padding: .5rem .7rem; }
legend { font-size: .82rem; color: var(--ink-soft); padding: 0 .3rem; }
.checkbox-row { display: flex; flex-wrap: wrap; gap: .6rem; }
.checkbox-row label { display: inline-flex; align-items: center; gap: .3rem; font-size: .88rem; }

button {
  font-family: var(--font-sans); font-size: .95rem; padding: .5rem 1rem; border-radius: .4rem; border: 1px solid var(--brand);
  background: var(--brand); color: #fff; cursor: pointer;
}
button:hover { background: var(--brand-hover); border-color: var(--brand-hover); }
button.ghost { background: transparent; color: var(--brand); }
button.ghost:hover { background: var(--paper-deep); }
button.small { font-size: .82rem; padding: .3rem .6rem; }
.btn-row { display: flex; flex-wrap: wrap; gap: .5rem; margin: .7rem 0; }

.result-card { background: #fff; border: 1px solid var(--line-soft); border-radius: .5rem; padding: .8rem 1rem; margin-bottom: .7rem; }
.result-card h4 { margin: 0 0 .3rem; font-size: 1rem; }
.result-card .field-line { font-size: .9rem; margin: .25rem 0; }
.result-card .field-line b { color: var(--ink-soft); font-weight: 600; }
.status-msg { padding: .6rem .8rem; border-radius: .4rem; margin: .7rem 0; font-size: .9rem; }
.status-msg.ok { background: #eef2e4; color: var(--ok); border: 1px solid #c9d8ab; }
.status-msg.err { background: #f6e4dd; color: var(--warn); border: 1px solid #e3b7a3; }

.record-list { display: flex; flex-direction: column; gap: .7rem; margin: 1rem 0; }
.record-card { background: var(--paper-card); border: 1px solid var(--line-soft); border-radius: .5rem; padding: .8rem 1rem; }
.record-card .record-head { display: flex; justify-content: space-between; gap: .5rem; flex-wrap: wrap; font-family: var(--font-mono); font-size: .82rem; color: var(--ink-soft); }
.record-card dl { margin: .5rem 0 0; display: grid; grid-template-columns: minmax(0,5.5rem) minmax(0,1fr); gap: .25rem .6rem; font-size: .9rem; }
.record-card dt { color: var(--ink-soft); }
.record-card dd { margin: 0; }

/* 搜索 */
.search-box { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.search-box input { flex: 1 1 14rem; }
.search-result { border-bottom: 1px solid var(--line-soft); padding: .8rem 0; }
.search-result h3 { margin: 0 0 .2rem; }
.search-result .snippet { color: var(--ink-soft); font-size: .92rem; }
mark { background: #e9c88f; color: var(--ink); padding: 0 .1rem; border-radius: .15rem; }

/* 引用块（方法论引用对谈段落） */
blockquote.quote-card {
  margin: 1rem 0; padding: .8rem 1rem; background: var(--paper-deep); border-left: 3px solid var(--brand);
  border-radius: .3rem; font-size: .95rem; white-space: pre-line;
}
blockquote.quote-card cite { display: block; margin-top: .5rem; font-size: .8rem; font-family: var(--font-mono); color: var(--ink-soft); font-style: normal; }
blockquote.quote-card cite a { color: var(--ink-soft); }
.quote-note { font-size: .9rem; color: var(--ink-soft); margin: .4rem 0 1.2rem; }

.storage-note {
  font-size: .85rem; color: var(--ink-soft); background: var(--paper-deep); border: 1px dashed var(--line);
  border-radius: .4rem; padding: .6rem .8rem; margin-bottom: 1rem;
}

footer.site-foot {
  background: var(--nav-bg); color: var(--nav-ink); margin-top: 2rem; padding: 1.4rem 1rem;
}
footer.site-foot .foot-inner { max-width: 920px; margin: 0 auto; font-size: .85rem; }
footer.site-foot a { color: var(--brand-hover); }

.char-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .5rem; }
.char-list li { background: var(--paper-card); border: 1px solid var(--line-soft); border-radius: .4rem; padding: .6rem .8rem; font-size: .92rem; }
.char-list b { color: var(--ink-soft); }

.inline-links { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; }
.inline-links a { font-size: .88rem; background: var(--paper-deep); border: 1px solid var(--line); border-radius: 1rem; padding: .2rem .7rem; text-decoration: none; }

.scope-note-icon { display: inline-flex; align-items: center; gap: .3rem; }

@media (max-width: 480px) {
  h1 { font-size: 1.32rem; }
  main { padding: .8rem .8rem 2.5rem; }
  .record-card dl { grid-template-columns: minmax(0,4.6rem) minmax(0,1fr); }
}