/* ==========================================================================
   沨镇生活网 · 垂直切片样式表
   基调：冷色公务 + 民间善意。系统字体，0 外链，0 CDN。

   动效预算（R7 · 09_y2k_web_style.md）：
     旧红线「@keyframes ≤ 2」——
     ⭐ 主理人裁决 2026-08-05：R7 修订为「@keyframes ≤ 7」。
     修订理由：新 keyframes 仅 transform/opacity + 双降级出口
     (prefers-reduced-motion / .fx-reduced) + 320px 帧率验收，
     数量闸改为行为闸。
     登记：lz-charin / lz-crawl（既有 2）+ fx-fog-a / fx-fog-b / fx-grain /
           fx-jitter / fx-flash（恐怖呈现层新增 5）= 7，不得再增。
     ⚠️ 恐怖呈现层完整实现（令牌 / 档位 / 后处理 / 文字加深 / 5 个新
        @keyframes / SVG data URI）已迁至 css/horror.css（新建，最后引入），
        不在本文件——以同时满足 tests/spec.js ⑰⑱（只扫 style/sites/y2k
        三文件）与 07 规格 B.0「新建 horror.css」的约束。
   ========================================================================== */

/* ── 0. 令牌 ─────────────────────────────────────────────────────────── */
:root{
  /* 冷灰蓝主色阶 */
  --ink:      #23282d;   /* 正文 */
  --ink-2:    #454d55;   /* 次级正文 */
  --muted:    #6d757e;   /* 元信息 */
  --faint:    #99a1a9;   /* 更弱：时间戳、楼层 */
  --ghost:    #b6bcc2;   /* 近乎背景：零强调残留 */
  --line:     #d9dde1;   /* 分隔线 */
  --line-2:   #e7eaed;   /* 更弱分隔线 */
  --paper:    #f6f7f8;   /* 页面底 */
  --card:     #ffffff;   /* 卡片底 */
  --well:     #f0f2f4;   /* 凹槽/引用底 */
  --chrome:   #33465a;   /* 站头深板岩蓝 */
  --chrome-2: #2a3b4c;
  --link:     #3d5a73;   /* 链接：去饱和冷蓝 */
  --link-v:   #5d6b78;   /* 已读链接 */
  --stamp:    #7a6a52;   /* 公文暖褐（善意的一侧） */
  --warn-bg:  #f4f1ea;   /* 公告条 */
  --warn-bd:  #e2dccd;

  --w-min: 320px;
  --w-max: 430px;
  --tab-h: 50px;

  --fs-xs: 11px; --fs-sm: 12px; --fs-md: 14px; --fs-lg: 16px; --fs-xl: 18px;

  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
          "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans SC",
          "Noto Sans CJK SC", "WenQuanYi Micro Hei", sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Courier New", monospace;
}

/* ── 1. 复位 ─────────────────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--font);
  font-size:var(--fs-md);
  line-height:1.75;
  color:var(--ink);
  background:#e4e7ea;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
button,input,textarea{ font-family:inherit; font-size:inherit; color:inherit; }
button{ cursor:pointer; }
a{ color:var(--link); text-decoration:none; }

/* ── 2. 竖屏窄栏骨架 ─────────────────────────────────────────────────── */
#lz-frame{
  width:100%;
  min-width:var(--w-min);
  max-width:var(--w-max);
  margin:0 auto;
  min-height:100vh;
  min-height:100dvh;
  background:var(--paper);
  display:flex;
  flex-direction:column;
  box-shadow:0 0 0 1px #d3d7db;
  position:relative;
}
#lz-main{
  flex:1 0 auto;
  padding-bottom:calc(var(--tab-h) + env(safe-area-inset-bottom, 0px));
}

/* ── 3. 站头 ─────────────────────────────────────────────────────────── */
#lz-top{
  background:var(--chrome);
  color:#e8ecef;
  padding:10px 12px 10px;
  padding-top:calc(10px + env(safe-area-inset-top, 0px));
  position:sticky; top:0; z-index:30;
}
.lz-brand{ display:flex; align-items:center; gap:8px; margin-bottom:9px; }
.lz-logo{
  width:26px; height:26px; flex:0 0 26px;
  border:1px solid #7f909f; border-radius:2px;
  display:flex; align-items:center; justify-content:center;
  font-size:15px; line-height:1; color:#dfe5ea;
}
.lz-brand-text{ display:flex; flex-direction:column; line-height:1.25; min-width:0; }
.lz-brand-name{ font-size:var(--fs-lg); font-weight:600; letter-spacing:.06em; }
.lz-brand-slogan{
  font-style:normal; font-size:var(--fs-xs); color:#9fb0be; letter-spacing:.02em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.lz-searchbar{ display:flex; gap:6px; }
.lz-q{
  flex:1 1 auto; min-width:0;
  height:34px; padding:0 10px;
  border:1px solid #566b7e; border-radius:2px;
  background:#f7f9fa; color:var(--ink);
  font-size:var(--fs-md);
  outline:none;
  -webkit-appearance:none; appearance:none;
}
.lz-q:focus{ border-color:#8fa5b6; background:#fff; }
.lz-q::-webkit-search-cancel-button{ -webkit-appearance:none; }
.lz-sbtn{
  flex:0 0 auto; height:34px; padding:0 14px;
  border:1px solid #566b7e; border-radius:2px;
  background:#42586d; color:#e8ecef;
  font-size:var(--fs-md); letter-spacing:.05em;
}
.lz-sbtn:active{ background:var(--chrome-2); }

/* ── 4. 板块横向导航 ─────────────────────────────────────────────────── */
.lz-nav{
  display:flex; gap:0;
  overflow-x:auto; overflow-y:hidden;
  background:var(--card);
  border-bottom:1px solid var(--line);
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  position:sticky; z-index:25;
  top:calc(93px + env(safe-area-inset-top, 0px));
}
.lz-nav::-webkit-scrollbar{ display:none; }
.lz-nav a{
  flex:0 0 auto;
  padding:9px 13px;
  font-size:var(--fs-md);
  color:var(--ink-2);
  white-space:nowrap;
  border-bottom:2px solid transparent;
}
.lz-nav a.on{ color:var(--chrome); font-weight:600; border-bottom-color:var(--chrome); }

/* ── 5. 通用块 ───────────────────────────────────────────────────────── */
.lz-block{ background:var(--card); border-bottom:1px solid var(--line); margin-bottom:8px; }
.lz-block:last-child{ margin-bottom:0; }
.lz-bh{
  display:flex; align-items:baseline; justify-content:space-between;
  padding:9px 12px 7px; border-bottom:1px solid var(--line-2);
}
.lz-bh h2{ margin:0; font-size:var(--fs-md); font-weight:600; letter-spacing:.04em; color:var(--ink); }
.lz-bh .more{ font-size:var(--fs-sm); color:var(--muted); }
.lz-pad{ padding:10px 12px; }

/* 列表行 */
.lz-li{
  display:block; padding:9px 12px;
  border-bottom:1px solid var(--line-2);
  color:var(--ink);
}
.lz-li:last-child{ border-bottom:0; }
.lz-li:active{ background:var(--well); }
.lz-li .ti{ font-size:var(--fs-md); line-height:1.55; color:var(--link); }
.lz-li.read .ti{ color:var(--link-v); }
.lz-li .mt{ font-size:var(--fs-xs); color:var(--faint); margin-top:3px; letter-spacing:.02em; }
.lz-li .sm{ font-size:var(--fs-sm); color:var(--muted); margin-top:3px; line-height:1.6; }

/* 头条 */
.lz-headline{ padding:12px; background:var(--card); border-bottom:1px solid var(--line); }
.lz-headline .ti{ font-size:var(--fs-xl); font-weight:600; line-height:1.5; color:var(--ink); }
.lz-headline .mt{ font-size:var(--fs-xs); color:var(--faint); margin-top:6px; }

/* ── 6. 强调层级（08j Part 3 重编号：数字大=强） ──────────────────────
   tier1 = 零强调（默认，一像素不给）· tier2 = 加粗 600 · tier3 = 红色加粗 #b30000 */
.t1{ /* 零强调：不加粗、不变色、不描边、不加标记 */ }
.t2{ font-weight:600; }
.t3{ font-weight:700; color:#b30000; }

/* 可搜索关键词标记（design/gdd/10_searchable_keyword_spec.md §2）
   与 tier3 正交：tier 作用于整段/语义「值得细读」（红粗）；
   .lz-kw 作用于单词/语义「这个词可以搜」（蓝虚线），点击走站群检索。
   仅 hover/active 换底色，不引入新 @keyframes（动效预算见 §16 与 horror.css）。 */
.lz-kw{
  color:#1e6fb8;
  border-bottom:1px dashed #1e6fb8;
  cursor:pointer;
  text-decoration:none;
  padding:0 1px;
}
.lz-kw:hover{ background:rgba(30,111,184,.10); }
.lz-kw:active{ background:rgba(30,111,184,.18); }
/* tier 与可搜词落在同一个词上时（mp-xuyue 姓名栏、pol-assist-001 编号栏），
   tier 是作者定的语义强调，不许被 kw 的蓝抢掉：保留 tier 的色与字重，
   只叠加「可搜」的虚线下划 + 手型。可点性的信号靠虚线，不靠颜色。 */
.t2 .lz-kw, .t3 .lz-kw{ color:inherit; font-weight:inherit; border-bottom-color:currentColor; }

/* ── 7. 详情页 ───────────────────────────────────────────────────────── */
.lz-art{ background:var(--card); padding:14px 14px 18px; }
.lz-art h1{ margin:0 0 8px; font-size:var(--fs-xl); font-weight:600; line-height:1.5; }
.lz-meta{
  font-size:var(--fs-xs); color:var(--faint);
  border-bottom:1px solid var(--line-2); padding-bottom:8px; margin-bottom:12px;
  line-height:1.8;
}
.lz-art p{ margin:0 0 12px; text-align:justify; }
.lz-art p:last-child{ margin-bottom:0; }
.lz-hr{ border:0; border-top:1px solid var(--line-2); margin:14px 0; }

.lz-quote{
  background:var(--well); border-left:2px solid var(--line);
  padding:9px 11px; margin:0 0 12px;
  font-size:var(--fs-sm); color:var(--ink-2);
}
.lz-kv{ display:flex; gap:8px; padding:6px 0; border-bottom:1px solid var(--line-2); font-size:var(--fs-md); }
.lz-kv:last-child{ border-bottom:0; }
.lz-kv .k{ flex:0 0 88px; color:var(--muted); font-size:var(--fs-sm); line-height:1.85; }
.lz-kv .v{ flex:1 1 auto; min-width:0; word-break:break-word; }
.lz-kv.blk{ display:block; }
.lz-kv.blk .k{ margin-bottom:2px; }

.lz-notice{
  background:var(--warn-bg); border:1px solid var(--warn-bd);
  padding:8px 10px; margin:0 0 12px;
  font-size:var(--fs-sm); color:var(--stamp); line-height:1.7;
}
.lz-sysline{ font-size:var(--fs-sm); color:var(--muted); }

/* ── 8. 图位（三态：空框 / 占位 / 叙事性空） ─────────────────────────── */
.lz-slot{ margin:0 0 12px; }
.lz-slot .frame{
  border:1px solid var(--line);
  background:#fbfbfc;
  aspect-ratio:4/3;
  display:flex; align-items:center; justify-content:center;
}
.lz-slot .cap{ font-size:var(--fs-xs); color:var(--faint); margin-top:5px; line-height:1.6; }
/* never_fill：永远为空。不放任何字、任何图标、任何斜线。 */
.lz-slot.never .frame{ background:#fafbfb; }
/* placeholder：灰底「图位」 */
.lz-slot.ph .frame{ background:var(--well); color:var(--ghost); font-size:var(--fs-sm); letter-spacing:.3em; }
/* 被涂黑的段落（08 §7.4 REDACTED）：黑条，无字，永不可点 */
.lz-redact{ background:#1a1a1a; margin:10px 0; border-radius:2px; }
.lz-redact::after{ content:''; display:block; width:100%; height:100%; }
/* empty_narrative：灰块 + 永不结束的读条 */
.lz-slot.narr .frame{ background:var(--well); flex-direction:column; gap:9px; }
.lz-slot.narr .txt{ font-size:var(--fs-sm); color:var(--muted); }
.lz-bar{ width:96px; height:2px; background:#dcdfe3; overflow:hidden; }
.lz-bar i{ display:block; width:34%; height:100%; background:#b3bac1; animation:lz-crawl 2.6s linear infinite; }

/* ── 9. 论坛 ─────────────────────────────────────────────────────────── */
.lz-op{ padding:12px 14px; background:var(--card); border-bottom:1px solid var(--line-2); }
.lz-op .who{ font-size:var(--fs-sm); color:var(--ink-2); margin-bottom:2px; }
.lz-floor{ padding:11px 14px; border-bottom:1px solid var(--line-2); background:var(--card); }
.lz-floor .hd{
  display:flex; justify-content:space-between; gap:8px;
  font-size:var(--fs-xs); color:var(--faint); margin-bottom:4px;
}
.lz-floor .hd .nm{ color:var(--muted); }
.lz-floor .tx{ font-size:var(--fs-md); line-height:1.75; }
.lz-dead{ color:var(--ghost); }
/* 签名档（08k 网名+签名档：千禧论坛 ID 下方灰字小行） */
.lz-sign{
  font-size:var(--fs-xs); color:var(--faint); font-style:italic;
  margin:2px 0 5px; padding:2px 0 4px;
  border-top:1px dotted var(--line-2);
}
.lz-op .lz-sign{ border-top:0; margin-top:4px; }

/* ── 10. 沨镇号时间线 ────────────────────────────────────────────────── */
.lz-profile{ background:var(--card); padding:14px; border-bottom:1px solid var(--line); }
.lz-profile .hd{ display:flex; gap:10px; align-items:center; }
.lz-avatar{
  width:44px; height:44px; flex:0 0 44px;
  border:1px solid var(--line); background:#fbfbfc;
}
.lz-profile .nm{ font-size:var(--fs-lg); font-weight:600; }
.lz-profile .bio{ font-size:var(--fs-sm); color:var(--muted); }
.lz-stats{ display:flex; gap:16px; margin-top:10px; font-size:var(--fs-sm); color:var(--muted); }
.lz-stats b{ color:var(--ink); font-weight:600; }

.lz-tl{ background:var(--card); }
.lz-tw{ padding:11px 14px; border-bottom:1px solid var(--line-2); }
.lz-tw .no{ font-size:var(--fs-xs); color:var(--faint); }
.lz-tw .ln{ margin:2px 0 0; line-height:1.8; }
.lz-tw .fn{ font-size:var(--fs-xs); color:var(--faint); margin-top:6px; }
.lz-gap{
  padding:9px 14px; font-size:var(--fs-xs); color:var(--faint);
  background:var(--paper); border-bottom:1px solid var(--line-2);
}
/* 逐字显现（仅用于 #651） */
.lz-char{ opacity:0; animation:lz-charin .01s linear forwards; }

/* ── 11. 检索结果 ────────────────────────────────────────────────────── */
.lz-qhead{
  padding:9px 12px; background:var(--card);
  border-bottom:1px solid var(--line-2);
  font-size:var(--fs-sm); color:var(--muted);
}
.lz-hit{ display:block; padding:10px 12px; border-bottom:1px solid var(--line-2); background:var(--card); }
.lz-hit .src{ font-size:var(--fs-xs); color:var(--faint); margin-bottom:3px; }
.lz-hit .sn{ font-size:var(--fs-md); line-height:1.7; color:var(--ink); }
.lz-hit .sn a{ color:var(--link); }
.lz-hit.locked{ background:#f4f5f6; }
.lz-hit.locked .sn{ color:var(--ghost); }
.lz-hit.locked .src{ color:#c2c7cc; }
.lz-zero{ padding:30px 14px; text-align:center; color:var(--muted); font-size:var(--fs-md); background:var(--card); }

/* ── 12. 门禁输入框（B-01 工号 / B-04 日期 · 08d A.0 站内语义） ───── */
.lz-gate{ display:flex; gap:8px; padding:4px 0 2px; }
.lz-gate-in{
  flex:1 1 auto; min-width:0; height:32px; padding:0 9px;
  border:1px solid var(--line); border-radius:2px; background:var(--card);
  font-size:var(--fs-sm); color:var(--ink); outline:none;
}
.lz-gate-in:focus{ border-color:#adb7c0; }
/* 站内按钮（门禁查询 / 终局提供线索）：与旧 .lz-vb 同源，保留通用样式 */
.lz-vb{
  flex:0 0 auto; height:32px; padding:0 12px;
  border:1px solid var(--line); border-radius:2px;
  background:var(--card); color:var(--ink-2);
  font-size:var(--fs-sm);
}
.lz-vb.on{ background:var(--chrome); border-color:var(--chrome); color:#eef1f3; }

/* ── ⑥ 警方站红字站头 / ⑦ 内站极简页 ─────────────────────────────── */
.lz-police-banner{ padding:10px 12px; background:var(--paper); border-bottom:1px solid var(--line); }
.lz-police-banner b{ font-size:var(--fs-sm); letter-spacing:.08em; }
.lz-inner{ padding:14px; background:var(--card); }
.lz-inner-ttl{ font-size:var(--fs-lg); font-weight:600; letter-spacing:.2em; margin-bottom:10px; color:var(--ink-2); }

/* ── 13. 底部标签栏 ──────────────────────────────────────────────────── */
.lz-tabs{
  position:fixed; left:50%; transform:translateX(-50%); bottom:0;
  width:100%; min-width:var(--w-min); max-width:var(--w-max);
  height:calc(var(--tab-h) + env(safe-area-inset-bottom, 0px));
  padding-bottom:env(safe-area-inset-bottom, 0px);
  display:flex; z-index:40;
  background:#f2f4f6; border-top:1px solid var(--line);
}
.lz-tabs a{
  flex:1 1 0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:2px;
  font-size:var(--fs-xs); color:var(--muted); letter-spacing:.05em;
}
.lz-tabs a .g{ font-size:15px; line-height:1; color:var(--faint); }
.lz-tabs a.on{ color:var(--chrome); }
.lz-tabs a.on .g{ color:var(--chrome); }

/* ── 14. 站脚 ────────────────────────────────────────────────────────── */
#lz-foot{
  padding:16px 14px calc(18px + var(--tab-h));
  font-size:var(--fs-xs); color:var(--faint);
  text-align:center; line-height:2; background:var(--paper);
  border-top:1px solid var(--line-2);
}
#lz-foot a{ color:var(--muted); }
#lz-foot .sep{ margin:0 5px; color:#c9ced3; }

/* ── 15. 杂项 ────────────────────────────────────────────────────────── */
.lz-back{ padding:9px 12px; font-size:var(--fs-sm); background:var(--paper); }
.lz-back a{ color:var(--muted); margin-right:14px; }
.lz-tag{
  display:inline-block; padding:0 5px; margin-left:6px;
  border:1px solid var(--line); border-radius:2px;
  font-size:var(--fs-xs); color:var(--muted); line-height:16px; vertical-align:1px;
}
.lz-empty{ padding:26px 14px; text-align:center; color:var(--faint); font-size:var(--fs-sm); background:var(--card); }
.lz-raw{ font-family:var(--mono); font-size:var(--fs-sm); line-height:1.9; white-space:pre-wrap; word-break:break-word; }
.lz-mini{ font-size:var(--fs-xs); color:var(--faint); }
.lz-x{ color:var(--ghost); }

/* ── 16. 动效预算：基础层 2 个 keyframes（恐怖呈现层另登记 5 个，见 css/horror.css） ── */
@keyframes lz-charin{ to{ opacity:1; } }
@keyframes lz-crawl{ 0%{ transform:translateX(-100%);} 100%{ transform:translateX(300%);} }

@media (prefers-reduced-motion: reduce){
  .lz-char{ animation:none; opacity:1; }
  .lz-bar i{ animation:none; }
}