/* The member forum builds on the site's open-source discussion theme. */
:root {
  --green: #23634f;
  --muted: #738078;
  --line: #e2e7e3;
  background: #f7f9f7;
  color: #24372e;
}
body {
  font-size: 14px;
  line-height: 1.55;
}
.forum-header {
  min-height: 80px;
  gap: 24px;
  padding: 0 max(24px, calc((100vw - 1320px) / 2));
}
.brand {
  font-size: 23px;
  letter-spacing: -0.8px;
}
.brand small {
  display: block;
  margin-top: -2px;
  letter-spacing: 2.7px;
  font-size: 9px;
  font-weight: 650;
  color: var(--muted);
}
.header-links {
  margin-right: auto;
  margin-left: 18px;
  gap: 20px;
}
.member-nav {
  gap: 16px;
  flex-shrink: 0;
}
.member-nav .button {
  min-height: 38px;
  padding: 7px 17px;
}
.login-link {
  font-weight: 650;
}
.notification-link {
  display: flex;
  gap: 7px;
  align-items: center;
  font-size: 12px;
}
.notification-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--green);
  color: white;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 20px;
  font-size: 10px;
}
.account-menu {
  position: relative;
}
.account-menu summary {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 650;
}
.account-menu summary::-webkit-details-marker {
  display: none;
}
.account-menu summary .avatar {
  width: 32px;
  height: 32px;
  margin: 0;
}
.account-menu > div {
  position: absolute;
  top: 44px;
  right: 0;
  z-index: 30;
  min-width: 200px;
  border: 1px solid var(--line);
  border-radius: 9px;
  padding: 7px;
  background: white;
  box-shadow: 0 12px 40px #23372e18;
}
.account-menu a,
.account-menu form button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 0;
  border-radius: 5px;
  background: white;
  color: inherit;
  font-size: 13px;
  cursor: pointer;
}
.account-menu a:hover,
.account-menu form button:hover {
  background: #f2f7f3;
  text-decoration: none;
}
.account-menu form {
  margin: 0;
}
.account-menu .form-status:empty {
  display: none;
}
main {
  max-width: 1368px;
  padding: 0 24px;
}
.forum-topline {
  padding: 23px 0 20px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  color: var(--muted);
  font-size: 11px;
}
.forum-shell {
  display: grid;
  grid-template-columns: 218px minmax(0, 1fr);
  gap: 34px;
  padding-bottom: 55px;
}
.forum-content {
  min-width: 0;
}
.forum-sidebar {
  min-width: 0;
}
.side-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 3px;
  margin-bottom: 26px;
}
.side-nav > a {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  min-height: 40px;
  font-size: 13px;
  border-radius: 6px;
  font-weight: 550;
}
.side-nav > a:hover {
  background: #edf3ee;
  text-decoration: none;
}
.side-nav > a[aria-current] {
  background: #e5f0e8;
  color: var(--green);
  font-weight: 700;
}
.nav-icon {
  width: 18px;
  text-align: center;
  font-size: 18px;
  line-height: 1;
  color: var(--green);
}
.nav-section-label {
  margin: 21px 12px 6px;
  font-size: 9px;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: var(--muted);
}
.category-menu h2 {
  margin: 0 12px 10px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1.3px;
}
.category-menu > a {
  padding: 9px 12px;
  font-size: 11px;
}
.category-count {
  border-radius: 4px;
  min-width: 20px;
  padding: 1px 4px;
  text-align: center;
  font-size: 10px;
  background: #e9eee9;
  color: #6c7c71;
}
.join-card {
  margin-top: 24px;
  border: 1px solid #d5e4d9;
  border-radius: 9px;
  background: #eff6f0;
  padding: 20px 16px;
}
.join-card h2 {
  font-size: 15px;
  line-height: 1.4;
  margin-bottom: 10px;
}
.join-card p {
  color: #69786c;
  font-size: 12px;
  line-height: 1.7;
  margin-bottom: 18px;
}
.join-card .button {
  padding: 9px 10px;
  min-height: 39px;
  font-size: 12px;
}
.subtle-link {
  display: block;
  color: var(--green);
  font-size: 11px;
  margin-top: 13px;
}
.join-card .subtle-link {
  text-align: center;
}
.sidebar-guide {
  display: block;
  margin: 20px 12px;
  font-size: 11px;
  color: var(--muted);
}
.forum-heading {
  padding: 0 0 24px;
  min-height: 80px;
}
.forum-heading h1 {
  font-size: 29px;
  letter-spacing: -0.8px;
  line-height: 1.2;
  margin: 0 0 7px;
}
.forum-heading p:last-child {
  font-size: 13px;
}
.button {
  border-radius: 7px;
  box-shadow: 0 1px 2px #183d2110;
}
.full-width {
  width: 100%;
}
.small-button {
  min-height: 36px;
  padding: 7px 13px;
  font-size: 12px;
}
.button.secondary.active {
  background: #e7f3e9;
  border-color: #8eb29a;
}
.button.danger {
  background: #a83f37;
  border-color: #a83f37;
}
.button:disabled {
  cursor: not-allowed;
}
.list-toolbar {
  min-height: 66px;
  padding: 0 20px;
  flex-wrap: wrap;
  gap: 8px 20px;
}
.list-tabs {
  gap: 24px;
  align-self: stretch;
}
.list-tabs a {
  display: flex;
  align-items: center;
  padding: 19px 0 16px;
  font-size: 12px;
}
.forum-search {
  margin: 0;
  background: #f9fbf9;
  border-color: var(--line);
  max-width: 270px;
  flex: 1 1 180px;
  overflow: hidden;
}
.forum-search input {
  width: 100%;
  padding: 8px 10px;
  font-size: 12px;
  min-height: 35px;
}
.forum-search button {
  padding: 8px;
  font-size: 10px;
  min-height: 35px;
}
.list-head {
  grid-template-columns: minmax(0, 1fr) 50px 42px 85px;
  gap: 14px;
  padding: 10px 20px;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  background: #fafcf9;
}
.list-head span:last-child {
  display: block;
}
.topic-row {
  grid-template-columns: minmax(0, 1fr) 50px 42px 85px;
  gap: 14px;
  padding: 18px 20px;
  min-height: 89px;
}
.topic-copy h2 {
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 7px;
  font-weight: 630;
}
.topic-details {
  font-size: 10px;
  gap: 5px 9px;
}
.topic-like-count {
  text-align: center;
  color: var(--muted);
  font-size: 12px;
}
.topic-like-count strong,
.reply-count strong {
  font-weight: 500;
}
.topic-like-count span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.reply-count strong {
  font-size: 13px;
}
.reply-count {
  grid-column: auto;
  grid-row: auto;
}
.activity {
  font-size: 10px;
  white-space: nowrap;
  grid-column: auto;
  grid-row: auto;
  text-align: right;
  margin-top: 0;
}
.avatar {
  border-radius: 50%;
  width: 38px;
  height: 38px;
  font-size: 12px;
  flex-shrink: 0;
  align-self: auto;
}
.avatar.large {
  width: 55px;
  height: 55px;
  font-size: 17px;
}
.orange {
  --category: #b57a33;
  --category-bg: #fbefdc;
}
.rose {
  --category: #ac6277;
  --category-bg: #f6e8ee;
}
.pending-badge {
  display: inline-block;
  background: #fff4d6;
  color: #8d6615;
  border: 1px solid #eed9a6;
  border-radius: 4px;
  padding: 1px 6px;
  font-size: 10px;
}
.state-label {
  color: #77837b;
  background: #f0f3f0;
  border-radius: 4px;
  padding: 1px 5px;
}
.community-stats {
  display: flex;
  gap: 23px;
  flex-wrap: wrap;
  align-items: center;
  padding: 20px 2px;
  font-size: 11px;
  color: var(--muted);
}
.community-stats strong {
  color: #334a3c;
  font-weight: 650;
}
.stats-note {
  margin-left: auto;
  font-size: 10px;
}
.page-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin: 35px 0 26px;
}
.page-heading h1 {
  margin: 5px 0;
  font-size: 31px;
}
.page-heading p {
  margin: 5px 0;
  color: var(--muted);
}
.page-heading .eyebrow {
  color: var(--green);
}
.panel {
  background: white;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 25px;
}
.panel h2 {
  font-size: 17px;
  font-weight: 650;
  letter-spacing: -0.2px;
}
.category-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-bottom: 70px;
}
.category-card {
  border: 1px solid var(--line);
  border-top: 4px solid var(--category);
  background: white;
  padding: 30px;
  border-radius: 10px;
}
.category-card:hover {
  text-decoration: none;
  border-color: var(--category);
}
.category-symbol {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 11px;
  color: var(--category);
  background: var(--category-bg);
  font-size: 28px;
  margin-bottom: 20px;
}
.category-card h2 {
  font-size: 19px;
}
.category-card p {
  color: var(--muted);
  line-height: 1.75;
  min-height: 66px;
  font-size: 13px;
}
.category-card > span:last-child {
  color: var(--category);
  display: flex;
  justify-content: space-between;
  font-weight: 600;
  font-size: 12px;
}
.breadcrumbs {
  padding: 27px 0 18px;
  margin: 0;
  font-size: 11px;
}
.topic-heading {
  max-width: 1000px;
}
.topic-heading h1 {
  font-size: 31px;
  line-height: 1.3;
  margin-bottom: 14px;
  overflow-wrap: anywhere;
}
.topic-heading .topic-details {
  font-size: 12px;
}
.topic-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 23px 0;
}
.topic-toolbar > div {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.topic-action-status {
  width: 100%;
  margin: 0;
  font-size: 12px;
  color: var(--green);
}
.topic-action-status:empty {
  display: none;
}
.topic-layout {
  grid-template-columns: minmax(0, 1fr) 245px;
  gap: 25px;
}
.topic-posts {
  min-width: 0;
}
.forum-post {
  display: grid;
  grid-template-columns: 135px minmax(0, 1fr);
  border: 1px solid var(--line);
  background: white;
  border-radius: 9px;
  margin-bottom: 16px;
  scroll-margin-top: 25px;
  overflow: hidden;
}
.post-author {
  padding: 25px 15px;
  background: #fafcf9;
  border-right: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  text-align: center;
  min-width: 0;
}
.post-author strong {
  margin-top: 6px;
  font-size: 12px;
  overflow-wrap: anywhere;
  max-width: 100%;
}
.post-author > span:not(.avatar):not(.team-badge) {
  color: var(--muted);
  font-size: 10px;
  overflow-wrap: anywhere;
}
.post-author small {
  color: #8a948c;
  font-size: 9px;
  margin-top: 7px;
}
.post-main {
  min-width: 0;
  padding: 21px 25px 15px;
}
.post-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 12px;
  color: var(--muted);
  font-size: 10px;
  margin-bottom: 20px;
}
.original-poster {
  color: var(--green);
  font-weight: 600;
}
.post-body {
  font-size: 14px;
  line-height: 1.85;
  overflow-wrap: anywhere;
}
.post-body p:last-child {
  margin-bottom: 10px;
}
.post-body pre {
  overflow: auto;
  padding: 14px;
  border-radius: 6px;
  background: #f3f5f3;
  font-size: 12px;
}
.post-body blockquote {
  border-left: 3px solid #b7ccbb;
  margin: 15px 0;
  padding: 10px 17px;
  background: #f6f9f5;
  color: #607367;
}
.post-body table {
  display: block;
  max-width: 100%;
  overflow: auto;
}
.post-body a {
  color: var(--green);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.post-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 3px 9px;
  border-top: 1px solid #edf0ed;
  padding-top: 11px;
  margin-top: 22px;
}
.post-action {
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  padding: 7px 4px;
  min-height: 32px;
  cursor: pointer;
  border-radius: 4px;
}
.post-action:hover {
  background: #f0f5f0;
  color: var(--green);
  text-decoration: none;
}
.post-action.active {
  color: var(--green);
  font-weight: 650;
}
.post-action:disabled {
  opacity: 0.55;
  cursor: default;
}
.post-actions .permalink-button {
  margin-left: auto;
}
.post-status {
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--green);
}
.post-status:empty {
  display: none;
}
.reply-context {
  background: #f4f7f3;
  color: var(--muted);
  padding: 7px 12px;
  font-size: 11px;
  border-radius: 4px;
}
.report-menu {
  position: relative;
}
.report-menu summary {
  color: var(--muted);
  font-size: 11px;
  padding: 7px 3px;
  cursor: pointer;
}
.report-menu form {
  position: absolute;
  right: 0;
  z-index: 10;
  width: 260px;
  padding: 16px;
  border: 1px solid var(--line);
  background: white;
  border-radius: 8px;
  box-shadow: 0 12px 30px #23372e15;
}
.report-menu form label {
  font-size: 12px;
}
.topic-sidebar {
  display: grid;
  gap: 20px;
}
.topic-sidebar .panel {
  padding: 21px;
}
.topic-sidebar h2 {
  font-size: 13px;
}
.topic-facts {
  margin: 20px 0;
}
.topic-facts > div {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  margin: 12px 0;
  font-size: 11px;
}
.topic-facts dt {
  color: var(--muted);
}
.topic-facts dd {
  margin: 0;
}
.sidebar-note {
  padding: 8px 15px;
}
.sidebar-note h2 {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.6;
  color: #344c3d;
}
.sidebar-note p,
.sidebar-note a {
  font-size: 12px;
  line-height: 1.8;
}
.notice,
.conversation-prompt {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f0f6ed;
  margin: 20px 0;
  font-size: 13px;
}
.conversation-prompt {
  display: flex;
  flex-direction: column;
  gap: 6px;
  background: #f9fbf7;
  text-align: center;
}
.conversation-prompt span {
  color: var(--muted);
  font-size: 12px;
}
.notice p {
  margin: 8px 0 0;
}
.join-conversation {
  text-align: center;
  padding: 34px;
  border: 1px solid #dce7de;
  border-radius: 9px;
  background: #eff5ee;
  margin-bottom: 35px;
}
.join-conversation h2 {
  font-size: 23px;
}
.join-conversation p {
  max-width: 490px;
  margin: 0 auto 22px;
  color: var(--muted);
  font-size: 13px;
}
.join-conversation > div {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.composer {
  margin: 24px 0;
  scroll-margin-top: 20px;
}
.composer h2 {
  margin-bottom: 18px;
}
.composer-identity {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 18px;
}
.composer-identity strong {
  color: #3c5143;
}
.composer-identity .avatar {
  width: 30px;
  height: 30px;
  font-size: 10px;
}
form label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 18px;
}
form input:not([type="checkbox"]):not([type="radio"]),
form select,
form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #d5dfd6;
  background: white;
  border-radius: 6px;
  padding: 11px 12px;
  color: #283e2f;
  font-size: 13px;
  line-height: 1.6;
  margin-top: 7px;
}
form textarea {
  resize: vertical;
}
.field-hint {
  display: block;
  margin: 7px 0 15px;
  font-size: 11px;
  font-weight: 400;
  color: var(--muted);
  line-height: 1.7;
}
.consent {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 9px;
  margin-top: 20px;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.8;
}
.consent input {
  margin: 4px 0 0;
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  accent-color: var(--green);
}
.consent a {
  color: var(--green);
  text-decoration: underline;
}
.form-status {
  font-size: 12px;
  line-height: 1.65;
  color: #805129;
  overflow-wrap: anywhere;
}
.form-status:empty {
  margin: 0;
}
.markdown-editor {
  border: 1px solid #d5dfd6;
  border-radius: 7px;
  overflow: hidden;
}
.editor-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  background: #f9fbf8;
}
.editor-toolbar > div {
  display: flex;
}
.editor-toolbar button {
  border: 0;
  padding: 6px 9px;
  min-height: 32px;
  min-width: 30px;
  background: transparent;
  color: #69776e;
  cursor: pointer;
  font-size: 12px;
  border-radius: 4px;
}
.editor-toolbar button:hover {
  background: #e9f1e9;
}
.markdown-editor textarea {
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 17px;
  min-height: 175px;
}
.markdown-preview {
  padding: 17px;
  min-height: 175px;
}
.editor-hint {
  display: block;
  padding: 7px 12px;
  text-align: right;
  font-size: 9px;
  color: var(--muted);
  background: #fcfdfb;
}
.composer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}
.composer-bottom .field-hint {
  margin: 0;
}
.reply-target {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  padding: 10px;
  background: #eaf3e9;
}
.reply-target button {
  border: 0;
  background: none;
  color: var(--green);
  cursor: pointer;
}
.new-topic-layout {
  display: grid;
  grid-template-columns: minmax(0, 850px) minmax(200px, 1fr);
  align-items: start;
  gap: 25px;
  margin-bottom: 65px;
}
.writing-tips p {
  font-size: 12px;
  line-height: 1.85;
  color: var(--muted);
}
.writing-tips a {
  display: block;
  font-size: 11px;
  color: var(--green);
  margin: 16px 0 0;
}
.edit-post-form {
  padding: 20px;
  border: 1px solid var(--line);
  background: #fafcf8;
  border-radius: 7px;
}
.edit-actions,
.recovery-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.moderation-controls summary,
.settings-detail summary,
.danger-zone summary {
  cursor: pointer;
  font-weight: 600;
  font-size: 13px;
}
.moderation-controls form {
  margin-top: 20px;
}
.earlier-topic {
  display: block;
  padding: 15px;
  margin-bottom: 20px;
  font-size: 12px;
}
.auth-layout {
  display: grid;
  grid-template-columns: 1fr minmax(0, 450px);
  gap: 100px;
  align-items: center;
  max-width: 990px;
  margin: 65px auto 80px;
}
.auth-intro h2 {
  font-size: 43px;
  line-height: 1.18;
  letter-spacing: -1.7px;
  margin: 20px 0;
  max-width: 350px;
}
.auth-intro > p {
  color: var(--muted);
  line-height: 1.8;
  font-size: 15px;
}
.auth-intro > a {
  display: inline-block;
  margin-top: 20px;
  font-size: 12px;
  color: var(--green);
}
.benefits {
  list-style: none;
  padding: 15px 0 0;
  font-size: 13px;
}
.benefits li {
  margin: 16px 0;
  display: flex;
  align-items: center;
  gap: 12px;
}
.benefits li::before {
  content: "✓";
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #e3eee2;
  color: var(--green);
  font-size: 12px;
}
.auth-card {
  padding: 33px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: 0 10px 35px #31452a05;
}
.auth-card h1 {
  font-size: 25px;
  letter-spacing: -0.7px;
  margin-bottom: 12px;
}
.auth-card > p.subtle {
  font-size: 12px;
  line-height: 1.8;
  margin-bottom: 25px;
}
.password-input {
  display: flex;
  align-items: center;
  border: 1px solid #d5dfd6;
  border-radius: 6px;
  margin-top: 7px;
  overflow: hidden;
}
.password-input input {
  border: 0 !important;
  margin: 0 !important;
}
.password-input button {
  border: 0;
  background: white;
  color: var(--muted);
  padding: 10px;
  font-size: 11px;
  cursor: pointer;
}
.auth-card .text-link {
  display: inline-block;
  font-size: 11px;
  margin: -5px 0 18px;
}
.auth-switch {
  border-top: 1px solid var(--line);
  text-align: center;
  padding-top: 20px;
  margin: 23px 0 0;
  font-size: 12px;
  color: var(--muted);
}
.auth-switch a {
  color: var(--green);
  font-weight: 650;
}
altcha-widget {
  --altcha-border-color: #d5dfd6;
  --altcha-border-radius: 6px;
  --altcha-max-width: 100%;
  margin: 18px 0;
  font-size: 12px;
}
.recovery-card {
  border: 1px solid #e3d5a3;
  background: #fffaf0;
  padding: 23px;
  border-radius: 9px;
}
.recovery-card h2 {
  font-size: 21px;
}
.recovery-card p {
  color: #74613b;
  font-size: 12px;
}
.recovery-card textarea {
  font-family: ui-monospace, monospace;
  background: white;
  width: 100%;
  padding: 13px;
  resize: none;
  border: 1px solid #e3d5a3;
  border-radius: 6px;
  color: #493e25;
}
.settings-layout {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 28px;
  max-width: 1050px;
  margin-bottom: 65px;
  align-items: start;
}
.profile-preview {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 24px 0;
}
.profile-preview p {
  margin: 3px 0 0;
  font-size: 12px;
}
.color-options {
  padding: 0;
  border: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 22px 0;
}
.color-options legend {
  font-weight: 600;
  font-size: 12px;
  margin-bottom: 12px;
}
.color-choice {
  display: flex;
  gap: 5px;
  align-items: center;
  padding: 7px 8px;
  background: var(--category-bg);
  color: var(--category);
  font-size: 10px;
  border-radius: 5px;
  margin: 0;
}
.color-choice input {
  accent-color: var(--category);
}
.settings-security {
  display: grid;
  gap: 25px;
}
.settings-detail {
  border-top: 1px solid var(--line);
  padding: 17px 0;
}
.settings-detail form {
  margin-top: 20px;
}
.settings-detail p {
  margin-top: 15px;
  font-size: 12px;
}
.danger-zone {
  color: #97423a;
}
.danger-zone > p {
  font-size: 12px;
  color: var(--muted);
  margin: 20px 0;
}
.member-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}
.member-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 20px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 10px;
  text-align: center;
}
.member-card:hover {
  border-color: #98b7a0;
  text-decoration: none;
}
.member-card h2 {
  margin: 16px 0 5px;
  font-size: 15px;
}
.member-card p {
  margin: 0 0 17px;
  font-size: 12px;
  color: var(--muted);
}
.member-card > span:last-child {
  font-size: 10px;
  color: var(--muted);
}
.profile-header {
  padding: 0;
  overflow: hidden;
  margin-bottom: 35px;
}
.profile-banner {
  height: 95px;
  background: var(--category-bg);
  border-bottom: 1px solid var(--line);
}
.profile-content {
  padding: 0 33px 28px;
}
.avatar.profile-avatar {
  width: 78px;
  height: 78px;
  font-size: 25px;
  border: 5px solid white;
  margin-top: -40px;
  position: relative;
}
.profile-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-top: 16px;
}
.profile-title h1 {
  font-size: 27px;
  margin: 0 0 5px;
}
.profile-title p {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 15px;
}
.member-bio {
  white-space: pre-wrap;
  max-width: 750px;
  color: #5a6c5e;
  font-size: 13px;
  margin: 10px 0 23px;
}
.profile-stats {
  display: flex;
  gap: 28px;
  font-size: 12px;
  color: var(--muted);
}
.profile-stats strong {
  font-size: 20px;
  color: #344c3d;
  margin-right: 4px;
}
.profile-sections {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 25px;
  align-items: start;
  margin-bottom: 60px;
}
.profile-sections > section > h2 {
  font-size: 16px;
}
.profile-sections .topic-row {
  grid-template-columns: minmax(0, 1fr) 36px 38px;
  padding: 15px;
  gap: 10px;
}
.profile-sections .topic-row .activity {
  display: none;
}
.profile-sections .topic-copy h2 {
  font-size: 12px;
}
.contribution-row {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 17px 0;
  border-bottom: 1px solid var(--line);
}
.contribution-row strong {
  font-size: 12px;
  font-weight: 550;
}
.contribution-row span {
  color: var(--muted);
  font-size: 10px;
}
.notification-list {
  max-width: 950px;
  margin-bottom: 25px;
}
.notification-row {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 19px 0;
  border-bottom: 1px solid var(--line);
}
.notification-row > div {
  flex: 1;
  min-width: 0;
}
.notification-row a {
  font-weight: 600;
  font-size: 14px;
}
.notification-row p {
  font-size: 11px;
  color: var(--muted);
  margin: 5px 0 0;
}
.unread-dot {
  width: 8px;
  height: 8px;
  background: var(--green);
  border-radius: 50%;
  flex-shrink: 0;
}
.empty-state > .button {
  color: white;
}
.empty-state > .button.secondary {
  color: var(--green);
}
.empty-state > span {
  display: block;
  font-size: 30px;
  color: #91ad96;
  margin-bottom: 15px;
}
footer {
  max-width: 1320px;
  margin: 30px auto 0;
  border-top: 1px solid var(--line);
  padding: 28px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 15px 25px;
  font-size: 11px;
}
footer .brand {
  font-size: 17px;
}
footer p {
  font-size: 11px;
  margin: 4px 0;
}
footer nav {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
}
footer .license {
  width: 100%;
  border-top: 0;
  padding: 0;
  font-size: 10px;
}
@media (max-width: 1150px) {
  .header-links {
    gap: 12px;
    margin-left: 0;
    font-size: 11px;
  }
  .forum-shell {
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 22px;
  }
  .forum-heading h1 {
    font-size: 25px;
  }
  .stats-note {
    display: none;
  }
  .topic-layout {
    grid-template-columns: minmax(0, 1fr) 205px;
    gap: 18px;
  }
  .forum-post {
    grid-template-columns: 112px minmax(0, 1fr);
  }
  .post-main {
    padding: 20px;
  }
  .auth-layout {
    gap: 45px;
  }
  .member-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  footer {
    margin: 30px 24px 0;
  }
}
@media (max-width: 900px) {
  .forum-header {
    flex-wrap: wrap;
    padding: 15px 20px;
    gap: 15px;
  }
  .header-links {
    order: 3;
    width: 100%;
    margin: 0;
    gap: 20px;
  }
  .member-nav {
    margin-left: auto;
  }
  .header-links .nav-active {
    padding: 7px 12px;
  }
  .forum-shell {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
  .forum-sidebar {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .side-nav {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0;
  }
  .side-nav > a {
    font-size: 11px;
    padding: 8px 10px;
    min-height: 34px;
  }
  .side-nav .nav-icon {
    font-size: 15px;
  }
  .nav-section-label,
  .join-card,
  .sidebar-guide {
    display: none;
  }
  .category-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 0;
  }
  .category-menu h2 {
    display: none;
  }
  .category-menu > a {
    font-size: 10px;
    background: white;
    border: 1px solid var(--line);
    margin: 0;
    padding: 6px 9px;
  }
  .forum-heading {
    min-height: 70px;
  }
  .topic-layout {
    display: block;
  }
  .topic-sidebar {
    margin-top: 25px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .topic-sidebar > .moderation-controls {
    grid-column: 1/-1;
  }
  .new-topic-layout {
    grid-template-columns: 1fr;
  }
  .writing-tips {
    display: none;
  }
  .auth-layout {
    grid-template-columns: minmax(0, 450px);
    justify-content: center;
    margin: 40px auto;
  }
  .auth-intro {
    display: none;
  }
  .settings-layout {
    grid-template-columns: 1fr;
  }
  .profile-sections {
    grid-template-columns: 1fr;
  }
  .category-cards {
    gap: 15px;
  }
  .category-card {
    padding: 22px;
  }
}
@media (max-width: 600px) {
  main {
    padding: 0 14px;
  }
  .forum-header {
    padding: 12px 14px;
    gap: 10px;
  }
  .brand {
    font-size: 19px;
  }
  .brand small {
    font-size: 8px;
  }
  .member-nav {
    gap: 10px;
  }
  .member-nav .button {
    min-height: 35px;
    padding: 6px 12px;
    font-size: 11px;
  }
  .member-nav .login-link {
    font-size: 12px;
  }
  .account-menu summary > span:not(.avatar) {
    display: none;
  }
  .notification-link {
    font-size: 10px;
  }
  .header-links {
    gap: 20px;
  }
  .forum-topline {
    padding: 17px 0;
    font-size: 10px;
  }
  .forum-topline > a {
    display: none;
  }
  .forum-heading {
    align-items: center;
    gap: 10px;
    padding-bottom: 16px;
  }
  .forum-heading h1 {
    font-size: 22px;
  }
  .forum-heading p:last-child {
    font-size: 11px;
  }
  .forum-heading > .button {
    font-size: 11px;
    min-height: 37px;
    padding: 7px 11px;
  }
  .forum-heading > .button span {
    display: none;
  }
  .list-toolbar {
    padding: 0 13px 12px;
    gap: 0;
    display: block;
  }
  .list-tabs {
    gap: 23px;
  }
  .list-tabs a {
    padding: 14px 0 11px;
    font-size: 11px;
  }
  .list-toolbar .forum-search {
    max-width: none;
    margin-top: 11px;
  }
  .list-head {
    grid-template-columns: minmax(0, 1fr) 40px 57px;
    padding: 9px 13px;
    gap: 8px;
    font-size: 9px;
  }
  .list-head span:nth-child(3) {
    display: none;
  }
  .list-head span:last-child {
    display: block;
  }
  .topic-row {
    grid-template-columns: minmax(0, 1fr) 40px 57px;
    gap: 8px;
    padding: 16px 12px;
  }
  .topic-copy {
    grid-column: 1;
    grid-row: 1;
  }
  .topic-copy h2 {
    font-size: 12px;
    line-height: 1.55;
  }
  .topic-details {
    font-size: 9px;
    gap: 5px 8px;
  }
  .topic-author {
    display: none;
  }
  .topic-like-count {
    display: none;
  }
  .reply-count {
    grid-column: 2;
    grid-row: 1;
  }
  .reply-count strong {
    font-size: 12px;
  }
  .activity {
    font-size: 9px;
    white-space: normal;
    grid-column: 3;
    grid-row: 1;
    margin-top: 0;
    text-align: right;
  }
  .category-menu {
    gap: 4px;
  }
  .category-menu > a {
    padding: 5px 7px;
    font-size: 9px;
  }
  .category-menu > a > span:first-child {
    gap: 5px;
  }
  .category-count {
    font-size: 9px;
    min-width: 15px;
  }
  .community-stats {
    gap: 17px;
    font-size: 10px;
  }
  .category-cards,
  .member-grid {
    grid-template-columns: 1fr;
  }
  .category-card p {
    min-height: 0;
  }
  .page-heading {
    margin: 26px 0 20px;
    flex-wrap: wrap;
    gap: 15px;
  }
  .page-heading h1 {
    font-size: 27px;
  }
  .page-heading .forum-search {
    max-width: none;
    flex-basis: 100%;
  }
  .topic-heading h1 {
    font-size: 24px;
  }
  .topic-heading .topic-details {
    font-size: 10px;
  }
  .topic-toolbar {
    padding: 20px 0;
    gap: 15px;
  }
  .forum-post {
    display: block;
  }
  .post-author {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 6px 9px;
    padding: 12px 15px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
    text-align: left;
  }
  .post-author .avatar.large {
    width: 32px;
    height: 32px;
    font-size: 10px;
  }
  .post-author strong {
    margin: 0;
    font-size: 12px;
  }
  .post-author > span:not(.avatar):not(.team-badge),
  .post-author small {
    display: none;
  }
  .post-main {
    padding: 16px 17px 10px;
  }
  .post-meta {
    margin-bottom: 14px;
    font-size: 9px;
  }
  .post-body {
    font-size: 13px;
    line-height: 1.85;
  }
  .post-actions {
    gap: 3px 6px;
    margin-top: 15px;
  }
  .post-action {
    font-size: 10px;
  }
  .report-menu form {
    right: -50px;
    width: 240px;
  }
  .topic-sidebar {
    grid-template-columns: 1fr;
  }
  .topic-sidebar .sidebar-note {
    display: none;
  }
  .panel {
    padding: 20px;
  }
  .composer-bottom {
    align-items: stretch;
  }
  .composer-bottom .button {
    width: 100%;
  }
  .composer-bottom .field-hint {
    width: 100%;
  }
  .join-conversation {
    padding: 27px 20px;
  }
  .join-conversation h2 {
    font-size: 21px;
  }
  .auth-card {
    padding: 25px 22px;
  }
  .auth-layout {
    margin: 27px 0 45px;
  }
  .auth-card h1 {
    font-size: 24px;
  }
  .profile-content {
    padding: 0 22px 25px;
  }
  .profile-title {
    flex-wrap: wrap;
    gap: 8px;
  }
  .profile-title h1 {
    font-size: 24px;
  }
  .profile-title .button {
    margin-bottom: 15px;
  }
  .profile-stats {
    gap: 19px;
    font-size: 10px;
    flex-wrap: wrap;
  }
  .profile-stats strong {
    font-size: 17px;
  }
  .profile-sections .topic-row {
    grid-template-columns: minmax(0, 1fr) 30px;
  }
  .notification-row {
    gap: 10px;
    flex-wrap: wrap;
  }
  .notification-row a {
    font-size: 12px;
  }
  .notification-row button {
    margin-left: 18px;
  }
  .form-page {
    padding: 28px 15px;
  }
  footer {
    margin: 25px 14px 0;
    padding: 24px 0;
    display: block;
  }
  footer nav {
    margin: 18px 0;
    gap: 17px;
  }
  footer .license {
    margin-top: 20px;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

/* Legacy comment fragments remain reachable without taking a grid cell. */
.legacy-anchor {
  position: absolute;
  scroll-margin-top: 25px;
}
.forum-search input {
  border: 0;
  border-radius: 0;
  margin: 0;
  background: transparent;
  box-shadow: none;
}
.benefits li::marker {
  content: "";
}

/* Private community report and shared consent controls. */
.growth-page {
  max-width: 1180px;
}
.growth-periods {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 24px 0;
}
.growth-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 28px 0;
}
.growth-cards section {
  border: 1px solid #d5dfd6;
  border-radius: 12px;
  padding: 20px;
}
.growth-cards h2 {
  font-size: 15px;
  margin: 0 0 12px;
}
.growth-cards strong {
  font-size: 36px;
}
.growth-cards p {
  font-size: 13px;
}
.growth-table {
  overflow: auto;
  border: 1px solid #d5dfd6;
  border-radius: 12px;
}
.growth-table table {
  width: 100%;
  border-collapse: collapse;
  min-width: 650px;
}
.growth-table th,
.growth-table td {
  text-align: left;
  padding: 15px;
  border-bottom: 1px solid #d5dfd6;
}
.growth-table th {
  font-size: 13px;
}
.forum-consent {
  position: fixed;
  z-index: 100;
  bottom: 16px;
  left: 16px;
  right: 16px;
  max-width: 920px;
  margin: auto;
  padding: 22px;
  background: #fffdf8;
  color: #1f3328;
  border: 1px solid #c6d4c6;
  border-radius: 16px;
  box-shadow: 0 6px 40px #17312433;
  display: flex;
  align-items: center;
  gap: 24px;
}
.forum-consent p {
  font-size: 14px;
  line-height: 1.6;
  margin: 8px 0 0;
}
.forum-consent a {
  text-decoration: underline;
}
.consent-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
  flex-direction: column;
}
footer [data-privacy-choices] {
  font: inherit;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  padding: 0;
  text-align: left;
}
footer [data-privacy-choices]:hover {
  text-decoration: underline;
}
@media (max-width: 700px) {
  .growth-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .forum-consent {
    display: block;
    padding: 18px;
    max-height: 70vh;
    overflow: auto;
  }
  .consent-actions {
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 14px;
  }
}