
/* generic */
[hidden]{display:none!important}

.cb-board{--bg:#fafcff;--card:#ffffff;--muted:#64748b;--ring:#2563eb;--border:#e5e7eb;--text:#0f172a;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:0 6px 14px rgba(15,23,42,.06);font-size:18px;line-height:1.6}
@media (max-width:640px){ .cb-board{font-size:20.5px} }

.cb-cats{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.cb-cat{padding:10px 16px;border:1px solid var(--border);border-radius:999px;cursor:pointer;font-weight:700;background:#fff}
.cb-cat.active{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}

.cb-new{border:1px solid var(--border);background:#ffffff;border-radius:14px;padding:14px;margin-bottom:16px}
.cb-new-row{display:flex;gap:10px;align-items:center;margin-bottom:8px}
.cb-title-input{flex:1;border:1px solid var(--border);border-radius:10px;padding:10px}
.cb-new-side{display:flex;gap:8px;align-items:center}
.cb-cat-select{border:1px solid var(--border);border-radius:10px;padding:8px}
.cb-input{width:100%;min-height:96px;background:#ffffff;color:var(--text);border:1px solid var(--border);border-radius:12px;padding:12px;font-size:1em}
.cb-toolbar{display:flex;gap:10px;align-items:center;margin:10px 0;flex-wrap:wrap;position:relative}
.cb-tool{border:1px solid var(--border);background:#fff;border-radius:10px;padding:6px 10px;cursor:pointer}

.cb-emoji-pop{position:absolute;top:42px;left:0;z-index:10;width:340px;max-height:260px;overflow:auto;border:1px solid var(--border);border-radius:12px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.08);padding:8px;display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.cb-emoji-pop button{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:6px;cursor:pointer;font-size:18px}

.cb-attach-preview{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0}
.cb-thumb{position:relative;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#fff}
.cb-thumb img{display:block;max-width:140px;max-height:140px}
.cb-thumb video{display:block;max-width:240px;max-height:160px}
.cb-chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:999px;padding:6px 10px;background:#fff}
.cb-remove{position:absolute;top:6px;right:6px;background:#ef4444;color:#fff;border:0;border-radius:999px;width:24px;height:24px;line-height:24px;text-align:center;cursor:pointer}

.cb-poll{border:1px dashed var(--border);border-radius:12px;padding:10px;margin-top:8px}
.cb-poll-opts{display:flex;flex-direction:column;gap:6px}
.cb-poll-opt-row{display:flex;gap:6px;align-items:center}
.cb-poll-opt-row input{flex:1;border:1px solid var(--border);border-radius:10px;padding:8px}
.cb-del-opt{border:0;background:#ef4444;color:#fff;border-radius:8px;padding:6px 10px;cursor:pointer}
.cb-add-opt{border:1px solid var(--ring);background:#2563eb;color:#fff;border-radius:10px;padding:6px 10px}

.cb-actions{display:flex;justify-content:flex-end;margin-top:10px}
.cb-post{background:var(--ring);color:#fff;border:0;border-radius:12px;padding:12px 16px;font-weight:800;cursor:pointer}

.cb-card{position:relative;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:14px}
.cb-postmenu{position:absolute;top:8px;right:8px}
.cb-menu-btn{width:32px;height:32px;border:1px solid var(--border);border-radius:10px;background:#fff;cursor:pointer;font-weight:900;line-height:1}
.cb-menu{position:absolute;right:0;top:36px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.08);min-width:160px;overflow:hidden}
.cb-menu button{width:100%;text-align:left;padding:10px 12px;border:0;background:#fff;cursor:pointer}
.cb-menu button:hover{background:#f8fafc}

.cb-author{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.cb-avatar{position:relative;width:54px;height:54px}
.cb-avatar img{width:54px;height:54px;border-radius:999px;display:block}
.cb-badge{position:absolute;right:-6px;bottom:-6px;background:var(--ring);color:#fff;border-radius:999px;padding:3px 8px;font-size:12px;border:2px solid #fff;white-space:nowrap}
.cb-author-name{font-weight:800}
.cb-meta{font-size:13px;color:var(--muted)}

.cb-title{font-size:1.05em;font-weight:800;margin:6px 0}
.cb-excerpt{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}

/* constrain embedded content like preview */
.cb-content figure,.cb-content img{max-width:140px;max-height:140px;border-radius:12px}
.cb-content video{max-width:240px;max-height:160px;border-radius:12px}
.cb-content figure{margin:8px 0}
.cb-filechip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:999px;padding:6px 10px;margin:6px 6px 0 0;background:#fff}

.cb-card.open .cb-excerpt{display:none}
.cb-card.open .cb-content{display:block}

.cb-bar{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.cb-acts{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.cb-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid var(--border);border-radius:999px;cursor:pointer;background:#fff;font-weight:700}
.cb-btn.active{outline:2px solid var(--ring);outline-offset:1px}
.cb-btn svg{width:18px;height:18px}

.cb-topteaser{display:inline-flex;align-items:center;gap:10px}
.cb-topteaser .cb-avatar{width:32px;height:32px}
.cb-topteaser .cb-avatar img{width:32px;height:32px}
.cb-topteaser .cb-author-name{font-weight:800;font-size:0.95em}
.cb-topteaser .cb-meta{font-size:12px}
.cb-top-text{max-width:420px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

.cb-poll-box{border:1px solid var(--border);border-radius:12px;padding:10px;margin-top:10px}
.cb-poll-q{font-weight:800;margin-bottom:6px}
.cb-poll-opt{margin:6px 0}
.cb-poll-opt button{width:100%;border:1px solid var(--border);border-radius:10px;padding:8px;background:#fff;cursor:pointer}
.cb-poll-bar{height:14px;border-radius:10px;background:#e5e7eb;overflow:hidden}
.cb-poll-bar > span{display:block;height:100%;background:#2563eb}
.cb-poll-meta{font-size:12px;color:var(--muted);margin-top:6px}

.cb-comments{margin-top:12px;border-top:1px solid var(--border);padding-top:10px}
.cb-comment{display:flex;gap:10px;font-size:0.98em;margin:10px 0}
.cb-comment .cb-avatar{width:36px;height:36px}
.cb-comment .cb-avatar img{width:36px;height:36px}
.cb-comment-body{flex:1}
.cb-comment-acts{display:flex;gap:8px;margin-top:6px;align-items:center;flex-wrap:wrap}
.cb-comment-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--border);border-radius:999px;background:#fff;cursor:pointer;font-weight:700}
.cb-expand{background:transparent;border:0;color:#2563eb;font-weight:800;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.cb-expand svg{width:16px;height:16px}
.cb-thread{margin-left:20px;border-left:3px solid #e2e8f0;padding-left:10px}

.cb-reply{display:flex;gap:8px;margin-top:8px}
.cb-reply textarea{flex:1;min-height:48px;border:1px solid var(--border);border-radius:10px;padding:10px}
.cb-reply .cb-comment-btn{border-color:var(--ring);background:#2563eb;color:#fff}

.cb-load{text-align:center;color:var(--muted);margin-top:12px}

@media (max-width:640px){ .cb-cats{overflow:auto;white-space:nowrap;scrollbar-width:none} .cb-cats::-webkit-scrollbar{display:none} }
```
