.community-page {
    --community-ink: #06144d;
    --community-blue: #0566ee;
    --community-muted: #5d6f9d;
    --community-line: #dbe5f3;
    background: #f4f9fd;
    color: var(--community-ink);
    min-height: 72vh;
    padding-bottom: 64px;
}

/* The reference uses a compact product header on this destination. */
.community-shell .tn-shell { width: min(1240px, calc(100% - 48px)); }
.community-shell .tn-navwrap { min-height: 44px; }
.community-shell .tn-brand img { height: 25px; }
.community-shell .tn-nav { gap: 27px; font-size: 12px; }
.community-shell .tn-nav-item { height: 44px; }
.community-shell .tn-nav-link,
.community-shell .tn-nav > a { font-size: 12px; height: 44px; }
.community-shell .tn-icon-link { font-size: 18px; height: 32px; width: 32px; }
.community-shell .tn-user-menu__button { gap: 8px; padding: 3px 0; }
.community-shell .tn-user-menu__text small { display: none; }
.community-shell .tn-nav > a[href="/community"] { border-bottom: 3px solid #0872ec; color: #0870e8; height: 44px; display: inline-flex; align-items: center; }

.community-page h1,
.community-page h2,
.community-page h3 { font-family: Georgia, 'Times New Roman', serif; }

.community-hero {
    background:
        linear-gradient(90deg, #edf8ff 0%, rgba(240, 249, 255, .98) 39%, rgba(235, 247, 255, .65) 57%, rgba(233, 246, 255, .05) 78%),
        url('/images/community-hero.png') center / cover no-repeat;
    border-bottom: 1px solid #d7e9f6;
    min-height: 198px;
    overflow: hidden;
}

.community-hero__inner { min-height: 198px; padding-bottom: 14px; position: relative; }
.community-breadcrumb { align-items: center; display: flex; font-size: 11px; gap: 9px; padding: 20px 0 8px; }
.community-breadcrumb a { color: var(--community-ink); }
.community-breadcrumb i { color: #8797b7; font-size: 8px; }
.community-hero__copy { position: relative; z-index: 1; }
.community-hero__copy h1 { font-size: clamp(42px, 4vw, 52px); letter-spacing: -2.7px; line-height: .98; margin: 4px 0 4px; }
.community-hero__copy p { font-size: clamp(15px, 1.6vw, 18px); font-weight: 650; margin: 0; }
.community-hero__scribble { color: #0760cf; font-family: 'Segoe Print', cursive; font-size: 13px; font-style: italic; left: 64%; line-height: 1.45; position: absolute; top: 38px; transform: rotate(-7deg); }
.community-hero__scribble strong { font-weight: 500; }

.community-search {
    align-items: center;
    background: rgba(255, 255, 255, .97);
    border: 1px solid #ccdeef;
    border-radius: 13px;
    box-shadow: 0 8px 22px rgba(15, 68, 120, .1);
    display: flex;
    gap: 12px;
    margin-top: 14px;
    max-width: 790px;
    padding: 4px 5px 4px 17px;
    position: relative;
    z-index: 2;
}
.community-search > i { color: #153f8e; font-size: 18px; }
.community-search input { background: transparent; border: 0; color: #142357; flex: 1; font: inherit; min-width: 80px; outline: 0; padding: 10px 0; }
.community-search__submit { background: transparent; border: 0; color: #31518f; cursor: pointer; display: none; font: inherit; font-size: 13px; font-weight: 800; padding: 10px; }
.community-primary {
    align-items: center; background: linear-gradient(180deg, #1972eb, #0656c9); border: 0; border-radius: 9px;
    box-shadow: 0 5px 12px rgba(0, 92, 219, .18); color: #fff; cursor: pointer; display: inline-flex;
    font: inherit; font-size: 13px; font-weight: 800; gap: 8px; justify-content: center; min-height: 42px; padding: 0 17px;
}
.community-primary:hover { color: #fff; filter: brightness(1.03); transform: translateY(-1px); }
.community-ask { flex: 0 0 auto; font-size: 15px; min-width: 190px; }

.community-viewbar { background: #fff; border-bottom: 1px solid var(--community-line); box-shadow: 0 3px 10px rgba(17, 47, 86, .04); }
.community-viewbar__inner { align-items: stretch; display: flex; gap: 8px; min-height: 56px; overflow-x: auto; }
.community-viewbar__inner > a { align-items: center; border-bottom: 3px solid transparent; color: #182b67; display: flex; flex: 0 0 auto; font-size: 13px; font-weight: 750; padding: 0 15px; }
.community-viewbar__inner > a.is-active { border-color: #0875f5; color: #0870e8; }
.community-viewbar__query { align-items: center; color: #64749a; display: flex; font-size: 12px; gap: 8px; margin-left: auto; white-space: nowrap; }
.community-viewbar__query a { align-items: center; background: #ebf1f8; border-radius: 50%; color: #3e568e; display: flex; height: 22px; justify-content: center; width: 22px; }
.community-following { align-items: center; border-left: 1px solid #dce5f1; display: flex; gap: 15px; margin-left: auto; padding-left: 20px; white-space: nowrap; }
.community-following > span { color: #203467; font-size: 11px; font-weight: 700; }
.community-following > a { align-items: center; color: #12275e; display: flex; font-size: 10px; font-weight: 800; gap: 7px; }
.community-following__thumb { background-position: center; background-size: cover; border: 1px solid #cfdbea; border-radius: 50%; display: inline-block; height: 28px; width: 28px; }
.community-following__thumb.is-bangkok { background-image: url('/images/community-hero.png'); background-position: 83% 48%; }
.community-following__thumb.is-chiang-mai { background: linear-gradient(145deg, #4c8546 15%, #d8e8a5 50%, #345e39 85%); }
.community-following__thumb.is-visas { background: linear-gradient(145deg, #d7e3f0 0 45%, #3c6943 46% 65%, #97b76c 66%); }
.community-following__thumb.is-food { background: radial-gradient(circle at 50% 50%, #f4d47e 0 25%, #9e391c 26% 47%, #3b702f 48% 64%, #f2c662 65%); }
.community-following__edit { position: relative; }
.community-following__edit summary { border: 1px solid #d7e1ee; border-radius: 7px; color: #244177; cursor: pointer; font-size: 10px; font-weight: 800; list-style: none; padding: 7px 12px; }
.community-following__edit summary::-webkit-details-marker { display: none; }
.community-following__edit > div { background: #fff; border: 1px solid #d9e3ef; border-radius: 10px; box-shadow: 0 14px 35px rgba(8, 25, 70, .18); display: grid; gap: 9px; padding: 14px; position: absolute; right: 0; top: 39px; width: 205px; z-index: 20; }
.community-following__edit strong { font-size: 11px; }
.community-following__edit label { align-items: center; color: #314674; display: flex; font-size: 11px; gap: 8px; }
.community-following__edit button { background: #0869da; border: 0; border-radius: 7px; color: #fff; cursor: pointer; font: inherit; font-size: 10px; font-weight: 800; padding: 8px; }

.community-content { padding-top: 16px; }
.community-layout { align-items: start; display: grid; gap: 14px; grid-template-columns: minmax(0, 2.12fr) minmax(290px, .98fr); }
.community-main { min-width: 0; }
.community-alert { border-radius: 10px; font-size: 13px; font-weight: 700; margin-bottom: 13px; padding: 12px 15px; }
.community-alert.is-error { background: #fff0f2; border: 1px solid #ffc8cf; color: #9c1d2b; }
.community-alert.is-success { background: #eaf9f1; border: 1px solid #bde4cf; color: #146b44; }
.community-validation { color: #b42331; font-size: 12px; }

.community-feed { background: #fff; border: 1px solid var(--community-line); border-radius: 12px; box-shadow: 0 7px 22px rgba(14, 45, 83, .06); padding: 14px 9px 9px; }
.community-feed__head { align-items: center; display: flex; gap: 20px; justify-content: space-between; padding: 0 5px 8px; }
.community-feed__eyebrow { display: none; }
.community-feed__head h2 { font-size: 22px; letter-spacing: -.6px; margin: 0; }
.community-sort { align-items: center; color: #66779f; display: flex; font-size: 11px; font-weight: 800; gap: 7px; }
.community-sort select { background: #fff; border: 1px solid #d6e1ee; border-radius: 8px; color: #243a71; font: inherit; font-size: 11px; outline: 0; padding: 8px 25px 8px 9px; }
.community-topics { display: flex; gap: 5px; margin-bottom: 9px; overflow-x: auto; padding: 1px 5px 9px; scrollbar-width: thin; }
.community-topics a { align-items: center; border: 1px solid #d7e3f1; border-radius: 999px; color: #1b3470; display: flex; flex: 0 0 auto; font-size: 10px; font-weight: 700; gap: 5px; padding: 7px 8px; }
.community-topics a.is-active { background: #0871ee; border-color: #0871ee; color: #fff; }

.community-card-list { display: grid; gap: 7px; }
.community-post-card { background: #fff; border: 1px solid #d9e4f1; border-radius: 10px; display: grid; grid-template-columns: 126px minmax(0, 1fr); padding: 11px; transition: border-color .15s, box-shadow .15s; }
.community-post-card:hover { border-color: #bdcfe6; box-shadow: 0 7px 18px rgba(20, 56, 99, .07); }
.community-post-card__author { align-items: center; display: flex; flex-direction: column; gap: 3px; padding: 1px 12px 0 0; text-align: center; }
.community-post-card__author strong { font-size: 12px; margin-top: 3px; max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.community-post-card__author time { color: #6f80a5; font-size: 10px; }
.community-avatar { align-items: center; background: linear-gradient(145deg, #d7e9ff, #e8f2ff); border: 2px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px #bdd3ed; color: #1255b9; display: inline-flex; flex: 0 0 42px; font-size: 12px; font-weight: 900; height: 42px; justify-content: center; width: 42px; }
.community-post-card__content { min-width: 0; position: relative; }
.community-post-card__status { display: flex; gap: 5px; position: absolute; right: 0; top: 0; }
.community-solved, .community-locked { align-items: center; border-radius: 999px; display: inline-flex; font-size: 9px; font-weight: 800; gap: 5px; padding: 5px 8px; }
.community-solved { background: #e5f7ef; color: #168263; }
.community-locked { background: #edf1f5; color: #65728d; }
.community-post-card__body { display: block; padding: 0 90px 7px 0; }
.community-post-card__body h3 { color: #081956; font-size: 18px; letter-spacing: -.35px; line-height: 1.25; margin: 0 0 4px; }
.community-post-card__body p { color: #50648f; display: -webkit-box; font-size: 11px; line-height: 1.5; margin: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.community-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.community-tags a { background: #eaf3ff; border-radius: 999px; color: #0964d7; font-size: 9px; font-weight: 800; padding: 5px 9px; }
.community-accepted-preview { align-items: center; background: linear-gradient(90deg, #e5f7f0, #effaf6); border-radius: 7px; color: #154c42; display: flex; gap: 10px; margin-top: 7px; padding: 7px 10px; }
.community-accepted-preview > i { align-items: center; background: #17876b; border-radius: 50%; color: #fff; display: flex; height: 22px; justify-content: center; width: 22px; }
.community-accepted-preview span { display: flex; flex: 1; flex-direction: column; }
.community-accepted-preview strong { font-size: 10px; }
.community-accepted-preview small { color: #4e7180; font-size: 9px; }
.community-accepted-preview b { color: #0967dd; font-size: 9px; }
.community-card-actions { align-items: center; border-top: 1px solid #edf2f7; display: flex; gap: 17px; margin-top: 7px; min-height: 32px; padding-top: 6px; }
.community-card-actions a, .community-card-actions button, .community-report summary { background: none; border: 0; color: #55709d; cursor: pointer; font: inherit; font-size: 10px; font-weight: 700; padding: 4px 0; }
.community-card-actions button.is-liked { color: #0669df; }
.community-card-actions form { margin: 0; }
.community-card-actions i { margin-right: 3px; }
.community-last-activity { color: #8995ae; font-size: 9px; margin-left: auto; }

.community-empty { align-items: center; background: #f9fbfe; border: 1px dashed #ccdaeb; border-radius: 10px; display: flex; flex-direction: column; padding: 52px 24px; text-align: center; }
.community-empty__icon { align-items: center; background: #e9f2ff; border-radius: 50%; color: #2674d8; display: flex; font-size: 26px; height: 58px; justify-content: center; width: 58px; }
.community-empty h3 { font-size: 20px; margin: 13px 0 5px; }
.community-empty p { color: #67799e; font-size: 13px; margin: 0 0 16px; }
.community-empty.is-compact { padding: 28px 20px; }
.community-pagination { align-items: center; display: flex; gap: 14px; justify-content: center; padding: 18px 0 9px; }
.community-pagination a { border: 1px solid #d5e0ed; border-radius: 8px; color: #1267d2; font-size: 11px; font-weight: 800; padding: 8px 10px; }
.community-pagination span { color: #7280a0; font-size: 10px; }

.community-sidebar { display: grid; gap: 9px; position: sticky; top: 54px; }
.community-side-card { background: #fff; border: 1px solid var(--community-line); border-radius: 11px; box-shadow: 0 6px 18px rgba(14, 45, 83, .05); padding: 11px; }
.community-side-card header { align-items: center; display: flex; justify-content: space-between; margin-bottom: 7px; }
.community-side-card h2 { font-size: 16px; letter-spacing: -.3px; margin: 0; }
.community-side-card header a { color: #066ce3; font-size: 9px; font-weight: 800; }
.community-help-card ol { display: grid; list-style: none; margin: 0; padding: 0; }
.community-help-card li { align-items: center; border-top: 1px solid #edf2f7; display: grid; gap: 7px; grid-template-columns: 17px 1fr auto; padding: 8px 0; }
.community-help-card li > span { align-items: center; background: #e4f1ff; border-radius: 50%; color: #1570d7; display: flex; font-size: 8px; font-weight: 900; height: 17px; justify-content: center; }
.community-help-card li a { color: #0d245f; font-size: 10px; font-weight: 700; line-height: 1.3; }
.community-help-card li time { color: #8290ad; font-size: 8px; white-space: nowrap; }
.community-side-empty { align-items: center; color: #597092; display: flex; font-size: 11px; gap: 8px; margin: 12px 0 4px; }
.community-side-empty i { color: #1b9a70; }
.community-hub-grid { display: grid; gap: 6px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.community-hub-grid > a { align-items: center; border: 1px solid #dce6f1; border-radius: 7px; display: flex; gap: 8px; min-width: 0; padding: 6px; }
.community-hub-grid > a > i { align-items: center; background: linear-gradient(145deg, #cce6ff, #e4f3ff); border-radius: 6px; color: #1670c7; display: flex; flex: 0 0 38px; height: 34px; justify-content: center; }
.community-hub-grid span { display: flex; flex-direction: column; min-width: 0; }
.community-hub-grid strong { color: #10275f; font-size: 10px; }
.community-hub-grid small { color: #7888a7; font-size: 8px; }
.community-trust-card ul { display: grid; gap: 9px; list-style: none; margin: 11px 0 2px; padding: 0; }
.community-trust-card li { align-items: flex-start; display: flex; gap: 9px; }
.community-trust-card li > i { color: #0971e8; margin-top: 2px; width: 15px; }
.community-trust-card li span { color: #71809d; display: flex; flex-direction: column; font-size: 9px; line-height: 1.35; }
.community-trust-card li strong { color: #213669; font-size: 10px; }

.community-areas { margin-top: 11px; }
.community-areas h2 { font-size: 20px; margin: 0 0 7px; }
.community-areas > div { display: grid; gap: 9px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.community-areas > div > a { align-items: center; background: linear-gradient(125deg, #fff 48%, #dff2ff); border: 1px solid #d5e3f0; border-radius: 9px; display: flex; gap: 10px; min-height: 58px; overflow: hidden; padding: 9px 12px; }
.community-areas > div > a > i { color: #0867d7; font-size: 23px; width: 30px; }
.community-areas span { display: flex; flex-direction: column; }
.community-areas strong { color: #10275f; font-size: 11px; }
.community-areas small { color: #687b9e; font-size: 8px; line-height: 1.35; }

.community-composer-dialog { background: #fff; border: 0; border-radius: 16px; box-shadow: 0 24px 80px rgba(3, 20, 70, .28); color: var(--community-ink); max-height: calc(100vh - 40px); max-width: 680px; overflow: auto; padding: 25px; width: calc(100% - 32px); }
.community-composer-dialog::backdrop { background: rgba(6, 18, 55, .65); backdrop-filter: blur(3px); }
.community-dialog-close { position: absolute; right: 16px; top: 15px; }
.community-dialog-close button { align-items: center; background: #edf2f7; border: 0; border-radius: 50%; color: #526481; cursor: pointer; display: flex; height: 32px; justify-content: center; width: 32px; }
.community-composer__heading { align-items: center; display: flex; gap: 13px; margin-bottom: 20px; padding-right: 30px; }
.community-composer__heading > span { align-items: center; background: #e9f2ff; border-radius: 12px; color: #086add; display: flex; flex: 0 0 47px; font-size: 20px; height: 47px; justify-content: center; }
.community-composer__heading small { color: #0870e5; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.community-composer__heading h2 { font-size: 24px; margin: 0; }
.community-composer__heading p { color: #6a7898; font-size: 12px; margin: 2px 0 0; }
.community-composer-form { display: grid; gap: 13px; }
.community-field { display: grid; gap: 6px; position: relative; }
.community-field label { color: #1c2f61; font-size: 12px; font-weight: 800; }
.community-field label span { color: #8995ad; font-weight: 500; }
.community-field input, .community-field select, .community-field textarea, .community-reply-form textarea, .community-report select, .community-report textarea { background: #fbfdff; border: 1px solid #d6e1ee; border-radius: 9px; color: #172752; font: inherit; outline: 0; padding: 11px 12px; resize: vertical; width: 100%; }
.community-field input:focus, .community-field select:focus, .community-field textarea:focus, .community-reply-form textarea:focus { border-color: #3982df; box-shadow: 0 0 0 3px rgba(19, 106, 218, .1); }
.community-reference-results { background: #fff; border: 1px solid #d6e1ee; border-radius: 9px; box-shadow: 0 12px 28px rgba(8, 30, 70, .15); left: 0; max-height: 220px; overflow: auto; padding: 5px; position: absolute; right: 0; top: 67px; z-index: 5; }
.community-reference-results button { align-items: center; background: transparent; border: 0; border-radius: 7px; color: #1a3167; cursor: pointer; display: flex; font: inherit; justify-content: space-between; padding: 9px; text-align: left; width: 100%; }
.community-reference-results button:hover { background: #edf5ff; }
.community-reference-results small { color: #7686a6; font-size: 10px; }
.community-reference-selected { align-items: center; background: #eaf4ff; border-radius: 8px; color: #1755a5; display: flex; font-size: 11px; font-weight: 750; gap: 7px; padding: 9px 11px; }
.community-reference-selected button { background: none; border: 0; color: #40628f; cursor: pointer; margin-left: auto; }
.community-composer__note { align-items: flex-start; background: #fff7df; border: 1px solid #f1dfac; border-radius: 9px; color: #6b5521; display: flex; font-size: 10px; gap: 9px; line-height: 1.45; padding: 10px 12px; }
.community-composer__footer { align-items: center; display: flex; gap: 15px; justify-content: space-between; }
.community-composer__footer small { color: #7483a0; font-size: 10px; }

/* Discussion page */
.community-discussion-page { padding-top: 1px; }
.community-discussion-page .community-layout { margin-top: 0; }
.community-discussion-page > .community-breadcrumb { padding: 18px 0 13px; }
.community-original-post, .community-reply, .community-reply-form, .community-signin-card { background: #fff; border: 1px solid var(--community-line); border-radius: 12px; box-shadow: 0 7px 22px rgba(14, 45, 83, .06); }
.community-original-post { padding: 24px; }
.community-author-row { align-items: center; display: flex; gap: 10px; }
.community-author-row > div { display: flex; flex: 1; flex-direction: column; gap: 2px; }
.community-author-row strong { font-size: 13px; }
.community-author-row div > span { color: #7684a3; font-size: 10px; }
.community-author-row b { color: #1a67cf; }
.community-original-post h1 { font-size: clamp(26px, 3.5vw, 38px); letter-spacing: -1.1px; line-height: 1.15; margin: 21px 0 14px; }
.community-full-content { color: #34466d; font-size: 14px; line-height: 1.75; overflow-wrap: anywhere; white-space: pre-wrap; }
.community-post-image { border-radius: 11px; margin-top: 18px; max-height: 520px; object-fit: cover; width: 100%; }
.community-reference { align-items: center; background: #edf5ff; border: 1px solid #d4e4f7; border-radius: 9px; display: flex; gap: 10px; margin-top: 18px; padding: 12px; }
.community-reference > i:first-child { color: #0f6dda; font-size: 18px; }
.community-reference span { display: flex; flex: 1; flex-direction: column; }
.community-reference small { color: #7182a1; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.community-reference strong { color: #172f65; font-size: 12px; }
.community-original-actions { margin-top: 20px; }
.community-replies { margin-top: 20px; scroll-margin-top: 95px; }
.community-replies__head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 10px; }
.community-replies__head h2 { font-size: 21px; margin: 0; }
.community-replies__head h2 span, .community-replies__head small { color: #7886a4; font-size: 11px; }
.community-reply { margin-bottom: 9px; padding: 18px; position: relative; }
.community-reply.is-accepted { border-color: #9ed8c5; box-shadow: 0 6px 18px rgba(18, 128, 91, .1); }
.community-accepted-label { background: #e3f7ee; border-radius: 999px; color: #12805d; font-size: 10px; font-weight: 850; padding: 6px 9px; position: absolute; right: 14px; top: 14px; }
.community-reply .community-full-content { margin: 12px 0 9px 52px; }
.community-accept-form { margin-left: auto !important; }
.community-accept-form button { color: #18815f; }
.community-report { position: relative; }
.community-report summary { list-style: none; }
.community-report summary::-webkit-details-marker { display: none; }
.community-report[open] form { background: #fff; border: 1px solid #dce4f0; border-radius: 10px; box-shadow: 0 12px 32px rgba(8, 22, 79, .16); display: grid; gap: 9px; left: 0; min-width: 280px; padding: 12px; position: absolute; top: 28px; z-index: 5; }
.community-report label { display: grid; font-size: 11px; font-weight: 800; gap: 5px; }
.community-report button[type='submit'] { background: #1264ca; border-radius: 7px; color: #fff; padding: 8px 10px; }
.community-reply-form { display: grid; gap: 8px; margin-top: 17px; padding: 20px; }
.community-reply-form h2 { font-size: 19px; margin: 0 0 3px; }
.community-reply-form label { font-size: 11px; font-weight: 800; }
.community-reply-form .community-primary { justify-self: end; }
.community-locked-note { align-items: center; background: #edf1f6; border-radius: 10px; color: #586783; display: flex; gap: 11px; margin-top: 17px; padding: 13px 15px; }
.community-locked-note span { display: flex; flex-direction: column; font-size: 10px; }
.community-locked-note strong { color: #263452; font-size: 12px; }
.community-signin-card { align-items: center; display: flex; gap: 15px; margin-top: 17px; padding: 18px; }
.community-signin-card > span { align-items: center; background: #edf3ff; border-radius: 10px; color: #1069d3; display: flex; height: 43px; justify-content: center; width: 43px; }
.community-signin-card > div { flex: 1; }
.community-signin-card h2 { font-size: 17px; margin: 0; }
.community-signin-card p { color: #6c7998; font-size: 11px; margin: 2px 0 0; }
.community-back { color: #1267d2; font-size: 10px; font-weight: 800; }

@media (max-width: 980px) {
    .community-shell .tn-navwrap { min-height: 76px; }
    .community-hero__scribble { display: none; }
    .community-following { display: none; }
    .community-layout { grid-template-columns: minmax(0, 1fr); }
    .community-sidebar { grid-template-columns: repeat(2, minmax(0, 1fr)); position: static; }
    .community-trust-card { grid-column: 1 / -1; }
    .community-areas > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
    .community-page { padding-bottom: 42px; }
    .community-hero { background-position: 70% center; background-size: auto 100%; }
    .community-hero__copy h1 { font-size: 40px; }
    .community-hero__copy p { max-width: 390px; }
    .community-search { flex-wrap: wrap; }
    .community-ask { flex: 1 0 100%; min-width: 0; }
    .community-viewbar__inner > a { padding: 0 10px; }
    .community-viewbar__query { display: none; }
    .community-content { padding-top: 10px; }
    .community-feed__head { align-items: flex-start; }
    .community-sort { align-items: flex-start; flex-direction: column; }
    .community-post-card { grid-template-columns: 46px minmax(0, 1fr); }
    .community-post-card__author { padding-right: 7px; }
    .community-post-card__author strong, .community-post-card__author time { display: none; }
    .community-post-card__body { padding-right: 0; padding-top: 28px; }
    .community-card-actions { align-items: flex-start; flex-wrap: wrap; gap: 8px 14px; }
    .community-last-activity { margin-left: 0; }
    .community-sidebar { grid-template-columns: 1fr; }
    .community-trust-card { grid-column: auto; }
    .community-areas > div { grid-template-columns: 1fr; }
    .community-composer-dialog { padding: 20px 17px; }
    .community-composer__footer { align-items: stretch; flex-direction: column; }
    .community-original-post, .community-reply, .community-reply-form { padding: 17px; }
    .community-reply .community-full-content { margin-left: 0; }
    .community-report[open] form { left: auto; min-width: min(280px, calc(100vw - 48px)); right: -42px; }
}

@media (min-width: 681px) {
    .community-topics { flex-wrap: wrap; overflow-x: visible; }
}