:root {
  --cj-primary:#4dabf7;
  --cj-primary-dark:#3b9ae6;
  --cj-accent:#ff6b9d;
  --cj-bg:#f8f9fa;
  --cj-card:#ffffff;
  --cj-border:#e5e7eb;
  --cj-text:#0f172a;
  --cj-muted:#4b5563;
  --cj-radius:16px;
  --cj-shadow:0 10px 30px rgba(0,0,0,0.08);
  --body-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
  color-scheme: light;
}
[data-theme="dark"] {
  --cj-bg:#0b1220;
  --cj-card:#0f172a;
  --cj-border:#1f2937;
  --cj-text:#e5e7eb;
  --cj-muted:#9ca3af;
  color-scheme: dark;
}

*{box-sizing:border-box}
html{margin:0;padding:0;height:100%}
html,body{max-width:100%;overflow-x:hidden}
body{
  margin:0;
  padding:0;
  background:var(--cj-bg);
  color:var(--cj-text);
  font-family:var(--body-font-family);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  min-height:100%;
}
/* 搜索页面布局 - 确保footer始终在底部 */
body.search,
body.search-results,
body.search-no-results {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
body.search .site-main,
body.search-results .site-main,
body.search-no-results .site-main {
  flex: 1;
  display: flex;
  flex-direction: column;
}
/* WordPress admin bar 兼容 */
body.admin-bar.search,
body.admin-bar.search-results,
body.admin-bar.search-no-results {
  min-height: calc(100vh - 32px);
}
@media screen and (max-width: 782px) {
  body.admin-bar.search,
  body.admin-bar.search-results,
  body.admin-bar.search-no-results {
    min-height: calc(100vh - 46px);
  }
}
p{
  display:block;
  font-style:normal;
  font-weight:400;
  font-size:18px;
  line-height:1.75;
  letter-spacing:-0.3px;
  color:var(--cj-text);
  margin-block-start:1em;
  margin-block-end:1em;
  margin-inline-start:0;
  margin-inline-end:0;
  unicode-bidi:isolate;
  margin-bottom:32px;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.sr-only{position:absolute;left:-9999px}

.container{max-width:1200px;margin:0 auto;padding:0 1.5rem}
.eyebrow{letter-spacing:.08em;font-weight:600;color:var(--cj-accent);text-transform:uppercase;font-size:.8rem;margin:0 0 .5rem}
.lead{color:var(--cj-muted);margin:0}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.25rem}
.section-head h2{margin:.1rem 0}
.link{color:var(--cj-primary);font-weight:600}

.site-header{position:sticky;top:0;z-index:50;background:rgba(248,249,250,.85);border-bottom:1px solid var(--cj-border);backdrop-filter:blur(16px)}
[data-theme="dark"] .site-header{background:rgba(15,23,42,.8)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1.5rem}
.logo-wrap{display:flex;align-items:center;gap:.75rem}
.brand{display:flex;align-items:center;gap:.6rem}
.logo{width:40px;height:40px}
.logo_foot{width: 250px;height: 65px;}
.wordmark{display:flex;flex-direction:column;line-height:1.1;font-family:"Fredoka",cursive;font-size:1.05rem;font-weight:700}
.wordmark-line:first-child{font-size:1.05rem}
.wordmark-line:last-child{font-size:1rem}
.tag{background:var(--cj-accent);color:#fff;padding:.3rem .7rem;border-radius:999px;font-size:.75rem;font-weight:600}
.menu-toggle{display:none!important;background:transparent;border:1px solid var(--cj-border);padding:.45rem .5rem;border-radius:10px;gap:4px;flex-direction:column;justify-content:center;align-items:center}
.menu-toggle .bar{width:20px;height:2px;background:var(--cj-text);display:block}
.primary-nav .menu{display:flex;gap:1rem;margin:0;padding:0;list-style:none}
.primary-nav a{padding:.6rem .8rem;border-radius:10px;transition:all .2s;font-weight:600}
.primary-nav a:hover{background:var(--cj-border)}
.primary-nav .menu li{position:relative}
.primary-nav .menu .sub-menu{display:none;position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--cj-border);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.12);padding:10px 0;min-width:240px;z-index:30}
.primary-nav .menu li:hover > .sub-menu{display:block}
.primary-nav .menu li:hover > a{background:var(--cj-border);}
.primary-nav .menu .sub-menu li{padding:0}
.primary-nav .menu .sub-menu a{display:block;padding:12px 16px;border-radius:0;font-weight:600;color:#0f172a;white-space:nowrap}
.primary-nav .menu .sub-menu a:hover{background:var(--cj-border)}
.site-header{background:#f8f9fa;border-bottom:1px solid #e5e7eb;}
.header-inner{max-width:1200px;margin:0 auto;}
.header-actions{display:flex;align-items:center;gap:.6rem}
.header-actions button{background:none;border:1px solid var(--cj-border);border-radius:12px;padding:.45rem .5rem;display:grid;place-items:center;color:var(--cj-text)}
.mobile-dropdown{display:none;border-top:1px solid var(--cj-border);padding:0 1.5rem 1rem}
.mobile-dropdown .menu{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.mobile-dropdown a{padding:.75rem 1rem;border-radius:12px;background:var(--cj-card);border:1px solid var(--cj-border);display:block}

.search-modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center}
.search-modal[hidden]{display:none}
.search-overlay{position:absolute;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(4px)}
.search-box{position:relative;background:var(--cj-card);padding:1.5rem;border-radius:20px;box-shadow:var(--cj-shadow);width:min(640px,90%);border:1px solid var(--cj-border)}
.search-box form{display:flex;gap:.75rem}
.search-box input{flex:1;padding:.85rem 1rem;border-radius:12px;border:1px solid var(--cj-border);background:transparent;color:var(--cj-text)}
.search-box button[type="submit"]{padding:.85rem 1.25rem;border:none;border-radius:12px;background:var(--cj-primary);color:#fff;font-weight:700}
.search-close{position:absolute;top:12px;right:12px;background:none;border:none;font-size:1.5rem;color:var(--cj-text)}

.hero{padding:2.5rem 0}
.hero-inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;align-items:center;background:radial-gradient(circle at 10% 20%, rgba(77,171,247,.2), transparent 35%), radial-gradient(circle at 90% 10%, rgba(255,107,157,.18), transparent 30%);padding:2.5rem;border-radius:28px;border:1px solid var(--cj-border)}
.hero-copy h1{font-size:2.5rem;margin:.2rem 0}
.hero-actions{display:flex;gap:.8rem;margin:1.2rem 0}
.hero-actions .btn{min-width:150px;justify-content:center}
.hero-meta{display:flex;gap:.8rem;flex-wrap:wrap;color:var(--cj-muted);font-weight:600}
.hero-img{border-radius:22px;border:1px solid var(--cj-border);box-shadow:var(--cj-shadow);object-fit:cover;width:100%}
.home-hero{padding-bottom:0px;padding-top:32px}
.home-hero-card{max-width:1180px;margin:0 auto;background:transparent;border:none;box-shadow:none;}
.home-hero-card h1{font-size:34px;line-height:1.3;font-weight:700;color:#1f2937;margin-bottom:12px;}
.home-hero-card p{font-size:17px;line-height:1.7;color:#4b5563;margin:0 0 8px;}
.home-hero-card form{max-width:520px;margin-top:14px;}
.home-hero-card form input{
  height:48px;
  padding:0 52px 0 18px;
  border-radius:999px;
  /* box-shadow:0 16px 35px rgba(68,91,120,0.18), inset 0 1px 2px rgba(0,0,0,0.08); */
  border:1px solid #e6e9ef;
  background:#fff;
  color:#1f2937;
  font-size:16px;
}
.home-hero-card form input::placeholder{color:#9aa3af;}
.home-hero-card form button{
  width:44px;
  height:44px;
  right:4px;
  box-shadow:0 12px 24px rgba(77,144,226,0.35);
  background:linear-gradient(135deg,#4a90e2,#3b7ccd);
}
.home-hero .home-hero-card img{border-radius:28px;}

.btn{display:inline-flex;align-items:center;gap:.35rem;padding:.9rem 1.2rem;border-radius:12px;font-weight:700;border:1px solid transparent;transition:all .2s}
.btn.primary{background:var(--cj-primary);color:#fff;border-color:var(--cj-primary)}
.btn.primary:hover{background:var(--cj-primary-dark)}
.btn.ghost{background:transparent;border-color:var(--cj-border);color:var(--cj-text)}
.btn.sm{padding:.65rem .9rem;font-size:.9rem}
.btn.sm.ghost{background:transparent;border-color:var(--cj-border)}

.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem}
.card{background:var(--cj-card);border:1px solid var(--cj-border);border-radius:16px;box-shadow:var(--cj-shadow);overflow:hidden;display:flex;flex-direction:column}
.card-media{aspect-ratio:3/4;overflow:hidden}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.card:hover img{transform:scale(1.04)}
.card-body{padding:1rem;display:grid;gap:.4rem}
.card-body h3{margin:0;font-size:1.05rem}
.card-body .cat{color:var(--cj-muted);font-weight:600;font-size:.9rem}
.card-meta{display:flex;gap:.5rem;align-items:center;color:var(--cj-muted);font-size:.9rem}

.archive-hero{padding:2rem 0 1rem;border-bottom:1px solid var(--cj-border)}
.archive-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-end}
.archive-grid-inner{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.25rem;padding:1.25rem 0}
.archive-hero-box{background:linear-gradient(180deg,#e9f4ff 0%,#f8fbff 100%);padding:40px 16px;margin-bottom:20px;border-bottom:1px solid #e5e7eb;}
.archive-hero-inner{max-width:1180px;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.archive-hero-text h1{font-family:"Fredoka",cursive;font-size:42px;margin:0 0 12px;color:#1f2937}
.archive-eyebrow{font-weight:700;color:#4dabf7;margin:0 0 6px;text-transform:uppercase;letter-spacing:.05em}
.archive-lead{margin:0 0 16px;color:#4b5563;font-size:16px;line-height:1.6}
.archive-hero-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;background:#4dabf7;color:#fff;border-radius:12px;font-weight:700;box-shadow:0 10px 24px rgba(77,171,247,0.25);transition:transform .2s,box-shadow .2s}
.archive-hero-btn:hover{transform:translateY(-1px);box-shadow:0 12px 30px rgba(77,171,247,0.32)}
.archive-lead-clamp{
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.archive-hero-meta{align-self:flex-start;color:#0f172a;font-weight:600}
.archive-title{text-align:center;font-family:"Fredoka",cursive;font-size:28px;margin:30px 0 10px;color:#1f2937}
.archive-grid-inner{padding:20px 0;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.archive-grid-inner{padding:20px 0}
.archive-card{display:flex;flex-direction:column;gap:10px;background:#fff;border:1px solid #e5e7eb;border-radius:18px;box-shadow:0 14px 30px rgba(0,0,0,0.06);overflow:hidden;transition:transform .2s,box-shadow .2s}
.archive-card:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(0,0,0,0.08)}
.archive-card-media{aspect-ratio:3/4;background:#f5f5f5;display:flex;align-items:center;justify-content:center}
.archive-card-media img{width:100%;height:100%;object-fit:cover;filter:grayscale(0.1);transition:transform .3s}
.archive-card:hover .archive-card-media img{transform:scale(1.04)}
.archive-card-body{padding:10px 12px 14px;text-align:center}
.archive-card-title{margin:0;font-size:15px;color:#1f2937;font-weight:700}

@media (max-width:1024px){
  .archive-grid-inner{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:640px){
  .archive-grid-inner{grid-template-columns:repeat(1,minmax(0,1fr));}
}

.single-hero{padding:1.5rem 0;border-bottom:1px solid var(--cj-border)}
.single-layout{padding:1.5rem 0}
.single-grid{display:grid;grid-template-columns:2fr 1fr;gap:1.5rem;width:100%;max-width:1200px;margin:0 auto;padding:0 16px;align-items:start}

/* 侧边栏智能吸附样式 */
.single-sidebar{
  position:sticky;
  top:80px;
  max-height:calc(100vh - 100px);
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:#d1d5db transparent;
  transition: top 0.1s ease-out;
}
.single-sidebar::-webkit-scrollbar{
  width:6px;
}
.single-sidebar::-webkit-scrollbar-track{
  background:transparent;
}
.single-sidebar::-webkit-scrollbar-thumb{
  background:#d1d5db;
  border-radius:3px;
}
.single-sidebar::-webkit-scrollbar-thumb:hover{
  background:#9ca3af;
}

/* JavaScript 控制的状态类 */
.single-sidebar.sidebar-stick-top{
  position:sticky;
  top:80px;
}
.single-sidebar.sidebar-stick-bottom{
  position:sticky;
  top:var(--sidebar-top, 80px);
}
.single-sidebar.sidebar-scrolling{
  position:relative;
  top:var(--sidebar-offset, 0);
}
.single-thumb{border-radius:20px;overflow:hidden;border:1px solid var(--cj-border)}
.single-meta{display:flex;gap:.6rem;flex-wrap:wrap;margin:0.8rem 0}
.pill{padding:.4rem .8rem;border-radius:999px;border:1px solid var(--cj-border);font-weight:600;color:var(--cj-muted)}
.download-cta{display:flex;gap:.8rem;flex-wrap:wrap;margin:1rem 0}
.single-content{background:transparent;padding:0;border-radius:0;border:none;box-shadow:none;font-size:16px;line-height:1.8;color:#1f2937}
.single-content p{margin:0 0 32px}
.single-content h2{margin:1.4rem 0 0.6rem;font-size:28px;font-weight:700;line-height:1.3}
.single-content ul{padding-left:1.1rem;margin:0 0 1.1rem;list-style:disc}
.tags{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.tag{background:var(--cj-border);color:var(--cj-text)}
.sidebar{background:var(--cj-card);border:1px solid var(--cj-border);padding:1rem;border-radius:16px;box-shadow:var(--cj-shadow)}
.widget-title{margin-top:0}
.single-header{margin-bottom:1.5rem}
.single-title{margin:0.5rem 0 0;font-size:32px;color:#111827;font-weight:800;line-height:1.2}
.single-sidebar{display:flex;flex-direction:column;gap:1rem}
.sidebar-block{background:#fff;border:1px solid var(--cj-border);border-radius:16px;box-shadow:var(--cj-shadow);padding:1rem}
.sidebar-title{margin:0 0 .6rem;font-size:16px;font-weight:700;color:#111827}
.sidebar-list{display:flex!important;flex-direction:column!important;gap:16px!important;align-items:stretch!important}
.sidebar-item{display:grid!important;grid-template-columns:1.2fr 1.8fr!important;gap:12px!important;align-items:center!important;padding:12px!important;border-radius:14px!important;border:1px solid #e5e7eb!important;background:#fff!important;text-decoration:none!important;color:inherit!important;box-shadow:0 8px 18px rgba(0,0,0,0.06)!important;transition:background .18s,transform .18s,box-shadow .18s!important}
.sidebar-item:hover{background:#f8fafc!important;box-shadow:0 14px 28px rgba(0,0,0,0.1)!important;transform:translateY(-2px)!important}
.sidebar-thumb-wrap{position:relative!important;width:100%!important}
.sidebar-thumb{position:relative!important;width:100%!important;padding-bottom:56.25%!important;border-radius:12px!important;overflow:hidden!important;border:1px solid var(--cj-border)!important;background:#f3f4f6!important}
.sidebar-thumb img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;display:block!important}
.sidebar-text{display:flex!important;flex-direction:column!important;gap:8px!important;min-width:0!important}
.sidebar-name{margin:0!important;font-size:15px!important;font-weight:700!important;color:#111827!important;line-height:1.4!important}
.sidebar-cat{display:inline-block!important;font-size:12px!important;color:#4b5563!important;font-weight:600!important;line-height:1.2!important;background:#eef2f7!important;border-radius:999px!important;padding:5px 10px!important;text-decoration:none!important;cursor:pointer!important;transition:background .18s,color .18s!important}
.sidebar-cat:hover{background:#e2e8f0!important;color:#111827!important}
.sidebar-empty{margin:0;color:#6b7280;font-size:13px}
.single-hero-banner{position:relative;min-height:320px;background-size:cover;background-position:center;border-radius:24px;overflow:hidden;margin:0 auto 1.5rem;max-width:1200px}
.single-hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 60%,rgba(255,255,255,0.85) 100%);}
.single-hero-inner{position:absolute;left:0;right:0;bottom:0;padding:16px 18px;display:flex;flex-direction:column;gap:8px;color:#374151}
.single-hero-inner .cj-breadcrumb{margin:0;color:#374151;text-shadow:0 1px 2px rgba(255,255,255,0.8)}
.single-hero-inner .cj-breadcrumb a{color:#1f2937;font-weight:600}
.single-hero-inner .cj-breadcrumb a:hover{color:var(--cj-primary)}
.single-hero-cat{font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.08em;color:#1f2937;text-shadow:0 1px 2px rgba(255,255,255,0.8)}
.similar-posts{margin-top:1.5rem;width:100%;box-sizing:border-box}
.similar-title{font-family:"Fredoka",cursive;font-size:24px;margin:0 0 1.5rem;color:#111827}
.similar-wrapper{width:100%;box-sizing:border-box}
.similar-grid{display:flex;flex-wrap:wrap;gap:12px;width:100%;box-sizing:border-box;margin-bottom:1.5rem}
.similar-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;box-shadow:0 12px 28px rgba(0,0,0,0.06);transition:transform .2s,box-shadow .2s;text-decoration:none;color:inherit;flex:1 1 calc(25% - 12px);min-width:0}
.similar-card:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(0,0,0,0.08)}
.similar-card[style*="display: none"]{display:none!important}
.similar-thumb{aspect-ratio:4/3;background:#f5f5f5;overflow:hidden}
.similar-thumb img{width:100%;height:100%;object-fit:cover}
.similar-info{padding:10px 12px;flex:1}
.similar-name{margin:0;font-weight:700;font-size:15px;color:#111827;line-height:1.4}
.similar-controls{display:flex;align-items:center;justify-content:center;gap:12px}
.similar-prev,.similar-next{width:40px;height:40px;border-radius:10px;border:1px solid #d1d5db;background:#fff;color:#111;font-weight:700;font-size:20px;cursor:pointer;box-shadow:0 8px 18px rgba(0,0,0,0.08);transition:transform .15s,opacity .15s;display:flex;align-items:center;justify-content:center}
.similar-prev:hover:not(:disabled),.similar-next:hover:not(:disabled){transform:translateY(-1px)}
.similar-prev:disabled,.similar-next:disabled{opacity:.5;cursor:not-allowed}
.similar-dots{display:flex;gap:8px;align-items:center}
.similar-dot{width:12px;height:12px;border-radius:50%;border:none;background:#d1d5db;cursor:pointer;transition:background .2s;padding:0}
.similar-dot.active{background:#111827}
.similar-dot:hover{background:#6b7280}
.similar-empty{text-align:center;padding:2rem;color:#6b7280;margin:0}

@media (max-width:768px){
  .single-hero-banner{margin:0 12px 1rem;border-radius:18px;max-width:100%;overflow:hidden;box-sizing:border-box;width:calc(100% - 24px)}
  .single-title{padding:0 6px;font-size:26px;margin-top:0.4rem;line-height:1.3}
  .single-meta{padding:0 6px;margin:0.6rem 0}
  .single-content{margin:0;padding:0 6px}
  .tags{padding:0 6px}
  .similar-posts{padding:0 6px;margin-top:1.1rem}
  .similar-grid{gap:10px}
  .similar-card{flex:1 1 calc(50% - 10px)}
  .single-grid{grid-template-columns:1fr;gap:.85rem;padding:0 12px;width:100%;max-width:100%;box-sizing:border-box}
  .single-sidebar{gap:.8rem}
  .sidebar-block{padding:.85rem}
  .sidebar-list{gap:12px}
  .sidebar-item{grid-template-columns:1.1fr 1.7fr;gap:10px;padding:10px}
  .sidebar-thumb{border-radius:10px}
  .sidebar-name{font-size:14px;line-height:1.35}
  .sidebar-cat{padding:4px 9px;font-size:11.5px}
  .single-content img{max-width:100%;height:auto}
}

.site-footer{background:var(--cj-bg);border-top:1px solid var(--cj-border);}
.footer-inner{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;padding:2rem 1.5rem}
.footer-col h3{margin:.2rem 0 .8rem;font-family:"Fredoka",cursive}
.footer-col ul{list-style:none;padding:0;margin:0;display:grid;gap:.4rem}
.footer-col a{color:var(--cj-muted)}
.footer-col a:hover{color:var(--cj-primary)}
.footer-brand .tagline{color:var(--cj-muted);margin:.5rem 0}
.newsletter-form{display:grid;gap:.7rem}
.newsletter-form input{padding:.85rem 1rem;border-radius:12px;border:1px solid var(--cj-border);background:var(--cj-card);color:var(--cj-text)}
.newsletter-form button{padding:.9rem 1rem;border:none;border-radius:12px;background:var(--cj-primary);color:#fff;font-weight:700}
.footer-bottom{text-align:center;padding:1rem;border-top:1px solid var(--cj-border);color:var(--cj-muted)}

.cj-breadcrumb{color:var(--cj-muted);font-weight:600}
.cj-breadcrumb a{color:var(--cj-primary)}

@media (max-width:960px){
  .header-inner{padding:.75rem 1rem}
  .primary-nav{display:none}
  .menu-toggle{display:inline-flex!important}
  .header-actions{gap:.4rem}
  .mobile-dropdown{display:none;border-top:none;padding:0;background:#fff;}
  .mobile-dropdown.open{display:block;padding:1rem 1rem 1rem 1rem;}
  .mobile-dropdown .menu{gap:.2rem}
  .mobile-dropdown .menu a{border-radius:10px}
  .single-grid{grid-template-columns:1fr;gap:1rem}
  /* 移动端禁用侧边栏吸附 */
  .single-sidebar{
    position:relative !important;
    top:auto !important;
    max-height:none !important;
    overflow-y:visible !important;
  }
}
@media (max-width:640px){
  .hero-inner{padding:1.5rem}
  .card-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
  .archive-grid-inner{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
  .single-hero-banner{margin:0 8px 1rem;width:calc(100% - 16px);border-radius:16px;box-sizing:border-box}
  .single-grid{padding:0 8px;box-sizing:border-box}
  .single-title{font-size:22px;padding:0 8px;margin-top:0.3rem;line-height:1.3}
  .single-meta{padding:0 8px;margin:0.6rem 0}
  .single-content{padding:0 8px;font-size:15px}
  .tags{padding:0 8px}
  .similar-posts{padding:0 8px}
  .similar-grid{gap:8px}
  .similar-card{flex:1 1 100%}
  .similar-title{font-size:20px;margin-bottom:1rem}
  .similar-name{font-size:14px}
  .similar-prev,.similar-next{width:36px;height:36px;font-size:18px}
  .similar-dot{width:10px;height:10px}
  .single-content h2{font-size:18px}
  .single-content p{margin:0 0 28px}
  .sidebar-item{grid-template-columns:1.1fr 1.7fr;gap:8px;padding:8px}
  .sidebar-name{font-size:13px}
}

@media (max-width:480px){
  .single-grid{padding:0 6px;box-sizing:border-box}
  .single-hero-banner{margin:0 6px 0.8rem;width:calc(100% - 12px);box-sizing:border-box}
  .single-title{font-size:18px;padding:0 6px;margin-top:0.3rem}
  .single-meta{padding:0 6px;margin:0.4rem 0}
  .single-content{padding:0 6px;font-size:14px}
  .single-content p{margin:0 0 24px}
  .tags{padding:0 6px}
  .similar-posts{padding:0 6px}
  .similar-card{flex:1 1 100%}
  .similar-title{font-size:18px;margin-bottom:1rem}
  .similar-prev,.similar-next{width:32px;height:32px;font-size:16px}
  .similar-dot{width:8px;height:8px}
  .similar-controls{gap:8px}
  .sidebar-item{gap:6px;padding:6px}
  .sidebar-name{font-size:12px}
}

/* ==========================================================================
   Search Results Page Styles
   搜索结果页面样式
   ========================================================================== */

/* 重置搜索页面可能继承的卡片样式 */
body.search .site-main,
body.search-results .site-main,
body.search-no-results .site-main {
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  margin: 0;
  padding: 0;
}

/* Search Page Container - 确保页面填满视口 */
.search-results-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  background: var(--cj-bg);
  border: none;
  border-radius: 0;
  box-shadow: none;
  margin: 0;
}

.search-results-wrapper > .container {
  flex: 1;
}

/* Search Hero Section */
.search-hero-box {
  background: linear-gradient(180deg, #e9f4ff 0%, #f8fbff 100%);
  padding: 40px 16px;
  margin-bottom: 20px;
  border-bottom: 1px solid #e5e7eb;
}

.search-hero-inner {
  max-width: 1180px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}

.search-hero-text h1 {
  font-family: "Fredoka", cursive;
  font-size: 42px;
  margin: 0 0 12px;
  color: #1f2937;
}

.search-eyebrow {
  font-weight: 700;
  color: #4dabf7;
  margin: 0 0 6px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 14px;
}

.search-lead {
  margin: 0;
  color: #4b5563;
  font-size: 16px;
  line-height: 1.6;
}

/* Search Section Title */
.search-section-title {
  text-align: left;
  font-family: "Fredoka", cursive;
  font-size: 24px;
  margin: 30px 0 10px;
  color: #1f2937;
  font-weight: 600;
}

/* Search Results Grid */
.search-grid-inner {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  padding: 20px 0;
}

.search-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
  text-decoration: none;
  color: inherit;
}

.search-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.08);
}

.search-card-media {
  aspect-ratio: 3/4;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.search-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s;
}

.search-card:hover .search-card-media img {
  transform: scale(1.04);
}

.search-card-body {
  padding: 10px 12px 14px;
  text-align: center;
}

.search-card-title {
  margin: 0;
  font-size: 15px;
  color: #1f2937;
  font-weight: 700;
  line-height: 1.4;
}

/* No Results State - 使用 search-empty-state 避免与 body.search-no-results 冲突 */
.search-empty-state {
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 20px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 24px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.search-empty-icon {
  color: #d1d5db;
  margin-bottom: 24px;
}

.search-empty-icon svg {
  width: 80px;
  height: 80px;
}

.search-empty-state h3 {
  font-family: "Fredoka", cursive;
  font-size: 28px;
  color: #1f2937;
  margin: 0 0 12px;
}

.search-empty-state p {
  color: #6b7280;
  font-size: 16px;
  max-width: 480px;
  margin: 0 auto 24px;
  line-height: 1.6;
}

.search-empty-actions {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Pagination */
.search-grid-inner + .pagination {
  margin-top: 30px;
  margin-bottom: 40px;
}

/* Search Suggestions Section */
.search-suggestions {
  background: #f8f9fa;
  padding: 48px 0;
  margin-top: 40px;
  border-top: 1px solid #e5e7eb;
}

.search-suggestions-title {
  font-family: "Fredoka", cursive;
  font-size: 24px;
  color: #1f2937;
  margin: 0 0 24px;
  text-align: center;
}

.search-suggestions-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.search-suggestion-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
  text-decoration: none;
  color: inherit;
}

.search-suggestion-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
}

.search-suggestion-media {
  aspect-ratio: 4/3;
  background: #f5f5f5;
  overflow: hidden;
}

.search-suggestion-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s;
}

.search-suggestion-card:hover .search-suggestion-media img {
  transform: scale(1.04);
}

.search-suggestion-body {
  padding: 10px 12px;
  text-align: center;
}

.search-suggestion-body h4 {
  margin: 0;
  font-size: 14px;
  color: #1f2937;
  font-weight: 600;
  line-height: 1.3;
}

/* Responsive Styles */
@media (max-width: 1024px) {
  .search-grid-inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  
  .search-suggestions-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .search-hero-box {
    padding: 30px 16px;
  }
  
  .search-hero-text h1 {
    font-size: 32px;
  }
  
  .search-section-title {
    font-size: 20px;
    margin: 20px 0 10px;
  }
  
  .search-grid-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
  
  .search-suggestions-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  
  .search-empty-state {
    padding: 40px 16px;
  }
  
  .search-empty-state h3 {
    font-size: 24px;
  }
  
  .search-empty-icon svg {
    width: 64px;
    height: 64px;
  }
}

@media (max-width: 480px) {
  .search-hero-box {
    padding: 24px 12px;
  }
  
  .search-hero-text h1 {
    font-size: 26px;
  }
  
  .search-eyebrow {
    font-size: 12px;
  }
  
  .search-lead {
    font-size: 14px;
  }
  
  .search-section-title {
    font-size: 18px;
  }
  
  .search-grid-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 16px 0;
  }
  
  .search-card {
    border-radius: 14px;
  }
  
  .search-card-body {
    padding: 8px 10px 12px;
  }
  
  .search-card-title {
    font-size: 13px;
  }
  
  .search-suggestions {
    padding: 32px 0;
  }
  
  .search-suggestions-title {
    font-size: 20px;
    margin-bottom: 16px;
  }
  
  .search-suggestions-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  
  .search-suggestion-card {
    border-radius: 12px;
  }
  
  .search-suggestion-body {
    padding: 8px 10px;
  }
  
  .search-suggestion-body h4 {
    font-size: 12px;
  }
  
  .search-empty-state {
    padding: 30px 12px;
    border-radius: 18px;
  }
  
  .search-empty-state h3 {
    font-size: 20px;
  }
  
  .search-empty-state p {
    font-size: 14px;
  }
  
  .search-empty-actions {
    flex-direction: column;
    align-items: center;
  }
  
  .search-empty-actions .btn {
    width: 100%;
    max-width: 200px;
    justify-content: center;
  }
}