:root { --max-w: 1200px; }
* { box-sizing: border-box; }
body { font: 14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"; color:#111; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

.july-container { width: min(100%, var(--max-w)); margin: 0 auto; padding: 0 16px; }

/* 头部（更扁平更低） */
.july-header{position:sticky;top:0;z-index:1000;border-bottom:1px solid rgba(0,0,0,.08);line-height:1}
.july-header .july-container{padding-top:0;padding-bottom:0}
.july-header-inner{height:40px;display:flex;align-items:center;justify-content:space-between}
.july-logo img{max-height:24px;height:auto;width:auto}.july-logo .site-title{font-weight:700;color:var(--july-header-text);font-size:14px;line-height:1;margin:0}

/* === Hamburger 动画：三条线 ↔ ×（沿用你这段） === */
.july-hamburger{position:relative;width:24px;height:16px;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:transparent;border:0;appearance:none;-webkit-appearance:none;outline:none;box-shadow:none;-webkit-tap-highlight-color:transparent}.july-hamburger .bar{position:absolute;left:0;right:0;height:2px;background:var(--july-menu-icon);display:block;border-radius:1px;transition:transform .2s ease,opacity .2s ease,top .2s ease}
.july-hamburger .bar:nth-child(1){top:0}
.july-hamburger .bar:nth-child(2){top:7px}
.july-hamburger .bar:nth-child(3){top:14px}
.july-hamburger.is-open .bar:nth-child(1){top:7px;transform:rotate(45deg)}
.july-hamburger.is-open .bar:nth-child(2){opacity:0}
.july-hamburger.is-open .bar:nth-child(3){top:7px;transform:rotate(-45deg)}
@media (prefers-reduced-motion:reduce){.july-hamburger .bar{transition:none}}

/* 主体：底部留出空间 + 底栏高度 */
.july-main { padding: 16px 0 72px; }

/* 轮播预留位（上边距小点，保持紧凑） */
#july-carousel-slot.july-carousel-slot { margin: 8px 0 12px; }

/* 分类筛选 2x2（扁平化 · 降低高度 · 减小字体） */
.july-cat-filter{margin:16px 0 14px}
.july-cat-filter .grid-2x2{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:30px;gap:3px}
/* 原有一行里把 transition 加上 transform，并新增按下态 */
.july-cat-filter .filter-item{display:flex;align-items:center;justify-content:center;padding:0 6px;font-size:13px;line-height:1;border-radius:3px;background:var(--july-filter-inactive-bg);color:var(--july-filter-inactive-text);border:1px solid rgba(0,0,0,.06);transition:transform .12s cubic-bezier(.2,.7,.2,1),background-color .15s ease,color .15s ease,border-color .15s ease}
/* 按下时缩小一圈（约等于 30px 高度里减少 ~2px 的视觉效果） */
.july-cat-filter .filter-item.is-pressed{transform:scale(.94)}
/* 激活态不缩小（点击后成为 active 时保持正常大小） */
.july-cat-filter .filter-item.active{background:var(--july-filter-active-bg);color:var(--july-filter-active-text);border-color:rgba(0,0,0,.12);transform:none}.july-cat-filter .filter-item.active{background:var(--july-filter-active-bg);color:var(--july-filter-active-text);border-color:rgba(0,0,0,.12)}
.july-cat-filter .filter-item.placeholder{opacity:.35;pointer-events:none}

/* 容器：离场/入场/完成 */
.july-posts{will-change:opacity,transform}
.july-posts.is-leave{opacity:.0;transform:translateY(6px);transition:opacity .16s ease,transform .16s ease}
.july-posts.is-enter{opacity:.01;transform:translateY(6px)}
.july-posts.is-fadein{opacity:1;transform:none;transition:opacity .24s cubic-bezier(.2,.7,.2,1),transform .24s cubic-bezier(.2,.7,.2,1)}

/* 卡片：只在入场阶段先隐藏，完成后显示 */
.july-posts.is-enter .july-card{opacity:0;transform:translateY(8px)}
.july-posts.is-fadein .july-card{opacity:1;transform:none;transition:opacity .28s cubic-bezier(.2,.7,.2,1),transform .28s cubic-bezier(.2,.7,.2,1)}

/* 级联延迟（前 8 个即可） */
.july-posts.is-fadein .july-card:nth-child(1){transition-delay:20ms}
.july-posts.is-fadein .july-card:nth-child(2){transition-delay:40ms}
.july-posts.is-fadein .july-card:nth-child(3){transition-delay:60ms}
.july-posts.is-fadein .july-card:nth-child(4){transition-delay:80ms}
.july-posts.is-fadein .july-card:nth-child(5){transition-delay:100ms}
.july-posts.is-fadein .july-card:nth-child(6){transition-delay:120ms}
.july-posts.is-fadein .july-card:nth-child(7){transition-delay:140ms}
.july-posts.is-fadein .july-card:nth-child(8){transition-delay:160ms}

/* 列表网格：PC 双列 */
.posts-grid { display:grid; grid-template-columns: 1fr; gap: 14px; opacity:1; transition: opacity .18s ease; }
@media (min-width: 992px) { .posts-grid.is-home { grid-template-columns: 1fr 1fr; } }
.posts-grid.is-loading { opacity:.25; pointer-events:none; }
.posts-grid.is-fadein { opacity:1; }

/* 文章大卡片 */
.july-card { position:relative; background:#fff; border-radius:18px; padding:14px; box-shadow:0 2px 12px rgba(0,0,0,.05); overflow:hidden; }
.july-card .cover-link { position:absolute; inset:0; z-index:1; }
.july-card-top { position:relative; z-index:2; display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.july-card-top .avatar { width: var(--july-card-avatar-size); height: var(--july-card-avatar-size); border-radius:50%; object-fit:cover; }
.july-card-top .meta { display:flex; flex-direction:column; justify-content:center; }
.july-card-top .meta .nick { font-weight:700; color:#000; font-size: var(--july-card-nickname-size); line-height:1.1; }
.july-card-top .meta .time { font-size: var(--july-card-time-size); color:#666; margin-top:3px; }

.july-card-middle { position:relative; z-index:2; margin-bottom:10px; }
.july-card-middle .excerpt { font-size: var(--july-card-excerpt-size); color:#111; }
.july-card-middle .excerpt p { margin: 0 0 8px; }
.july-card-middle .excerpt ul, .july-card-middle .excerpt ol { margin: 0 0 8px 18px; }
.july-card-middle .excerpt blockquote { margin: 8px 0; padding-left:10px; border-left:3px solid #e5e5e5; color:#444; }
.july-card-middle .readmore { text-decoration: none; color: #1d9bcc; font-weight:400; }
.july-card-tags { margin-top:6px; }
.july-card-tags .hashtag { color:#1d9bcc; margin-right:8px; font-size: 13px; }

/* 九宫格 / 推特式布局（仅外层圆角） */
.july-card-bottom { position:relative; z-index:2; }
.july-gallery { display:grid; gap: var(--july-image-gap); border-radius: var(--july-image-radius); overflow:hidden; }
.july-gallery .tile { position:relative; }
.july-gallery .tile img { width:100%; height:100%; object-fit:cover; display:block; }

/* 1~4 特殊；5~9 密集 */
.july-gallery.count-1 { grid-template-columns: 1fr; }
.july-gallery.count-1 .tile { aspect-ratio: 16 / 9; }
.july-gallery.count-2 { grid-template-columns: 1fr 1fr; }
.july-gallery.count-2 .tile { aspect-ratio: 1 / 1; }
.july-gallery.count-3 { grid-template-columns: 2fr 1fr; grid-auto-rows:1fr; }
.july-gallery.count-3 .tile-1 { grid-row:1 / span 2; aspect-ratio:3 / 4; }
.july-gallery.count-3 .tile-2, .july-gallery.count-3 .tile-3 { aspect-ratio:1 / 1; }
.july-gallery.count-4 { grid-template-columns:1fr 1fr; }
.july-gallery.count-4 .tile { aspect-ratio:1 / 1; }
.july-gallery.count-5, .july-gallery.count-6 { grid-template-columns:1fr 1fr 1fr; }
.july-gallery.count-5 .tile-1 { grid-column:1 / span 3; aspect-ratio:16 / 9; }
.july-gallery.count-5 .tile-2, .july-gallery.count-5 .tile-3, .july-gallery.count-5 .tile-4, .july-gallery.count-5 .tile-5 { aspect-ratio:1 / 1; }
.july-gallery.count-6 .tile { aspect-ratio:1 / 1; }
.july-gallery.count-7 { grid-template-columns:2fr 1fr 1fr; }
.july-gallery.count-7 .tile-1 { grid-row:1 / span 3; aspect-ratio:3 / 4; }
.july-gallery.count-7 .tile-2, .july-gallery.count-7 .tile-3, .july-gallery.count-7 .tile-4, .july-gallery.count-7 .tile-5, .july-gallery.count-7 .tile-6, .july-gallery.count-7 .tile-7 { aspect-ratio:1 / 1; }
.july-gallery.count-8 { grid-template-columns:repeat(4, 1fr); }
.july-gallery.count-8 .tile { aspect-ratio:1 / 1; }
.july-gallery.count-9 { grid-template-columns:repeat(3, 1fr); }
.july-gallery.count-9 .tile { aspect-ratio:1 / 1; }
.july-gallery .tile .more { position:absolute; inset:0; background:rgba(0,0,0,.35); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:28px; }

/* 分页器 */
.july-pagination { margin-top: 12px; display:flex; flex-wrap:wrap; gap:8px; }
.july-pagination a, .july-pagination span {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:34px; height:34px; padding:0 8px; border-radius:8px;
  background: var(--july-pagination-bg); color: var(--july-pagination-text);
}
.july-pagination .current { background:#333; color:#fff; }

/* 面包屑 */

/* 单页卡片 */
.july-single-card { background:#fff; border-radius:18px; padding:16px; box-shadow:0 2px 12px rgba(0,0,0,.05); }
.july-single-title { margin:0 0 6px; font-size:26px; font-weight:800; color:#000; }
.july-single-time { font-size:13px; color:#666; margin-bottom: 10px; }
.july-single-content { color:#333; }
.july-single-footer { margin-top: 14px; }
.july-single-footer .meta-line { display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; }
.july-single-footer .cats { display:flex; align-items:center; flex-wrap:wrap; gap:6px; }
.july-single-footer .cats .icon-folder { display:inline-flex; align-items:center; color:#666; margin-right:2px; }
.july-single-footer .pill { display:inline-flex; align-items:center; height:26px; padding:0 10px; background:#f1f1f1; color:#333; border-radius:999px; }
.july-single-footer .pill a { color: inherit; }

/* 单页标签：#标签 样式 */
.july-single-footer .hashtags .hashtag,
.july-card-tags .hashtag { color:#1d9bcc; text-decoration:none; margin-right:8px; }
.july-single-footer .hashtags .hashtag:hover,
.july-card-tags .hashtag:hover { text-decoration: underline; }

/* 评论区 */
.july-comments { margin-top:20px; }
.july-comments-title { font-size:18px; font-weight:700; margin-bottom:10px; }
.comment-list { list-style:none; margin:0; padding:0; }
.july-comment { padding: 10px 0; border-bottom:1px solid #eee; }
.july-comment-body { display:flex; gap:10px; }
.july-comment-avatar { border-radius:50%; }
.july-comment-main { flex:1; }
.july-comment-meta { display:flex; align-items:center; gap:8px; font-size:13px; color:#666; margin-bottom:4px; }
.july-comment-meta .author { color:#000; }
.july-comment-content { font-size:14px; color:#222; }
.july-comment-actions a { font-size:12px; color:#555; text-decoration: underline; }
.july-comment-form .field { margin-bottom: 8px; }
.july-comment-form .field label { display:block; font-size:13px; margin-bottom: 4px; color:#444; }
.july-comment-form input[type="text"],
.july-comment-form input[type="email"],
.july-comment-form input[type="url"],
.july-comment-form textarea {
  width:100%; border:1px solid #ddd; border-radius:8px; padding:8px 10px; outline:none;
}
.july-comment-form .btn-submit { background: var(--july-pagination-bg); color: var(--july-pagination-text); border:0; border-radius:8px; padding:8px 14px; cursor:pointer; }

/* 页脚（收紧内边距） */
.july-footer{margin-top:18px;padding:12px 0;font-size:var(--july-footer-font-size);text-align:center}
.july-footer-inner{display:flex;flex-direction:column;gap:6px;justify-content:center;align-items:center}
.july-footer a{color:inherit;text-decoration:none}

/* 抽屉 */
body.july-drawer-open { overflow: hidden; }
.july-drawer { position: fixed; top:0; left:0; bottom:0; width: var(--july-drawer-width); background:#fff; transform: translateX(-100%); transition: transform .2s ease; z-index:2000; box-shadow:2px 0 12px rgba(0,0,0,.12); }
.july-drawer-header { display:flex; align-items:center; justify-content:space-between; padding: 12px 16px; border-bottom:1px solid #eee; }
.july-drawer-body { padding: 10px 16px; overflow:auto; height: calc(100% - 48px); }
.july-drawer-close { background:none; border:0; font-size:26px; line-height:1; cursor:pointer; }
.july-drawer-backdrop { position: fixed; inset:0; background: rgba(0,0,0,.25); opacity:0; pointer-events:none; transition: opacity .2s ease; z-index:1990; }
body.july-drawer-open .july-drawer { transform: translateX(0); }
body.july-drawer-open .july-drawer-backdrop { opacity:1; pointer-events:auto; }

/* 搜索弹窗 */
.july-search-overlay { position:fixed; inset:0; background: rgba(0,0,0,.25); display:none; z-index:2100; align-items:center; justify-content:center; }
.july-search-overlay.open { display:flex; }
.july-search-box { width: min(680px, 92vw); backdrop-filter: blur(10px); background: rgba(255,255,255,.6); border-radius:14px; padding:10px; box-shadow:0 4px 18px rgba(0,0,0,.12); }
.july-search-box form { display:flex; gap:8px; }
.july-search-box input[type="search"] { flex:1; border:1px solid #ddd; border-radius:999px; padding:10px 14px; outline:none; background: rgba(255,255,255,.85); }
.july-search-submit { border:0; border-radius:999px; padding:0 16px; background: var(--july-pagination-bg); color: var(--july-pagination-text); }

/* 视口底部四按钮（滚动隐藏） */
.july-bottom-bar{position:fixed;left:0;right:0;bottom:0;z-index:1200;background:var(--july-bottom-bg);backdrop-filter:none;border-top:1px solid rgba(0,0,0,.12);display:grid;grid-template-columns:repeat(4,1fr);transition:transform .2s ease,opacity .2s ease}
.july-bottom-bar.hidden{transform:translateY(100%);opacity:0;pointer-events:none}
.july-bottom-bar .bb-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4px 0;gap:2px;color:var(--july-bottom-icon);background:none;border:0;cursor:pointer;line-height:1.1}
.july-bottom-bar .bb-item svg{fill:currentColor}

@media (hover:hover) {
  .july-cat-filter .filter-item:hover { transform: translateY(-1px); }
  .july-hamburger:hover .bar { opacity:.85; }
  .july-pagination a:hover { filter: brightness(0.95); }
}

/* 无文章 / 404 */
.no-posts { padding: 16px; text-align: center; color:#666; }
.july-notfound { padding: 46px 0; text-align: center; }
.july-notfound h1 { font-size: 42px; margin: 0 0 10px; }