@charset "UTF-8";
/*
Theme Name: NewsFlow
Theme URI: https://example.com/newsflow
Author: NewsFlow Team
Author URI: https://example.com
Description: NewsFlow 是一款资讯 / 博客类 WordPress 主题，采用「顶部导航 + 大图轮播 + 分类 Tab 文章流 + 右侧边栏」的经典资讯站布局。内置主题色、Logo、备案号、社交链接等可视化设置，支持轮播、多栏文章列表、面包屑、相关文章、浏览器端评论表单，以及完整的归档 / 搜索 / 作者 / 404 页面。全站响应式，无外部依赖。
Version: 1.0.0
Requires at least: 5.5
Tested up to: 6.7
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: newsflow
Tags: blog, news, two-columns, right-sidebar, custom-logo, custom-menu, custom-colors, featured-images, threaded-comments, translation-ready, block-styles, wide-blocks
*/

/* ==========================================================================
   01. 设计令牌 (Design Tokens)
   ========================================================================== */
:root {
  /* ---- 品牌色：可在「外观 → 自定义」中覆盖 ---- */
  --nf-color: #206be7;
  --nf-color-h: 217;
  --nf-color-s: 81%;
  --nf-color-l: 52%;
  --nf-hsl: var(--nf-color-h), var(--nf-color-s), var(--nf-color-l);
  --nf-hover: #1162e8;

  /* ---- 中性色（由品牌色相推导，保证整体协调） ---- */
  --nf-black: hsl(0, 0%, 15%);
  --nf-gray: hsla(0, 0%, 15%, 0.8);
  --nf-light: hsla(0, 0%, 15%, 0.6);
  --nf-line: hsla(0, 0%, 15%, 0.07);
  --nf-border: hsla(0, 0%, 15%, 0.2);

  /* ---- 功能色 ---- */
  --nf-success: #29ad00;
  --nf-warning: #ffa400;
  --nf-danger: #fa5555;
  --nf-info: #00aae7;

  /* ---- 背景 ---- */
  --nf-body-bg: #f5f5f5;
  --nf-el-bg: #fff;
  --nf-soft: hsla(var(--nf-hsl), 0.04);
  --nf-soft-2: hsla(var(--nf-hsl), 0.08);
  --nf-header-bg: #fff;
  --nf-footer-bg: #2d3236;
  --nf-footer-color: rgba(255, 255, 255, 0.7);

  /* ---- 圆角 ---- */
  --nf-radius-s: 3px;
  --nf-radius-m: 5px;
  --nf-radius-l: 8px;
  --nf-radius-xl: 12px;
  --nf-radius-pill: 999px;

  /* ---- 布局 ---- */
  --nf-container: 1200px;
  --nf-sidebar-w: 300px;
  --nf-gap: 40px;
  --nf-header-h: 64px;
  --nf-logo-h: 32px;

  /* ---- 阴影 ---- */
  --nf-shadow-sm: 0 1px 2px hsla(0, 0%, 0%, 0.04);
  --nf-shadow: 0 2px 12px hsla(0, 0%, 0%, 0.06);
  --nf-shadow-md: 0 6px 24px hsla(0, 0%, 0%, 0.1);
  --nf-shadow-lg: 0 12px 40px hsla(0, 0%, 0%, 0.14);

  /* ---- 字体 ---- */
  --nf-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Helvetica Neue",
    Arial, sans-serif;
  --nf-font-mono: SFMono-Regular, "Liberation Mono", Consolas, Menlo, Monaco,
    "Microsoft YaHei", monospace;

  /* ---- 动效 ---- */
  --nf-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --nf-dur: 0.3s;

  /* ---- 图片比例 ---- */
  --nf-thumb-ratio: 480 / 300;
}

/* 深色配色（在 <html> 上加 .nf-dark 生效，或由自定义器切换） */
.nf-dark {
  --nf-black: hsl(0, 0%, 92%);
  --nf-gray: hsla(0, 0%, 100%, 0.78);
  --nf-light: hsla(0, 0%, 100%, 0.55);
  --nf-line: hsla(0, 0%, 100%, 0.1);
  --nf-border: hsla(0, 0%, 100%, 0.2);
  --nf-body-bg: #121212;
  --nf-el-bg: #1c1c1e;
  --nf-header-bg: #18191b;
  --nf-soft: hsla(var(--nf-hsl), 0.12);
  --nf-soft-2: hsla(var(--nf-hsl), 0.2);
  --nf-shadow: 0 2px 12px hsla(0, 0%, 0%, 0.4);
  --nf-shadow-md: 0 6px 24px hsla(0, 0%, 0%, 0.5);
}

/* ==========================================================================
   02. 基础重置与排版
   ========================================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  margin: 0;
  background: var(--nf-body-bg);
  color: var(--nf-black);
  font-family: var(--nf-font);
  font-size: 16px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  margin: 1.2em 0 0.6em;
  color: var(--nf-black);
  font-weight: 600;
  line-height: 1.4;
}

h1 { font-size: 28px; }
h2 { font-size: 24px; }
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }

p { margin: 0 0 1.2em; }

a {
  color: var(--nf-color);
  text-decoration: none;
  transition: color var(--nf-dur) var(--nf-ease);
}

a:hover { color: var(--nf-hover); }

img {
  max-width: 100%;
  height: auto;
  border: 0;
  vertical-align: middle;
}

ul, ol { padding-left: 1.4em; }

hr {
  border: 0;
  border-top: 1px solid var(--nf-line);
  margin: 2em 0;
}

code, kbd, pre, samp {
  font-family: var(--nf-font-mono);
  font-size: 0.9em;
}

code {
  padding: 2px 6px;
  background: var(--nf-soft);
  border-radius: var(--nf-radius-s);
  color: var(--nf-danger);
}

pre {
  overflow: auto;
  padding: 18px 20px;
  background: #282c34;
  border-radius: var(--nf-radius-l);
  color: #abb2bf;
  line-height: 1.7;
}

pre code {
  padding: 0;
  background: none;
  color: inherit;
}

blockquote {
  margin: 1.6em 0;
  padding: 16px 20px;
  background: var(--nf-soft);
  border-left: 4px solid var(--nf-color);
  border-radius: 0 var(--nf-radius-m) var(--nf-radius-m) 0;
  color: var(--nf-gray);
}

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

table {
  width: 100%;
  margin: 1.6em 0;
  border-collapse: collapse;
  font-size: 15px;
}

th, td {
  padding: 10px 14px;
  border: 1px solid var(--nf-line);
  text-align: left;
}

th {
  background: var(--nf-soft);
  font-weight: 600;
}

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
}

button { cursor: pointer; }

::selection {
  background: var(--nf-color);
  color: #fff;
}

/* 滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--nf-soft); }
::-webkit-scrollbar-thumb {
  background: var(--nf-border);
  border-radius: var(--nf-radius-pill);
}
::-webkit-scrollbar-thumb:hover { background: var(--nf-light); }

/* 无障碍：屏幕阅读器文本 */
.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link:focus {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100000;
  width: auto;
  height: auto;
  padding: 12px 20px;
  clip: auto;
  background: var(--nf-color);
  color: #fff;
  border-radius: var(--nf-radius-m);
}

/* 焦点可见性 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--nf-color);
  outline-offset: 2px;
}

/* ==========================================================================
   03. 布局骨架
   ========================================================================== */
.container {
  width: 100%;
  max-width: var(--nf-container);
  margin: 0 auto;
  padding: 0 15px;
}

.nf-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--nf-sidebar-w);
  gap: var(--nf-gap);
  padding-top: 20px;
  padding-bottom: 40px;
  align-items: start;
}

.nf-main { min-width: 0; }

.nf-sidebar {
  width: var(--nf-sidebar-w);
  position: sticky;
  top: calc(var(--nf-header-h, 64px) + 20px);
}

/* 无侧边栏（页面模板）时主区占满 */
.nf-no-sidebar .nf-wrap {
  grid-template-columns: minmax(0, 1fr);
}
.nf-no-sidebar .nf-main { width: 100%; max-width: none; }

/* 通用面板 */
.nf-panel {
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-xl);
  margin-bottom: 20px;
  overflow: hidden;
}

.nf-panel-body { padding: 0 20px 10px; }

.nf-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 20px;
  border-bottom: 1px solid var(--nf-line);
}

.nf-panel-head h1,
.nf-panel-head h2,
.nf-panel-head h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.nf-panel-head .nf-head-bar {
  display: inline-block;
  width: 4px;
  height: 18px;
  background: var(--nf-color);
  border-radius: var(--nf-radius-s);
}

/* ==========================================================================
   04. 顶部导航
   ========================================================================== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 900;
  width: 100%;
  background: var(--nf-header-bg);
  box-shadow: 0 0 3px 1px hsla(var(--nf-hsl), 0.08);
  transition: box-shadow var(--nf-dur) var(--nf-ease);
}

.site-header.is-stuck { box-shadow: 0 2px 16px hsla(0, 0%, 0%, 0.1); }

.site-header .container {
  display: flex;
  align-items: center;
  gap: 28px;
  min-height: var(--nf-header-h);
}

.nf-brand { flex-shrink: 0; }
.nf-nav-wrap { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; }
.nf-actions { flex-shrink: 0; margin-left: auto; }

/* Logo */
.nf-brand { display: flex; align-items: center; flex-shrink: 0; }

.nf-brand img,
.nf-brand .custom-logo {
  display: block;
  height: var(--nf-logo-h, 32px);
  width: auto;
  max-height: 72px;
}

.nf-brand a {
  display: block;
  color: var(--nf-black);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.2px;
  line-height: 1.15;
}

.nf-brand .nf-site-desc {
  display: block;
  color: var(--nf-light);
  font-size: 12px;
  line-height: 1;
  margin-top: 4px;
}

/* 导航 */
.nf-nav-wrap {
  display: flex;
  align-items: center;
  min-width: 0;
}

.nf-nav {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nf-nav > li { position: relative; }

.nf-nav > li > a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  height: var(--nf-header-h);
  padding: 0 14px;
  color: var(--nf-black);
  font-size: 15px;
  font-weight: 400;
  white-space: nowrap;
}

.nf-nav > li > a .nf-ico {
  font-size: 15px;
  opacity: 0.75;
}

.nf-nav > li > a::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 0;
  height: 2px;
  background: var(--nf-color);
  border-radius: 2px 2px 0 0;
  transform: scaleX(0);
  transition: transform var(--nf-dur) var(--nf-ease);
}

.nf-nav > li > a:hover,
.nf-nav > li.current-menu-item > a,
.nf-nav > li.current-menu-ancestor > a,
.nf-nav > li.current_page_item > a {
  color: var(--nf-color);
}

.nf-nav > li > a:hover::after,
.nf-nav > li.current-menu-item > a::after,
.nf-nav > li.current-menu-ancestor > a::after {
  transform: scaleX(1);
}

/* 下拉箭头 */
.nf-nav > li.menu-item-has-children > a .nf-caret {
  font-size: 10px;
  opacity: 0.6;
  transition: transform var(--nf-dur) var(--nf-ease);
}

.nf-nav > li.menu-item-has-children:hover > a .nf-caret {
  transform: rotate(180deg);
}

/* 下拉面板 */
.nf-nav .sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 20;
  min-width: 180px;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--nf-el-bg);
  border-radius: 0 0 var(--nf-radius-l) var(--nf-radius-l);
  box-shadow: var(--nf-shadow-md);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity var(--nf-dur) var(--nf-ease),
    transform var(--nf-dur) var(--nf-ease), visibility var(--nf-dur);
}

.nf-nav > li:hover > .sub-menu,
.nf-nav > li:focus-within > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* 二级面板里的列布局（超过 6 项自动两列） */
.nf-nav .sub-menu.nf-cols-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(140px, 1fr));
  min-width: 340px;
}

.nf-nav .sub-menu .sub-menu {
  top: -6px;
  left: 100%;
  border-radius: var(--nf-radius-l);
}

.nf-nav .sub-menu li { position: relative; }

.nf-nav .sub-menu a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border-radius: var(--nf-radius-m);
  color: var(--nf-gray);
  font-size: 14px;
  white-space: nowrap;
}

.nf-nav .sub-menu a:hover {
  background: var(--nf-soft);
  color: var(--nf-color);
}

/* 右侧动作区 */
.nf-actions {
  display: flex;
  align-items: center;
  gap: 4px;
}

.nf-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  border-radius: var(--nf-radius-m);
  background: transparent;
  color: var(--nf-gray);
  font-size: 17px;
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-icon-btn:hover {
  background: var(--nf-soft);
  color: var(--nf-color);
}

/* 搜索面板 */
.nf-search-panel {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 30;
  background: var(--nf-el-bg);
  border-top: 1px solid var(--nf-line);
  box-shadow: var(--nf-shadow);
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s var(--nf-ease);
}

.nf-search-panel.is-open { max-height: 120px; }

.nf-search-panel .nf-search-form {
  display: flex;
  align-items: center;
  max-width: var(--nf-container);
  margin: 0 auto;
  padding: 18px 15px;
  gap: 10px;
}

.nf-search-panel input[type="search"],
.nf-search-panel input[type="text"] {
  flex: 1 1 auto;
  height: 44px;
  padding: 0 16px;
  border: 1px solid var(--nf-line);
  border-radius: var(--nf-radius-m);
  background: var(--nf-body-bg);
  color: var(--nf-black);
  font-size: 15px;
  outline: none;
  transition: border-color var(--nf-dur) var(--nf-ease);
}

.nf-search-panel input:focus { border-color: var(--nf-color); }

.nf-search-panel button {
  height: 44px;
  padding: 0 26px;
  border: 0;
  border-radius: var(--nf-radius-m);
  background: var(--nf-color);
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  transition: background var(--nf-dur) var(--nf-ease);
}

.nf-search-panel button:hover { background: var(--nf-hover); }

/* 汉堡按钮 */
.nf-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 40px;
  height: 40px;
  padding: 0 8px;
  border: 0;
  border-radius: var(--nf-radius-m);
  background: transparent;
}

.nf-toggle span {
  display: block;
  height: 2px;
  background: var(--nf-black);
  border-radius: 2px;
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-toggle span:nth-child(2) { width: 80%; }

/* 移动端抽屉 */
.nf-drawer {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 300px;
  max-width: 85vw;
  height: 100%;
  background: var(--nf-el-bg);
  box-shadow: var(--nf-shadow-lg);
  transform: translateX(-100%);
  transition: transform 0.35s var(--nf-ease);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.nf-drawer.is-open { transform: translateX(0); }

.nf-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 60px;
  padding: 0 16px;
  border-bottom: 1px solid var(--nf-line);
}

.nf-drawer-head strong { font-size: 16px; }

.nf-drawer-close {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: var(--nf-radius-m);
  background: var(--nf-soft);
  color: var(--nf-gray);
  font-size: 18px;
  line-height: 1;
}

.nf-drawer-nav {
  margin: 0;
  padding: 8px 0;
  list-style: none;
}

.nf-drawer-nav a {
  display: block;
  padding: 12px 18px;
  color: var(--nf-black);
  font-size: 15px;
  border-bottom: 1px solid var(--nf-line);
}

.nf-drawer-nav .sub-menu {
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--nf-soft);
}

.nf-drawer-nav .sub-menu a {
  padding-left: 36px;
  font-size: 14px;
  color: var(--nf-gray);
}

.nf-overlay {
  position: fixed;
  inset: 0;
  z-index: 9998;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  visibility: hidden;
  transition: all 0.35s var(--nf-ease);
}

.nf-overlay.is-open { opacity: 1; visibility: visible; }

body.nf-locked { overflow: hidden; }

/* ==========================================================================
   05. 首页轮播
   ========================================================================== */
.nf-slider {
  position: relative;
  width: 100%;
  height: 320px;
  margin-bottom: 20px;
  background: var(--nf-soft);
  border-radius: var(--nf-radius-xl);
  overflow: hidden;
}

.nf-slider-track {
  display: flex;
  height: 100%;
  transition: transform 0.6s var(--nf-ease);
  will-change: transform;
}

.nf-slide {
  position: relative;
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.nf-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 6s linear;
}

.nf-slide.is-active img { transform: scale(1.06); }

.nf-slide-cap {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 60px 100px 32px 30px;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0));
  color: #fff;
}

.nf-slide-cap h2 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.4;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.nf-slide-cap h2 a { color: #fff; }

.nf-slide-cap .nf-slide-meta {
  font-size: 13px;
  opacity: 0.82;
  display: flex;
  align-items: center;
  gap: 10px;
}

.nf-slider-btn {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin-top: -21px;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.28);
  color: #fff;
  font-size: 18px;
  opacity: 0;
  backdrop-filter: blur(4px);
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-slider:hover .nf-slider-btn { opacity: 1; }

.nf-slider-btn:hover { background: var(--nf-color); }

.nf-slider-btn.prev { left: 16px; }
.nf-slider-btn.next { right: 16px; }

.nf-slider-dots {
  position: absolute;
  right: 20px;
  bottom: 20px;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 6px;
}

.nf-slider-dots button {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: var(--nf-radius-pill);
  background: rgba(255, 255, 255, 0.55);
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-slider-dots button.is-active {
  width: 22px;
  background: #fff;
}

/* ==========================================================================
   06. Tab 面板
   ========================================================================== */
.nf-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}

.nf-tabs::-webkit-scrollbar { display: none; }

.nf-tabs li a {
  position: relative;
  display: block;
  padding: 0 14px;
  color: var(--nf-gray);
  font-size: 16px;
  font-weight: 400;
  line-height: 52px;
  white-space: nowrap;
  transition: color var(--nf-dur) var(--nf-ease);
}

.nf-tabs li a::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 0;
  height: 2px;
  background: var(--nf-color);
  border-radius: 2px 2px 0 0;
  transform: scaleX(0);
  transition: transform var(--nf-dur) var(--nf-ease);
}

.nf-tabs li.is-active a { color: var(--nf-color); }

.nf-tabs li.is-active a::after { transform: scaleX(1); }

.nf-tab-pane { display: none; padding: 0 20px; }
.nf-tab-pane.is-active { display: block; animation: nf-fade 0.4s var(--nf-ease); }

@keyframes nf-fade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* ==========================================================================
   07. 文章循环 / 卡片
   ========================================================================== */
.post-loop {
  margin: 0;
  padding: 0;
  list-style: none;
}

.post-loop .item {
  display: flex;
  align-items: stretch;
  gap: 20px;
  padding: 24px 0;
  border-bottom: 1px solid var(--nf-line);
  transition: background var(--nf-dur) var(--nf-ease);
}

.post-loop .item:last-child { border-bottom: 0; }

/* --- 缩略图 --- */
.item-img {
  position: relative;
  flex: 0 0 30%;
  max-width: 30%;
  overflow: hidden;
  border-radius: var(--nf-radius-l);
  background: #eef2f6;
}

.item-img-inner {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: var(--nf-radius-l);
}

.item-img img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: var(--nf-thumb-ratio);
  object-fit: cover;
  transition: transform 0.5s var(--nf-ease);
}

.post-loop .item:hover .item-img img { transform: scale(1.05); }

/* 分类角标 */
.item-category {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  padding: 4px 8px;
  border-radius: var(--nf-radius-s);
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  font-size: 12px;
  line-height: 1.3;
  backdrop-filter: blur(4px);
}

.item-category:hover { background: var(--nf-color); color: #fff; }

/* --- 内容区 --- */
.item-content {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.item-title {
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.item-title a { color: var(--nf-black); }
.item-title a:hover { color: var(--nf-color); }

.item-excerpt {
  margin-bottom: 12px;
  color: var(--nf-gray);
  font-size: 15px;
  line-height: 1.625;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.item-excerpt p { margin: 0; }

.item-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  color: var(--nf-light);
  font-size: 13px;
}

.item-meta .item-meta-left,
.item-meta .item-meta-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

.item-meta a { color: var(--nf-light); }
.item-meta a:hover { color: var(--nf-color); }

.item-meta .nf-dot { opacity: 0.5; }

.item-meta .nf-views::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 3px;
  margin-right: 5px;
  border-radius: 50%;
  background: currentColor;
  vertical-align: middle;
  opacity: 0.6;
}

/* --- 两栏 / 三栏 / 四栏网格卡片 --- */
.post-loop.cols-2,
.post-loop.cols-3,
.post-loop.cols-4 {
  display: grid;
  gap: 20px;
  padding: 20px;
}

.post-loop.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.post-loop.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.post-loop.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.post-loop.cols-2 .item,
.post-loop.cols-3 .item,
.post-loop.cols-4 .item {
  display: block;
  padding: 0;
  border-bottom: 0;
}

.post-loop.cols-2 .item-img,
.post-loop.cols-3 .item-img,
.post-loop.cols-4 .item-img {
  flex: none;
  max-width: 100%;
  margin-bottom: 12px;
}

.post-loop.cols-2 .item-title,
.post-loop.cols-3 .item-title,
.post-loop.cols-4 .item-title {
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 8px;
  -webkit-line-clamp: 2;
}

.post-loop.cols-2 .item-excerpt,
.post-loop.cols-3 .item-excerpt,
.post-loop.cols-4 .item-excerpt {
  font-size: 13px;
  -webkit-line-clamp: 2;
}

.post-loop.cols-2 .item-meta,
.post-loop.cols-3 .item-meta,
.post-loop.cols-4 .item-meta { font-size: 12px; }

/* --- 简约文字列表 --- */
.post-loop-text .item {
  display: block;
  padding: 12px 0;
  border-bottom: 1px dashed var(--nf-line);
}

.post-loop-text .item-title {
  font-size: 15px;
  font-weight: 400;
  margin: 0;
  -webkit-line-clamp: 1;
}

.post-loop-text .item-title a:hover { color: var(--nf-color); }

.post-loop-text .item-meta { margin-top: 4px; font-size: 12px; }

/* --- 头条位：左大图 + 右内容（对齐 JustNews 的 item-large 观感） --- */
.post-loop-featured .item:first-child {
  display: flex;
  align-items: stretch;
  padding-top: 24px;
}

.post-loop-featured .item:first-child .item-img {
  flex: 0 0 44%;
  max-width: 44%;
  margin-bottom: 0;
}

.post-loop-featured .item:first-child .item-img img {
  height: 100%;
  min-height: 220px;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.post-loop-featured .item:first-child .item-content {
  justify-content: center;
}

.post-loop-featured .item:first-child .item-title {
  font-size: 22px;
  line-height: 1.4;
  margin-bottom: 10px;
}

.post-loop-featured .item:first-child .item-excerpt {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 窄屏退化为上下结构 */
@media (max-width: 991px) {
  .post-loop-featured .item:first-child { flex-direction: column; }
  .post-loop-featured .item:first-child .item-img {
    max-width: 100%;
    flex: none;
    margin-bottom: 14px;
  }
  .post-loop-featured .item:first-child .item-img img {
    min-height: 0;
    aspect-ratio: 16 / 9;
  }
  .post-loop-featured .item:first-child .item-title { font-size: 19px; }
}

/* ==========================================================================
   08. 面包屑
   ========================================================================== */
.nf-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  color: var(--nf-light);
  font-size: 13px;
}

.nf-breadcrumb li { display: flex; align-items: center; gap: 6px; }

.nf-breadcrumb li + li::before {
  content: "/";
  color: var(--nf-light);
  opacity: 0.5;
}

.nf-breadcrumb a { color: var(--nf-light); }
.nf-breadcrumb a:hover { color: var(--nf-color); }
.nf-breadcrumb .active { color: var(--nf-gray); }

/* ==========================================================================
   09. 文章详情
   ========================================================================== */
.nf-article {
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-xl);
  padding: 30px;
  margin-bottom: 20px;
}

.entry-title {
  margin: 0 0 16px;
  font-size: 28px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--nf-black);
}

.entry-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--nf-line);
  color: var(--nf-light);
  font-size: 13px;
}

.entry-info a { color: var(--nf-light); }
.entry-info a:hover { color: var(--nf-color); }

.entry-info .nf-dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.5;
}

.entry-info .entry-date { color: var(--nf-light); }

/* 特色图 */
.entry-thumb {
  margin: 0 0 24px;
  border-radius: var(--nf-radius-l);
  overflow: hidden;
}

.entry-thumb img { display: block; width: 100%; height: auto; }

/* 正文排版 */
.entry-content {
  color: var(--nf-gray);
  font-size: 17px;
  line-height: 1.85;
  word-break: break-word;
}

.entry-content > *:first-child { margin-top: 0; }

.entry-content h2 {
  margin: 1.8em 0 0.7em;
  padding-left: 14px;
  border-left: 4px solid var(--nf-color);
  font-size: 22px;
  color: var(--nf-black);
}

.entry-content h3 {
  margin: 1.6em 0 0.6em;
  font-size: 19px;
  color: var(--nf-black);
}

.entry-content h4 { font-size: 17px; color: var(--nf-black); }

.entry-content a {
  text-decoration: underline;
  text-decoration-color: hsla(var(--nf-hsl), 0.35);
  text-underline-offset: 3px;
}

.entry-content a:hover { text-decoration-color: var(--nf-color); }

.entry-content img,
.entry-content video,
.entry-content iframe {
  max-width: 100%;
  height: auto;
  border-radius: var(--nf-radius-l);
}

.entry-content figure {
  margin: 1.6em 0;
}

.entry-content figcaption,
.entry-content .wp-caption-text {
  margin-top: 8px;
  text-align: center;
  color: var(--nf-light);
  font-size: 13px;
}

.entry-content ul,
.entry-content ol { margin: 1.2em 0; }

.entry-content li { margin-bottom: 0.5em; }

.entry-content blockquote {
  margin: 1.6em 0;
  padding: 18px 22px;
  background: var(--nf-soft);
  border-left: 4px solid var(--nf-color);
  border-radius: 0 var(--nf-radius-m) var(--nf-radius-m) 0;
  color: var(--nf-gray);
  font-style: normal;
}

.entry-content table { font-size: 15px; }

.entry-content > .alignwide { max-width: 100%; }

.entry-content > .alignfull {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: 100vw;
  width: 100vw;
}

/* 分页（多页文章） */
.page-links {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 24px 0;
  font-size: 14px;
}

.page-links a,
.page-links > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 10px;
  border-radius: var(--nf-radius-s);
  background: var(--nf-soft);
  color: var(--nf-gray);
}

.page-links a:hover { background: var(--nf-color); color: #fff; }

/* 标签 */
.entry-tag {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 30px 0 0;
  padding-top: 20px;
  border-top: 1px solid var(--nf-line);
}

.entry-tag .nf-tag-label {
  color: var(--nf-light);
  font-size: 13px;
}

.entry-tag a {
  padding: 4px 12px;
  border-radius: var(--nf-radius-pill);
  background: var(--nf-soft);
  color: var(--nf-gray);
  font-size: 13px;
  transition: all var(--nf-dur) var(--nf-ease);
}

.entry-tag a:hover {
  background: var(--nf-color);
  color: #fff;
}

/* 点赞 / 分享条 */
.entry-action {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 24px 0 0;
  padding: 20px 0 4px;
  border-top: 1px solid var(--nf-line);
}

.nf-btn-zan {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 22px;
  border: 1px solid hsl(var(--nf-hsl));
  border-radius: var(--nf-radius-pill);
  background: transparent;
  color: var(--nf-color);
  font-size: 15px;
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-btn-zan:hover,
.nf-btn-zan.is-on {
  background: var(--nf-color);
  color: #fff;
}

.nf-btn-zan .nf-count { font-size: 13px; opacity: 0.85; }

.nf-share {
  display: flex;
  align-items: center;
  gap: 8px;
}

.nf-share a,
.nf-share button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: var(--nf-soft);
  color: var(--nf-gray);
  font-size: 16px;
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-share a:hover,
.nf-share button:hover { background: var(--nf-color); color: #fff; }

/* 作者卡 */
.nf-author-box {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 24px 0 0;
  padding: 20px;
  background: var(--nf-soft);
  border-radius: var(--nf-radius-l);
}

.nf-author-box img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  flex-shrink: 0;
}

.nf-author-box .nf-author-name {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 600;
}

.nf-author-box .nf-author-desc {
  margin: 0;
  color: var(--nf-gray);
  font-size: 13px;
  line-height: 1.6;
}

/* 上一篇 / 下一篇 */
.entry-page {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 20px 0;
}

.entry-page-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-l);
  color: var(--nf-gray);
  font-size: 14px;
  transition: all var(--nf-dur) var(--nf-ease);
}

.entry-page-item:hover {
  background: var(--nf-el-bg);
  box-shadow: var(--nf-shadow);
  color: var(--nf-color);
}

.entry-page-item .nf-label {
  display: block;
  color: var(--nf-light);
  font-size: 12px;
  margin-bottom: 4px;
}

.entry-page-item .nf-title {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.entry-page-item.next { justify-content: flex-end; text-align: right; }

.entry-page-item .nf-arrow { color: var(--nf-light); font-size: 16px; flex-shrink: 0; }

/* 相关文章 */
.nf-related {
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-xl);
  margin-bottom: 20px;
}

/* ==========================================================================
   10. 评论
   ========================================================================== */
.nf-comments {
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-xl);
  padding: 30px;
  margin-bottom: 20px;
}

.nf-comments-title {
  margin: 0 0 20px;
  font-size: 18px;
  font-weight: 600;
}

.nf-comments-title .nf-count {
  color: var(--nf-color);
  font-size: 15px;
}

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

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

.comment-body {
  position: relative;
  padding: 18px 0;
  border-top: 1px solid var(--nf-line);
}

.comment-list > .comment:first-child > .comment-body { border-top: 0; }

.comment-author {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
  font-size: 14px;
}

.comment-author .avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  flex-shrink: 0;
}

.comment-author .fn {
  font-style: normal;
  font-weight: 600;
  color: var(--nf-black);
}

.comment-author .says { display: none; }

.comment-metadata {
  color: var(--nf-light);
  font-size: 12px;
  margin-bottom: 8px;
}

.comment-metadata a { color: var(--nf-light); }
.comment-metadata a:hover { color: var(--nf-color); }

.comment-content {
  color: var(--nf-gray);
  font-size: 15px;
  line-height: 1.75;
}

.comment-content p:last-child { margin-bottom: 0; }

.comment-awaiting-moderation {
  display: inline-block;
  margin-top: 6px;
  color: var(--nf-warning);
  font-size: 12px;
}

.reply {
  position: absolute;
  top: 18px;
  right: 0;
  font-size: 13px;
}

.reply a {
  padding: 3px 10px;
  border-radius: var(--nf-radius-s);
  background: var(--nf-soft);
  color: var(--nf-gray);
}

.reply a:hover { background: var(--nf-color); color: #fff; }

.pingback .comment-body,
.trackback .comment-body { padding-left: 0; }

/* 评论导航 */
.comment-nav {
  display: flex;
  justify-content: space-between;
  margin: 20px 0;
  font-size: 14px;
}

/* 评论表单 */
.comment-respond {
  margin-top: 30px;
  padding-top: 24px;
  border-top: 1px solid var(--nf-line);
}

.comment-reply-title {
  margin: 0 0 18px;
  font-size: 17px;
  font-weight: 600;
}

.comment-reply-title small { font-size: 13px; font-weight: 400; margin-left: 10px; }

.comment-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.comment-form-comment,
.comment-form-url,
.comment-form-author,
.comment-form-email { margin: 0; }

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

.comment-form label {
  display: block;
  margin-bottom: 6px;
  color: var(--nf-gray);
  font-size: 13px;
}

.comment-form label .required { color: var(--nf-danger); }

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--nf-line);
  border-radius: var(--nf-radius-m);
  background: var(--nf-body-bg);
  color: var(--nf-black);
  font-size: 15px;
  outline: none;
  transition: border-color var(--nf-dur) var(--nf-ease);
}

.comment-form input:focus,
.comment-form textarea:focus { border-color: var(--nf-color); }

.comment-form textarea { min-height: 120px; resize: vertical; }

.comment-form .form-submit { margin-top: 4px; }

.comment-form .submit {
  height: 42px;
  padding: 0 30px;
  border: 0;
  border-radius: var(--nf-radius-m);
  background: var(--nf-color);
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  transition: background var(--nf-dur) var(--nf-ease);
}

.comment-form .submit:hover { background: var(--nf-hover); }

.comment-notes,
.logged-in-as {
  color: var(--nf-light);
  font-size: 13px;
}

/* ==========================================================================
   11. 侧边栏小工具
   ========================================================================== */
.nf-widget {
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-xl);
  padding: 20px;
  margin-bottom: 20px;
}

.nf-widget:last-child { margin-bottom: 0; }

.widget-title {
  position: relative;
  margin: 0 0 16px;
  padding-left: 14px;
  color: var(--nf-black);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
}

.widget-title::before {
  content: "";
  position: absolute;
  top: 2px;
  bottom: 2px;
  left: 0;
  width: 4px;
  border-radius: var(--nf-radius-s);
  background: var(--nf-color);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.25), transparent);
}

.widget-title a { color: var(--nf-black); }
.widget-title a:hover { color: var(--nf-color); }

.nf-widget ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.nf-widget ul li {
  padding: 9px 0;
  border-bottom: 1px dashed var(--nf-line);
  font-size: 14px;
  line-height: 1.6;
}

.nf-widget ul li:last-child { border-bottom: 0; padding-bottom: 0; }

.nf-widget ul li a { color: var(--nf-gray); }
.nf-widget ul li a:hover { color: var(--nf-color); }

.nf-widget ul ul { padding-left: 14px; }

.nf-widget ul ul li { border-bottom: 0; padding: 5px 0; }

/* 标签云 */
.tagcloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tagcloud a,
.nf-widget .tag-cloud-link {
  padding: 5px 12px;
  border-radius: var(--nf-radius-pill);
  background: var(--nf-soft);
  color: var(--nf-gray);
  font-size: 13px !important;
  transition: all var(--nf-dur) var(--nf-ease);
}

.tagcloud a:hover {
  background: var(--nf-color);
  color: #fff;
}

/* 搜索小工具 */
.nf-widget .search-form,
.nf-widget .wp-block-search__inside-wrapper {
  display: flex;
  gap: 8px;
}

.nf-widget input[type="search"] {
  flex: 1 1 auto;
  min-width: 0;
  height: 40px;
  padding: 0 14px;
  border: 1px solid var(--nf-line);
  border-radius: var(--nf-radius-m);
  background: var(--nf-body-bg);
  color: var(--nf-black);
  font-size: 14px;
  outline: none;
}

.nf-widget input[type="search"]:focus { border-color: var(--nf-color); }

.nf-widget .search-submit,
.nf-widget .wp-block-search__button {
  height: 40px;
  padding: 0 18px;
  border: 0;
  border-radius: var(--nf-radius-m);
  background: var(--nf-color);
  color: #fff;
  font-size: 14px;
}

.nf-widget .search-submit:hover { background: var(--nf-hover); }

/* 热门文章小工具 */
.nf-hot-list .nf-hot-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px dashed var(--nf-line);
}

.nf-hot-list .nf-hot-item:last-child { border-bottom: 0; padding-bottom: 0; }

.nf-hot-list .nf-rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  border-radius: var(--nf-radius-s);
  background: var(--nf-soft);
  color: var(--nf-light);
  font-size: 12px;
  font-weight: 600;
}

.nf-hot-list .nf-hot-item:nth-child(1) .nf-rank { background: #fa5555; color: #fff; }
.nf-hot-list .nf-hot-item:nth-child(2) .nf-rank { background: #ffa400; color: #fff; }
.nf-hot-list .nf-hot-item:nth-child(3) .nf-rank { background: #29ad00; color: #fff; }

.nf-hot-list .nf-hot-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--nf-gray);
  font-size: 14px;
  line-height: 1.55;
}

.nf-hot-list .nf-hot-title:hover { color: var(--nf-color); }

/* 图片小工具 */
.nf-widget img.image,
.nf-widget .wp-block-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--nf-radius-l);
}

.nf-widget .nf-widget-more {
  display: block;
  margin-top: 12px;
  text-align: center;
  color: var(--nf-light);
  font-size: 13px;
}

.nf-widget .nf-widget-more:hover { color: var(--nf-color); }

/* 关于站点小工具 */
.nf-about-box { text-align: center; padding: 10px 0 4px; }

.nf-about-box img {
  width: 110px;
  height: 110px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto 16px;
  display: block;
  border: 3px solid var(--nf-soft-2);
}

.nf-about-box .nf-about-name {
  margin: 0 0 8px;
  font-size: 17px;
  font-weight: 600;
}

.nf-about-box .nf-about-desc {
  color: var(--nf-gray);
  font-size: 13px;
  line-height: 1.7;
  margin: 0;
}

/* ==========================================================================
   12. 分页
   ========================================================================== */
.nf-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}

.nf-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 10px;
  border-radius: var(--nf-radius-s);
  background: hsla(var(--nf-hsl), 0.06);
  color: var(--nf-gray);
  font-size: 14px;
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-pagination .page-numbers:hover {
  background: hsla(var(--nf-hsl), 0.14);
  color: var(--nf-color);
}

.nf-pagination .page-numbers.current {
  background: var(--nf-color);
  color: #fff;
}

.nf-pagination .page-numbers.dots {
  background: transparent;
  color: var(--nf-light);
}

/* 页码跳转 */
.nf-page-jump {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 6px 0 12px;
  border-radius: var(--nf-radius-s);
  background: hsla(var(--nf-hsl), 0.06);
}

.nf-page-jump input {
  width: 44px;
  height: 24px;
  padding: 0 6px;
  border: 1px solid var(--nf-line);
  border-radius: var(--nf-radius-s);
  background: var(--nf-el-bg);
  color: var(--nf-black);
  font-size: 13px;
  text-align: center;
  outline: none;
}

.nf-page-jump button {
  height: 24px;
  padding: 0 10px;
  border: 0;
  border-radius: var(--nf-radius-s);
  background: var(--nf-color);
  color: #fff;
  font-size: 12px;
}

/* ==========================================================================
   13. 页脚
   ========================================================================== */
.site-footer {
  background: var(--nf-footer-bg);
  color: var(--nf-footer-color);
  padding: 20px 0 18px;
  font-size: 13px;
  line-height: 1.8;
}

.site-footer a { color: rgba(255, 255, 255, 0.86); }
.site-footer a:hover { color: #fff; }

.nf-footer-cols {
  display: flex;
  align-items: flex-start;
  gap: 40px;
  padding-bottom: 30px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.nf-footer-logo { flex: 0 0 200px; }

.nf-footer-logo img { max-height: 44px; width: auto; }

.nf-footer-logo .nf-footer-sitename {
  color: #fff;
  font-size: 20px;
  font-weight: 700;
}

.nf-footer-copy { flex: 1 1 auto; min-width: 0; }

.nf-footer-spacer { flex: 1 1 auto; }

.nf-footer-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 0;
  margin: 0 0 14px;
  padding: 0;
  list-style: none;
  font-size: 14px;
}

.nf-footer-nav li {
  display: inline-flex;
  align-items: center;
}

.nf-footer-nav li + li::before {
  content: "|";
  margin: 0 10px;
  opacity: 0.35;
}

.nf-footer-nav a { color: rgba(255, 255, 255, 0.82); }
.nf-footer-nav a:hover { color: #fff; }

.nf-footer-nav .current-menu-item a { color: var(--nf-color); }

.nf-copyright p { margin: 0 0 6px; }

.nf-copyright a { color: #78d2ff; }

.nf-footer-sns {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
}

.nf-footer-sns a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.8);
  font-size: 17px;
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-footer-sns a:hover {
  background: var(--nf-color);
  color: #fff;
  transform: translateY(-2px);
}

.nf-footer-bottom {
  padding-top: 22px;
  text-align: center;
  color: rgba(255, 255, 255, 0.6);
  font-size: 13px;
}

.nf-footer-bottom .nf-copyright-line {
  margin: 0;
  line-height: 2;
}

.nf-footer-bottom .nf-copyright-line a {
  color: #78d2ff;
}

.nf-police-line {
  display: flex;
  justify-content: center;
  margin: 4px 0 0;
  line-height: 2;
}

.nf-police-line a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #78d2ff;
}

.nf-police-badge {
  flex: 0 0 auto;
  display: block;
  height: 16px;
  width: auto;
}

/* 友情链接区 */
.nf-links {
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-xl);
  margin-bottom: 20px;
  overflow: hidden;
}

.nf-links .nf-panel-body {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  padding: 18px 20px;
}

.nf-links a {
  color: var(--nf-gray);
  font-size: 14px;
}

.nf-links a:hover { color: var(--nf-color); }

/* ==========================================================================
   14. 浮动操作
   ========================================================================== */
.nf-action {
  position: fixed;
  right: 20px;
  bottom: 40px;
  z-index: 800;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.nf-action-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: var(--nf-radius-l);
  background: var(--nf-el-bg);
  color: var(--nf-gray);
  font-size: 18px;
  box-shadow: var(--nf-shadow);
  transition: all var(--nf-dur) var(--nf-ease);
}

.nf-action-item:hover {
  background: var(--nf-color);
  color: #fff;
  transform: translateY(-2px);
}

.nf-action-item.nf-top {
  opacity: 0;
  visibility: hidden;
}

.nf-action-item.nf-top.is-show { opacity: 1; visibility: visible; }

/* 移动端底部导航 */
.nf-mobile-bar {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 850;
  height: 52px;
  background: var(--nf-el-bg);
  border-top: 1px solid var(--nf-line);
  box-shadow: 0 -1px 12px hsla(0, 0%, 0%, 0.05);
}

.nf-mobile-bar a,
.nf-mobile-bar button {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  border: 0;
  background: transparent;
  color: var(--nf-light);
  font-size: 11px;
}

.nf-mobile-bar .nf-mb-ico { font-size: 17px; }

.nf-mobile-bar a.is-active,
.nf-mobile-bar button.is-active { color: var(--nf-color); }

/* ==========================================================================
   15. 空状态 / 404 / 页面
   ========================================================================== */
.nf-empty {
  padding: 60px 20px;
  text-align: center;
  color: var(--nf-light);
}

.nf-empty .nf-empty-ico {
  font-size: 56px;
  color: var(--nf-line);
  margin-bottom: 16px;
}

.nf-empty h2 {
  margin: 0 0 10px;
  font-size: 20px;
  color: var(--nf-gray);
}

.nf-empty p { margin: 0 0 20px; font-size: 14px; }

.nf-empty .nf-btn {
  display: inline-block;
  padding: 10px 26px;
  border-radius: var(--nf-radius-m);
  background: var(--nf-color);
  color: #fff;
  font-size: 14px;
}

.nf-empty .nf-btn:hover { background: var(--nf-hover); color: #fff; }

.nf-404 {
  padding: 80px 20px;
  text-align: center;
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-xl);
}

.nf-404 .nf-404-code {
  font-size: 96px;
  font-weight: 800;
  line-height: 1;
  background: linear-gradient(135deg, var(--nf-color), #7ec8ff);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.nf-404 h1 { margin: 16px 0 10px; font-size: 24px; }

.nf-404 p { color: var(--nf-gray); margin-bottom: 24px; }

.nf-404 .nf-search-form {
  display: flex;
  gap: 10px;
  max-width: 420px;
  margin: 0 auto;
}

.nf-404 input[type="search"] {
  flex: 1 1 auto;
  height: 44px;
  padding: 0 16px;
  border: 1px solid var(--nf-line);
  border-radius: var(--nf-radius-m);
  background: var(--nf-body-bg);
  color: var(--nf-black);
  outline: none;
}

.nf-404 button {
  height: 44px;
  padding: 0 24px;
  border: 0;
  border-radius: var(--nf-radius-m);
  background: var(--nf-color);
  color: #fff;
}

/* 页面（page.php） */
.nf-page-header {
  background: var(--nf-el-bg);
  border-radius: var(--nf-radius-xl);
  padding: 30px;
  margin-bottom: 20px;
}

.nf-page-header h1 { margin: 0; font-size: 26px; }

.nf-page-header .nf-page-desc {
  margin: 12px 0 0;
  color: var(--nf-gray);
  font-size: 14px;
}

.nf-archive-desc {
  margin: 12px 0 0;
  color: var(--nf-gray);
  font-size: 14px;
  line-height: 1.7;
}

/* ==========================================================================
   16. WordPress 核心类兼容
   ========================================================================== */
.alignleft {
  float: left;
  margin: 0.4em 1.6em 1em 0;
}

.alignright {
  float: right;
  margin: 0.4em 0 1em 1.6em;
}

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

.wp-caption {
  max-width: 100%;
  margin-bottom: 1.4em;
}

.wp-caption img { display: block; margin: 0 auto; }

.sticky-badge {
  display: inline-block;
  margin-right: 8px;
  padding: 1px 7px;
  border-radius: var(--nf-radius-s);
  background: var(--nf-color);
  color: #fff;
  font-size: 12px;
  font-weight: 400;
  vertical-align: 2px;
}

.bypostauthor > .comment-body .fn::after {
  content: "作者";
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: var(--nf-radius-s);
  background: var(--nf-soft);
  color: var(--nf-color);
  font-size: 11px;
  font-weight: 400;
}

.wp-block-quote { border-left: 4px solid var(--nf-color); }
.wp-block-button__link { border-radius: var(--nf-radius-m); }
.wp-block-image figcaption { color: var(--nf-light); font-size: 13px; }
.wp-block-table td, .wp-block-table th { border-color: var(--nf-line); }
.wp-block-search__button { background: var(--nf-color); color: #fff; border: 0; }

.screen-reader-shortcut { position: absolute; left: -9999px; }

/* 编辑链接 */
.edit-link a {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--nf-radius-s);
  background: var(--nf-soft);
  color: var(--nf-gray);
  font-size: 12px;
}

/* ==========================================================================
   17. 细节补充
   ========================================================================== */
.nf-svg {
  display: inline-block;
  vertical-align: -0.15em;
  flex-shrink: 0;
}

.nf-nav .nf-menu-text { white-space: nowrap; }

.nf-primary { min-width: 0; }

/* 无图占位 */
.nf-no-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: var(--nf-thumb-ratio);
  background: var(--nf-soft);
  color: var(--nf-border);
}

.nf-no-thumb img { display: none; }

.nf-thumb-fallback {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--nf-soft), var(--nf-soft-2));
}

.item-img .nf-no-thumb .nf-svg { width: 34px; height: 34px; }

/* 轮播图片链接铺满 */
.nf-slide-link {
  display: block;
  width: 100%;
  height: 100%;
}

/* 移动端抽屉：默认折叠子菜单 */
.nf-drawer-nav .sub-menu { display: none; }
.nf-drawer-nav .sub-menu.nf-sub-open { display: block; }
.nf-drawer-nav .nf-caret { margin-left: auto; transition: transform var(--nf-dur) var(--nf-ease); }
.nf-drawer-nav .nf-sub-toggle { display: flex; align-items: center; gap: 8px; }
.nf-drawer-nav .nf-sub-toggle[aria-expanded="true"] .nf-caret { transform: rotate(180deg); }

/* 头部计数 / 更多 */
.nf-head-count { flex-shrink: 0; }
.nf-head-more { flex-shrink: 0; }
.nf-head-more:hover { color: var(--nf-color); }

.nf-more-btn:hover {
  border-color: var(--nf-color);
  color: var(--nf-color);
}

/* 元信息分隔点 */
.nf-dot {
  display: inline-block;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.5;
  vertical-align: middle;
}

.entry-info .nf-dot,
.nf-slide-meta .nf-dot { flex-shrink: 0; }

/* 归档描述 */
.nf-archive-desc {
  padding: 14px 0 0;
}

/* 页脚小工具在深色底上的适配 */
.nf-widget-footer {
  background: rgba(255, 255, 255, 0.04);
  color: var(--nf-footer-color);
}

.nf-widget-footer .widget-title { color: #fff; }

.nf-widget-footer ul li { border-bottom-color: rgba(255, 255, 255, 0.08); }
.nf-widget-footer ul li a { color: rgba(255, 255, 255, 0.75); }
.nf-widget-footer ul li a:hover { color: #fff; }

/* WordPress 经典小工具里的列表圆点 */
.nf-widget ul li.cat-item a::before,
.nf-widget ul li.page_item a::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 4px;
  margin-right: 8px;
  border-radius: 50%;
  background: var(--nf-border);
  vertical-align: middle;
}

/* 日历小工具 */
.nf-widget #wp-calendar {
  width: 100%;
  font-size: 13px;
}

.nf-widget #wp-calendar caption {
  margin-bottom: 8px;
  color: var(--nf-gray);
  font-weight: 600;
}

.nf-widget #wp-calendar th,
.nf-widget #wp-calendar td {
  padding: 4px 0;
  border: 0;
  text-align: center;
}

.nf-widget #wp-calendar td a { color: var(--nf-color); font-weight: 600; }

/* RSS / 近期评论小工具 */
.nf-widget ul li .rsswidget { font-weight: 600; }
.nf-widget .recentcomments a { color: var(--nf-gray); }

/* ==========================================================================
   18. 响应式
   ========================================================================== */
@media (max-width: 1239px) {
  :root { --nf-container: 970px; --nf-sidebar-w: 260px; }
  .nf-slider { height: 300px; }
  .nf-wrap { grid-template-columns: minmax(0, 1fr) var(--nf-sidebar-w); }
}

@media (max-width: 991px) {
  :root {
    --nf-container: 100%;
    --nf-gap: 20px;
    --nf-header-h: 56px;
  }
  .nf-slider { height: 280px; }
  .nf-slide-cap { padding: 50px 40px 26px 20px; }
  .nf-slide-cap h2 { font-size: 20px; }
  .nf-wrap { grid-template-columns: 1fr; }
  .nf-sidebar {
    position: static;
    width: 100%;
  }
  /* 移动端隐藏桌面导航列表，保留搜索按钮，启用汉堡 */
  .nf-primary { display: none; }
  .nf-nav-wrap { display: none; }
  .nf-toggle { display: flex; flex-shrink: 0; }
  .site-header .container { gap: 12px; }
  .nf-brand { margin: 0 auto; }
  .post-loop.cols-3,
  .post-loop.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nf-footer-cols { flex-direction: column; gap: 24px; }
  .nf-footer-sns { align-self: flex-start; }
}

@media (max-width: 767px) {
  body { font-size: 15px; }
  :root { --nf-radius-xl: 10px; }
  .container { padding: 0 12px; }
  .nf-slider { height: 210px; }
  .nf-slide-cap { padding: 40px 16px 18px 14px; }
  .nf-slide-cap h2 { font-size: 16px; -webkit-line-clamp: 2; }
  .nf-slide-cap .nf-slide-meta { display: none; }
  .nf-slider-btn { display: none; }
  .nf-slider-dots { right: 12px; bottom: 12px; }
  .nf-panel-head h1,
  .nf-panel-head h2,
  .nf-panel-head h3 { line-height: 46px; font-size: 16px; }
  .nf-tabs li a { line-height: 46px; padding: 0 10px; font-size: 15px; }
  .post-loop .item { gap: 12px; padding: 15px 0; }
  .item-img { flex: 0 0 36%; max-width: 36%; }
  .post-loop-featured .item:first-child .item-img img { aspect-ratio: 16 / 9; }
  .post-loop-featured .item:first-child .item-title { font-size: 19px; }
  .item-title { font-size: 16px; line-height: 1.45; margin-bottom: 6px; }
  .item-excerpt { display: none; }
  .item-meta { font-size: 12px; }
  .post-loop.cols-2,
  .post-loop.cols-3,
  .post-loop.cols-4 { grid-template-columns: 1fr; padding: 15px; gap: 16px; }
  .post-loop.cols-2 .item-excerpt,
  .post-loop.cols-3 .item-excerpt,
  .post-loop.cols-4 .item-excerpt { display: -webkit-box; }
  .nf-article,
  .nf-comments { padding: 20px 16px; }
  .entry-title { font-size: 21px; }
  .entry-content { font-size: 16px; }
  .entry-content h2 { font-size: 19px; }
  .entry-content h3 { font-size: 17px; }
  .entry-page { grid-template-columns: 1fr; }
  .entry-page-item.next { justify-content: flex-start; text-align: left; }
  .comment-form { grid-template-columns: 1fr; }
  .comment-list .children { padding-left: 0; }
  .reply { position: static; margin-top: 8px; }
  .nf-404 { padding: 60px 16px; }
  .nf-404 .nf-404-code { font-size: 72px; }
  .site-footer { padding: 18px 0 60px; }
  .nf-action { right: 12px; bottom: 66px; }
  .nf-mobile-bar { display: flex; }
  .nf-pagination { gap: 6px; }
  .nf-pagination .page-numbers { min-width: 30px; height: 30px; font-size: 13px; }
  .nf-page-jump { display: none; }
}

/* 打印 */
@media print {
  .site-header,
  .nf-sidebar,
  .nf-action,
  .nf-mobile-bar,
  .site-footer,
  .nf-comments,
  .entry-action { display: none !important; }
  .nf-wrap { display: block; }
  .nf-article { padding: 0; box-shadow: none; }
}