/* 燎原 · 最近上新（updates.html）专用样式 · 2026-09-30 时间轴版
   在 Codex 的时间轴版式上优化，结构不变：开头介绍 → 上新时间轴（搜索 + 板块筛选）→ 左栏 + 右侧时间轴。
   这是副页，开头照「工具」页的副页刊头（.l2-channel-head：浅色纸底、小路径、墨绿大标题、右侧说明、下面一条细线），
   不用首页的深绿刊头；筛选用燎原刊的栏目条（.l2-journal-index）。颜色、字号、字体全部取 liaoyuan-v2.css 的变量和字号档位
   （电脑 12/14/16/18/22/28，展示字 48–86；手机 12/13/15/17/20/24）。 */

/* ---------- 开头：副页刊头（数值照线上工具页实测：标题 56/48/40，行高 1.35，说明 16px 灰字） ---------- */
.l2-updates .l2-channel-head{padding:2px 0 29px}
.l2-updates .l2-channel-head h1{margin-top:17px;line-height:1.35;letter-spacing:-1px}
.l2-updates-intro{align-self:end;max-width:31em;padding-bottom:3px}
.l2-updates-intro>p:first-child{font-size:16px;line-height:2;color:var(--l2-muted)}
/* 带 .l2-updates 前缀的几条：全站 .l2-designed p{margin:0} 权重更高，单写类名的外边距会被它盖掉 */
.l2-updates .l2-updates-stats{display:flex;flex-wrap:wrap;gap:4px 28px;margin-top:12px;font-size:14px;color:var(--l2-muted)}
.l2-updates-stats b{margin-right:6px;font-size:22px;font-weight:600;line-height:1.5;color:var(--l2-ink);font-variant-numeric:tabular-nums}

/* ---------- 上新时间轴：标题行 + 搜索 ---------- */
.l2-updates-control{padding-top:52px}
.l2-updates-control-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:18px}
.l2-updates-control-head h2{font-size:28px;font-weight:600;line-height:1.5}
.l2-updates-search{display:flex;align-items:center;width:260px;max-width:100%;border-bottom:1px solid var(--l2-line);transition:border-color .2s}
.l2-updates-search:focus-within{border-color:var(--l2-ink)}
.l2-updates-search input{flex:1;min-width:0;margin:0;padding:6px 0 7px;border:0;border-radius:0;background:transparent;font:inherit;font-size:14px;color:var(--l2-ink);outline:0;-webkit-appearance:none;appearance:none}
.l2-updates-search input::placeholder{color:var(--l2-muted);opacity:1}

/* ---------- 板块筛选：外观同燎原刊栏目条，当前板块一条 2px 朱红线（同页眉导航的当前页） ---------- */
.l2-updates-filter>button{position:relative;appearance:none;margin:0;padding:0;border:0;border-radius:0;background:none;font:inherit;line-height:inherit;color:var(--l2-ink);cursor:pointer;white-space:nowrap}
.l2-updates-filter>button small{margin-left:6px;font-size:12px;color:var(--l2-muted);font-variant-numeric:tabular-nums}
/* 还没有条目的板块（例如寻常·录）按钮藏起来；手机上按钮写了 display:flex，要明确压住 hidden */
.l2-updates-filter>button[hidden]{display:none}
.l2-updates-filter>button::after{content:"";position:absolute;left:0;right:0;bottom:-20px;height:2px;background:var(--l2-red);transform:scaleX(0);transition:transform .28s cubic-bezier(.22,1,.36,1)}
.l2-updates-filter>button[aria-pressed=true]::after{transform:scaleX(1)}
.l2-updates-filter>button:hover{color:var(--l2-red)}
.l2-updates-filter>button:focus-visible,.l2-updates-latest button:focus-visible,.l2-updates-empty button:focus-visible{outline:2px solid var(--l2-red);outline-offset:6px}

/* ---------- 左栏 + 时间轴 ---------- */
.l2-updates-grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:72px;padding:44px 0 80px}
.l2-updates-rail{position:sticky;top:124px;align-self:start}
.l2-updates-rail .l2-kicker{margin-bottom:10px}
.l2-updates-latest{margin:0;padding:0;list-style:none;border-bottom:1px solid var(--l2-line)}
.l2-updates-latest button{display:flex;justify-content:space-between;align-items:baseline;gap:12px;width:100%;margin:0;padding:9px 0;border:0;border-top:1px solid var(--l2-line);border-radius:0;background:none;font:inherit;font-size:14px;line-height:1.7;color:var(--l2-ink);text-align:left;cursor:pointer}
.l2-updates-latest button time{color:var(--l2-red);font-variant-numeric:tabular-nums}
.l2-updates-latest button:hover{color:var(--l2-red)}
.l2-updates-latest button[aria-pressed=true]{font-weight:600}
.l2-updates .l2-updates-rail-note{margin-top:22px;font-size:14px;line-height:1.9;color:var(--l2-muted)}
.l2-updates .l2-updates-rail-note+.l2-updates-rail-note{margin-top:12px}
.l2-updates-rail-note a{color:var(--l2-ink);border-bottom:1px solid color-mix(in srgb,var(--l2-red) 48%,var(--l2-line))}

.l2-updates-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--l2-line);font-size:14px;color:var(--l2-muted)}
.l2-updates-head strong{font-size:18px;font-weight:600;color:var(--l2-ink)}

/* 时间轴：一条竖线；每个月一个空心圆，每一天一个朱红圆点 */
.l2-tl{position:relative;padding-left:36px}
.l2-tl::before{content:"";position:absolute;left:6px;top:49px;bottom:0;width:1px;background:var(--l2-line)}
.l2-tl-month{display:flex;align-items:baseline;gap:14px;padding-top:44px}
.l2-tl>section:first-child .l2-tl-month{padding-top:28px}
.l2-tl-month h2{position:relative;font-size:28px;font-weight:600;line-height:1.5}
.l2-tl-month h2::before{content:"";position:absolute;left:-36px;top:14.5px;box-sizing:border-box;width:13px;height:13px;border:2px solid var(--l2-ink);border-radius:50%;background:var(--l2-paper)}
.l2-tl-month span{font-size:14px;color:var(--l2-muted)}
.l2-tl-day{padding:26px 0 10px}
.l2-tl-day time{position:relative;display:inline-block;font-size:14px;line-height:1.7;letter-spacing:.08em;color:var(--l2-red);font-variant-numeric:tabular-nums}
.l2-tl-day time::before{content:"";position:absolute;left:-34px;top:7.4px;width:9px;height:9px;border-radius:50%;background:var(--l2-red);box-shadow:0 0 0 5px var(--l2-paper)}

/* 条目：左边板块和硬信息，中间标题和一句话简介，右边箭头 */
.l2-tl-entry{display:grid;grid-template-columns:150px minmax(0,1fr) 24px;gap:24px;align-items:center;padding:20px 0;border-top:1px solid var(--l2-line)}
.l2-tl-entries>.l2-tl-entry:last-child{border-bottom:1px solid var(--l2-line)}
.l2-tl-entry>span{font-size:14px;line-height:1.7;color:var(--l2-muted)}
.l2-tl-entry>span i{display:block;font-style:normal}
.l2-tl-entry>div{min-width:0}
.l2-tl-entry h3{font-size:22px;font-weight:600;line-height:1.55}
.l2-tl-entry p{margin-top:4px;font-size:16px;line-height:1.9;color:var(--l2-muted)}
.l2-tl-entry b{font-size:22px;font-weight:400;line-height:1;color:var(--l2-red);text-align:right}
/* 新闻：字号降一档，下面一行写来源和核实状态 */
.l2-tl-news h3{font-size:18px;line-height:1.65}
.l2-tl-news p{margin-top:2px;font-size:14px;line-height:1.7}

/* ---------- 空结果 ---------- */
.l2-updates-empty{padding:40px 0 8px}
.l2-updates-empty h2{font-size:22px;font-weight:600}
.l2-updates-empty p{margin-top:6px;font-size:16px;color:var(--l2-muted)}
.l2-updates-empty button{margin-top:18px;padding:0 0 4px;border:0;border-bottom:1px solid var(--l2-red);border-radius:0;background:none;font:inherit;font-size:14px;color:var(--l2-ink);cursor:pointer}
.l2-updates-empty button:hover{color:var(--l2-red)}
.l2-updates .l2-updates-noscript{margin-top:32px;font-size:16px;color:var(--l2-muted)}

/* ---------- 平板：左栏移到时间轴下面 ---------- */
@media(max-width:1000px){
  .l2-updates-grid{display:flex;flex-direction:column;gap:56px}
  .l2-updates-rail{position:static;order:2;max-width:420px}
  .l2-tl-entry{grid-template-columns:130px minmax(0,1fr) 22px;gap:20px}
}

/* ---------- 手机 ---------- */
@media(max-width:760px){
  .l2-updates .l2-channel-head{grid-template-columns:minmax(0,1fr);gap:23px;padding:0 0 22px}
  .l2-updates .l2-channel-head h1{margin-top:13px;line-height:1.42}
  .l2-updates-intro{max-width:none;padding-bottom:0}
  .l2-updates-intro>p:first-child{font-size:15px;line-height:1.9}
  .l2-updates .l2-updates-stats{gap:2px 22px;margin-top:10px;font-size:13px}
  .l2-updates-stats b{font-size:20px}
  .l2-updates-control{padding-top:36px}
  .l2-updates-control-head{display:block;margin-bottom:14px}
  .l2-updates-control-head h2{font-size:24px}
  .l2-updates-search{width:100%;margin-top:8px}
  /* 筛选：同燎原刊栏目条的四列两行，条数放在板块名下面 */
  .l2-updates-filter>button{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:48px;padding:7px 2px 8px;font-size:12px;line-height:1.35;white-space:normal;text-align:center;overflow-wrap:anywhere}
  .l2-updates-filter>button small{margin:1px 0 0}
  .l2-updates-filter>button::after{left:22%;right:22%;bottom:-1px}
  .l2-updates-filter>button:focus-visible{outline-offset:-2px}
  .l2-updates-grid{gap:44px;padding:28px 0 56px}
  .l2-updates-rail{max-width:none}
  .l2-updates-head strong{font-size:17px}
  .l2-updates-head{font-size:13px}
  .l2-tl{padding-left:28px}
  .l2-tl::before{left:5px;top:42px}
  .l2-tl-month{padding-top:36px}
  .l2-tl>section:first-child .l2-tl-month{padding-top:24px}
  .l2-tl-month h2{font-size:24px}
  .l2-tl-month h2::before{left:-29px;top:11.5px}
  .l2-tl-month span{font-size:13px}
  .l2-tl-day{padding:22px 0 8px}
  .l2-tl-day time{font-size:13px}
  .l2-tl-day time::before{left:-27px;top:6.5px}
  .l2-tl-entry{grid-template-columns:minmax(0,1fr) 22px;gap:6px 12px;padding:16px 0}
  .l2-tl-entry>span{grid-column:1 / -1;font-size:13px}
  .l2-tl-entry>span i{display:inline}
  .l2-tl-entry>span i::before{content:" · "}
  .l2-tl-entry h3{font-size:20px;line-height:1.6}
  .l2-tl-entry p{font-size:15px;line-height:1.85}
  .l2-tl-news h3{font-size:17px}
  .l2-tl-news p{font-size:13px}
}
@media(prefers-reduced-motion:reduce){.l2-updates-filter>button::after{transition:none}}