/* 北大资讯顶上的校园生活入口和三页：空教室、食堂、班车（pages/life.js，docs/specs/733-campus-life.md）。类名都以 lf- 开头。手机分界 760px */
.lf-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
a.lf-go { display: inline-flex; align-items: center; gap: 2px; height: 32px; padding: 0 8px 0 14px; border: 1px solid var(--line-2);
  border-radius: 999px; background: var(--panel); color: var(--ink); font-size: 13.5px; font-weight: 500; text-decoration: none; }
a.lf-go:hover { border-color: var(--ink); }
a.lf-go .ic { width: 14px; height: 14px; color: var(--muted); }
a.lf-back { display: inline-flex; align-items: center; gap: 2px; margin: 0 0 8px -4px; color: var(--muted); font-size: 14px; text-decoration: none; }
a.lf-back:hover { color: var(--ink); }
a.lf-back .ic { width: 16px; height: 16px; }
.lf h1 { margin: 0; }
.lf-note { margin: 18px 0 0; color: var(--muted); font-size: 14px; }
.lf-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 14px; }
select.lf-sel { height: 36px; font-size: 14px; }
.lf-days { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.lf-days button { display: grid; justify-items: center; min-width: 52px; height: 44px; padding: 0 8px; border: 1px solid var(--line-2);
  border-radius: var(--radius-sm); background: var(--panel); color: var(--text); font-size: 13px; line-height: 1.2; }
.lf-days button span { color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.lf-days button.on { border-color: var(--ink); background: var(--ink); color: var(--panel); }
.lf-days button.on b { color: inherit; }
.lf-days button.on span { color: inherit; opacity: .75; }
label.lf-now { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--text); cursor: pointer; }
label.lf-now input { width: 16px; height: 16px; margin: 0; accent-color: var(--accent); }
.lf-body { margin-top: 12px; }
.lf-tags { margin-bottom: 8px; }
/* 空教室的格子：一行一间，12 列是 12 节；空的亮，现在这一节描一圈 */
.lf-grid { display: grid; gap: 3px; }
.lf-r { display: grid; grid-template-columns: 72px repeat(12, minmax(0, 1fr)); gap: 3px; align-items: stretch; }
.lf-room { display: flex; align-items: baseline; gap: 6px; padding-right: 4px; font-size: 13px; color: var(--ink); font-variant-numeric: tabular-nums; }
.lf-room span { color: var(--faint); font-size: 11px; }
.lf-h .lf-room { color: var(--muted); font-size: 12px; }
.lf-c { min-height: 24px; border-radius: 4px; }
.lf-c.free { background: color-mix(in srgb, var(--green) 30%, var(--panel)); }
.lf-c.busy { background: var(--soft); }
.lf-c.lf-n { display: grid; place-items: center; min-height: 20px; color: var(--muted); font-size: 11.5px; font-variant-numeric: tabular-nums; }
.lf-c.cur { box-shadow: inset 0 0 0 2px var(--tint); }
.lf-c.lf-n.cur { box-shadow: none; color: var(--tint); font-weight: 700; }
/* 一行一项：现在空的教室、食堂 */
.lf-list { display: grid; }
.lf-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 11px 2px;
  border-bottom: 1px solid var(--line); font-size: 14px; }
.lf-item b { font-weight: 500; color: var(--ink); }
.lf-cap { color: var(--muted); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.lf-until { color: var(--green); font-size: 13px; }
.lf-ct { grid-template-columns: minmax(0, 1fr) 120px 112px; }
.lf-meter { position: relative; height: 6px; border-radius: 3px; background: var(--soft); overflow: hidden; }
.lf-meter i { position: absolute; inset: 0 auto 0 0; border-radius: 3px; background: var(--green); }
.lf-num { color: var(--muted); font-size: 12.5px; text-align: right; font-variant-numeric: tabular-nums; }
.lf-ct.crowded .lf-num { color: var(--red); }
.lf-ct.crowded .lf-meter i { background: var(--red); }
/* 食堂：一个食堂的几层一组，组和组之间一条深一点的线；右上角选显示哪些食堂（一个食堂一颗，显示的实心） */
.lf-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
button.lf-pick { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid var(--line-2);
  border-radius: var(--radius-sm); background: var(--panel); color: var(--muted); }
button.lf-pick:hover, button.lf-pick[aria-expanded="true"] { border-color: var(--ink); color: var(--ink); }
button.lf-pick .ic { width: 18px; height: 18px; }
.lf-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.lf-chips button { height: 30px; padding: 0 12px; border: 1px solid var(--line-2); border-radius: 999px; background: var(--panel);
  color: var(--muted); font-size: 13px; }
.lf-chips button.on { border-color: var(--ink); background: var(--ink); color: var(--panel); }
.lf-grp { display: grid; padding: 4px 0; border-bottom: 1px solid var(--line-2); }
.lf-grp .lf-item:last-child { border-bottom: 0; }
/* 食堂：开着的整行淡绿、开到几点绿字；没开的名字变灰 */
.lf-nm { display: grid; gap: 2px; min-width: 0; }
.lf-nm span { color: var(--faint); font-size: 12px; }
.lf-ct b { color: var(--muted); }
.lf-ct.open { margin: 1px -8px; padding-left: 10px; padding-right: 10px; border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--green) 9%, var(--panel)); }
.lf-ct.open b { color: var(--ink); }
.lf-ct.open .lf-nm span { color: var(--green); }
/* 班车：一行一天，发车时刻一个一个排开；开走了的变灰，下一班实心 */
.lf-bus { display: grid; margin-top: 12px; }
.lf-day { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: start; padding: 10px 2px;
  border-bottom: 1px solid var(--line); }
.lf-dl { display: grid; line-height: 1.25; padding-top: 3px; }
.lf-dl b { font-weight: 500; color: var(--ink); font-size: 14px; }
.lf-dl span { color: var(--muted); font-size: 11.5px; font-variant-numeric: tabular-nums; }
.lf-times { display: flex; flex-wrap: wrap; gap: 6px; }
.lf-t { display: inline-flex; align-items: center; height: 26px; padding: 0 8px; border: 1px solid var(--line-2); border-radius: var(--radius-sm);
  color: var(--ink); font-size: 13px; font-variant-numeric: tabular-nums; }
.lf-t.gone { border-color: var(--line); color: var(--faint); }
.lf-t.next { border-color: var(--ink); background: var(--ink); color: var(--panel); font-weight: 600; }
.lf-none { padding-top: 4px; color: var(--muted); font-size: 13.5px; }
@media (max-width: 760px) {
  .lf-day { grid-template-columns: 52px minmax(0, 1fr); gap: 8px; }
  .lf-r { grid-template-columns: 52px repeat(12, minmax(0, 1fr)); gap: 2px; }
  .lf-room span { display: none; }
  .lf-ct { grid-template-columns: minmax(0, 1fr) 64px 96px; gap: 8px; }
}