.forum-top {
    padding: 14px max(20px, 5vw);
}

.forum-top strong {
    margin-left: auto;
}

.forum-shell,
.forum-topic-page,
.forum-moderation-page,
.forum-form-shell {
    padding-bottom: 64px;
}

.forum-heading {
    align-items: end;
}

.forum-filters {
    align-items: end;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(180px, 1.5fr) minmax(150px, 1fr) minmax(140px, .8fr) auto auto;
    margin-bottom: 22px;
}

.forum-filters label,
.forum-editor label,
.forum-reply-form label,
.forum-category-form label {
    display: grid;
    font-weight: 800;
    gap: 6px;
}

.forum-filters input,
.forum-filters select,
.forum-editor input,
.forum-editor select,
.forum-editor textarea,
.forum-reply-form textarea {
    width: 100%;
}

.forum-layout {
    align-items: start;
    display: grid;
    gap: 22px;
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
}

.forum-categories {
    display: grid;
    gap: 6px;
    position: sticky;
    top: 16px;
}

.forum-categories h2 {
    margin: 0 0 8px;
}

.forum-category-link {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--ink);
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding: 10px;
    text-decoration: none;
}

.forum-category-link:hover,
.forum-category-link.active {
    background: var(--soft);
    border-color: var(--line);
}

.forum-category-link span {
    display: grid;
    gap: 2px;
}

.forum-category-link small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.35;
}

.forum-topic-list {
    display: grid;
    gap: 12px;
}

.forum-list-summary,
.forum-pagination,
.forum-topic-card,
.forum-state-row,
.forum-item-actions,
.forum-form-actions,
.forum-simulator-card,
.forum-moderator-actions,
.forum-login-callout {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
}

.forum-list-summary {
    color: var(--muted);
    padding: 0 4px;
}

.forum-topic-card {
    padding: 18px 20px;
}

.forum-topic-main {
    flex: 1 1 420px;
}

.forum-topic-main h2 {
    font-size: 21px;
    margin: 8px 0 5px;
}

.forum-topic-main h2 a {
    color: var(--ink);
    text-decoration: none;
}

.forum-topic-main p {
    margin: 4px 0;
}

.forum-topic-stats {
    display: flex;
    gap: 12px;
    margin: 0;
}

.forum-topic-stats div {
    background: var(--surface-2);
    border-radius: 8px;
    min-width: 78px;
    padding: 8px;
    text-align: center;
}

.forum-topic-stats dt {
    color: var(--muted);
    font-size: 11px;
}

.forum-topic-stats dd {
    font-size: 20px;
    font-weight: 900;
    margin: 0;
}

.forum-state {
    text-transform: capitalize;
}

.forum-state.open {
    background: #dcfce7;
    color: #166534;
}

.forum-state.closed,
.forum-state.hidden {
    background: #e5e7eb;
    color: #374151;
}

.forum-state.resolved {
    background: #ccfbf1;
    color: #115e59;
}

.forum-state.unanswered {
    background: #ffedd5;
    color: #9a3412;
}

.forum-origin {
    background: #e0e7ff;
    border: 1px solid #a5b4fc;
    color: #3730a3;
    text-transform: none;
}

.forum-empty {
    text-align: center;
}

.forum-pagination {
    justify-content: center;
    margin-top: 12px;
}

.forum-breadcrumb {
    display: flex;
    gap: 8px;
    margin: 18px 0;
}

.forum-question h1 {
    font-size: clamp(28px, 4vw, 44px);
    line-height: 1.08;
    margin: 14px 0 8px;
}

.forum-content {
    font-size: 17px;
    margin-top: 22px;
    overflow-wrap: anywhere;
}

.forum-content p {
    margin: 0 0 16px;
}

.forum-code {
    background: #111827;
    border: 1px solid #334155;
    border-radius: 8px;
    color: #e5f5f2;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 14px;
    line-height: 1.55;
    overflow: auto;
    padding: 16px;
    white-space: pre;
}

.forum-simulator-card {
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 8px;
    margin-top: 22px;
    padding: 14px;
}

.forum-simulator-card p {
    margin: 3px 0 0;
}

.forum-item-actions {
    justify-content: flex-start;
    margin-top: 18px;
}

.forum-item-actions form,
.forum-moderator-actions form {
    margin: 0;
}

.forum-moderator-actions {
    margin-top: 14px;
}

.forum-moderator-actions button.secondary {
    background: #475569;
}

.forum-responses {
    display: grid;
    gap: 14px;
    margin-top: 28px;
}

.forum-answer {
    border-left: 5px solid var(--line);
}

.forum-answer.is-solution {
    background: #f0fdfa;
    border-color: var(--accent);
}

.forum-answer.is-hidden {
    opacity: .65;
}

.forum-answer > header {
    align-items: center;
    border-bottom: 1px solid var(--line);
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
    padding-bottom: 10px;
}

.forum-answer > header div {
    align-items: center;
    display: flex;
    gap: 8px;
}

.forum-reply-form,
.forum-closed-note,
.forum-login-callout {
    margin-top: 24px;
}

.forum-editor,
.forum-reply-form {
    display: grid;
    gap: 16px;
}

.forum-editor small {
    color: var(--muted);
    font-weight: 500;
}

.forum-form-actions {
    justify-content: flex-start;
}

.forum-moderation-list {
    margin-bottom: 22px;
}

.forum-moderation-list article {
    align-items: center;
    border-top: 1px solid var(--line);
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 11px 0;
}

.forum-moderation-list article div {
    align-items: center;
    display: flex;
    gap: 8px;
}

.forum-admin-grid {
    align-items: start;
    display: grid;
    gap: 22px;
    grid-template-columns: minmax(0, 1.4fr) minmax(280px, .8fr);
}

.forum-category-admin-list {
    display: grid;
    gap: 12px;
}

.forum-category-form {
    border-top: 1px solid var(--line);
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr 1.5fr 80px auto auto;
    padding-top: 12px;
}

.forum-check {
    align-items: center;
    display: flex !important;
    grid-auto-flow: column;
}

@media (max-width: 900px) {
    .forum-filters,
    .forum-layout,
    .forum-admin-grid,
    .forum-category-form {
        grid-template-columns: 1fr;
    }

    .forum-categories {
        position: static;
    }

    .forum-topic-stats {
        width: 100%;
    }

    .forum-top strong {
        margin-left: 0;
        width: 100%;
    }
}

@media (max-width: 560px) {
    .forum-topic-card,
    .forum-question,
    .forum-answer {
        padding: 14px;
    }

    .forum-topic-stats div {
        flex: 1;
    }
}