/* 首页：极简入口。一个按钮、一张卡、留出扩展位。 */
body.home {
  padding: 0;
  background:
    linear-gradient(#eef1f6 1px, transparent 1px) 0 0 / 100% 72px,
    linear-gradient(90deg, #eef1f6 1px, transparent 1px) 0 0 / 72px 100%,
    #f7f8fa;
  background-blend-mode: normal;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}
.home-shell {
  width: min(920px, 100% - 40px);
  margin: 0 auto;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  padding: 26px 0 22px;
}
.home-top { display: flex; align-items: baseline; gap: 12px; }
.wordmark { font-family: var(--mono); font-size: 15px; font-weight: 700; letter-spacing: .16em; }
.wordmark .dot { display: inline-block; width: 6px; height: 6px; background: var(--red); margin-left: 7px; vertical-align: 2px; }
.wordmark-sub { font-family: var(--mono); font-size: 10.5px; letter-spacing: .18em; color: var(--faint); }
.home-clock { margin-left: auto; font-family: var(--mono); font-size: 11.5px; color: var(--faint); font-variant-numeric: tabular-nums; }

.home-main { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 48px 0 40px; }
.home-kicker {
  font-size: 11.5px; letter-spacing: .12em; color: var(--faint);
  display: flex; align-items: center; gap: 10px; margin-bottom: 16px;
}
.home-kicker::before { content: ""; width: 22px; height: 1px; background: var(--line-strong); }
.home-title {
  font-size: clamp(34px, 6vw, 52px); font-weight: 700; letter-spacing: -.035em; line-height: 1.05;
}
.home-lede { margin-top: 14px; font-size: 15px; color: var(--muted); max-width: 34em; }

.app-card {
  margin-top: 44px;
  display: block; text-decoration: none; color: inherit;
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  box-shadow: 0 1px 0 rgba(27, 36, 48, .03), 0 18px 40px -24px rgba(27, 36, 48, .28);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.app-card:hover {
  transform: translateY(-2px);
  border-color: #b9c4d2;
  box-shadow: 0 1px 0 rgba(27, 36, 48, .03), 0 26px 50px -26px rgba(27, 36, 48, .34);
}
.app-card-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; border-bottom: 1px solid var(--line);
  font-family: var(--mono); font-size: 11px; color: var(--faint); letter-spacing: .1em;
}
.app-state { color: var(--green); }
.app-state::before { content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%;
  background: var(--green); margin-right: 6px; vertical-align: 1px; }
.app-card-body { padding: 22px 20px 20px; }
.app-card-body h2 { font-size: 23px; font-weight: 650; letter-spacing: -.015em; }
.app-card-body p { margin-top: 8px; font-size: 13px; color: var(--muted); max-width: 42em; }
.app-card-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 13px 20px; border-top: 1px solid var(--line); background: var(--surface-2);
  border-radius: 0 0 14px 14px;
}
.app-meta { font-size: 11.5px; color: var(--faint); }
.app-meta b { color: var(--muted); font-weight: 600; font-variant-numeric: tabular-nums; }
.app-go {
  font-size: 13px; font-weight: 600; color: var(--text);
  border-bottom: 1px solid var(--text); padding-bottom: 1px; white-space: nowrap;
}
.app-card:hover .app-go { color: var(--blue); border-color: var(--blue); }

.app-placeholder {
  margin-top: 14px; display: flex; align-items: center; gap: 12px;
  padding: 15px 20px; border: 1px dashed var(--line-strong); border-radius: 12px;
  font-family: var(--mono); font-size: 11px; color: #a3aebc; letter-spacing: .08em;
}
.ph-line { flex: 1; height: 1px; background: repeating-linear-gradient(90deg, var(--line-strong) 0 4px, transparent 4px 8px); }

.home-foot {
  display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding-top: 16px; border-top: 1px solid var(--line);
  font-size: 11px; color: var(--faint);
}

@media (max-width: 640px) {
  .home-shell { width: calc(100% - 32px); padding: 20px 0 18px; }
  .home-main { padding: 34px 0 30px; }
  .home-clock { display: none; }
  .app-card { margin-top: 32px; }
  .app-card-body h2 { font-size: 20px; }
  .app-card-foot { flex-direction: column; align-items: flex-start; gap: 8px; }
  .home-foot { flex-direction: column; gap: 4px; }
}