.community-layout { display:grid; grid-template-columns:150px minmax(0,1fr) 245px; gap:24px; align-items:start; }
.community-main { min-width:0; }
.community-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; margin-bottom:22px; }
.community-heading h1 { font-size:2rem; }
.community-heading p { margin:6px 0; }
.community-tabs { display:grid; gap:8px; position:sticky; top:20px; }
.community-tabs button,.community-pills button { background:transparent; color:var(--muted); font:inherit; border:0; border-radius:12px; padding:12px; min-height:46px; cursor:pointer; text-align:left; }
.community-tabs [aria-current],.community-pills [aria-pressed='true'] { color:var(--accent); background:var(--accent-soft); font-weight:700; }
.community-pills { display:flex; gap:4px; padding:4px; border-radius:16px; background:var(--surface); }
.community-pills button { flex:1; text-align:center; }
.community-controls { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.community-controls label { flex:1 1 120px; min-width:0; font-size:.875rem; }
.community-search { display:block; margin-top:14px; font-size:.875rem; }
.community-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin:18px 0; }
.community-toolbar .app-button { padding:8px 12px; }
.community-aside { display:grid; gap:20px; }
.community-aside .app-panel { padding:20px; display:grid; gap:12px; }
.community-aside p,.community-aside h2 { margin:0; }
.community-aside h2 { font-size:1.2rem; }
.community-aside a { font-size:.875rem; }
.community-post { padding:22px; margin-bottom:16px; overflow-wrap:anywhere; }
.community-post header { display:flex; align-items:center; gap:12px; }
.community-avatar { width:44px; height:44px; border-radius:50%; background:var(--accent-soft); display:grid; place-items:center; flex:none; font-weight:700; color:var(--accent); }
.community-meta { font-size:.875rem; color:var(--muted); }
.community-post h2 { margin:16px 0 10px; }
.community-body { white-space:pre-wrap; color:var(--text)!important; }
.community-tags { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.community-post .app-actions { margin-top:14px; gap:8px; }
.community-post button,.community-post select { font-size:.875rem; }
.community-post .app-button { padding:8px 12px; }
.community-post button[aria-pressed='true'] { background:var(--accent-soft); border-color:var(--accent); color:var(--accent)!important; }
.community-post select { width:auto; max-width:100%; }
.community-post details { margin-top:12px; }
.community-post summary { cursor:pointer; color:var(--muted); }
.community-media { max-width:100%; max-height:430px; border-radius:12px; object-fit:contain; margin-block:12px; display:block; }
.community-notification { display:block; width:100%; text-align:left; color:var(--text); font:inherit; cursor:pointer; margin-bottom:12px; }
.community-notification.unread { border-left:4px solid var(--accent); }
.community-notification p { margin:8px 0; }
.community-comment { padding:14px 0; border-bottom:1px solid var(--border); overflow-wrap:anywhere; }
.community-comment.reply { margin-left:24px; padding-left:12px; border-left:2px solid var(--border); }
.community-comment p { white-space:pre-wrap; }
.community-comment button { padding:6px 10px; font-size:.875rem; }
.app-surface textarea { font:inherit; color:var(--text); background:var(--bg); border:1px solid var(--border-strong); border-radius:10px; width:100%; padding:12px; resize:vertical; }
#thread-dialog { width:min(760px,calc(100% - 24px)); }
#compose-dialog .app-form,#thread-dialog .app-form { max-width:none; }
#report-fields { display:grid; gap:16px; }
#me-summary .app-button { margin-left:12px; }
@media(max-width:1050px) { .community-layout { grid-template-columns:130px minmax(0,1fr); } .community-aside { grid-column:2; } }
@media(max-width:650px) { .community-layout { display:block; padding-top:22px; padding-bottom:100px; } .community-tabs { position:fixed; inset:auto 0 0; display:flex; justify-content:space-around; background:var(--surface-strong); border-top:1px solid var(--border); z-index:20; padding:8px 6px calc(8px + env(safe-area-inset-bottom)); gap:0; } .community-tabs button { font-size:.875rem; padding:10px 8px; text-align:center; } .community-post { padding:18px; } .community-aside { margin-top:28px; } .app-footer { padding-bottom:110px; } }
