:root{
    --ink:#1f2a37;
    --muted:#6b778c;
    --border:#cfd6e4;
    --panel:#ffffff;
    --meta-bg:#eef3fb;   /* header strip */
    --actions-bg:#fafbfd;/* footer strip */
  }

  .thread { max-width: 860px; margin: 1rem auto; font: 14px/1.5 system-ui, -apple-system, Segoe UI, Roboto, sans-serif; color:var(--ink); }
  .post { border:1px solid var(--border); border-radius:8px; margin:0; overflow:hidden; background:var(--panel); box-shadow: 0 1px 0 rgba(16,24,40,.03); }
  .post + .post { margin-top:0; border-top:0; }
  .post .meta {
    display:flex; gap:.75rem; align-items:center;
    background:var(--meta-bg); color:#3e4b5c;
    padding:.55rem .75rem; border-bottom:1px solid var(--border);
  }
  .post .meta .author { font-weight:700; }
  .post .meta .tag { margin-left:.5rem; color:#445066; }
  .post .meta .stamp { margin-left:auto; font-variant-numeric: tabular-nums; color:var(--muted); }

  .post .body { padding:.9rem .9rem 1rem; }
  .post .body p { margin:.6rem 0; }

  .post .actions {
    display:flex; gap:.5rem; justify-content:flex-end;
    background:var(--actions-bg); padding:.5rem .75rem;
    border-top:1px solid var(--border);
  }
  .btn {
    font: inherit;
    border:1px solid var(--border);
    background:#fff;
    padding:.28rem .6rem;
    border-radius:6px;
    color:#344154;
  }
  .btn:active { transform: translateY(1px); }

  .quote{
    background:#e9eef6;
    border:1px solid #cfd6e4;
    border-left:6px solid #b5c6de;
    padding:10px 12px;
    margin:.5rem 0 1rem;
  }
  .quote .quote-head{ font-weight:700; color:#2d425b; margin-bottom:.35rem; }