/* ═══ 更新日志列表页（/releases/）—— 亮色版 ═══ */
.rl-hero { padding: calc(var(--nav-h) + 56px) 0 18px; }
.rl-hero h1 {
  font-size: clamp(30px, 4.2vw, 46px); font-weight: 800;
  color: var(--ink);
  display: inline-block;
}
.rl-hero p { color: var(--muted); margin-top: 10px; font-size: 15.5px; }
.rl-hero b { color: var(--ink); font-variant-numeric: tabular-nums; }

.rl-filter {
  display: flex; flex-wrap: wrap; gap: 10px;
  padding: 16px 0 6px;
  position: sticky; top: var(--nav-h); z-index: 30;
  background: var(--sticky-bg);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.rl-chip {
  font-family: var(--font);
  font-size: 13px; color: var(--muted); line-height: 1;
  border: 1px solid var(--line); border-radius: 999px;
  padding: 8px 15px; background: var(--paper);
  cursor: pointer;
  transition: color 0.18s var(--ease), border-color 0.18s var(--ease), background-color 0.18s var(--ease);
}
.rl-chip:hover { color: var(--brand-deep); border-color: var(--brand-line); }
.rl-chip-on { color: var(--btn-solid-ink) !important; background: var(--btn-solid-bg); border-color: transparent !important; font-weight: 600; }

.rl-list { list-style: none; margin: 0; padding: 0; min-height: 1080px; }
/* O07：首屏骨架高度要贴近真实列表，否则数据一到就把下面的内容顶下去。
   实测移动端：骨架占 1080px、真实列表 1459px，合计约 430px 的跳变。
   列表按移动端真实高度预留。 */
@media (max-width: 860px) {
  .rl-list { min-height: 1460px; }
  /* 真正的位移大头在这里：项目筛选有 18 个 chip，在 390px 宽下换行成 9 排、
     高 712px，数据一到就把整个列表推下去（实测 CLS 0.479）。
     移动端改成横向滚动单行 —— 高度恒定 46px，顺带省掉「先滑 9 排按钮」的麻烦。 */
  .rl-filter {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .rl-filter::-webkit-scrollbar { display: none; }
  .rl-filter > * { flex: 0 0 auto; }
}
.rl-list::before {
  content: ""; position: absolute; left: 5px; top: 10px; bottom: 10px;
  width: 1px;
  background: var(--tl-rail);
}
.rl-item { position: relative; padding: 0 0 26px 30px; }
.rl-item::before {
  content: ""; position: absolute; left: 0; top: 8px;
  width: 11px; height: 11px; border-radius: 50%;
  background: var(--paper); border: 2px solid var(--brand);
}
.rl-item:first-child::before { background: var(--brand); box-shadow: var(--tl-dot-halo); }
.rl-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.rl-v { font-size: 15.5px; font-weight: 700; color: var(--brand-deep); }
.rl-proj { font-size: 14.5px; font-weight: 600; color: var(--ink); }
.rl-date { font-size: 12px; color: var(--dim); white-space: nowrap; }
.rl-note {
  color: var(--muted); font-size: 13.5px; line-height: 1.65; margin-top: 5px;
  text-wrap: pretty;
}
.rl-link { font-size: 12.5px; color: var(--brand); }
.rl-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.rl-foot { display: flex; align-items: center; gap: 16px; margin-top: 7px; }
.rl-perma { font-size: 12.5px; color: var(--dim); text-decoration: none; border-bottom: 1px dashed var(--line-hi); }
.rl-perma:hover { color: var(--brand); border-bottom-color: var(--brand); }
.rl-jump, .rl-item:target { animation: rl-jump 2.4s ease; border-radius: 10px; }
@keyframes rl-jump { 0%, 62% { background: var(--chip-bg); } 100% { background: transparent; } }
.rl-prov { opacity: 0.6; }
.rl-prov .rl-proj::after { content: "· 建档"; font-size: 11px; color: var(--dim); font-weight: 400; margin-left: 6px; }
.rl-loading { color: var(--dim); font-size: 13.5px; list-style: none; padding-left: 30px; }

.rl-more-wrap { text-align: center; padding: 8px 0 90px; }
.rl-end { color: var(--dim); font-size: 13px; }

@media (max-width: 640px) {
  .rl-hero { padding-top: calc(var(--nav-h) + 34px); }
  .rl-item { padding-left: 24px; }
  .rl-chip { min-height: 40px; display: inline-flex; align-items: center; font-size: 13.5px; }
  .rl-perma, .rl-link, .rl-rss-btn { min-height: 40px; display: inline-flex; align-items: center; }
  @media (prefers-reduced-motion: reduce) { .rl-jump, .rl-item:target { animation: none; } }
}

.rl-rss { margin-left: 10px; font-size: 13px; color: var(--brand-strong); text-decoration: none; border: 1px solid var(--line); border-radius: 999px; padding: 3px 12px; white-space: nowrap; }
.rl-rss:hover { border-color: var(--brand); }
.rl-rss-btn { background: transparent; cursor: pointer; font: inherit; font-size: 13px; }

/* 加载骨架条（2026-10-09）：占位与真实条目同高，防列表渲染时 CLS 跳变 */
.rl-skel { height: 104px; margin: 10px 0 22px 30px; border-radius: 10px;
  background: var(--card); border: 1px solid var(--line);
  animation: rl-pulse 1.4s ease-in-out infinite; }
@keyframes rl-pulse { 50% { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .rl-skel { animation: none; } }
