:root { --ink:#202923; --muted:#858d86; --line:#e4e8e4; --green:#347749; --light:#f2f6f2; }
.community-page { background:#f6f7f6; color:var(--ink); font-family:Arial,'Malgun Gothic',sans-serif; font-size:14px; line-height:1.6; }
.community-page a { color:inherit; text-decoration:none; }
.community-page a:hover { color:var(--green); }
.community-page button,.community-page input { font:inherit; }
.community-page button,.community-page a { -webkit-tap-highlight-color:transparent; }
.community-page :focus-visible { outline:3px solid #77a586; outline-offset:3px; }
.site-width { width:min(1200px,calc(100% - 48px)); margin-inline:auto; }
.utility-bar { background:#f0f2f0; border-bottom:1px solid var(--line); font-size:11px; color:#737d74; }
.utility-bar > div { display:flex; align-items:center; justify-content:space-between; min-height:32px; }
.utility-bar > div > div { display:flex; gap:18px; }
.utility-bar button { background:none; border:0; padding:0; color:inherit; }
.community-header { display:grid; grid-template-columns:auto minmax(160px,390px) auto; align-items:center; justify-content:space-between; gap:24px; min-height:110px; }
.brand-partnership { display:flex; align-items:center; gap:20px; min-width:0; }
.title-sponsor { flex:none; border-left:1px solid var(--line); padding-left:20px; width:190px; }
.title-sponsor-label { display:block; color:#96a198; font-size:8px; letter-spacing:1.5px; font-weight:700; margin-bottom:5px; }
.title-sponsor-logo { width:100%; height:64px; display:flex; align-items:center; justify-content:center; }
.title-sponsor-logo img { width:100%; height:100%; object-fit:contain; object-position:left center; }
.title-sponsor-name { display:block; margin:0; min-width:0; overflow-wrap:anywhere; }
.title-sponsor.has-sponsor { width:auto; max-width:340px; flex-shrink:1; }
.title-sponsor .title-sponsor-brand { gap:12px; min-width:0; flex-shrink:1; }
.title-sponsor .title-sponsor-brand img { width:64px; height:64px; flex:0 0 64px; object-fit:contain; }
.title-sponsor-placeholder { border:1px dashed #cdd8cf; border-radius:3px; background:#f8faf8; color:#a0aba2; font-size:11px; letter-spacing:1px; }
.community-page > .community-header { background:#fff; }
.community-page { background:linear-gradient(#fff 0 193px,#f6f7f6 193px); }
.brand { display:flex; gap:14px; align-items:center; flex-shrink:0; }
.brand img { width:102px; height:65px; object-fit:contain; }
.brand > span { font-size:27px; font-weight:900; letter-spacing:2px; line-height:1.15; color:#28683c; }
.brand small { display:block; font-size:10px; letter-spacing:0; font-weight:400; color:#8a938c; margin-top:7px; }
.brand-country-code { display:block; margin-top:3px; font-size:.9em; line-height:1.1; font-weight:800; letter-spacing:.08em; text-align:center; }
.header-search { display:flex; align-items:center; border:2px solid #3c7d4f; border-radius:5px; width:390px; max-width:100%; background:#fff; }
.header-search input { border:0; padding:11px 16px; flex:1; min-width:0; width:0; background:transparent; outline:none; font-size:13px; }
.header-search button { width:44px; border:0; background:none; font-size:28px; color:var(--green); }
.header-write { display:flex; gap:8px; align-items:center; font-weight:700; white-space:nowrap; }
.community-nav { background:#fff; border-top:1px solid #eef0ee; border-bottom:2px solid var(--green); }
.nav-inner { display:flex; gap:0; align-items:stretch; }
.nav-inner a { flex:1; padding:15px 8px; text-align:center; white-space:nowrap; font-weight:700; font-size:13px; }
.nav-inner a:hover { background:var(--light); }
.nav-inner a:first-child { color:var(--green); border-bottom:3px solid var(--green); }
.community-content { width:min(1248px,100%); padding:28px 24px 48px; }
.community-shell { display:grid; grid-template-columns:215px minmax(0,1fr); gap:24px; align-items:start; }
.community-main { min-width:0; }
.community-main > .site-messages { margin-bottom:20px; }
.sidebar-navigation { display:flex; flex-direction:column; }
.sidebar-navigation > summary { display:none; }
.sidebar-navigation .side-menu { margin-bottom:16px; }
.shared-sidebar { gap:16px; }
.nav-inner a:first-child { border-bottom:0; color:inherit; }
.nav-inner > a[aria-current] { color:var(--green); box-shadow:inset 0 -3px var(--green); }
.nav-group { flex:1; position:relative; min-width:0; }
.nav-group summary { list-style:none; padding:15px 8px; text-align:center; font-size:13px; font-weight:700; cursor:pointer; }
.nav-group summary::-webkit-details-marker { display:none; }
.nav-group summary span { color:#8e9a91; margin-left:5px; font-size:10px; }
.nav-group[open] summary { background:var(--light); color:var(--green); }
.nav-popover { position:absolute; left:0; top:100%; z-index:30; min-width:180px; padding:8px; border:1px solid var(--line); background:#fff; box-shadow:0 8px 24px rgb(24 45 29 / 12%); border-radius:0 0 5px 5px; }
.nav-popover a { display:block; text-align:left; padding:9px 12px; font-size:12px; font-weight:400; }
.community-banner { min-height:174px; padding:24px 30px; }
.community-banner h1 { font-size:26px; margin:8px 0; }
.community-banner p { margin-bottom:8px; }
.banner-art { width:130px; height:130px; }
.banner-art span { font-size:90px; }
.board-previews { grid-template-columns:repeat(2,minmax(0,1fr)); }
.board-previews > :last-child:nth-child(odd) { grid-column:1/-1; }
.feed-time,.feed-votes { flex:none; font-size:10px; color:#95a299; white-space:nowrap; }
.feed-criteria { font-size:10px; color:#95a299; margin:10px 20px 0; }
.image-indicator { color:#97a79b; font-size:11px; white-space:nowrap; flex:none; margin-inline:2px; }
.popular-score { color:#bd765b; }
.best-score { color:#b68b3a; }
.community-table td { padding-block:12px; }
.board-filter-bar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:18px; font-size:12px; color:#84958a; }
.board-filter-bar select { min-width:160px; }
.board-filter-bar select,.board-filter-bar button,.scoped-search select,.page-jump input,.page-jump button { border:1px solid #d8e1da; background:white; border-radius:4px; color:#6d8273; padding:7px 10px; font-size:12px; }
.board-filter-bar a { margin-left:auto; font-size:11px; }
.board-notices { border-bottom:1px solid var(--line); padding:10px 0; }
.board-notices a { display:flex; align-items:center; gap:10px; padding:9px 0; font-size:12px; }
.board-notices strong { font-weight:500; }
.board-notices summary { font-size:10px; color:#8b9b90; padding:6px 0; cursor:pointer; }
.board-highlights { border-bottom:1px solid var(--line); padding:16px 0 4px; }
.highlight-heading { display:flex; justify-content:space-between; gap:12px; font-size:12px; color:#ac795d; }
.highlight-heading a { font-size:10px; color:#96a298; }
.board-highlights .compact-feed { padding:8px 0; min-height:0; }
.listing-tabs { display:flex; gap:22px; overflow-x:auto; margin-bottom:14px; }
.listing-tabs a { padding:9px 0; font-size:12px; white-space:nowrap; color:#8a998e; }
.listing-tabs [aria-current] { color:var(--green); font-weight:700; border-bottom:2px solid var(--green); }
.page-jump { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px; font-size:11px; color:#99a49c; margin:20px 0; }
.page-jump input { width:65px; }
.community-content .page-jump button { background:transparent; color:#6d8273; border:1px solid #d8e1da; padding:7px 10px; }
.scoped-search { max-width:520px; }
.scoped-search select { max-width:110px; min-width:0; }
.scoped-search .community-button { white-space:nowrap; }
.portal-layout { display:grid; grid-template-columns:240px minmax(0,1fr); gap:24px; align-items:start; }
.portal-sidebar,.portal-main { display:flex; flex-direction:column; gap:20px; min-width:0; }
.surface { background:#fff; border:1px solid var(--line); border-radius:6px; }
.member-box { padding:23px 20px 15px; }
.eyebrow { font-size:10px; font-weight:700; letter-spacing:1.4px; color:#608369; margin:0 0 10px; }
.member-box h2 { font-size:19px; font-weight:800; margin:0 0 12px; }
.member-box > p:not(.eyebrow) { font-size:12px; line-height:1.9; color:#8b928c; margin-bottom:20px; }
.member-box > p { word-break:keep-all; }
.community-button { display:inline-flex; justify-content:center; align-items:center; gap:8px; background:var(--green); color:white !important; border:1px solid var(--green); border-radius:4px; font-size:13px; font-weight:700; padding:10px 18px; cursor:pointer; }
.community-button:hover { background:#255e37; }
.member-box .community-button { width:100%; }
.member-links { display:flex; justify-content:space-between; gap:8px; font-size:10px; color:#929991; margin-top:14px; }
.member-links a { color:#59675c; }
.member-mark { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:50%; background:#edf3ee; color:var(--green); font-weight:800; margin-bottom:12px; }
.side-menu { padding:18px 0 10px; }
.side-menu h2 { font-size:13px; font-weight:800; margin:0 20px 12px; }
.side-menu a { display:flex; justify-content:space-between; padding:9px 20px; font-size:12px; color:#667068; }
.side-menu a:hover { background:var(--light); }
.side-menu a span { color:#aab6ad; }
.side-note { position:relative; padding:24px 22px; background:#e9efea; border:1px solid #dde7df; border-radius:6px; overflow:hidden; min-height:252px; }
.side-note h3 { margin:12px 0; font-size:24px; line-height:1.4; font-weight:800; color:#2d5336; letter-spacing:-1px; }
.side-note p { font-size:11px; color:#768c7c; }
.side-note > a { display:block; width:fit-content; margin-left:auto; }
.side-note img { display:block; width:62px; height:62px; object-fit:contain; margin:14px 0 0 auto; opacity:.7; }
.community-banner { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:30px 36px; min-height:236px; background:#214f35; border-radius:6px; color:white; overflow:hidden; position:relative; }
.banner-label { color:#a7c5ae; font-size:9px; letter-spacing:2.5px; font-weight:700; }
.community-banner h1 { font-size:30px; line-height:1.4; font-weight:800; letter-spacing:-1.2px; margin:12px 0; }
.community-banner p { color:#b7cebf; font-size:11px; margin-bottom:15px; }
.community-banner a { color:#fff; font-size:11px; font-weight:700; }
.community-banner a span { margin-left:22px; }
.banner-art { display:flex; flex-direction:column; align-items:center; justify-content:center; flex-shrink:0; width:180px; height:180px; border:1px solid #688770; border-radius:50%; outline:1px solid #42664d; outline-offset:18px; transform:rotate(-12deg); color:#c4d5c6; }
.banner-art span { font-family:Georgia,serif; font-size:130px; line-height:1; font-style:italic; }
.banner-art small { font-size:7px; letter-spacing:2px; }
.community-ticker { display:flex; align-items:center; gap:14px; padding:0 4px; font-size:11px; }
.community-ticker > span { background:#e8efea; color:#41764f; font-weight:800; border-radius:3px; padding:3px 8px; font-size:9px; }
.community-ticker p { margin:0; flex:1; min-width:0; color:#7d877f; }
.community-ticker > a { flex-shrink:0; color:#5c6c60; }
.feed-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.panel-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 20px; min-height:56px; border-bottom:1px solid var(--line); }
.panel-heading h2 { display:flex; align-items:center; gap:7px; font-size:14px; font-weight:800; margin:0; }
.panel-heading > a { color:#939c95; font-size:10px; white-space:nowrap; }
.heading-dot { width:6px; height:6px; border-radius:50%; background:#428759; }
.heading-dot.warm { background:#bb9c65; }
.compact-feed { padding:5px 20px 12px; list-style:none; margin:0; min-height:160px; }
.compact-feed li { display:flex; align-items:center; gap:10px; min-height:39px; border-bottom:1px solid #f2f3f2; font-size:12px; }
.compact-feed li:last-child { border:0; }
.compact-feed li > a { display:flex; align-items:center; gap:8px; flex:1; min-width:0; }
.feed-category { font-size:9px; color:#709278; background:#f0f5f0; padding:1px 5px; max-width:90px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex-shrink:0; }
.feed-title { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.reply-count { color:#568561; font-size:10px; flex-shrink:0; }
.feed-author { color:#a0a69f; font-size:10px; max-width:55px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.feed-rank { color:#4c7758; font-size:11px; font-weight:800; }
.ranked-feed .reply-count { margin-left:auto; }
.photo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; padding:20px; }
.photo-card { min-width:0; }
.photo-card img { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:4px; background:#edf0eb; }
.photo-card > div { padding-top:10px; }
.photo-card span { font-size:9px; color:#71917b; }
.photo-card h3 { font-size:13px; font-weight:700; margin:5px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.photo-card p { color:#a0a79f; font-size:10px; margin:0; }
.photo-grid > .empty-state { grid-column:1/-1; }
.topic-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.topic-card { position:relative; background:white; border:1px solid var(--line); border-radius:5px; padding:16px; }
.topic-number { color:#b0bdb2; font-size:10px; letter-spacing:1px; }
.topic-card h2 { font-size:13px; font-weight:800; line-height:1.5; margin:12px 0 6px; }
.topic-card p { font-size:10px; color:#949d95; margin-bottom:12px; }
.topic-arrow { color:#63876b; font-size:16px; }
.portal-bottom { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:22px 4px 0; border-top:1px solid var(--line); font-size:11px; color:#79857b; }
.portal-bottom strong { font-weight:400; }
.portal-bottom a { color:var(--green); }
.community-footer { margin-top:auto; border-top:1px solid var(--line); padding:30px 0; background:#fff; color:#99a199; font-size:11px; }
.community-footer > div { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.community-footer strong { font-size:19px; letter-spacing:2px; color:#608069; }
.community-footer p { margin:5px 0 0; font-size:10px; }
.account-dialog { width:min(400px,calc(100% - 32px)); max-height:calc(100dvh - 32px); overflow:auto; border:1px solid var(--line); border-radius:10px; margin:auto; padding:36px 28px 28px; background:#fff; color:var(--ink); }
.account-dialog::backdrop { background:rgb(16 32 21 / 55%); backdrop-filter:blur(3px); }
.account-close { position:absolute; right:12px; top:8px; border:0; background:none; font-size:28px !important; color:#718176; width:36px; height:36px; }
.account-dialog h2 { font-size:23px; font-weight:800; }
.muted { color:var(--muted); font-size:12px; }
.account-dialog label { display:block; font-size:12px; font-weight:700; margin:18px 0 6px; }
.account-dialog input { width:100%; padding:11px; border:1px solid #d4ddd5; border-radius:4px; }
.account-dialog .community-button { width:100%; margin-top:24px; }
.join-link { display:block; text-align:center; font-size:11px; margin-top:20px; color:#7b897f !important; }
body:has(.account-dialog[open]) { overflow:hidden; }
.breadcrumb-line { display:flex; gap:12px; color:#95a097; font-size:11px; margin-bottom:28px; }
.board-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:25px; }
.board-heading h1 { font-size:28px; font-weight:800; margin:0 0 10px; }
.board-heading p:not(.eyebrow) { color:#8d988f; font-size:12px; margin:0; }
.board-surface { padding:0 24px 28px; }
.board-toolbar { display:flex; justify-content:space-between; gap:16px; align-items:center; padding:20px 0; font-size:12px; color:#8b958d; }
.board-toolbar strong { color:var(--green); }
.board-toolbar > div { display:flex; gap:16px; }
.community-page .community-table { border-collapse:collapse; width:100%; }
.community-table th { background:#f7f9f7; border-top:2px solid #537c5e; border-bottom:1px solid var(--line); font-size:12px; padding:12px; font-weight:600; color:#717e75; }
.community-table td { border-bottom:1px solid #edf0ed; padding:16px 12px; font-size:13px; }
.community-table tbody tr:hover { background:#fafcf9; }
.community-table .number-column { width:65px; text-align:center; color:#9aa39a; }
.community-table .author-column { width:130px; color:#7d897f; font-size:11px; }
.community-table .comment-column { width:60px; color:#6d8d74; text-align:center; }
.table-category { display:inline-block; color:#74917a; font-size:10px; margin-right:12px; }
.board-pagination { display:flex; flex-wrap:wrap; justify-content:center; gap:6px; padding:28px 0; }
.board-pagination a { display:grid; place-items:center; min-width:32px; height:32px; padding:0 8px; color:#88978b; font-size:12px; border:1px solid #e6ece6; border-radius:3px; }
.board-pagination [aria-current] { background:var(--green); color:white; border-color:var(--green); }
.board-search { display:flex; justify-content:center; gap:8px; max-width:440px; margin:auto; }
.board-search input { flex:1; min-width:0; border:1px solid #dce3dd; border-radius:4px; padding:10px 12px; font-size:12px; }
.empty-state { padding:32px 16px !important; text-align:center; color:#9aa49c; font-size:12px; }
.site-messages { padding:12px 16px; background:#fff7e9; border:1px solid #eadabc; border-radius:4px; }
.site-messages p { margin:0; }
.footer-links { display:flex; flex-wrap:wrap; gap:16px; align-items:center; }
.home-notices { padding:6px 20px; }
.home-notices a { display:flex; align-items:center; gap:12px; padding:10px 0; font-size:12px; }
.home-notices strong { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.notice-badge { display:inline-block; padding:2px 6px; border-radius:3px; background:#e5eee6; color:#347749; font-size:10px; font-weight:700; white-space:nowrap; }
.community-table .notice-row { background:#f6f9f4; }
.community-table .current-post { background:#edf4ee; }
.mobile-notice { display:none; }
.reading-badge { font-size:9px; color:var(--green); margin-left:6px; white-space:nowrap; }
.community-table .date-column { width:78px; font-size:10px; color:#8d988f; }
.community-table .metric-column { width:52px; text-align:center; font-size:11px; color:#8d988f; }
.home-popular .compact-feed { min-height:0; }
.article-jump { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:16px; font-size:11px; color:#829085; margin-bottom:12px; }
.copy-link-row { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding-top:16px; font-size:11px; color:#94a097; }
.copy-link-row button { border:1px solid #dce4dd; border-radius:4px; padding:5px 10px; background:#fff; color:#688370; }
.copy-link-fallback { width:100%; border:1px solid var(--line); padding:8px; }
.post-reactions { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:10px; padding:16px 0 28px; scroll-margin-top:16px; }
.community-content .post-reactions button.reaction-button { display:inline-flex; align-items:center; gap:6px; border:1px solid #cfdcd2; padding:9px 18px; color:#5e7865; background:white; border-radius:5px; font-size:12px; }
.community-content .post-reactions button.is-active { background:#edf5ee; border-color:#347749; color:#347749; }
.report-link { background:none; border:0; color:#9b9489 !important; font-size:11px !important; padding:8px; }
.community-content button.text-button { padding:0; background:none; border:0; color:#8f9992; font-size:11px; }
.reading-guide { padding:18px 4px 0; color:#95a098; font-size:11px; }
.reading-guide a { color:#698871; }
.comment-item time { margin-left:auto; color:#a6afa8; font-size:10px; }
.comment-item form { margin-top:8px; }
.comment-form label[for=id_comment] { width:100%; }
.comment-form select { border:1px solid var(--line); padding:6px; border-radius:4px; }
.errorlist { color:#b55341; font-size:12px; padding-left:20px; }
.adjacent-posts { margin-top:20px; }
.adjacent-posts:empty { display:none; }
.adjacent-posts a { display:flex; gap:20px; padding:14px 20px; font-size:12px; border-bottom:1px solid var(--line); }
.adjacent-posts a:last-child { border:0; }
.adjacent-posts span { flex:none; color:#94a298; font-size:11px; }
.related-posts { margin-top:20px; padding:0 20px 10px; scroll-margin-top:20px; }
.related-posts .panel-heading { margin:0 0 16px; }
.back-top { text-align:right; color:#8a9b8e; font-size:11px; padding-top:20px; }
.page-ellipsis { padding:4px; color:#a4afa6; }
.activity-tabs { display:flex; gap:24px; margin-bottom:20px; border-bottom:1px solid var(--line); overflow-x:auto; }
.activity-tabs a { padding:12px 0; color:#89978b; white-space:nowrap; font-size:13px; }
.activity-tabs [aria-current] { color:var(--green); border-bottom:2px solid var(--green); font-weight:700; }
.activity-surface { padding:20px; }
.activity-surface h2 { font-size:19px; }
.activity-list article { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); }
.activity-list article > div { min-width:0; }
.activity-list article a { font-size:13px; }
.activity-list p,.activity-list time { font-size:11px; color:#96a198; margin:6px 0 0; }
.report-status { display:inline-block; background:#eff4ef; color:#65806d; padding:2px 8px; border-radius:3px; font-size:11px; margin-right:8px; }
.profile-details { display:grid; grid-template-columns:100px minmax(0,1fr); gap:16px; font-size:13px; padding-top:20px; }
.profile-details dt { color:#8f9b92; font-weight:400; }
.profile-details dd { margin:0; overflow-wrap:anywhere; }
.account-form-page,.rules-page,.editor-page { width:100%; max-width:900px; padding:32px; margin:0 auto; }
.account-form-page { max-width:560px; }
.account-form-page h1,.rules-page h1,.editor-page h1 { font-size:26px; margin:0 0 20px; font-weight:800; }
.account-form-page form { margin-top:24px; }
.account-form-page label,.editor-page label { display:block; margin-bottom:6px; font-size:12px; font-weight:700; }
.account-form-page textarea { width:100%; padding:10px; border:1px solid var(--line); border-radius:4px; }
.account-form-page .helptext { display:block; color:#95a097; font-size:11px; margin-top:6px; }
.account-form-page form ul:not(.errorlist) { color:#95a097; font-size:11px; padding-left:18px; }
.form-actions { display:flex; align-items:center; justify-content:flex-end; gap:24px; margin-top:28px; font-size:12px; }
.rules-page h2 { font-size:17px; margin-top:28px; }
.rules-page p { color:#839186; font-size:13px; line-height:1.9; }
.article-page { max-width:960px; margin:auto; }
.article-surface { padding:32px; }
.article-heading { border-bottom:1px solid var(--line); padding-bottom:24px; }
.article-heading h1 { font-size:27px; font-weight:800; margin:12px 0 20px; }
.article-meta { display:flex; flex-wrap:wrap; gap:18px; font-size:11px; color:#94a097; }
.article-meta a { margin-left:auto; color:var(--green); }
.article-body { padding:32px 0; min-height:220px; line-height:1.9; overflow-wrap:anywhere; }
.article-body img { max-width:100% !important; height:auto !important; }
.article-actions { display:flex; justify-content:space-between; border-top:1px solid var(--line); padding-top:20px; font-size:12px; color:#7f8d83; }
.article-video { display:block; padding:12px; background:var(--light); margin-bottom:24px; }
.article-comments { margin-top:20px; }
.comment-item { padding:20px; border-bottom:1px solid #eef1ee; }
.comment-item > div { display:flex; gap:16px; font-size:12px; }
.comment-item span { color:#9ca79e; font-size:10px; }
.comment-item p { margin:12px 0 0; font-size:13px; }
.comment-login { text-align:center; padding:24px; background:#fafcf9; color:#8c998f; font-size:12px; }
.comment-login button { color:var(--green); border:0; background:none; font-weight:700; }
.comment-form { padding:20px; display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.comment-form textarea { width:100%; padding:12px; border:1px solid #d9e1da; border-radius:4px; }
.comment-form input { width:65px; padding:6px; border:1px solid #d9e1da; border-radius:4px; }
.comment-form .community-button { margin-left:auto; }
.community-content form label { color:#66746a; }
.community-content form p > input, .community-content form p > select { display:block; width:100%; padding:10px; border:1px solid #d8e0d8; border-radius:4px; }
.community-content form button[type=submit], .community-content form > button { background:var(--green); border:0; padding:10px 20px; border-radius:4px; color:#fff; }
@media(max-width:1000px) {
 .community-shell { grid-template-columns:190px minmax(0,1fr); gap:18px; }
 .community-shell .community-table .date-column,.community-shell .community-table .metric-column { display:none; }
 .community-shell .community-table .author-column { width:82px; }
 .community-shell .community-table .number-column { width:48px; }
 .portal-layout { grid-template-columns:210px minmax(0,1fr); gap:18px; }
 .feed-grid { grid-template-columns:minmax(0,1fr); }
 .topic-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .banner-art { width:130px; height:130px; }
 .banner-art span { font-size:90px; }
 .community-banner { padding:26px; }
 .community-banner h1 { font-size:25px; }
 .community-header { gap:16px; }
 .brand-partnership { gap:12px; }
 .title-sponsor { width:120px; padding-left:12px; }
 .brand > span { font-size:22px; }
 .brand img { width:80px; }
}
@media(max-width:700px) {
 .community-shell { display:flex; flex-direction:column; gap:16px; }
 .community-main { width:100%; }
 .shared-sidebar .sidebar-navigation { display:block; width:100%; }
 .sidebar-navigation > summary { display:flex; justify-content:space-between; padding:8px 14px; background:#edf2ed; color:#6b8371; border-radius:4px; font-size:11px; list-style:none; cursor:pointer; }
 .sidebar-navigation > summary::-webkit-details-marker { display:none; }
 .shared-sidebar .sidebar-navigation .side-menu { display:block; margin-top:10px; margin-bottom:0; }
 .shared-sidebar { gap:8px; }
 .board-previews { grid-template-columns:minmax(0,1fr); }
 .board-filter-bar select { max-width:calc(100% - 95px); min-width:0; flex:1; }
 .board-filter-bar a { margin:0; width:100%; }
 .listing-tabs { gap:18px; }
 .scoped-search { flex-wrap:wrap; }
 .scoped-search select { width:100%; max-width:none; }
 .scoped-search input { flex:1; }
 .scoped-search button { flex:none; }
 .community-page .utility-bar > div { align-items:flex-start; padding-block:7px; gap:8px; }
 .utility-bar > div > span { max-width:100px; }
 .utility-bar > div > div { gap:10px; }
 .feed-category { max-width:72px; }
 .community-table .date-column,.community-table .metric-column { display:none; }
 .mobile-notice { display:inline-block; margin-right:5px; }
 .related-posts,.activity-surface { padding:0 12px 12px; }
 .related-posts .panel-heading { margin-bottom:8px; }
 .activity-surface:has(.profile-details) { padding:20px 14px; }
 .activity-tabs { gap:22px; }
 .activity-tabs a { font-size:12px; }
 .account-form-page,.rules-page,.editor-page { padding:24px 16px; }
 .activity-list article { align-items:flex-start; flex-direction:column; gap:4px; }
 .article-surface { padding:20px 16px; }
 .article-heading h1 { font-size:22px; }
 .site-width { width:calc(100% - 32px); }
 .utility-bar { font-size:10px; }
 .utility-bar > div > span { font-size:9px; }
 .community-header { display:flex; flex-wrap:wrap; gap:12px; min-height:auto; padding:14px 0 16px; }
 .brand-partnership { width:100%; justify-content:space-between; gap:12px; }
 .title-sponsor { width:104px; }
 .title-sponsor-label { font-size:7px; letter-spacing:1px; }
 .title-sponsor-logo { height:32px; }
 .title-sponsor-placeholder { font-size:10px; }
 .brand img { width:54px; height:45px; }
 .brand { gap:8px; }
 .brand > span { font-size:21px; }
 .brand small { font-size:8px; margin-top:4px; }
 .header-write { order:3; margin-left:0; font-size:12px; }
 .header-search { order:2; flex:1; width:auto; min-width:0; border-width:1px; }
 .header-search input { padding:9px 12px; font-size:12px; }
 .header-search button { font-size:22px; }
 .community-nav { overflow-x:auto; scrollbar-width:none; }
 .community-nav::-webkit-scrollbar { display:none; }
 .nav-inner { width:max-content; min-width:100%; padding:0 8px; margin:0; }
 .nav-inner a { flex:none; padding:12px; font-size:12px; }
 .community-content { padding:16px 16px 32px; }
 .portal-layout { display:flex; flex-direction:column; gap:16px; }
 .portal-sidebar { width:100%; }
 .portal-sidebar .side-menu,.portal-sidebar .side-note { display:none; }
 .member-box { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; padding:12px 14px; }
 .member-box > .eyebrow,.member-box > p:not(.eyebrow),.member-links,.member-mark { display:none; }
 .member-box h2 { font-size:13px; margin:0; }
 .member-box .community-button { width:auto; font-size:11px; padding:7px 13px; }
 .portal-main { width:100%; gap:16px; }
 .community-banner { padding:24px 20px; min-height:210px; gap:0; }
 .community-banner h1 { font-size:23px; }
 .banner-label { font-size:8px; letter-spacing:1.3px; }
 .community-banner p { font-size:10px; max-width:210px; }
 .banner-art { position:absolute; right:-20px; bottom:25px; width:90px; height:90px; opacity:.25; }
 .banner-art span { font-size:65px; }
 .banner-art small { display:none; }
 .community-banner > div:first-child { position:relative; z-index:1; }
 .community-ticker { gap:8px; font-size:10px; }
 .community-ticker > a { display:none; }
 .panel-heading { margin-inline:14px; min-height:50px; }
 .panel-heading h2 { font-size:13px; }
 .compact-feed { padding-inline:14px; }
 .photo-grid { gap:10px; padding:14px; grid-template-columns:repeat(2,minmax(0,1fr)); }
 .photo-card:last-child:nth-child(3) { display:none; }
 .topic-card { padding:14px; }
 .topic-card h2 { font-size:12px; }
 .portal-bottom { flex-direction:column; align-items:flex-start; gap:8px; padding-top:16px; }
 .community-footer > div { flex-direction:column; align-items:flex-start; gap:16px; }
 .board-heading h1 { font-size:23px; }
 .board-heading .community-button { font-size:11px; padding:8px 12px; white-space:nowrap; }
 .board-surface { padding:0 12px 20px; }
 .board-toolbar { flex-wrap:wrap; font-size:10px; }
 .community-table .number-column { display:none; }
 .community-table .author-column { width:65px; }
 .community-table .comment-column { width:36px; }
 .community-table th,.community-table td { padding:12px 5px; font-size:12px; }
 .table-category { display:block; margin:0 0 4px; font-size:9px; }
}
/* Grouped navigation stays inside the viewport, including its popovers. */
@media(max-width:700px) {
 .community-nav { overflow:visible; }
 .nav-inner { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:calc(100% - 16px); min-width:0; margin:auto; padding:0; }
 .nav-inner > a { padding:10px 4px; font-size:11px; }
 .nav-group summary { padding:10px 4px; font-size:11px; white-space:nowrap; }
 .nav-group summary span { margin-left:1px; font-size:8px; }
 .nav-popover { min-width:160px; }
 .nav-popover a { font-size:12px; padding:10px; }
 .nav-group:nth-child(3) .nav-popover { left:auto; right:0; }
 .nav-group:last-of-type .nav-popover { left:0; right:auto; }
 .listing-tabs { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; overflow:visible; }
 .listing-tabs a { font-size:11px; text-align:center; }
 .community-banner { min-height:174px; }
 .community-banner h1 { font-size:23px; }
 .community-banner p { max-width:220px; }
}

/* Optional dark theme. Keep sponsor assets in their reserved neutral area. */
.community-page .community-banner { min-height:174px; padding:24px 28px; }
.community-page .community-banner h1 { font-size:26px; }
.community-page .banner-art { width:130px; height:130px; }
.community-page .banner-art span { font-size:90px; }
@media(max-width:700px) {
 .community-page .community-banner { padding:22px 18px; }
 .community-page .community-banner h1 { font-size:23px; }
 .community-page .banner-art { width:90px; height:90px; }
 .community-page .banner-art span { font-size:65px; }
}
[data-theme=dark] { color-scheme:dark; --ink:#e2e8e2; --muted:#a0ada2; --line:#384139; --green:#92bd9c; --light:#303b32; }
[data-theme=dark] .community-page { background:#191e1a; color:var(--ink); }
[data-theme=dark] :is(.surface,.nav-popover,.account-dialog) { background:#252c26; color:var(--ink); }
[data-theme=dark] :is(.community-page > .community-header,.community-nav,.community-footer) { background:#202621; }
[data-theme=dark] .utility-bar { background:#1d231e; color:#a5b1a7; }
[data-theme=dark] .brand > span { color:#b8ceba; }
[data-theme=dark] .brand small { color:#9aa99d; }
[data-theme=dark] .header-search { background:#252c26; }
[data-theme=dark] .header-search input { color:#e2e8e2; }
[data-theme=dark] .title-sponsor-placeholder { background:#252c26; border-color:#58685b; color:#a0afa4; }
[data-theme=dark] .brand img { background:#fff; border-radius:4px; }
[data-theme=dark] .community-button { background:#92bd9c; color:#172b1d !important; }
[data-theme=dark] .side-menu a { color:#bcc8bf; }
[data-theme=dark] :is(.side-note,.member-mark,.notice-badge,.community-ticker > span,.feed-category) { background:#303e32; color:#b4cab7; border-color:#3b4e40; }
[data-theme=dark] .side-note h3 { color:#c3d3c5; }
[data-theme=dark] .side-note p { color:#a0b1a4; }
[data-theme=dark] .community-banner { background:#22422e; }
[data-theme=dark] :is(.board-notices,.board-highlights,.compact-feed li,.community-table td,.comment-item,.article-heading,.article-actions) { border-color:#384139; }
[data-theme=dark] :is(.community-table th,.community-table .notice-row,.community-table tbody tr:hover,.comment-login) { background:#29342b; }
[data-theme=dark] .community-table .current-post { background:#344736; }
[data-theme=dark] :is(.community-table th,.community-table .author-column,.table-category,.feed-time,.feed-votes,.feed-criteria,.board-toolbar,.listing-tabs a,.panel-heading > a) { color:#a7b7aa; }
[data-theme=dark] :is(.board-filter-bar select,.board-filter-bar button,.scoped-search select,.page-jump input,.page-jump button,.board-search input,.account-dialog input,.account-form-page textarea,.community-content form p > input,.community-content form p > select,.comment-form textarea,.comment-form select,.comment-form input) { background:#202721; border-color:#46564a; color:#d1dfd4; }
[data-theme=dark] .community-content .post-reactions button.reaction-button { background:#263429; color:#b1c9b6; border-color:#4a6351; }
[data-theme=dark] .community-content .post-reactions button.is-active { background:#3b5140; }
[data-theme=dark] .copy-link-row button { background:#263429; color:#b1c9b6; border-color:#4a6351; }
[data-theme=dark] .sidebar-navigation > summary { background:#303b32; color:#b4c6b8; }
[data-theme=dark] .community-content form label { color:#b7c9bc; }
[data-theme=dark] .community-nav { border-top-color:var(--line); }
[data-theme=dark] :is(.member-links a,.community-ticker > a,.activity-tabs a,.board-filter-bar) { color:#b3c5b7; }
[data-theme=dark] .site-messages { background:#3a3527; border-color:#62573d; color:#e4d7b3; }
[data-theme=dark] .popular-score { color:#deb292; }
[data-theme=dark] .best-score { color:#d5bc85; }

.home-image-feed { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:16px 20px 20px; }
.home-image-feed > .compact-empty { grid-column:1/-1; }
.board-previews .panel-heading h2 { min-width:0; overflow-wrap:anywhere; }
.board-previews .panel-heading > a { flex-shrink:0; }
.home-image-card { min-width:0; display:flex; flex-direction:column; gap:8px; overflow-wrap:anywhere; font-size:13px; }
.home-image-card img,.home-image-placeholder { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:4px; background:var(--light); }
.home-image-placeholder { display:grid; place-items:center; color:#768c7c; font-size:12px; }
.home-image-card small { color:#768c7c; }