/* 骨架 f7：列表优先（无 hero，首屏直接信息流，横线分隔的密集列表）
   特征：全站以"日期 | 标题 | 阅读"的横向列表行组织，没有卡片盒子 */
.f7-wrap { max-width: var(--width); margin: 0 auto; padding: 0 20px; }

.f7-hd { background: var(--card); border-bottom: 2px solid var(--txt); }
.f7-hd-in { display: flex; align-items: center; gap: 26px; min-height: 58px; flex-wrap: wrap; }
.f7-logo { display: flex; align-items: baseline; gap: 9px; }
.f7-logo i { font-style: normal; color: var(--brand); font-size: 17px; }
.f7-logo b { font-size: 19px; letter-spacing: .5px; color: var(--txt); }
.f7-logo span { font-size: 11px; color: #9ca3af; letter-spacing: 1px; }
.f7-nav { display: flex; gap: 20px; margin-left: auto; flex-wrap: wrap; }
.f7-nav a { font-size: 13.5px; color: var(--mut); padding: 4px 0; border-bottom: 2px solid transparent; }
.f7-nav a:hover { color: var(--brand); }
.f7-nav a.on { color: var(--brand); border-bottom-color: var(--brand); }

.f7-sub { background: var(--brand-l); border-bottom: 1px solid var(--line); font-size: 11.5px; }
.f7-sub-in { display: flex; align-items: center; justify-content: space-between; height: 32px; gap: 14px; }
.f7-sub-l { color: var(--brand-d); letter-spacing: 1px; white-space: nowrap; }
.f7-sub-r { display: flex; gap: 12px; overflow: hidden; }
.f7-sub-r a { color: var(--mut); white-space: nowrap; }
.f7-sub-r a:hover { color: var(--brand); }

.f7-main { padding-top: 20px; padding-bottom: 14px; }
.f7-crumb { font-size: 12px; color: var(--mut); margin-bottom: 12px; }
.f7-crumb a { color: var(--brand); }
.f7-bar { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 2px solid var(--txt); flex-wrap: wrap; }
.f7-bar h1 { font-size: 25px; letter-spacing: .5px; line-height: 1.25; }
.f7-bar p { font-size: 12.5px; color: var(--mut); margin-top: 6px; }
.f7-bar-a { font-size: 12.5px; color: var(--brand); white-space: nowrap; }

.f7-sect { margin-top: 22px; }
.f7-sect-h { display: flex; align-items: center; gap: 9px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.f7-dot { width: 8px; height: 8px; background: var(--brand); display: inline-block; flex: none; }
.f7-sect-h h2 { font-size: 16px; letter-spacing: .5px; }
.f7-sect-h a { margin-left: auto; font-size: 12.5px; color: var(--brand); }
.f7-sect-m { margin-left: auto; font-size: 11.5px; color: #a1a1aa; }

.f7-rows { list-style: none; }
.f7-rows li { display: flex; align-items: baseline; gap: 14px; padding: 10px 0; border-bottom: 1px dotted var(--line); }
.f7-rows li:last-child { border-bottom: 0; }
.f7-rows li > a { flex: 1; min-width: 0; font-size: 15px; line-height: 1.55; color: var(--txt); }
.f7-rows li > a:hover { color: var(--brand); }
.f7-d { flex: none; width: 60px; font-size: 12px; color: #9ca3af; font-family: Consolas, "Courier New", monospace; line-height: 1.9; }
.f7-d i { display: block; font-style: normal; font-size: 10.5px; color: #c3cad3; }
.f7-d-n { font-size: 15px; color: var(--brand); font-weight: 700; }
.f7-v { flex: none; font-size: 11.5px; color: #a1a1aa; }

.f7-rows-lg li { align-items: flex-start; padding: 14px 0; }
.f7-row-b { flex: 1; min-width: 0; }
.f7-row-b a { font-size: 16px; line-height: 1.55; color: var(--txt); font-weight: 500; }
.f7-row-b a:hover { color: var(--brand); }
.f7-row-b p { font-size: 13px; color: var(--mut); line-height: 1.8; margin-top: 5px; }
.f7-row-b em { font-style: normal; display: block; font-size: 11.5px; color: #a1a1aa; margin-top: 5px; }

.f7-rows-hot li { align-items: center; padding: 8px 0; }
.f7-hn { flex: none; width: 20px; text-align: center; font-size: 12px; color: #b6bfca; font-weight: 700; }
.f7-hn.hot { color: var(--brand); }

.f7-more { display: flex; gap: 18px; padding: 14px 0 4px; font-size: 12.5px; border-top: 1px dotted var(--line); margin-top: 4px; }
.f7-more a { color: var(--brand); }

.f7-two { display: grid; grid-template-columns: 1.5fr 1fr; gap: 34px; }
.f7-sect-wide { grid-column: 1 / -1; }
.f7-tags { padding: 10px 0; }
.f7-tags a { display: inline-block; font-size: 12px; padding: 3px 9px; margin: 0 7px 7px 0; border: 1px solid var(--line); color: var(--mut); background: var(--card); }
.f7-tags a:hover { border-color: var(--brand); color: var(--brand); }
.f7-sites { display: flex; flex-wrap: wrap; gap: 4px 20px; padding: 10px 0; }
.f7-sites a { font-size: 13px; color: var(--txt); }
.f7-sites a:hover { color: var(--brand); }
.f7-sites-lg a { font-size: 13.5px; width: calc(25% - 20px); }

.f7-pager { display: flex; gap: 6px; padding: 14px 0 4px; flex-wrap: wrap; border-top: 1px dotted var(--line); margin-top: 4px; }
.f7-pager a, .f7-pager span.on { min-width: 32px; text-align: center; padding: 5px 10px; font-size: 12.5px; border: 1px solid var(--line); color: var(--txt); background: var(--card); }
.f7-pager a:hover { border-color: var(--brand); color: var(--brand); }
.f7-pager span.on { background: var(--txt); border-color: var(--txt); color: #fff; }

.f7-art { padding: 4px 0 6px; }
.f7-art h1 { font-size: 28px; line-height: 1.45; letter-spacing: .5px; }
.f7-art-meta { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; font-size: 12px; color: #9ca3af; margin: 14px 0 20px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.f7-art-tag { background: var(--brand-l); color: var(--brand-d); padding: 2px 9px; }
.f7-art-cover { margin-bottom: 20px; }
.f7-art-cover img { width: 100%; display: block; }
.f7-art-body p { font-size: 16px; line-height: 1.95; color: #374151; margin: 12px 0; }
.f7-art-body h2 { font-size: 19px; margin: 24px 0 10px; }
.f7-art-body h2::before { content: '■ '; color: var(--brand); font-size: 12px; vertical-align: 2px; }
.f7-art-body h3 { font-size: 16.5px; margin: 18px 0 8px; }
.f7-art-tags { border-top: 1px dotted var(--line); margin-top: 18px; padding-top: 14px; }
.f7-art-note { font-size: 13px; color: var(--mut); line-height: 1.9; margin: 8px 0; }

.f7-pn { display: flex; flex-direction: column; gap: 0; margin-top: 16px; border-top: 1px solid var(--line); }
.f7-pn a { font-size: 13.5px; color: var(--txt); padding: 11px 0; border-bottom: 1px dotted var(--line); }
.f7-pn a span { color: var(--mut); font-size: 12px; margin-right: 10px; }
.f7-pn a:hover { color: var(--brand); }

.f7-ft { margin-top: 36px; border-top: 1px solid var(--line); padding: 18px 0 28px; }
.f7-ft-row { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; font-size: 12.5px; }
.f7-ft-row a { color: var(--mut); }
.f7-ft-row a:hover { color: var(--brand); }
.f7-ft-cp { margin-left: auto; font-size: 11.5px; color: #b6bfca; }
.f7-ft-links { font-size: 11.5px; color: #a1a1aa; line-height: 2.1; margin-top: 10px; }
.f7-ft-links a { color: #a1a1aa; margin-right: 12px; }
.f7-ft-links a:hover { color: var(--brand); }

@media (max-width: 860px) {
  .f7-two { grid-template-columns: 1fr; gap: 10px; }
  .f7-nav { gap: 14px; margin-left: 0; }
  .f7-bar h1 { font-size: 21px; }
  .f7-art h1 { font-size: 22px; }
  .f7-d { width: 48px; }
  .f7-sites-lg a { width: calc(50% - 20px); }
  .f7-ft-cp { margin-left: 0; }
}