@charset "utf-8";
/* ==========================================================================
   verse — 诗集主题原型样式
   纸感宋体 / 窄版心 / 一句一行
   想调手感，改下面 :root 里的 token 就够了
   ========================================================================== */

:root {
  /* 西文交给 Georgia 取字形，中文交给思源宋体；顺序不能反 */
  --font-serif: Georgia, "Iowan Old Style", "Times New Roman", "Noto Serif SC",
                "Source Han Serif SC", "Songti SC", STSong, "华文宋体", "STZhongsong",
                "华文中宋", SimSun, "宋体", serif;
  --font-sans: -apple-system, "Segoe UI", "Noto Sans SC", "Source Han Sans SC",
               "Microsoft YaHei", sans-serif;

  /* 字尺：正文 18px 为基准 */
  --step--1: 0.8125rem;  /* 13px 日期、注释 */
  --step-0:  1.125rem;   /* 18px 诗句 */
  --step-1:  1.375rem;   /* 22px 目录诗题 */
  --step-2:  1.5rem;     /* 24px 诗题 */
  --step-3:  1.75rem;    /* 28px 站名 */

  /* 行与宽：诗比散文需要更多呼吸 */
  --lh-verse: 2;
  --lh-prose: 1.8;
  --measure: 28em;       /* 版心 ≈504px，一行约 25 字 */
  --gutter: 1.5rem;

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.75rem;
  --space-4: 3rem;
  --space-5: 5rem;

  --paper:    #faf8f4;
  --ink:      #22201d;
  --ink-soft: #837c72;
  --rule:     #e5e0d8;
  --accent:   #8a6d3b;   /* 赭石，只在悬停/焦点处露一下 */

  color-scheme: light dark;
}

/* 暗色不是反色：暖纸 → 暖黑，文字压到 #e8e4dd，别用纯白纯黑 */
@supports (color: light-dark(#000, #fff)) {
  :root {
    --paper:    light-dark(#faf8f4, #151412);
    --ink:      light-dark(#22201d, #e8e4dd);
    --ink-soft: light-dark(#837c72, #8d867a);
    --rule:     light-dark(#e5e0d8, #2b2724);
    --accent:   light-dark(#8a6d3b, #c9a86a);
  }
}
/* 老浏览器降级：没有 light-dark() 时手写一份暗色 */
@supports not (color: light-dark(#000, #fff)) {
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      --paper: #151412; --ink: #e8e4dd; --ink-soft: #8d867a;
      --rule: #2b2724;  --accent: #c9a86a;
    }
  }
  :root[data-theme="dark"] {
    --paper: #151412; --ink: #e8e4dd; --ink-soft: #8d867a;
    --rule: #2b2724;  --accent: #c9a86a;
  }
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"]  { color-scheme: dark; }

/* 跨页面淡入淡出（Chrome/Edge 支持，其他浏览器直接忽略） */
@view-transition { navigation: auto; }

/* --------------------------------------------------------------------------
   基础
   -------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0 auto;
  max-width: var(--measure);
  padding: var(--space-5) var(--gutter);
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: var(--step-0);
  line-height: var(--lh-prose);
  letter-spacing: 0.015em;
  font-kerning: normal;
  text-autospace: normal;         /* 中英混排自动加缝 */
  text-spacing-trim: trim-start;  /* 标点挤压 */
  hanging-punctuation: allow-end; /* 行末标点悬挂（Safari） */
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: inherit; text-decoration: none; }

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 2px;
}
::selection { background: color-mix(in srgb, var(--accent) 24%, transparent); }

/* --------------------------------------------------------------------------
   页头
   -------------------------------------------------------------------------- */

.masthead {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
  margin-bottom: var(--space-5);
}

.wordmark {
  font-family: var(--font-sans);
  font-size: var(--step-3);
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1.2;
}

.tagline {
  margin: 0.4rem 0 0;
  font-family: var(--font-sans);
  font-size: var(--step--1);
  color: var(--ink-soft);
  letter-spacing: 0.2em;
}

.back {
  font-family: var(--font-sans);
  font-size: var(--step--1);
  color: var(--ink-soft);
  letter-spacing: 0.08em;
}
.back:hover { color: var(--accent); }

.theme-toggle {
  flex: none;
  padding: 0.4rem 0.55rem;
  border: 0;
  border-radius: 4px;
  background: none;
  color: var(--ink-soft);
  font-family: var(--font-sans);
  font-size: var(--step--1);
  letter-spacing: 0.1em;
  cursor: pointer;
  transition: color 0.18s ease;
}
.theme-toggle:hover { color: var(--ink); }

/* --------------------------------------------------------------------------
   目录页
   -------------------------------------------------------------------------- */

.toc-note {
  margin: 0 0 var(--space-2);
  font-family: var(--font-sans);
  font-size: var(--step--1);
  color: var(--ink-soft);
  letter-spacing: 0.1em;
}

.toc {
  margin: 0;
  padding: 0;
  list-style: none;
  border-bottom: 1px solid var(--rule);
}
.toc li + li { border-top: 1px solid var(--rule); }

.toc a {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
  padding: 0.95rem 0;
}

.toc .title {
  font-size: var(--step-1);
  font-weight: 500;
  line-height: 1.5;
  transition: color 0.18s ease, transform 0.18s ease;
}
.toc a:hover .title { color: var(--accent); transform: translateX(3px); }

.toc .date {
  flex: none;
  font-family: var(--font-sans);
  font-size: var(--step--1);
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
  transition: color 0.18s ease;
}
.toc a:hover .date { color: var(--ink); }

/* --------------------------------------------------------------------------
   单首诗
   -------------------------------------------------------------------------- */

.poem-head { margin: var(--space-4) 0 0; }

/* 题上那条短眉线，是"诗集感"的来源之一 */
.poem-head::before {
  content: "";
  display: block;
  width: 2rem;
  margin-bottom: var(--space-2);
  border-top: 1px solid var(--rule);
}

.poem-title {
  margin: 0 0 0.75rem;
  font-size: var(--step-2);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.02em;
}

.poem-meta {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--step--1);
  color: var(--ink-soft);
  letter-spacing: 0.06em;
}
.poem-meta .sep { padding: 0 0.5em; }
.poem-meta .tag { letter-spacing: 0.14em; }

.verse {
  margin: var(--space-4) 0 0;
  line-height: var(--lh-verse);
  text-align: left;   /* 诗句不要两端对齐，短行会被拉开 */
  hyphens: none;
}
/* Hexo 输出的是 <p>，原型里用的是 .stanza，两套都照顾 */
.verse p, .verse .stanza { margin: 0; }
.verse p + p, .verse .stanza + .stanza { margin-top: 1.5em; }

/* 散文/碎碎念：中文传统首行缩进两字 */
.prose { line-height: var(--lh-prose); }
.prose p { margin: 0 0 1em; text-indent: 2em; }
.prose p:first-child { text-indent: 0; }

.poem-nav {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  margin-top: var(--space-5);
  padding-top: var(--space-2);
  border-top: 1px solid var(--rule);
  font-size: var(--step--1);
}
.poem-nav .label {
  display: block;
  margin-bottom: 0.35rem;
  font-family: var(--font-sans);
  color: var(--ink-soft);
  letter-spacing: 0.12em;
}
.poem-nav a:hover { color: var(--accent); }
.poem-nav .next { margin-left: auto; text-align: right; }

/* --------------------------------------------------------------------------
   页脚
   -------------------------------------------------------------------------- */

.site-foot {
  display: flex;
  justify-content: space-between;
  gap: var(--space-2);
  margin-top: var(--space-5);
  padding-top: var(--space-2);
  border-top: 1px solid var(--rule);
  font-family: var(--font-sans);
  font-size: 0.75rem;
  color: var(--ink-soft);
  letter-spacing: 0.06em;
}
.site-foot a:hover { color: var(--accent); }
.site-foot__links { display: flex; align-items: baseline; }
.site-foot__links a + a { margin-left: 0.6rem; }
.site-foot__links a + a::before { content: "·"; margin-right: 0.6rem; color: var(--rule); }

/* --------------------------------------------------------------------------
   入场动效：只有一次轻微上浮，别做视差和打字机
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: no-preference) {
  .rise {
    animation: rise 0.5s cubic-bezier(0.2, 0.7, 0.2, 1) both;
    animation-delay: calc(var(--i, 0) * 55ms);
  }
  @keyframes rise {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
  }
  ::view-transition-old(root),
  ::view-transition-new(root) { animation-duration: 0.22s; }
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) { animation: none !important; }
}

/* --------------------------------------------------------------------------
   小屏：优先按手机调，诗大多是手机上读的
   -------------------------------------------------------------------------- */

@media (max-width: 480px) {
  :root {
    --gutter: 1.25rem;
    --step-0: 1.0625rem;  /* 17px，别再小了 */
    --step-1: 1.1875rem;
    --space-5: 3rem;
  }
  .masthead { margin-bottom: var(--space-4); }
}

/* --------------------------------------------------------------------------
   打印：诗集是会被人打印的
   -------------------------------------------------------------------------- */

@media print {
  :root {
    --paper: #fff; --ink: #000; --ink-soft: #555; --rule: #bbb; --accent: #000;
  }
  body { max-width: none; padding: 0; font-size: 12pt; }
  .masthead, .theme-toggle, .poem-nav, .site-foot, .toc-note { display: none; }
  .poem-head { margin-top: 0; }
  .poem-head::before { display: none; }
  .rise { animation: none; opacity: 1; }
  @page { margin: 2cm; }
}
