/*
Theme Name: Moushuo
Theme URI: https://moushuo.me
Description: 对 moushuo.me 阅读型个人博客（Hugo "reading-column hybrid" 编辑式版式）的 WordPress 复刻。顶部 sticky 站点栏、居中编辑栏、衬线正文、克制的强调色。
Version: 1.0.0
Author: 猫子 / WorkBuddy
Author URI: https://moushuo.me
Tags: blog, minimal, editorial, serif, responsive
Text Domain: moushuo
Requires at least: 6.0
Tested up to: 6.6
*/

/* =========================================================================
   Moushuo — WordPress theme
   Design tokens & layout ported from moushuo.me (style.css + fonts.css +
   custom.css?v=reading-column-hybrid-18).
   ========================================================================= */

/* ---- Micro reset ---- */
html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  box-sizing: border-box;
}

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

body {
  margin: 0;
  padding: 0;
}

button,
input,
select,
textarea,
label {
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: inherit;
}

img {
  max-width: 100%;
  height: auto;
}

/* ---- Design tokens ---- */
:root {
  --moushuo-paper: #fbfaf8;
  --moushuo-ink: #242321;
  --moushuo-muted: #807d77;
  --moushuo-rule: #d9d6d0;
  --moushuo-accent: #bc5d4e;
  --moushuo-serif: "Noto Serif SC", "Songti SC", "STSong", Georgia, serif;
  --moushuo-sans: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Microsoft YaHei", sans-serif;
}

html,
body {
  background: var(--moushuo-paper);
}

body {
  width: auto;
  max-width: none;
  margin: 0;
  padding: 0;
  color: var(--moushuo-ink);
  font-family: var(--moushuo-sans);
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ---- Base typography ---- */
body {
  line-height: 1.8;
  color: var(--moushuo-ink);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  padding: 0;
  margin: 60px 0 30px;
  line-height: 1.25;
  text-align: center;
  font-weight: normal;
}

h1 {
  font-size: 32px;
  font-weight: normal;
}

h2 {
  font-size: 22px;
  font-weight: bold;
}

h3,
h4,
h5,
h6 {
  font-size: 19px;
  font-weight: bold;
  text-align: left;
}

p {
  margin: 0 0 20px;
}

ul,
ol {
  padding: 0 0 0 20px;
}

li {
  margin: 4px 0;
  padding: 0;
}

blockquote {
  margin: 1em 0;
  padding: 0 2em;
  border-left: 3px solid #ddd;
  font-family: "Palatino Linotype", "Book Antiqua", Palatino, "STKaiti",
    "KaiTi", "楷体", "SimKai", "DFKai-SB", "NSimSun", serif;
}

/* ---- Code ---- */
code,
pre {
  font-family: Consolas, Courier, "Courier New", "STKaiti", "KaiTi", "SimKai",
    monospace;
  font-size: 0.9em;
}

pre code {
  display: block;
  border: 1px solid #ddd;
  box-shadow: 5px 5px 5px #eee;
  padding: 1em;
  overflow-x: auto;
  line-height: 1.75;
  background: none;
}

code {
  background: #f9f9f9;
}

/* ---- Links ---- */
a {
  color: black;
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 1px dashed;
}

a:hover {
  color: var(--moushuo-accent);
}

sup a {
  border-bottom: none;
}

/* ---- Horizontal rule ---- */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid;
  margin: 50px auto;
  padding: 0;
  max-width: 300px;
}

/* ---- Tables ---- */
table {
  margin: auto;
  margin-bottom: 25px;
  border-top: 1px solid #666;
  border-bottom: 1px solid #666;
  min-width: 90%;
  max-width: 100%;
}

thead,
tfoot,
tr:nth-child(even) {
  background: #f8f8f8;
}

table thead th {
  border-bottom: 1px solid #666;
}

th,
td {
  padding: 5px;
}

/* =========================================================================
   Masthead (sticky top site bar)
   ========================================================================= */
.masthead {
  position: sticky;
  top: 0;
  z-index: 20;
  width: auto;
  min-height: 64px;
  height: 64px;
  margin: 0;
  padding: 0 24px;
  float: none;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 32px;
  border-bottom: 1px solid var(--moushuo-rule);
  background: rgba(251, 250, 248, 0.94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.masthead h1 {
  justify-self: start;
  margin: 0;
  padding: 0;
  text-align: left;
  font: 600 23px/1 var(--moushuo-serif);
  letter-spacing: -0.04em;
  display: flex;
  align-items: baseline;
  gap: 14px;
}

.masthead h1 a,
.masthead .menu a {
  border-bottom: 0;
}

.masthead h1 a {
  color: var(--moushuo-ink);
}

.masthead h1 .brand-note {
  color: var(--moushuo-muted);
  font: 400 11px/1.5 var(--moushuo-sans);
  letter-spacing: 0.08em;
}


/* ---- Menu ---- */
.masthead .menu {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  margin: 0;
  direction: ltr;
}

.masthead .menu > ul {
  display: flex;
  align-items: center;
  gap: 30px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.masthead .menu li,
.masthead .menu li:first-child {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
}

.masthead .menu li a {
  display: block;
  padding: 0;
  color: var(--moushuo-muted);
  font: 400 13px/1.5 var(--moushuo-sans);
  letter-spacing: 0.04em;
  transition: color 0.2s ease;
  border-bottom: none;
}

.masthead .menu li a:hover,
.masthead .menu li.current-menu-item > a,
.masthead .menu li.current_page_item > a,
.masthead .menu li.active a {
  color: var(--moushuo-ink);
}

.masthead .menu li.current-menu-item > a,
.masthead .menu li.active a {
  position: relative;
}

.masthead .menu li.current-menu-item > a::after,
.masthead .menu li.active a::after {
  position: absolute;
  right: 0;
  bottom: -29px;
  left: 0;
  height: 1px;
  background: var(--moushuo-accent);
  content: "";
}

/* =========================================================================
   Main editorial column
   ========================================================================= */
.main {
  width: min(calc(100% - 48px), 820px);
  min-height: 0;
  margin: 0 auto;
  padding: 56px 0 56px;
  border-left: 0;
  font-family: var(--moushuo-serif);
  hyphens: auto;
  -webkit-hyphens: auto;
}

.main .title {
  margin: 0 0 56px;
  padding: 0 0 48px;
  border-bottom: 1px solid var(--moushuo-rule);
}

.main .title h1 {
  margin: 0 0 24px;
  color: var(--moushuo-ink);
  text-align: left;
  font: 600 clamp(36px, 5vw, 54px) / 1.24 var(--moushuo-serif);
  letter-spacing: -0.075em;
}

.main .title h3 {
  margin: 0;
  color: var(--moushuo-muted);
  text-align: left;
  font: 400 12px/1.5 var(--moushuo-sans);
  letter-spacing: 0.08em;
}

.main .title hr {
  display: none;
}

/* Body copy */
.main > p,
.main > ul,
.main > ol,
.main > blockquote,
.main > h2,
.main > h3,
.main > h4,
.main > h5,
.main > h6,
.main > table,
.main > pre {
  max-width: 100%;
}

.main > p {
  margin: 0 0 20px;
  color: var(--moushuo-ink);
  font: 500 18px/1.8 var(--moushuo-serif);
}

.main > h2 {
  margin: 60px 0 22px;
  text-align: left;
  font: 600 29px/1.3 var(--moushuo-sans);
  letter-spacing: 0.02em;
}

.main > h3,
.main > h4,
.main > h5,
.main > h6 {
  margin: 46px 0 18px;
  text-align: left;
  font: 600 22px/1.4 var(--moushuo-serif);
  letter-spacing: -0.03em;
}

.main blockquote {
  margin: 36px 0 42px;
  padding: 24px 24px 24px 28px;
  border-left: 3px solid var(--moushuo-accent);
  color: var(--moushuo-muted);
  font: 500 20px/1.75 var(--moushuo-serif);
}

.main blockquote p {
  margin: 0 0 12px;
}

.main blockquote p:last-child {
  margin-bottom: 0;
}

.main a {
  color: inherit;
  border-bottom: 1px dashed currentColor;
  text-decoration: none;
  padding-bottom: 1px;
}

.main a:hover {
  color: var(--moushuo-accent);
  border-bottom-color: var(--moushuo-accent);
}

.main img {
  display: block;
  max-width: 100%;
  margin: 28px auto;
  border-radius: 1%;
  box-shadow: 0 2px 8px rgba(36, 35, 33, 0.12);
}

.main ul:not(.home-post-list):not(.notes-list):not(.booklist-index):not(.children),
.main ol:not(.home-post-list) {
  margin: 4px 0 24px;
  padding-left: 1.4em;
  list-style: disc;
}

.main ol:not(.home-post-list) {
  list-style: decimal;
}

.main ul:not(.home-post-list) > li,
.main ol:not(.home-post-list) > li {
  display: list-item;
  width: auto;
  margin: 0 0 8px;
  color: var(--moushuo-ink);
  font: 500 18px/1.7 var(--moushuo-serif);
}

/* =========================================================================
   Homepage (hero + latest + note)
   ========================================================================= */
.home .main {
  width: min(calc(100% - 48px), 980px);
  padding-top: 0;
  padding-bottom: 100px;
}

.home-hero {
  min-height: 360px;
  padding: 76px 0 64px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  align-items: end;
  gap: 80px;
}

.eyebrow {
  margin: 0 0 16px;
  color: var(--moushuo-accent);
  font: 600 10px/1.4 var(--moushuo-sans);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.home-hero h1 {
  max-width: 640px;
  margin: 0;
  color: var(--moushuo-ink);
  text-align: left;
  font: 600 clamp(42px, 5.6vw, 70px) / 1.12 var(--moushuo-serif);
  letter-spacing: -0.08em;
}

.home-hero h1 em {
  color: var(--moushuo-muted);
  font-style: normal;
}

.home-intro {
  max-width: 410px;
  margin: 30px 0 0;
  color: var(--moushuo-muted);
  font: 400 16px/1.9 var(--moushuo-serif);
}

.home-hero-aside {
  color: var(--moushuo-muted);
  font: 400 14px/1.9 var(--moushuo-serif);
}

.home-hero-aside .aside-label {
  display: block;
  margin-bottom: 14px;
  color: var(--moushuo-ink);
  font: 600 11px/1 var(--moushuo-sans);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.home-current {
  margin-top: 0;
  padding: 0 0 0 24px;
  border-top: 0;
  border-left: 1px solid var(--moushuo-rule);
}

.home-hero-aside p {
  margin: 0;
}

.home-latest {
  border-top: 1px solid var(--moushuo-ink);
  padding-top: 28px;
}

.home-section-heading {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 20px;
  margin-bottom: 22px;
}

.home-section-heading .eyebrow {
  margin-bottom: 16px;
}

.home-section-heading h2 {
  margin: 0;
  color: var(--moushuo-ink);
  text-align: left;
  font: 500 25px/1.4 var(--moushuo-serif);
  letter-spacing: -0.04em;
}

.main .home-inline-link {
  color: var(--moushuo-accent);
  border-bottom: 0;
  font: 400 12px/1.5 var(--moushuo-sans);
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.home-inline-link span {
  display: inline-block;
  margin-left: 9px;
  transition: transform 0.2s ease;
}

.home-inline-link:hover span {
  transform: translateX(4px);
}

/* ---- Post list (shared by home + archive) ---- */
.home-post-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

/*
 * 首页「最近写下的」标题行下方那根分隔线（还原 moushuo.me）。
 * 必须限定在 .home-latest 下：.home-post-list 同时被 post-list.php
 * （归档/搜索页）复用，写全局会把分类页标题下的双线问题带回来。
 */
.home-latest .home-post-list {
  border-top: 1px solid var(--moushuo-rule);
}

.home-post-row {
  width: 100%;
  margin: 0;
  padding: 25px 0 27px;
  border-bottom: 1px solid var(--moushuo-rule);
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) 24px;
  gap: 28px;
  list-style: none;
  text-align: left;
  transition: padding 0.2s ease, color 0.2s ease;
}

.home-post-row:hover {
  padding-right: 12px;
  padding-left: 12px;
  color: var(--moushuo-accent);
}

.home-post-row time {
  color: var(--moushuo-muted);
  font: 400 11px/1.5 var(--moushuo-sans);
  letter-spacing: 0.06em;
}

.home-post-copy h3 {
  margin: 0 0 8px;
  font: 500 22px/1.45 var(--moushuo-serif);
  letter-spacing: -0.035em;
}

.home-post-copy h3 a {
  border-bottom: 0;
  color: var(--moushuo-ink);
}

.home-post-copy h3 a:hover {
  color: var(--moushuo-accent);
}

.home-post-copy p {
  max-width: 650px;
  margin: 0;
  color: var(--moushuo-muted);
  font: 400 14px/1.8 var(--moushuo-serif);
}

.home-row-arrow {
  align-self: center;
  color: var(--moushuo-accent);
  font: 400 16px/1 var(--moushuo-sans);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.home-post-row:hover .home-row-arrow {
  opacity: 1;
}

/* ---- Year group divider (archive) ---- */
.year-group {
  width: 100%;
  margin-top: 36px;
  padding: 20px 0 12px;
  border-bottom: 0;
  color: var(--moushuo-muted);
  font: 600 11px/1.5 var(--moushuo-sans);
  letter-spacing: 0.14em;
  list-style: none;
}

/* ---- Homepage manifesto note ---- */
.home-note {
  max-width: none;
  margin: 48px 0 48px;
  padding: 20px 0 0;
  border-top: 1px solid var(--moushuo-accent);
  display: block;
}

/* 有配图时：左图 + 右文两栏（还原 moushuo.me） */
.home-note.has-media {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 48px;
  align-items: start;
}

.home-note-media img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 4px;
}

.home-note-copy > .eyebrow {
  margin-top: 4px;
}

.home-note-content {
  max-width: 820px;
  color: var(--moushuo-muted);
  font: 400 18px/1.85 var(--moushuo-serif);
}

.home-note-content p {
  margin: 0 0 18px;
}

.home-note-content blockquote {
  margin: 0 0 18px;
  padding: 0;
  border-left: 0;
  color: var(--moushuo-ink);
  font: 500 21px/1.8 var(--moushuo-serif);
  letter-spacing: -0.02em;
}

.home-note-content blockquote em {
  color: var(--moushuo-muted);
  font-size: 14px;
  font-style: italic;
}

/* =========================================================================
   Single post navigation
   ========================================================================= */
/*
 * 文章导航（还原目标站）：
 *  - 加粗衬线体、继承正文字号，无上方分隔线；
 *  - 虚线下划线来自全局 a 样式（.post-nav a 不再覆写）；
 *  - 箭头在 <a> 外侧（single.php），虚线只压标题文字。
 */
.post-nav {
  display: flex;
  justify-content: space-between;
  margin-top: 48px;
  font: 700 18px/1.8 var(--moushuo-serif);
}

.post-nav a {
  color: var(--moushuo-ink);
  padding-bottom: 2px;
  border-bottom: 1px dashed;
}

.post-nav a:hover {
  color: var(--moushuo-accent);
  border-bottom-color: var(--moushuo-accent);
}

.post-nav .nav-prev {
  margin-right: 1em;
}

.post-nav .nav-next {
  margin-left: 1em;
  text-align: right;
}

/* =========================================================================
   Comments (minimal, editorial)
   ========================================================================= */
.comments-area {
  margin-top: 64px;
  padding-top: 28px;
  border-top: 1px solid var(--moushuo-accent);
  font-family: var(--moushuo-serif);
}

.comments-area .comments-title {
  margin: 0 0 42px;
  color: var(--moushuo-ink);
  text-align: left;
  font: 500 28px/1.35 var(--moushuo-serif);
  letter-spacing: -0.045em;
}

.comment-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.comment-list li.comment {
  padding: 18px 0;
  border-bottom: 1px solid var(--moushuo-rule);
}

/* Nested replies — tree indent with a left guide line */
.comment-list .children {
  list-style: none;
  margin: 4px 0 0;
  padding-left: 32px;
  border-left: 1px solid var(--moushuo-rule);
}

.comment-list .children li.comment {
  padding: 14px 0;
}

.comment-list .reply {
  margin-top: 8px;
}

.comment-reply-link {
  color: var(--moushuo-accent);
  font: 500 12px/1.5 var(--moushuo-sans);
  letter-spacing: 0.04em;
  border-bottom: none;
}

@media (max-width: 760px) {
  .comment-list .children {
    padding-left: 18px;
  }

  .comment-list li.comment,
  .comment-list .children li.comment {
    padding: 14px 0;
  }
}

/* =========================================================================
   Friend links (page template)
   ========================================================================= */
.friend-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}

.friend-links li {
  margin: 0;
}

.friend-links a {
  display: block;
  padding: 16px 18px;
  border: 1px solid var(--moushuo-rule);
  border-radius: 6px;
  color: var(--moushuo-ink);
  font: 500 15px/1.4 var(--moushuo-serif);
  text-decoration: none;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.friend-links a:hover {
	border-color: var(--moushuo-accent);
	color: var(--moushuo-accent);
}

.friend-links .fl-name {
	display: block;
}

.friend-links .fl-desc {
	display: block;
	margin-top: 4px;
	font: 400 13px/1.5 var(--moushuo-sans);
	color: var(--moushuo-muted);
}

.comment-meta {
  font: 400 12px/1.6 var(--moushuo-sans);
  color: var(--moushuo-muted);
}

.comment-meta a {
  border-bottom: none;
  color: var(--moushuo-muted);
}

.comment-content {
  font: 400 16px/1.85 var(--moushuo-serif);
  color: var(--moushuo-ink);
}

.comment-reply-link,
.comment-form input,
.comment-form textarea {
  font-family: var(--moushuo-sans);
}

.comment-form label {
  display: block;
  margin-bottom: 6px;
  font: 400 12px/1.5 var(--moushuo-sans);
  letter-spacing: 0.04em;
  color: var(--moushuo-muted);
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--moushuo-rule);
  border-radius: 4px;
  background: #fff;
  color: var(--moushuo-ink);
}

.comment-form .submit {
  padding: 10px 22px;
  border: 1px solid var(--moushuo-ink);
  border-radius: 4px;
  background: var(--moushuo-ink);
  color: #fff;
  cursor: pointer;
  font: 500 13px/1 var(--moushuo-sans);
  letter-spacing: 0.04em;
}

/* Comment form layout — guest fields (name/email/url) sit in ONE row of
   three columns ABOVE the comment textarea. functions.php reorders the
   DOM (comment field last via comment_form_fields), so plain grid
   auto-placement does the rest; logged-in users (no author fields) get a
   single-column form automatically. */
.comment-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.comment-form p {
  margin: 0;
}

.comment-form .comment-notes,
.comment-form .logged-in-as,
.comment-form .comment-form-comment,
.comment-form .comment-form-cookies-consent,
.comment-form .form-submit {
  grid-column: 1 / -1;
}

.comment-form textarea {
  min-height: 200px;
}

/* Cookie-consent: checkbox and text on the same line */
.comment-form .comment-form-cookies-consent label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 0;
  cursor: pointer;
}

.comment-form .comment-form-cookies-consent input[type="checkbox"] {
  width: auto;
  margin: 0;
  flex: none;
}

@media (max-width: 760px) {
  .comment-form {
    grid-template-columns: 1fr;
  }
}

/* =========================================================================
   Footer
   ========================================================================= */
.copyright {
  margin-top: 28px;
  color: var(--moushuo-muted);
  font: 400 11px/1.6 var(--moushuo-sans);
  letter-spacing: 0.04em;
  text-align: center;
}

.main > footer hr {
  max-width: none;
  margin: 48px 0 0;
  border-top: 1px solid var(--moushuo-rule);
}

/* =========================================================================
   WordPress core
   ========================================================================= */
.alignwide,
.alignfull {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: auto;
  max-width: 100vw;
}

.aligncenter {
  margin-left: auto;
  margin-right: auto;
}

.wp-caption {
  max-width: 100%;
}

.wp-caption-text {
  margin: 0.5rem auto 1rem;
  width: 35%;
  border-top: 1px solid #bbb;
  font-size: 0.8em;
  color: #bbb;
  padding: 5px;
  line-height: 1.8em;
  text-align: center;
}

.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.sticky,
.bypostauthor {
  /* visual hooks reserved */
}

/* =========================================================================
   Responsive
   ========================================================================= */
@media screen and (max-width: 960px) {
  .masthead {
    min-height: 64px;
    height: auto;
    padding: 14px 20px;
    grid-template-columns: 1fr auto;
    gap: 16px;
  }

  .masthead h1 {
    font-size: 21px;
  }

  .masthead .menu {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
  }

  .masthead .menu > ul {
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
  }

  .masthead .menu li a {
    font-size: 12px;
  }

  .masthead .menu li.current-menu-item > a::after,
  .masthead .menu li.active a::after {
    bottom: -10px;
  }

  .main,
  .home .main {
    width: min(calc(100% - 40px), 700px);
    padding-top: 52px;
  }

  .main .title {
    margin-bottom: 42px;
    padding-bottom: 38px;
  }

  .main > p,
  .main ul:not(.home-post-list) > li,
  .main ol:not(.home-post-list) > li {
    font-size: 17px;
    line-height: 1.85;
  }

  .home-hero {
    min-height: 0;
    padding: 60px 0 52px;
    grid-template-columns: minmax(0, 1fr) 210px;
    gap: 48px;
  }

  .home-hero h1 {
    font-size: clamp(42px, 7vw, 60px);
  }
}

@media screen and (max-width: 760px) {
  .masthead h1 {
    display: block;
  }

  .masthead h1 .brand-note {
    display: block;
    margin-top: 4px;
    font-size: 9px;
  }

  .home .main {
    width: min(calc(100% - 40px), 620px);
    padding-bottom: 48px;
  }

  .home-hero {
    padding: 56px 0 48px;
    display: block;
  }

  .home-hero h1 {
    font-size: 43px;
  }

  .home-intro {
    margin-top: 24px;
    font-size: 15px;
  }

  .home-hero-aside {
    margin-top: 44px;
    padding: 0;
  }

  .home-current {
    margin-top: 34px;
    padding: 17px 0 0;
    border-top: 1px solid var(--moushuo-rule);
    border-left: 0;
  }

  .home-section-heading {
    display: block;
  }

  .home-section-heading .home-inline-link {
    display: inline-block;
    margin-top: 18px;
  }

  .main .home-post-row {
    grid-template-columns: 1fr 20px;
    gap: 8px;
    padding: 20px 0 22px;
  }

  .main .home-post-row time {
    grid-column: 1 / -1;
  }

  .home-post-copy h3 {
    font-size: 19px;
  }

  .home-row-arrow {
    opacity: 1;
  }

  .home-note {
    margin: 40px 0;
    padding-top: 22px;
    display: block;
  }

  /* 移动端宣言区改为单列：图在上、文在下 */
  .home-note.has-media {
    grid-template-columns: 1fr;
    gap: 26px;
  }

}

@media screen and (max-width: 480px) {
  .main,
  .home .main {
    width: calc(100% - 40px);
    padding-bottom: 48px;
  }

  .main .title h1 {
    font-size: 36px;
  }

  .main blockquote {
    margin: 28px 0 34px;
    padding: 18px 16px 18px 20px;
    font-size: 18px;
  }

  .home .main > p:first-of-type img {
    max-height: 220px;
  }

  .home-note-content blockquote {
    font-size: 20px;
  }
}

@media print {
  .masthead,
  .comments-area,
  footer {
    display: none;
  }

  body {
    max-width: 700px;
  }

  .main {
    margin-left: 0;
    border-left: none;
    padding-left: 10px;
  }
}

/* =========================================================================
   Comment-visible lock (content hidden until the visitor comments)
   ========================================================================= */
.comment-visible-lock {
  margin: 36px 0;
  padding: 30px 26px;
  border: 1px dashed var(--moushuo-rule);
  border-radius: 6px;
  background: rgba(188, 93, 78, 0.04);
  text-align: center;
  font-family: var(--moushuo-sans);
}

.comment-visible-lock .cv-label {
  margin: 0 0 16px;
  color: var(--moushuo-muted);
  font: 400 14px/1.7 var(--moushuo-sans);
  letter-spacing: 0.02em;
}

.comment-visible-lock .cv-link {
  display: inline-block;
  padding: 9px 22px;
  border: 1px solid var(--moushuo-accent);
  border-radius: 22px;
  color: var(--moushuo-accent);
  font: 500 13px/1 var(--moushuo-sans);
  letter-spacing: 0.04em;
  transition: background 0.2s ease, color 0.2s ease;
}

.comment-visible-lock .cv-link:hover {
  background: var(--moushuo-accent);
  color: #fff;
}