/* Labnote Workspace — shared styles (timeline / project / entry detail)
   附加于 home.css + tool.css 之后，全部使用 ws- 前缀，不覆盖既有类。
   记录本风：横格线时间线 + 手写日期戳 + 克制上浮。 */

/* ── 顶栏当前页标记（追加，不改 home.css） ── */
.nav a.ws-active { opacity: 1; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--seal); }

/* ── 工具栏 ── */
.ws-toolbar {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 1.2rem; padding: 1rem 1.1rem; background: var(--card);
  border: 1px solid var(--rule); border-radius: 8px; margin-bottom: .4rem;
}
.ws-toolbar-left { display: flex; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.ws-filters { display: flex; align-items: flex-end; gap: 1rem; flex-wrap: wrap; }
.ws-filter { display: flex; flex-direction: column; gap: .3rem; }
.ws-filter > label { font-size: .74rem; color: var(--muted); letter-spacing: .02em; }
.ws-filter .select { min-width: 170px; }

/* 新建项目内联表单 */
.ws-new-project-form {
  display: none; margin-top: 1rem; padding-top: 1rem;
  border-top: 1px dashed var(--rule);
}
.ws-new-project-form .row { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; }
.ws-new-project-form .input { flex: 1; min-width: 220px; }

/* ── 时间线（横格线翻页感） ── */
.ws-timeline { border-top: 2px solid var(--ink); margin-top: .4rem; }
.ws-entry {
  display: flex; gap: 1.3rem; padding: 1.15rem .6rem;
  border-bottom: 1px solid var(--rule);
  /* 手写记录本横格线：每 32px 一条淡线 */
  background-image: repeating-linear-gradient(
    to bottom, transparent 0, transparent 31px, var(--rule) 31px, var(--rule) 32px);
  transition: background-color .15s ease, transform .08s ease;
}
.ws-entry:hover { background-color: rgba(216, 203, 178, .22); transform: translateY(-1px); }
.ws-entry-stamp {
  font-family: var(--hand); color: var(--seal); min-width: 5.2rem; padding-top: .15rem;
  display: flex; flex-direction: column; line-height: 1.1;
}
.ws-entry-stamp .ws-date { font-size: 1.18rem; font-weight: 600; }
.ws-entry-stamp .ws-time { font-size: .95rem; color: var(--warm); }
.ws-entry-body { flex: 1; min-width: 0; }
.ws-entry-top { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .35rem; }
.ws-entry-title { font-family: var(--serif); font-size: 1.22rem; font-weight: 600; margin: 0 0 .4rem; line-height: 1.3; }
.ws-entry-title a { color: var(--ink-deep); text-decoration: none; }
.ws-entry-title a:hover { color: var(--seal); text-decoration: underline; }
.ws-entry-meta { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.ws-repro { font-size: .82rem; color: var(--warm); }
.ws-repro code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .78rem; color: var(--muted); word-break: break-all; }
.btn-sm { padding: .3rem .7rem; font-size: .8rem; }

/* ── 项目页头部 ── */
.ws-project-head { margin-bottom: 1rem; }
.ws-project-name { font-family: var(--serif); color: var(--ink-deep); font-size: 1.35rem; font-weight: 600; margin: 0 0 .2rem; }
.ws-project-desc { color: var(--warm); font-size: .92rem; margin: 0; }

/* ── 空状态 ── */
.ws-empty {
  text-align: center; padding: 3.4rem 1.5rem; color: var(--warm);
}
.ws-empty-icon { font-family: var(--hand); font-size: 2.6rem; color: var(--seal); margin-bottom: .6rem; }
.ws-empty h3 { font-family: var(--serif); color: var(--ink-deep); font-size: 1.35rem; margin: 0 0 .5rem; }
.ws-empty p { max-width: 34rem; margin: 0 auto 1.2rem; font-size: .95rem; line-height: 1.6; }

/* ── 详情页区块 ── */
.ws-block { padding: 1.4rem 0; border-bottom: 1px dashed var(--rule); }
.ws-block:last-child { border-bottom: 0; }
.ws-grid { display: flex; flex-direction: column; gap: .35rem; max-width: 46rem; }
.ws-row { display: flex; gap: 1rem; padding: .45rem 0; border-bottom: 1px dotted var(--rule); }
.ws-row:last-child { border-bottom: 0; }
.ws-row-k { flex: 0 0 9rem; color: var(--muted); font-size: .88rem; }
.ws-row-v { flex: 1; color: var(--ink-deep); font-size: .95rem; word-break: break-word; }

.ws-repro-row {
  display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between;
  background: var(--card-deep); border: 1px solid var(--rule); border-radius: 8px;
  padding: .9rem 1.1rem; margin-top: 1rem; max-width: 46rem;
}
.ws-repro-id { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.ws-repro-label { font-size: .74rem; color: var(--muted); letter-spacing: .02em; }
.ws-repro-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .9rem; color: var(--ink-deep); word-break: break-all; }
.ws-repro-actions { display: flex; gap: .6rem; flex-wrap: wrap; }

.ws-json {
  background: var(--card); border: 1px solid var(--rule); border-radius: 8px;
  padding: 1rem 1.1rem; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .84rem; line-height: 1.55; color: var(--ink-deep); overflow-x: auto;
  max-height: 26rem; overflow-y: auto; white-space: pre;
}
.ws-muted { color: var(--muted); font-size: .92rem; }
.ws-result-note { color: var(--warm); font-size: .9rem; margin-bottom: .8rem; }

.ws-actions { display: flex; gap: .7rem; flex-wrap: wrap; margin-bottom: 1.4rem; }
.ws-flow { max-width: 46rem; }
.ws-flow-title { font-family: var(--serif); color: var(--ink-deep); font-size: 1.08rem; margin: 0 0 .25rem; }
.ws-flow-desc { color: var(--warm); font-size: .9rem; margin: 0 0 .8rem; }
.ws-flow-btns { display: flex; gap: .6rem; flex-wrap: wrap; }

/* ── 响应式 ── */
@media (max-width: 640px) {
  .ws-entry { gap: .8rem; }
  .ws-entry-stamp { min-width: 4.2rem; }
  .ws-row-k { flex-basis: 6.5rem; }
  .ws-toolbar { align-items: stretch; }
  .ws-toolbar-left { flex-direction: column; }
  .ws-filters { flex-direction: column; align-items: stretch; }
  .ws-filter .select { width: 100%; }
}