/** * Forum — Pixel redesign. * Scoped to `.forum-page` (set on ) so shared variables on other pages stay intact. */ .forum-page { --fx-bg: #1a1b2e; --fx-bg-1: #232542; --fx-bg-2: #2e3156; --fx-bg-3: #3a3d70; --fx-ink: #f2e9dc; --fx-dim: #a8a5c0; --fx-mute: #6e6b8a; --fx-line: #3d3f66; --fx-line-2:#5a5d85; --fx-cyan: #4ec9ff; --fx-pink: #ff6bb3; --fx-yellow:#ffd966; --fx-green: #8aff7a; --fx-red: #ff6b6b; --fx-violet:#b48cff; --fx-orange:#ffa15e; background: var(--fx-bg); color: var(--fx-ink); font-family: "Space Grotesk", system-ui, sans-serif; font-size: 15px; -webkit-font-smoothing: antialiased; min-height: 100vh; margin: 0; } .forum-page *, .forum-page *::before, .forum-page *::after { box-sizing: border-box; } .forum-page a { color: inherit; text-decoration: none; } .forum-page button { font: inherit; } .forum-page .pixel { font-family: "Press Start 2P", monospace; } .forum-page .mono { font-family: "VT323", monospace; font-size: 18px; } .forum-wrap { max-width: 1280px; margin: 0 auto; padding: 0 28px; } /* ───────────────── Top nav ───────────────── */ .forum-page .forum-nav { border-bottom: 2px solid var(--fx-line-2); background: var(--fx-bg-1); position: sticky; top: 0; z-index: 40; } .forum-nav-row { display: flex; align-items: center; gap: 20px; height: 60px; } .forum-brand { font-family: "Press Start 2P", monospace; font-size: 13px; color: var(--fx-yellow); letter-spacing: 0.04em; display: flex; align-items: center; gap: 10px; } .forum-brand .sp { color: var(--fx-pink); } .forum-brand .slash { color: var(--fx-mute); margin: 0 6px; } .forum-brand .sec { color: var(--fx-cyan); } .forum-page .forum-nav-links { display: flex; gap: 20px; font-family: "VT323", monospace; font-size: 20px; color: var(--fx-dim); margin-left: 16px; } .forum-page .forum-nav-links a { padding: 0; border-radius: 0; background: transparent; color: inherit; transition: color 0.15s ease; } .forum-page .forum-nav-links a:hover, .forum-page .forum-nav-links a.active { background: transparent; color: var(--fx-cyan); } .forum-nav-spacer { flex: 1; } .forum-page .forum-nav-external { display: flex; gap: 8px; margin-left: 0; } .forum-user-chip { display: flex; align-items: center; gap: 8px; font-family: "VT323", monospace; font-size: 18px; color: var(--fx-dim); padding: 6px 12px; background: var(--fx-bg-2); border: 2px solid var(--fx-line); } .forum-user-chip .av { width: 24px; height: 24px; background: var(--fx-yellow); display: grid; place-items: center; color: #1a1b2e; font-family: "Press Start 2P", monospace; font-size: 10px; } .forum-user-chip a { color: var(--fx-cyan); } /* ───────────────── Pixel button ───────────────── */ .forum-page .fx-btn { padding: 10px 16px; background: var(--fx-bg-2); color: var(--fx-ink); border: 2px solid var(--fx-line-2); box-shadow: 3px 3px 0 #000; font-family: "Press Start 2P", monospace; font-size: 10px; letter-spacing: 0.04em; cursor: pointer; transition: transform .06s, box-shadow .06s; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; } .forum-page .fx-btn:hover { transform: translate(-1px,-1px); box-shadow: 4px 4px 0 #000; text-decoration: none; } .forum-page .fx-btn:active { transform: translate(2px,2px); box-shadow: 1px 1px 0 #000; } .forum-page .fx-btn.pri { background: var(--fx-yellow); color: #1a1b2e; border-color: var(--fx-yellow); } .forum-page .fx-btn.pink { background: var(--fx-pink); color: #1a1b2e; border-color: var(--fx-pink); } .forum-page .fx-btn.cyan { background: var(--fx-cyan); color: #1a1b2e; border-color: var(--fx-cyan); } .forum-page .fx-btn.sm { padding: 6px 10px; font-size: 9px; box-shadow: 2px 2px 0 #000; } .forum-page .fx-btn.ghost { background: transparent; box-shadow: none; } .forum-page .fx-btn.ghost:hover { background: var(--fx-bg-2); box-shadow: none; transform: none; } .forum-page .fx-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; box-shadow: 2px 2px 0 #000; } /* ───────────────── Sub-nav ───────────────── */ .forum-sub { background: var(--fx-bg-1); border-bottom: 2px solid var(--fx-line-2); padding: 14px 0; } .forum-sub-row { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; } .forum-crumb { font-family: "VT323", monospace; font-size: 20px; color: var(--fx-dim); display: flex; align-items: center; gap: 8px; } .forum-crumb .sep { color: var(--fx-mute); } .forum-crumb .cur { color: var(--fx-yellow); } .forum-crumb a { color: var(--fx-dim); } .forum-crumb a:hover { color: var(--fx-cyan); } .forum-search { flex: 1; min-width: 220px; display: flex; border: 2px solid var(--fx-line-2); background: var(--fx-bg-2); box-shadow: 3px 3px 0 #000; } .forum-search:focus-within { border-color: var(--fx-yellow); } .forum-search input { flex: 1; background: transparent; border: 0; outline: 0; padding: 10px 14px; color: var(--fx-ink); font-family: "VT323", monospace; font-size: 20px; } .forum-search input::placeholder { color: var(--fx-mute); } .forum-search button { padding: 0 16px; background: var(--fx-bg-3); color: var(--fx-ink); font-family: "Press Start 2P", monospace; font-size: 10px; border: 0; cursor: pointer; } /* ───────────────── Page grid ───────────────── */ .forum-page-grid { padding: 28px 0 80px; display: grid; grid-template-columns: 240px 1fr; gap: 28px; } /* ───────────────── Rail + boxes ───────────────── */ .forum-rail { display: flex; flex-direction: column; gap: 20px; } .forum-box { background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 4px 4px 0 #000; } .forum-box-h { padding: 12px 14px; border-bottom: 2px solid var(--fx-line-2); background: var(--fx-bg-2); font-family: "Press Start 2P", monospace; font-size: 10px; color: var(--fx-yellow); letter-spacing: 0.06em; } .forum-cat-list { list-style: none; margin: 0; padding: 0; } .forum-cat { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; padding: 10px 14px; border-bottom: 1px dotted var(--fx-line-2); font-family: "VT323", monospace; font-size: 19px; color: var(--fx-dim); cursor: pointer; text-decoration: none; } .forum-cat:last-child { border-bottom: 0; } .forum-cat:hover { background: var(--fx-bg-2); color: var(--fx-ink); text-decoration: none; } .forum-cat.on { background: var(--fx-bg-2); color: var(--fx-ink); border-left: 4px solid var(--fx-yellow); padding-left: 10px; } .forum-cat .dot { width: 10px; height: 10px; justify-self: center; box-shadow: 1px 1px 0 rgba(0,0,0,0.4); } .forum-cat.c-all .dot { background: var(--fx-ink); } .forum-cat.c-general .dot { background: var(--fx-cyan); } .forum-cat.c-bugs .dot { background: var(--fx-red); } .forum-cat.c-suggestions .dot { background: var(--fx-green); } .forum-cat.c-guides .dot { background: var(--fx-yellow); } .forum-cat .n { font-family: "Press Start 2P", monospace; font-size: 9px; color: var(--fx-mute); } .forum-rule { padding: 10px 14px; font-family: "VT323", monospace; font-size: 17px; color: var(--fx-dim); border-bottom: 1px dotted var(--fx-line-2); display: grid; grid-template-columns: 24px 1fr; gap: 8px; } .forum-rule:last-child { border-bottom: 0; } .forum-rule .n { font-family: "Press Start 2P", monospace; font-size: 11px; color: var(--fx-pink); } /* ───────────────── Hero ───────────────── */ .forum-main { min-width: 0; } .forum-hero { background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 5px 5px 0 #000; padding: 22px 24px; margin-bottom: 20px; position: relative; overflow: hidden; } .forum-hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(2px 2px at 30px 20px, var(--fx-cyan) 50%, transparent), radial-gradient(2px 2px at 120px 60px, var(--fx-pink) 50%, transparent), radial-gradient(2px 2px at 220px 30px, var(--fx-yellow) 50%, transparent), radial-gradient(2px 2px at 320px 80px, var(--fx-green) 50%, transparent); background-size: 400px 120px; opacity: 0.5; pointer-events: none; } .forum-hero h1 { font-family: "Press Start 2P", monospace; font-size: 22px; line-height: 1.4; margin: 0 0 10px; text-shadow: 2px 2px 0 var(--fx-pink); position: relative; color: var(--fx-ink); } .forum-hero p { font-family: "VT323", monospace; font-size: 20px; color: var(--fx-dim); position: relative; margin: 0; } .forum-hero .stats { display: flex; gap: 20px; margin-top: 14px; font-family: "VT323", monospace; font-size: 16px; color: var(--fx-mute); position: relative; flex-wrap: wrap; } .forum-hero .stats b { color: var(--fx-cyan); font-family: "Press Start 2P", monospace; font-size: 11px; margin-right: 6px; } /* ───────────────── Tools row ───────────────── */ .forum-tools-row { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; } .forum-chips { display: flex; gap: 6px; flex-wrap: wrap; } .forum-chip { padding: 6px 10px; background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 2px 2px 0 #000; font-family: "Press Start 2P", monospace; font-size: 9px; color: var(--fx-dim); cursor: pointer; letter-spacing: 0.04em; text-decoration: none; } .forum-chip:hover, .forum-chip.on { color: #1a1b2e; background: var(--fx-yellow); border-color: var(--fx-yellow); text-decoration: none; } .forum-sort { padding: 10px 14px; background: var(--fx-bg-2); color: var(--fx-ink); border: 2px solid var(--fx-line-2); box-shadow: 3px 3px 0 #000; font-family: "Press Start 2P", monospace; font-size: 10px; cursor: pointer; } .forum-page-spacer { flex: 1; } /* ───────────────── Topic rows ───────────────── */ .forum-topic-list { display: flex; flex-direction: column; gap: 8px; } .forum-topic { background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 4px 4px 0 #000; padding: 14px 16px; display: grid; grid-template-columns: 40px 1fr auto auto; gap: 16px; align-items: center; transition: transform .06s, box-shadow .06s; cursor: pointer; text-decoration: none; color: inherit; } .forum-topic:hover { transform: translate(-1px,-1px); box-shadow: 5px 5px 0 #000; border-color: var(--fx-yellow); text-decoration: none; } .forum-topic.pinned { border-left-width: 6px; border-left-color: var(--fx-yellow); } .forum-topic.locked { opacity: 0.75; } .forum-t-avatar { width: 40px; height: 40px; display: grid; place-items: center; font-family: "Press Start 2P", monospace; font-size: 11px; color: #1a1b2e; box-shadow: 2px 2px 0 rgba(0,0,0,0.4); } .forum-av-1 { background: var(--fx-cyan); } .forum-av-2 { background: var(--fx-pink); } .forum-av-3 { background: var(--fx-yellow); } .forum-av-4 { background: var(--fx-green); } .forum-av-5 { background: var(--fx-violet); } .forum-av-6 { background: var(--fx-orange); } .forum-av-7 { background: var(--fx-red); } .forum-t-body { min-width: 0; } .forum-t-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; } .forum-t-title .name { font-family: "Press Start 2P", monospace; font-size: 13px; color: var(--fx-ink); line-height: 1.4; } .forum-topic:hover .forum-t-title .name { color: var(--fx-yellow); } .forum-cat-badge { padding: 3px 8px; font-family: "Press Start 2P", monospace; font-size: 8px; letter-spacing: 0.06em; } .forum-cat-badge.general { background: var(--fx-cyan); color: #1a1b2e; } .forum-cat-badge.bugs { background: var(--fx-red); color: #1a1b2e; } .forum-cat-badge.suggestions { background: var(--fx-green); color: #1a1b2e; } .forum-cat-badge.guides { background: var(--fx-yellow); color: #1a1b2e; } .forum-t-flag { font-family: "Press Start 2P", monospace; font-size: 8px; padding: 3px 6px; border: 1px solid var(--fx-mute); color: var(--fx-mute); } .forum-t-flag.pinned { border-color: var(--fx-yellow); color: var(--fx-yellow); } .forum-t-flag.locked { border-color: var(--fx-red); color: var(--fx-red); } .forum-t-flag.dev { background: var(--fx-yellow); color: #1a1b2e; border-color: var(--fx-yellow); } .forum-t-meta { font-family: "VT323", monospace; font-size: 17px; color: var(--fx-dim); display: flex; gap: 10px; align-items: center; flex-wrap: wrap; } .forum-t-meta .by { color: var(--fx-cyan); } .forum-t-meta .by.dev { color: var(--fx-yellow); } .forum-t-meta .dot-sep { color: var(--fx-mute); } .forum-t-stats { display: grid; grid-template-columns: auto auto; gap: 6px 14px; text-align: right; } .forum-t-stat { font-family: "VT323", monospace; font-size: 17px; color: var(--fx-dim); display: flex; align-items: center; gap: 6px; } .forum-t-stat b { font-family: "Press Start 2P", monospace; font-size: 11px; color: var(--fx-ink); } .forum-t-stat .ico { color: var(--fx-mute); font-size: 15px; } .forum-t-activity { text-align: right; min-width: 100px; } .forum-t-activity .when { font-family: "VT323", monospace; font-size: 16px; color: var(--fx-mute); } .forum-t-activity .who { font-family: "VT323", monospace; font-size: 17px; color: var(--fx-cyan); margin-top: 3px; } /* ───────────────── Pagination ───────────────── */ .forum-pager { display: flex; justify-content: center; gap: 6px; margin-top: 24px; } .forum-pager a, .forum-pager span { padding: 8px 12px; font-family: "Press Start 2P", monospace; font-size: 10px; background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 2px 2px 0 #000; color: var(--fx-dim); text-decoration: none; } .forum-pager a:hover { background: var(--fx-bg-2); color: var(--fx-yellow); text-decoration: none; } .forum-pager .on { background: var(--fx-yellow); color: #1a1b2e; border-color: var(--fx-yellow); } .forum-pager .disabled { opacity: 0.4; cursor: not-allowed; } /* ───────────────── Thread detail ───────────────── */ .forum-thread-page { padding: 28px 0 80px; display: grid; grid-template-columns: 240px 1fr; gap: 28px; } .forum-back-bar { margin-bottom: 16px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; } .forum-thread-head { background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 5px 5px 0 #000; padding: 22px 24px; margin-bottom: 20px; } .forum-thread-head h1 { font-family: "Press Start 2P", monospace; font-size: 20px; line-height: 1.4; margin: 0 0 12px; color: var(--fx-ink); } .forum-thread-head .tmeta { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; font-family: "VT323", monospace; font-size: 18px; color: var(--fx-dim); } .forum-thread-head .tmeta .by { color: var(--fx-cyan); } .forum-thread-head .tmeta .by.dev { color: var(--fx-yellow); } .forum-locked-banner { background: var(--fx-red); color: #1a1b2e; padding: 10px 14px; font-family: "Press Start 2P", monospace; font-size: 10px; box-shadow: 3px 3px 0 #000; margin-bottom: 16px; display: flex; align-items: center; gap: 12px; } .forum-post { background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 4px 4px 0 #000; display: grid; grid-template-columns: 140px 1fr; margin-bottom: 16px; } .forum-post.op { border-color: var(--fx-yellow); } .forum-post.dev-post { border-color: var(--fx-cyan); } .forum-post-side { background: var(--fx-bg-2); border-right: 2px solid var(--fx-line-2); padding: 16px 12px; text-align: center; } .forum-post-side .av { width: 64px; height: 64px; margin: 0 auto 10px; display: grid; place-items: center; font-family: "Press Start 2P", monospace; font-size: 18px; color: #1a1b2e; box-shadow: 3px 3px 0 rgba(0,0,0,0.4); } .forum-post-side .name { font-family: "Press Start 2P", monospace; font-size: 11px; color: var(--fx-ink); line-height: 1.3; word-break: break-word; } .forum-post-side .role { font-family: "VT323", monospace; font-size: 15px; color: var(--fx-yellow); margin-top: 4px; } .forum-post-side .role.dev { color: var(--fx-cyan); } .forum-post-side .joined { font-family: "VT323", monospace; font-size: 14px; color: var(--fx-mute); margin-top: 10px; } .forum-post-side .badges { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; margin-top: 10px; } .forum-badge { font-family: "Press Start 2P", monospace; font-size: 8px; padding: 3px 5px; background: var(--fx-bg-3); color: var(--fx-yellow); } .forum-badge.dev { background: var(--fx-cyan); color: #1a1b2e; } .forum-badge.founder { background: var(--fx-yellow); color: #1a1b2e; } .forum-post-body { padding: 16px 20px; min-width: 0; } .forum-post-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; font-family: "VT323", monospace; font-size: 16px; color: var(--fx-mute); gap: 10px; flex-wrap: wrap; } .forum-post-body .text { font-size: 15px; line-height: 1.6; color: var(--fx-dim); white-space: pre-wrap; word-break: break-word; } .forum-post-body .text code { background: var(--fx-bg-2); padding: 2px 6px; border: 1px solid var(--fx-line); font-family: "VT323", monospace; font-size: 16px; color: var(--fx-yellow); } .forum-post-foot { display: flex; gap: 8px; margin-top: 14px; padding-top: 14px; border-top: 1px dotted var(--fx-line-2); font-family: "VT323", monospace; font-size: 16px; color: var(--fx-mute); flex-wrap: wrap; align-items: center; } .forum-post-foot .edited { font-style: italic; } .forum-post-foot-spacer { flex: 1; } /* ───────────────── Reply composer ───────────────── */ .forum-reply-composer { background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 4px 4px 0 #000; padding: 16px 18px; margin-top: 24px; } .forum-reply-composer h3 { font-family: "Press Start 2P", monospace; font-size: 11px; color: var(--fx-yellow); margin: 0 0 12px; } .forum-reply-composer textarea { width: 100%; min-height: 120px; background: var(--fx-bg-2); border: 2px solid var(--fx-line-2); color: var(--fx-ink); padding: 12px; font-family: "VT323", monospace; font-size: 18px; resize: vertical; outline: 0; } .forum-reply-composer textarea:focus { border-color: var(--fx-yellow); } .forum-reply-composer .compose-toolbar { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; font-family: "VT323", monospace; font-size: 15px; color: var(--fx-mute); flex-wrap: wrap; gap: 10px; } /* ───────────────── New topic form ───────────────── */ .forum-new-form { background: var(--fx-bg-1); border: 2px solid var(--fx-line-2); box-shadow: 5px 5px 0 #000; padding: 24px; } .forum-new-form h1 { font-family: "Press Start 2P", monospace; font-size: 16px; color: var(--fx-yellow); margin: 0 0 20px; text-shadow: 2px 2px 0 var(--fx-pink); } .forum-fgroup { margin-bottom: 18px; } .forum-fgroup label { display: block; font-family: "Press Start 2P", monospace; font-size: 10px; color: var(--fx-cyan); margin-bottom: 8px; letter-spacing: 0.04em; } .forum-fgroup input, .forum-fgroup textarea, .forum-fgroup select { width: 100%; background: var(--fx-bg-2); border: 2px solid var(--fx-line-2); color: var(--fx-ink); padding: 12px; font-family: "VT323", monospace; font-size: 20px; outline: 0; border-radius: 0; } .forum-fgroup textarea { min-height: 240px; font-size: 18px; line-height: 1.5; resize: vertical; } .forum-fgroup input:focus, .forum-fgroup textarea:focus, .forum-fgroup select:focus { border-color: var(--fx-yellow); } .forum-fgroup .hint { font-family: "VT323", monospace; font-size: 15px; color: var(--fx-mute); margin-top: 6px; } .forum-cat-picker { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; } .forum-cat-pick { padding: 10px 8px; text-align: center; cursor: pointer; background: var(--fx-bg-2); border: 2px solid var(--fx-line-2); font-family: "Press Start 2P", monospace; font-size: 9px; color: var(--fx-dim); letter-spacing: 0.04em; user-select: none; } .forum-cat-pick:hover { border-color: var(--fx-yellow); color: var(--fx-ink); } .forum-cat-pick.on.c-general { background: var(--fx-cyan); border-color: var(--fx-cyan); color: #1a1b2e; } .forum-cat-pick.on.c-bugs { background: var(--fx-red); border-color: var(--fx-red); color: #1a1b2e; } .forum-cat-pick.on.c-suggestions { background: var(--fx-green); border-color: var(--fx-green); color: #1a1b2e; } .forum-cat-pick.on.c-guides { background: var(--fx-yellow); border-color: var(--fx-yellow); color: #1a1b2e; } .forum-form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; padding-top: 20px; border-top: 2px dotted var(--fx-line-2); } .forum-form-error { color: var(--fx-red); font-family: "VT323", monospace; font-size: 18px; margin-top: 10px; } /* ───────────────── Admin controls ───────────────── */ .forum-admin-controls { display: flex; gap: 8px; flex-wrap: wrap; } /* ───────────────── Verified badge ───────────────── */ .forum-verified-badge { display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px; background: var(--fx-cyan); color: #1a1b2e; font-family: "Press Start 2P", monospace; font-size: 8px; font-weight: 700; vertical-align: middle; margin-left: 4px; flex-shrink: 0; } /* ───────────────── Utility states ───────────────── */ .forum-loading, .forum-empty { text-align: center; padding: 80px 0; color: var(--fx-dim); font-family: "VT323", monospace; font-size: 22px; } .forum-empty h2 { font-family: "Press Start 2P", monospace; font-size: 14px; color: var(--fx-yellow); margin: 0 0 12px; } .forum-empty a { color: var(--fx-cyan); } .forum-login-prompt { text-align: center; padding: 40px; font-family: "VT323", monospace; font-size: 20px; color: var(--fx-dim); } .forum-login-prompt a { color: var(--fx-cyan); } /* inline reply edit textarea (injected at runtime) */ .forum-edit-textarea { width: 100%; min-height: 100px; background: var(--fx-bg-2); border: 2px solid var(--fx-line-2); color: var(--fx-ink); padding: 10px; font-family: "VT323", monospace; font-size: 18px; resize: vertical; outline: 0; } .forum-edit-textarea:focus { border-color: var(--fx-yellow); } .forum-edit-actions { display: flex; gap: 8px; margin-top: 8px; justify-content: flex-end; } /* ───────────────── Responsive ───────────────── */ @media (max-width: 1100px) { .forum-page-grid, .forum-thread-page { grid-template-columns: 220px 1fr; } } @media (max-width: 820px) { .forum-page-grid, .forum-thread-page { grid-template-columns: 1fr; } .forum-rail { display: none; } .forum-page .forum-nav-links { display: none; } .forum-topic { grid-template-columns: 40px 1fr; } .forum-t-stats, .forum-t-activity { grid-column: 2; text-align: left; } .forum-t-stats { display: flex; gap: 14px; justify-content: flex-start; } .forum-t-activity { min-width: 0; } .forum-post { grid-template-columns: 1fr; } .forum-post-side { display: flex; gap: 12px; align-items: center; text-align: left; border-right: 0; border-bottom: 2px solid var(--fx-line-2); } .forum-post-side .av { width: 48px; height: 48px; font-size: 14px; margin: 0; } .forum-post-side .badges { margin: 0; justify-content: flex-start; } .forum-cat-picker { grid-template-columns: repeat(2, 1fr); } }