/* =========================================================
   WGNDS Modern - Full CSS (no legacy dependency)
   ========================================================= */

/* -------- 0) Reset / Base -------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
               "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  line-height: 1.7;
  color: #111;
  background: #f6f7f9;
}

img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; }

p, h1, h2, h3, h4, h5, h6 { margin: 0 0 0.9em; }
ul, ol { margin: 0 0 1em; padding-left: 1.2em; }
li { margin: 0.2em 0; }
blockquote {
  margin: 1em 0;
  padding: 0.9em 1em;
  background: rgba(0,0,0,.03);
  border-left: 4px solid rgba(0,0,0,.15);
  border-radius: 12px;
}
hr { border: 0; border-top: 1px solid rgba(0,0,0,.08); margin: 1.2em 0; }

code, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}
pre {
  padding: 12px;
  border-radius: 14px;
  overflow: auto;
  background: #0b1020;
  color: #e9ecff;
}

table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  overflow: hidden;
}
th, td {
  padding: 10px 12px;
  border-bottom: 1px solid rgba(0,0,0,.06);
  text-align: left;
  vertical-align: top;
}
th { background: rgba(0,0,0,.03); }

/* Accessibility helpers */
.screen-reader-text{
  position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  position: fixed;
  left: 12px; top: 12px;
  width:auto; height:auto;
  padding:10px 12px;
  z-index:9999;
  background:#111;
  color:#fff;
  border-radius:12px;
}

/* Tokens */
:root{
  --maxw: 1120px;
  --gap: 16px;
  --radius: 16px;
  --border: 1px solid rgba(0,0,0,.09);
  --shadow: 0 10px 30px rgba(0,0,0,.07);
  --muted: rgba(0,0,0,.68);
  --muted2: rgba(0,0,0,.52);
  --bg-card: #fff;
}

/* WordPress core alignment */
.alignwide { width: 100%; }
.aligncenter { margin-left:auto; margin-right:auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 12px; color: var(--muted2); }

/* -------- 1) Main wrappers (kill legacy floats) -------- */
.clear { display: none !important; } /* legacy */
#main, #container { width: 100%; float: none !important; }

.site-main { padding: 0; }
.site-content { width: 100%; }

/* -------- 2) Header -------- */
.site-header{
  position: sticky;
  top: 0;
  z-index: 60;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border-bottom: var(--border);
}

.site-header__inner{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 10px var(--gap);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}

.site-logo img{ height: 36px; width:auto; }

.nav-toggle{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap: 5px;
  width: 44px;
  height: 44px;
  border: var(--border);
  border-radius: 14px;
  background:#fff;
  cursor:pointer;
}
.nav-toggle__bar{ width:18px; height:2px; background:#111; margin:0 auto; border-radius:2px; }

.site-nav{ display:none; }
.site-nav .menu{
  list-style:none;
  display:flex;
  gap: 8px;
  padding:0;
  margin:0;
}
.site-nav .menu a{
  display:inline-flex;
  padding: 10px 10px;
  border-radius: 12px;
}
.site-nav .menu a:hover{
  background: rgba(0,0,0,.04);
  text-decoration: none;
}

.site-header__search{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--gap) 12px;
}

.search-form{ display:flex; gap:10px; }
.search-form__input{
  flex:1;
  padding: 12px 12px;
  border: var(--border);
  border-radius: 14px;
  outline:none;
  background:#fff;
}
.search-form__button{
  padding: 12px 14px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  cursor:pointer;
}
.search-form__button:hover{ background: rgba(0,0,0,.03); }

@media (min-width: 980px){
  .nav-toggle{ display:none; }
  .site-nav{ display:block; }
}

/* Mobile nav open */
body.nav-open .site-nav{
  display:block;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--gap) 10px;
}
body.nav-open .site-nav .menu{
  flex-wrap: wrap;
  gap: 8px;
}

/* -------- 3) Layout: content + sidebar -------- */
.layout{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: var(--gap);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--gap);
}

/* Force WP sidebar container to behave */
.content-area { min-width: 0; }

.post-grid{
  display: grid;
  grid-template-columns: 1fr;   /* mobile: 1 col */
  gap: 16px;
}
@media (min-width: 980px){
  .post-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* sidebar generic (WP often uses #sidebar or .sidebar) */
#sidebar, .sidebar, .widget-area {
  min-width: 0;
}

/* Desktop: two columns */
@media (min-width: 980px){
  .layout{
    grid-template-columns: minmax(0, 1fr) 320px;
    align-items: start;
  }
}

/* -------- 4) Post list cards (index/archive) -------- */
.post-card{
  display: grid;
  grid-template-columns: 1fr;   /* 关键：不再 132px + 1fr */
  gap: 0;
  padding: 0;
  overflow: hidden;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}

.post-card__thumb{
  display: block;
  border-radius: 0;
  overflow: hidden;
  background: rgba(0,0,0,.03);
}

.post-card__img{
  width: 100%;
  aspect-ratio: 16/10;
  object-fit: cover;
}

.post-card__body{
  padding: 12px;
  min-width: 0; /* 防止标题/分类撑破 */
}

.post-card__title{
  margin: 0 0 8px;
  font-size: 15px;
  line-height: 1.35;
}

.post-card__meta{
  font-size: 12px;
  color: var(--muted2);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}

.post-card__excerpt{
  font-size: 13px;
  color: rgba(0,0,0,.80);
  margin-bottom: 12px;
}

.post-card__more{
  display: inline-flex;
  padding: 8px 10px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  text-decoration: none;
}
.post-card__more:hover{
  background: rgba(0,0,0,.03);
  text-decoration: none;
}

.badge-new{
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 999px;
  border: var(--border);
  background: rgba(0,0,0,.02);
  color: var(--muted);
}

.post-card__excerpt{
  font-size: 14px;
  color: rgba(0,0,0,.80);
  margin-bottom: 10px;
}

.post-card__more{
  display:inline-flex;
  padding: 8px 10px;
  border: var(--border);
  border-radius: 14px;
  background:#fff;
  text-decoration:none;
}
.post-card__more:hover{
  background: rgba(0,0,0,.03);
  text-decoration:none;
}

/* Mobile tweaks */
@media (max-width: 420px){
  .post-card{ grid-template-columns: 110px 1fr; }
}

/* -------- 5) Pagination (supports yzipi_pagenavi output) -------- */
.pagination, .pagenavi {
  margin: 16px 0 4px;
  padding: 14px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}

.pagination a, .pagination span,
.pagenavi a, .pagenavi span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  margin: 4px 6px 4px 0;
  border: var(--border);
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  font-size: 14px;
}

.pagination .current, .pagenavi .current{
  font-weight: 700;
  background: rgba(0,0,0,.06);
}

/* -------- 6) Sidebar widgets (generic) -------- */
#sidebar .widget, .sidebar .widget, .widget-area .widget {
  padding: 14px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
  margin-bottom: 16px;
}
#sidebar .widget-title, .sidebar .widget-title, .widget-area .widget-title {
  margin: 0 0 10px;
  font-size: 16px;
}
#sidebar .widget a, .sidebar .widget a { text-decoration: none; }
#sidebar .widget a:hover, .sidebar .widget a:hover { text-decoration: underline; }

/* -------- 7) Single content basic typography -------- */
.entry-content, .post-content, .article-content {
  padding: 16px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}
.entry-content h1, .entry-content h2, .entry-content h3,
.post-content h1, .post-content h2, .post-content h3 {
  line-height: 1.25;
  margin-top: 1.2em;
}
.entry-content a, .post-content a {
  text-decoration: underline;
}
.entry-content img, .post-content img {
  border-radius: 14px;
}

/* -------- 8) Shop nav section -------- */
.shop-nav{
  padding: 0 var(--gap) var(--gap);
}
.shop-nav__inner{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 14px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}
.shop-nav__title{
  margin: 0 0 10px;
  font-size: 16px;
}
.shop-nav__list{
  margin: 0;
  padding-left: 18px;
}
.shop-nav__list li { margin: 6px 0; }

/* -------- 9) Footer (desktop correct placement) -------- */
.site-footer{
  padding: 20px var(--gap) 96px; /* leaves space for mobile bar */
  border-top: var(--border);
  background: rgba(255,255,255,.8);
}
.site-footer__inner{
  max-width: var(--maxw);
  margin: 0 auto;
  display:grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.site-footer__desc{
  color: var(--muted);
  font-size: 14px;
}
.footer-menu{
  list-style:none;
  padding:0;
  margin:0 0 10px;
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
}
.footer-menu a{
  display:inline-flex;
  padding: 8px 10px;
  border: var(--border);
  border-radius: 12px;
  background:#fff;
  text-decoration:none;
}
.footer-menu a:hover{ background: rgba(0,0,0,.03); }

.site-footer__label{ margin: 0 0 8px; }
.site-footer__links a{ text-decoration: none; }
.site-footer__links a:hover{ text-decoration: underline; }

.site-footer__bottom{
  max-width: var(--maxw);
  margin: 12px auto 0;
  font-size: 12px;
  color: var(--muted2);
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
  align-items:center;
}
.site-footer__bottom a{ text-decoration:none; }
.site-footer__bottom a:hover{ text-decoration: underline; }
.site-footer__bottom .dot{ opacity:.55; }

.tongji{
  max-width: var(--maxw);
  margin: 10px auto 0;
  font-size: 12px;
  color: var(--muted2);
}

/* Desktop footer padding (no mobile bar) */
@media (min-width: 980px){
  .site-footer{ padding-bottom: 24px; }
  .site-footer__inner{ grid-template-columns: 1fr 1fr; }
}

/* -------- 10) Mobile bottom bar + search drawer -------- */
.mbar{
  position: sticky;
  bottom: 0;
  z-index: 70;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 10px 12px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border-top: var(--border);
}
.mbar__item{
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 10px 8px;
  border: var(--border);
  border-radius: 14px;
  background:#fff;
  font-size: 14px;
  cursor:pointer;
  text-decoration:none;
}
.mbar__item:hover{ background: rgba(0,0,0,.03); text-decoration:none; }
.mbar__item--accent{ font-weight: 700; }

.footer-search{
  position: sticky;
  bottom: 66px;
  z-index: 69;
  padding: 10px 12px;
  background: rgba(255,255,255,.95);
  border-top: var(--border);
}
.footer-search__form{ display:flex; gap:10px; }
.footer-search__input{
  flex:1;
  padding: 12px;
  border: var(--border);
  border-radius: 14px;
  background:#fff;
}
.footer-search__btn{
  padding: 12px 14px;
  border: var(--border);
  border-radius: 14px;
  background:#fff;
  cursor:pointer;
}
.footer-search__btn:hover{ background: rgba(0,0,0,.03); }

@media (min-width: 980px){
  .mbar{ display:none; }
  .footer-search{ display:none; }
}

/* -------- 11) Scroll top floating button -------- */
.scroll-top{
  position: fixed;
  right: 14px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  border: var(--border);
  border-radius: 999px;
  background:#fff;
  box-shadow: var(--shadow);
  cursor:pointer;
}
.scroll-top:hover{ background: rgba(0,0,0,.03); }


/* ===== Sidebar: support #sidebar AND legacy #sitebar ===== */
#sidebar, #sitebar{
  min-width: 0;
}

/* Make sidebar widgets look consistent */
#sidebar .widget, #sitebar .widget,
#sidebar section.widget, #sitebar section.widget{
  padding: 14px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
  margin-bottom: 16px;
}

#sidebar .widget-title, #sitebar .widget-title,
#sidebar .widget-title, #sitebar .widget-title{
  margin: 0 0 10px;
  font-size: 16px;
  line-height: 1.2;
}

/* Ads widget: keep it clean */
.widget-ads{
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.widget-ads ins.adsbygoogle{
  border-radius: var(--radius);
  overflow: hidden;
}

/* Tag cloud */
.tag-cloud{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tag-cloud a{
  display: inline-flex;
  align-items: center;
  padding: 7px 10px;
  border: var(--border);
  border-radius: 999px;
  background: #fff;
  font-size: 13px;
  color: rgba(0,0,0,.78);
  text-decoration: none;
}
.tag-cloud a:hover{
  background: rgba(0,0,0,.04);
  text-decoration: none;
}

/* Legacy classes compatibility (if you keep old markup) */
#sitebar .sitebar_list2{ margin-bottom: 16px; }
#sitebar .wptag{ padding: 14px; border: var(--border); border-radius: var(--radius); background: var(--bg-card); box-shadow: var(--shadow); }
#sitebar .tagtitle{ display:block; font-weight: 700; margin-bottom: 10px; }
#sitebar .tagg{ display:flex; flex-wrap:wrap; gap:8px; }
#sitebar .tagg a{
  display:inline-flex; padding:7px 10px; border: var(--border); border-radius:999px; background:#fff;
  font-size:13px; text-decoration:none;
}
#sitebar .tagg a:hover{ background: rgba(0,0,0,.04); }

/* ===== Archive Page ===== */
.layout--page{
  max-width: var(--maxw);
  margin: 0 auto;
  padding: var(--gap);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--gap);
}
@media (min-width: 980px){
  .layout--page{
    grid-template-columns: 320px minmax(0, 1fr);
    align-items: start;
  }
}

.page-archive{
  padding: 16px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}
.page-archive__title{
  margin: 0 0 8px;
  font-size: 20px;
  line-height: 1.25;
}
.page-archive__desc{
  margin: 0 0 16px;
  color: var(--muted);
  font-size: 14px;
}

.archive-group{
  margin-top: 18px;
  padding-top: 10px;
  border-top: 1px dashed rgba(0,0,0,.12);
}
.archive-group__title{
  margin: 0 0 10px;
  font-size: 16px;
}

.archive-list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}
.archive-item{
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 10px;
  padding: 10px 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
}
.archive-item__date{
  color: var(--muted2);
  font-size: 12px;
  align-self: center;
}
.archive-item__link{
  text-decoration: none;
}
.archive-item__link:hover{
  text-decoration: underline;
}

.archive-pagination{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-top: 16px;
  padding-top: 12px;
  border-top: var(--border);
}
.archive-pagination__btn{
  display: inline-flex;
  padding: 10px 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  text-decoration: none;
}
.archive-pagination__btn:hover{
  background: rgba(0,0,0,.03);
  text-decoration: none;
}
.archive-pagination__btn.is-disabled{
  opacity: .45;
  pointer-events: none;
}
.archive-pagination__info{
  color: var(--muted2);
  font-size: 13px;
}

/* ===== Single Page ===== */
.breadcrumb{
  padding: 12px 14px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
  margin-bottom: 16px;
  color: var(--muted2);
  font-size: 13px;
  display:flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items:center;
}
.breadcrumb a{ text-decoration: none; }
.breadcrumb a:hover{ text-decoration: underline; }
.breadcrumb__sep{ opacity:.55; }
.breadcrumb__current{ color: rgba(0,0,0,.82); }

.single{
  padding: 16px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}
.single-title{
  margin: 0 0 10px;
  font-size: 24px;
  line-height: 1.25;
}
@media (max-width: 480px){
  .single-title{ font-size: 20px; }
}

.single-meta{
  display:flex;
  gap: 14px;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-bottom: 12px;
  border-bottom: var(--border);
  margin-bottom: 14px;
}
.single-meta__author{
  display:flex;
  gap: 12px;
  align-items:center;
  min-width: 260px;
}
.single-avatar{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  object-fit: cover;
  background: rgba(0,0,0,.04);
  border: var(--border);
}
.single-meta__name a{ text-decoration:none; font-weight: 700; }
.single-meta__name a:hover{ text-decoration: underline; }
.single-meta__sub{
  color: var(--muted2);
  font-size: 13px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items:center;
}
.dot{ opacity: .55; }
.single-meta__stats{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.stat{
  display:flex;
  gap: 8px;
  align-items:center;
  padding: 8px 10px;
  border: var(--border);
  border-radius: 14px;
  background:#fff;
  font-size: 13px;
  color: var(--muted);
}
.stat__label{ color: var(--muted2); }
.stat__value{ font-weight: 700; color: rgba(0,0,0,.78); }

/* content */
.single-content{
  padding: 0; /* outer card already has padding */
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.single-content > *:first-child{ margin-top: 0; }
.single-content a{ text-decoration: underline; }
.single-content img{ border-radius: 14px; }
.single-content h2{ font-size: 20px; margin-top: 1.4em; }
.single-content h3{ font-size: 17px; margin-top: 1.2em; }

/* ad */
.single-ad{
  margin-top: 16px;
  padding-top: 12px;
  border-top: var(--border);
}

/* tags */
.single-tags{
  margin-top: 14px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}
.single-tags a{
  display:inline-flex;
  padding: 7px 10px;
  border: var(--border);
  border-radius: 999px;
  background:#fff;
  font-size: 13px;
  text-decoration:none;
  color: rgba(0,0,0,.78);
}
.single-tags a:hover{ background: rgba(0,0,0,.04); }

/* declare */
.single-declare{
  margin-top: 14px;
  padding: 12px;
  border: var(--border);
  border-radius: var(--radius);
  background: rgba(0,0,0,.02);
  color: var(--muted);
  font-size: 13px;
}

/* like btn */
.single-like{
  margin-top: 14px;
  display:flex;
  justify-content:center;
}
.like-btn{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  padding: 12px 16px;
  border: var(--border);
  border-radius: 999px;
  background:#fff;
  text-decoration:none;
  font-weight: 700;
}
.like-btn:hover{ background: rgba(0,0,0,.03); text-decoration:none; }
.like-btn.done{ opacity: .7; }

/* prev next */
.single-nav{
  margin-top: 16px;
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
@media (min-width: 680px){
  .single-nav{ grid-template-columns: 1fr 1fr; }
}
.single-nav__prev, .single-nav__next{
  padding: 12px;
  border: var(--border);
  border-radius: var(--radius);
  background:#fff;
}
.single-nav a{ text-decoration:none; }
.single-nav a:hover{ text-decoration: underline; }
.is-muted{ color: var(--muted2); }

/* related */
.related{
  margin-top: 16px;
  padding: 16px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}
.related-title{
  margin: 0 0 12px;
  font-size: 18px;
}
.related-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media (min-width: 680px){
  .related-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.related-card{
  display:grid;
  grid-template-columns: 120px 1fr;
  gap: 12px;
  padding: 12px;
  border: var(--border);
  border-radius: var(--radius);
  background:#fff;
}
.related-card__thumb{
  border-radius: 14px;
  overflow:hidden;
  align-self:start;
  background: rgba(0,0,0,.03);
}
.related-card__img{
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
}
.related-card__title{
  margin: 0 0 6px;
  font-size: 15px;
  line-height: 1.35;
}
.related-card__title a{ text-decoration:none; }
.related-card__title a:hover{ text-decoration: underline; }
.related-card__meta{ font-size: 12px; color: var(--muted2); }

/* comments wrapper */
.comments-wrap{
  margin-top: 16px;
  padding: 16px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}

/* ===== Archive header (category/tag) ===== */
.archive-header{
  padding: 16px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
  margin-bottom: 16px;
}
.archive-title{
  margin: 0 0 8px;
  font-size: 20px;
  line-height: 1.25;
}
.archive-desc{
  color: var(--muted);
  font-size: 14px;
}

/* ===== Comments ===== */
.comments{
  margin-top: 0; /* single.php 外层已有卡片，可按需调整 */
}

.comments-header{
  margin-bottom: 12px;
}
.comments-title{
  margin: 0 0 10px;
  font-size: 18px;
  line-height: 1.25;
}

.comments-empty,
.comments-closed,
.comments-locked{
  margin: 0;
  padding: 12px;
  border: var(--border);
  border-radius: var(--radius);
  background: rgba(0,0,0,.02);
  color: var(--muted);
}

.comment-list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
}

.comment-list .comment{
  padding: 14px;
  border: var(--border);
  border-radius: var(--radius);
  background: #fff;
}

.comment-list .comment .comment-author{
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
}
.comment-list .comment .avatar{
  border-radius: 999px;
  border: var(--border);
}

.comment-list .comment .comment-metadata{
  font-size: 12px;
  color: var(--muted2);
  margin-bottom: 8px;
}
.comment-list .comment .comment-metadata a{
  color: inherit;
  text-decoration: none;
}
.comment-list .comment .comment-metadata a:hover{
  text-decoration: underline;
}

.comment-list .comment .comment-content{
  color: rgba(0,0,0,.82);
  font-size: 14px;
}
.comment-list .comment .reply{
  margin-top: 10px;
}
.comment-list .comment .reply a{
  display: inline-flex;
  padding: 7px 10px;
  border: var(--border);
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  font-size: 13px;
}
.comment-list .comment .reply a:hover{
  background: rgba(0,0,0,.03);
}

/* nested comments */
.comment-list .children{
  list-style: none;
  margin: 12px 0 0;
  padding-left: 14px;
  border-left: 2px solid rgba(0,0,0,.08);
  display: grid;
  gap: 12px;
}

/* comments nav */
.comments-nav{
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0 14px;
}
.comments-nav a{
  display: inline-flex;
  padding: 8px 10px;
  border: var(--border);
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  font-size: 13px;
}
.comments-nav a:hover{
  background: rgba(0,0,0,.03);
}

/* comment form */
.comment-form-wrap{
  margin-top: 16px;
  padding-top: 14px;
  border-top: var(--border);
}
.comment-form-title{
  margin: 0 0 10px;
  font-size: 16px;
}
.comment-notes{
  margin: 0 0 12px;
  color: var(--muted2);
  font-size: 13px;
}

.comment-form{
  display: grid;
  gap: 12px;
}
.comment-form-field{
  margin: 0;
  display: grid;
  gap: 6px;
}
.comment-form-field label{
  font-size: 13px;
  color: var(--muted);
}
.comment-form-field input,
.comment-form-field textarea{
  width: 100%;
  padding: 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  outline: none;
}
.comment-form-field input:focus,
.comment-form-field textarea:focus{
  box-shadow: 0 0 0 4px rgba(0,0,0,.06);
}

.comment-form-cookies-consent{
  font-size: 13px;
  color: var(--muted2);
}

.comment-submit{
  display: inline-flex;
  justify-content: center;
  padding: 12px 14px;
  border: var(--border);
  border-radius: 14px;
  background: #111;
  color: #fff;
  cursor: pointer;
}
.comment-submit:hover{
  opacity: .92;
}

/* ===== Search Page ===== */
.search-key{
  display: inline-flex;
  padding: 2px 8px;
  border: var(--border);
  border-radius: 999px;
  background: #fff;
  font-weight: 700;
}

.search-page-form{
  margin-top: 12px;
  display:flex;
  gap: 10px;
}
.search-page-form__input{
  flex: 1;
  padding: 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  outline: none;
}
.search-page-form__btn{
  padding: 12px 14px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  cursor: pointer;
}
.search-page-form__btn:hover{
  background: rgba(0,0,0,.03);
}

/* ===== Page Sidebar Nav ===== */
#sidebar-page{
  min-width: 0;
}

.page-nav{
  padding: 14px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}

.page-nav__menu{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 6px;
}

.page-nav__menu li a{
  display: flex;
  padding: 10px 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  text-decoration: none;
  color: rgba(0,0,0,.78);
}

.page-nav__menu li a:hover{
  background: rgba(0,0,0,.03);
  text-decoration: none;
}

/* WordPress 自动高亮类 */
.page-nav__menu .current-menu-item > a,
.page-nav__menu .current_page_item > a,
.page-nav__menu .current-menu-ancestor > a{
  font-weight: 800;
  background: rgba(0,0,0,.06);
}

/* 移动端：让它更像“目录块” */
@media (max-width: 980px){
  .page-nav{
    position: relative;
  }
}

/* ===== 404 Not Found ===== */
.notfound{
  padding: 10px 0;
}
.notfound__card{
  padding: 18px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
  text-align: center;
}

.notfound__media{
  display:flex;
  justify-content:center;
  margin-bottom: 12px;
}
.notfound__img{
  width: min(520px, 100%);
  height: auto;
  border-radius: var(--radius);
  border: var(--border);
  background: rgba(0,0,0,.02);
}

.notfound__title{
  margin: 10px 0 8px;
  font-size: 22px;
  line-height: 1.25;
}
.notfound__desc{
  margin: 0 auto 14px;
  max-width: 46ch;
  color: var(--muted);
  font-size: 14px;
}

.notfound__search{
  display:flex;
  gap: 10px;
  margin: 10px auto 14px;
  max-width: 560px;
}
.notfound__input{
  flex:1;
  padding: 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  outline: none;
}
.notfound__btn{
  padding: 12px 14px;
  border: var(--border);
  border-radius: 14px;
  background: #111;
  color: #fff;
  cursor: pointer;
}
.notfound__btn:hover{ opacity: .92; }

.notfound__actions{
  display:flex;
  gap: 10px;
  justify-content:center;
  flex-wrap: wrap;
}
.notfound__link{
  display:inline-flex;
  padding: 10px 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  text-decoration:none;
}
.notfound__link:hover{
  background: rgba(0,0,0,.03);
  text-decoration:none;
}

/* ===== 404 Recommended ===== */
.notfound-rec{
  margin-top: 16px;
  padding: 16px;
  border: var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
  box-shadow: var(--shadow);
}

.notfound-rec__title{
  margin: 0 0 12px;
  font-size: 16px;
}

.notfound-rec__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

@media (min-width: 680px){
  .notfound-rec__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1080px){
  .notfound-rec__grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* mini card */
.nf-card{
  border: var(--border);
  border-radius: var(--radius);
  background: #fff;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr;
}

.nf-card__thumb{
  display:block;
  background: rgba(0,0,0,.03);
}

.nf-card__img{
  width: 100%;
  aspect-ratio: 16/10;
  object-fit: cover;
}

.nf-card__body{
  padding: 12px;
}

.nf-card__title{
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.35;
}
.nf-card__title a{
  text-decoration: none;
}
.nf-card__title a:hover{
  text-decoration: underline;
}

.nf-card__meta{
  font-size: 12px;
  color: var(--muted2);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.nf-card__meta a{
  color: inherit;
  text-decoration: none;
}
.nf-card__meta a:hover{
  text-decoration: underline;
}

.notfound-rec__more{
  margin-top: 14px;
  display: flex;
  justify-content: center;
}
/* ===== Mobile Drawer Nav (FULLSCREEN, not clipped) ===== */

/* 1) 防止任何父容器裁切 fixed 元素 */
#site-header, .site-header { overflow: visible !important; }

/* 2) 遮罩全屏 */
#navOverlay{
  position: fixed !important;
  top: 0; left: 0; right: 0; bottom: 0;
  width: 100vw; height: 100vh;
  background: rgba(0,0,0,.45);
  z-index: 9998;
}

/* 3) nav 全屏承载层 */
#site-nav{
  position: fixed !important;
  top: 0; left: 0; right: 0; bottom: 0;
  width: 100vw; height: 100vh;
  z-index: 9999;
}

/* hidden 一定要真的隐藏 */
#site-nav[hidden]{ display: none !important; }
#navOverlay[hidden]{ display: none !important; }

/* 打开时一定显示 */
body.nav-open #site-nav{ display: block !important; }
body.nav-open #navOverlay{ display: block !important; }

/* 4) 抽屉面板：右侧滑出 */
#site-nav .site-nav__panel{
  position: absolute;
  top: 0; right: 0;
  width: min(86vw, 360px);
  height: 100%;
  background: #fff;
  border-left: var(--border);
  box-shadow: var(--shadow);
  transform: translateX(100%);
  transition: transform .22s ease;
  display: flex;
  flex-direction: column;
}

body.nav-open #site-nav .site-nav__panel{
  transform: translateX(0);
}

/* 头部 */
.site-nav__head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  padding: 14px 14px;
  border-bottom: var(--border);
}
.site-nav__brand{
  display:flex;
  align-items:center;
  gap: 10px;
  font-weight: 800;
}
.site-nav__brand img{
  width: 28px;
  height: 28px;
  border-radius: 10px;
  object-fit: contain;
  background: rgba(0,0,0,.03);
  border: var(--border);
}
.nav-close{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: var(--border);
  background:#fff;
  cursor:pointer;
}
.nav-close:hover{ background: rgba(0,0,0,.03); }

/* 菜单主体 */
.site-nav__body{
  padding: 12px;
  overflow: auto;
}

/* 抽屉菜单：竖排大按钮 */
.menu--drawer{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.menu--drawer > li > a{
  display:flex;
  padding: 12px 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  text-decoration: none;
  font-size: 15px;
}
.menu--drawer > li > a:hover{
  background: rgba(0,0,0,.03);
}

/* 子菜单 */
.menu--drawer .sub-menu{
  list-style: none;
  padding: 8px 0 0 14px;
  margin: 0;
  display: grid;
  gap: 6px;
}
.menu--drawer .sub-menu a{
  display:flex;
  padding: 10px 12px;
  border: var(--border);
  border-radius: 14px;
  background: #fff;
  font-size: 14px;
}

/* PC：不显示抽屉（PC 用横向菜单） */
@media (min-width: 980px){
  #navOverlay{ display:none !important; }
  #site-nav{
    position: static !important;
    width: auto; height: auto;
    z-index: auto;
    display: block !important;
  }
  #site-nav[hidden]{ display:block !important; }
  #site-nav .site-nav__panel{
    position: static;
    transform: none;
    width: auto;
    height: auto;
    border: 0;
    box-shadow: none;
    background: transparent;
  }
  .site-nav__head{ display:none; }
  .site-nav__body{ padding: 0; overflow: visible; }

  .menu--drawer{
    display:flex;
    gap: 8px;
  }
  .menu--drawer > li > a{
    border: 0;
    background: transparent;
    padding: 10px 10px;
  }
  .menu--drawer .sub-menu{ display:none; }
}