/* ============================================================
   庭院 · 说明书与更新记录

   这两份长文住在「我」那一页里 —— 不是另一个网址，是这个院子的一格。
   所以排版要跟院子走：发丝线分层、不用卡片墙、不写死颜色。
   ============================================================ */

/* ── 折叠：两份长文收在这里，默认收着 ─────────────────────── */
.docfolds { margin: 2px 0; }
.docfold + .docfold { border-top: 1px solid var(--line); }

.docfold__head {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 15px 0;
  text-align: left;
  transition: opacity var(--e2) var(--ease);
}
.docfold__head:hover { opacity: 0.8; }
.docfold__i { font-size: 15px; line-height: 1.5; filter: saturate(0.8); flex: none; }
.docfold__b { flex: 1 1 auto; min-width: 0; }
.docfold__b b {
  display: block;
  color: var(--moon-100);
  font-weight: 400;
  font-size: var(--t-base);
  letter-spacing: 0.06em;
}
.docfold__b > span {
  display: block;
  margin-top: 3px;
  font-size: var(--t-xs);
  color: var(--moon-400);
  line-height: 1.7;
}
.docfold__x {
  flex: none;
  align-self: center;
  font-size: var(--t-xs);
  color: var(--c-glimmer);
  letter-spacing: 0.10em;
}
.docfold__body { display: none; padding: 6px 0 30px; }
.docfold.is-open .docfold__body { display: block; animation: fadeIn var(--e2) var(--ease); }
.docfold.is-open .docfold__x { color: var(--moon-400); }

/* ── 长文：留白多一点，因为是要一行行读的 ─────────────────── */
.doc {
  font-size: var(--t-sm);
  line-height: 1.95;
  color: var(--moon-200);
  letter-spacing: 0.02em;
}
.doc p { margin: 10px 0; }
.doc b { font-weight: 400; color: var(--moon-100); }
.doc em { font-style: normal; color: var(--c-glimmer); }
.doc code {
  font-family: var(--font-mono);
  font-size: 0.9em;
  background: var(--s-2);
  border: 1px solid var(--line);
  border-radius: var(--r-xs);
  padding: 1px 5px;
  color: var(--moon-100);
}

.doc ul, .doc ol { margin: 10px 0; padding-left: 0; }
.doc li { position: relative; padding-left: 16px; margin: 6px 0; }
.doc li::before {
  content: "";
  position: absolute; left: 2px; top: 0.78em;
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--moon-400);
}
.doc ol { counter-reset: dc; }
.doc ol > li { padding-left: 23px; }
.doc ol > li::before {
  content: counter(dc); counter-increment: dc;
  left: 0; top: 0; width: auto; height: auto;
  border-radius: 0; background: none;
  color: var(--moon-400);
  font-family: var(--font-mono);
  font-size: 11px;
}

.doc__lead {
  font-family: var(--font-serif);
  font-size: var(--t-base);
  line-height: 2.05;
  color: var(--moon-300);
  letter-spacing: 0.03em;
  margin-bottom: 6px;
}
.doc__lead b { color: var(--moon-100); font-weight: 400; }

.doc__chap {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t-md);
  letter-spacing: 0.12em;
  color: var(--moon-100);
  margin: 40px 0 4px;
  padding-top: 26px;
  border-top: 1px solid var(--line-2);
  display: flex;
  align-items: baseline;
  gap: 11px;
}
.doc__chap em {
  font-style: normal;
  color: var(--c-glimmer);
  font-size: var(--t-sm);
  letter-spacing: 0;
}
.doc__note { font-size: var(--t-xs); color: var(--moon-400); margin-bottom: 4px; line-height: 1.8; }

.doc__sec {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t-base);
  letter-spacing: 0.06em;
  color: var(--moon-100);
  margin: 30px 0 4px;
  display: flex;
  align-items: baseline;
  gap: 9px;
}
.doc__sec .doc__n {
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--moon-400);
  letter-spacing: 0;
  flex: none;
}

.doc__h5 { font-size: var(--t-sm); color: var(--moon-300); margin: 20px 0 2px; letter-spacing: 0.08em; }
.doc__hint { color: var(--moon-400); font-size: var(--t-xs); }

/* ── 条 ──────────────────────────────────────────────────── */
.doc__box {
  background: var(--s-1);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 16px 18px;
  margin: 16px 0;
}
.doc__box--quiet { background: none; }
.doc__box--warm { border-color: rgba(226,189,124,.22); background: var(--c-glimmer-wash); }
.doc__box--warn { border-color: rgba(196,123,147,.24); background: var(--c-rose-wash); }
.doc__bt { font-size: var(--t-sm); letter-spacing: 0.08em; color: var(--moon-100); margin-bottom: 8px; }
.doc__box--warm .doc__bt { color: var(--c-glimmer); }
.doc__box > *:last-child { margin-bottom: 0; }
.doc__box > *:first-child { margin-top: 0; }

/* ── 键值：左边是名字，右边是说明，窄屏折成两行 ───────────── */
.doc__kv {
  display: flex;
  gap: 14px;
  align-items: baseline;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
}
.doc__kv:last-child { border-bottom: 0; }
.doc__k { flex: none; width: 104px; color: var(--moon-400); font-size: var(--t-xs); letter-spacing: 0.05em; }
.doc__v { flex: 1 1 auto; min-width: 0; color: var(--moon-200); font-size: var(--t-sm); }
.doc__v b { color: var(--moon-100); }
@media (max-width: 420px) {
  .doc__kv { flex-direction: column; gap: 2px; }
  .doc__k { width: auto; }
}

/* ── 步骤 ────────────────────────────────────────────────── */
.doc__steps { counter-reset: ds; margin: 16px 0; }
.doc__step {
  position: relative;
  padding: 0 0 18px 32px;
  border-left: 1px solid var(--line);
  margin-left: 6px;
}
.doc__step:last-child { border-left-color: transparent; padding-bottom: 0; }
.doc__step::before {
  counter-increment: ds; content: counter(ds);
  position: absolute; left: -11px; top: -2px;
  width: 21px; height: 21px; border-radius: 50%;
  background: var(--night-700);
  border: 1px solid var(--line-2);
  color: var(--c-glimmer);
  font-family: var(--font-mono);
  font-size: 11px;
  display: grid;
  place-items: center;
}
.doc__step-t { font-size: var(--t-sm); color: var(--moon-100); }
.doc__step-d { font-size: var(--t-xs); color: var(--moon-300); margin-top: 3px; line-height: 1.85; }

/* ── 空间格：跟世界页共用一套，只是不给人点 ───────────────── */
.spaces--doc { margin: 16px 0; }
.spaces--doc .space { min-height: 104px; }
.spaces--doc .space:hover { transform: none; border-color: var(--line); }

/* ── 标记 ────────────────────────────────────────────────── */
.tag--ok   { color: var(--c-garden); border-color: rgba(123,160,127,.3); }
.tag--fix  { color: var(--c-blue);   border-color: rgba(125,156,203,.3); }
.tag--no   { color: var(--c-rose);   border-color: rgba(196,123,147,.28); }

.doc__tags { margin: 12px 0; }
.doc__tags--sm { margin: 10px 0 2px; }
.doc__tags--legend { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 8px 0; }
.doc__tagrow { display: flex; align-items: baseline; gap: 8px; padding: 3px 0; }
.doc__tagrow .tag { flex: none; margin: 0; }
.doc__tagnote { font-size: var(--t-xs); color: var(--moon-400); line-height: 1.75; }

/* ── 更新条目 ────────────────────────────────────────────── */
.entry { padding-top: 22px; border-top: 1px solid var(--line); margin-top: 24px; }
.entry:first-of-type { border-top: 1px solid var(--line-2); }
.entry__head { display: flex; align-items: baseline; gap: 11px; flex-wrap: wrap; }
.entry__no {
  font-family: var(--font-mono);
  font-size: 11.5px;
  letter-spacing: 0.06em;
  color: var(--c-glimmer);
  border: 1px solid rgba(226,189,124,.3);
  border-radius: var(--r-pill);
  padding: 1px 10px;
}
.entry--old .entry__no { color: var(--moon-400); border-color: var(--line); }
.entry__date { font-size: var(--t-xs); color: var(--moon-400); letter-spacing: 0.08em; }
.entry__t {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--t-md);
  letter-spacing: 0.06em;
  color: var(--moon-100);
  margin: 10px 0 0;
}
.entry__lead { font-size: var(--t-sm); color: var(--moon-300); margin-top: 8px; line-height: 1.95; }
.entry__lead b { color: var(--moon-100); font-weight: 400; }
.entry__files { margin: 12px 0 0; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.entry__file {
  display: flex; gap: 12px;
  padding: 8px 13px;
  border-bottom: 1px solid var(--line);
  font-size: var(--t-xs);
}
.entry__file:last-child { border-bottom: 0; }
.entry__fp { font-family: var(--font-mono); font-size: 11.5px; color: var(--moon-100); flex: none; }
.entry__fd { color: var(--moon-400); flex: 1 1 auto; min-width: 0; }
@media (max-width: 420px) {
  .entry__file { flex-direction: column; gap: 1px; }
}
