.wf-list,.wf-records { display:grid; gap:16px; }
.wf-record { background:#1b2017; border:1px solid var(--line); border-radius:10px; padding:22px; min-width:0; }
.wf-record-header { display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; gap:18px; }
.wf-record-header > div { flex:1 1 220px; min-width:0; }
.wf-record-header h2 { font-size:18px; line-height:1.4; margin:0 0 6px; overflow-wrap:anywhere; }
.wf-record-header p,.wf-record-footer time { font-size:12px; line-height:1.6; color:var(--muted); margin:0; overflow-wrap:anywhere; }
.wf-record-body,.wf-body { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.75; font-size:14px; }
.wf-record-footer,.wf-record-actions { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:18px; }
.wf-status-actions { display:flex; flex-wrap:wrap; gap:8px; }
.wf-meta { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; margin:18px 0; }
.wf-meta dt { color:var(--muted); font-size:11px; margin-bottom:6px; }
.wf-meta dd { margin:0; font-size:13px; overflow-wrap:anywhere; }
.wf-update { padding:14px 16px; background:#242a1c; border-left:3px solid var(--gold); border-radius:4px; }
.wf-update strong { font-size:12px; color:var(--gold); }
.wf-update p { white-space:pre-wrap; overflow-wrap:anywhere; margin:8px 0 0; font-size:13px; line-height:1.7; }
.wf-pagination { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin:22px 0; }
.wf-use-cases { border:1px solid var(--line); border-radius:8px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:20px 0; padding:16px; }
.wf-use-cases .check-field { min-width:0; margin:0; }
.wf-use-cases legend { color:var(--muted); font-size:13px; padding:0 6px; }
.wf-comment-thread { display:grid; gap:12px; max-height:300px; overflow:auto; margin:18px 0; }
.wf-comment-thread .wf-record { padding:14px; }
.wf-comment-thread .wf-record-header h2 { font-size:14px; }
.wf-comment-thread .wf-record-body { font-size:13px; }
.wf-join { max-width:630px; margin:60px auto; padding:32px; border:1px solid var(--line); border-radius:14px; background:#1b2017; }
.wf-join .brand-logo { max-width:130px; }
.wf-join h1 { font-size:28px; margin-top:26px; }
.wf-join p { line-height:1.75; color:var(--muted); }
.wf-join .field textarea { width:100%; }
.wf-join-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:20px; }
.wf-partner-note { white-space:pre-wrap; overflow-wrap:anywhere; }
.wf-record .status { flex-shrink:0; }
@media(max-width:700px) {
 .wf-record { padding:17px; }
 .wf-record-header { gap:12px; }
 .wf-record-header h2 { font-size:16px; }
 .wf-meta { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .wf-record-actions,.wf-record-footer { align-items:flex-start; }
 .wf-status-actions { width:100%; }
 .wf-status-actions .btn { flex:1 1 40%; }
 .wf-join { margin:20px 14px; padding:24px; }
}