.sufc-community-shell {
  --community-navy: #15365a;
  --community-navy-deep: #0f2b48;
  --community-teal: #1fb8bd;
  --community-teal-deep: #118f94;
  --community-orange: #f3942a;
  --community-cream: #fff8ee;
  --community-soft-blue: #eef7fb;
  --community-soft-mint: #e8faf5;
  --community-muted: #637485;
  --community-border: #d9e7ee;
  background: #f6fafc;
  color: #203548;
  min-height: 70vh;
}

.sufc-community-shell [hidden] { display: none !important; }

.sufc-community-cover {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 15%, rgba(255,211,108,.28), transparent 23%),
    radial-gradient(circle at 6% 100%, rgba(31,184,189,.13), transparent 26%),
    linear-gradient(120deg, #fffaf1 0%, #fff 54%, #eef9fa 100%);
  border-bottom: 1px solid rgba(21,54,90,.08);
}

.sufc-community-cover::before,
.sufc-community-cover::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.sufc-community-cover::before {
  width: 240px;
  height: 240px;
  left: -110px;
  bottom: -140px;
  background: rgba(31,184,189,.14);
}

.sufc-community-cover::after {
  width: 190px;
  height: 190px;
  right: -65px;
  top: -75px;
  background: rgba(243,148,42,.14);
}

.sufc-community-cover__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0,1.5fr) minmax(310px,.6fr);
  gap: 56px;
  align-items: center;
  min-height: 390px;
  padding-top: 54px;
  padding-bottom: 54px;
}

.sufc-community-kicker {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--community-teal-deep);
  text-transform: uppercase;
  font-size: .77rem;
  font-weight: 900;
  letter-spacing: .085em;
}

.sufc-community-kicker span {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: var(--community-soft-mint);
  color: var(--community-teal);
  font-size: .58rem;
}

.sufc-community-cover h1 {
  max-width: 790px;
  margin: 14px 0 17px;
  font-size: clamp(2.45rem, 4.5vw, 4.65rem);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.sufc-community-cover h1 span { color: var(--community-orange); }

.sufc-community-cover__copy > p {
  max-width: 720px;
  margin-bottom: 22px;
  color: #4f6578;
  font-size: 1.12rem;
  line-height: 1.68;
}

.sufc-community-cover__trust {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 22px;
  color: var(--community-navy);
  font-size: .92rem;
  font-weight: 800;
}

.sufc-community-cover__trust span { display: inline-flex; align-items: center; gap: 7px; }

.sufc-community-cover__trust b {
  display: grid;
  place-items: center;
  width: 21px;
  height: 21px;
  border-radius: 50%;
  background: var(--community-teal);
  color: #fff;
  font-size: .72rem;
}

.sufc-community-cover__art {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 270px;
}

.sufc-community-cover__art p {
  position: absolute;
  right: 3px;
  bottom: 13px;
  margin: 0;
  color: var(--community-navy);
  font-family: "Comic Sans MS", "Trebuchet MS", cursive, sans-serif;
  font-size: 1.06rem;
  font-weight: 800;
  line-height: 1.2;
  transform: rotate(-4deg);
}

.sufc-community-orbit {
  position: absolute;
  border: 2px dashed rgba(31,184,189,.3);
  border-radius: 50%;
}

.sufc-community-orbit--one { width: 244px; height: 244px; }
.sufc-community-orbit--two { width: 178px; height: 178px; border-color: rgba(243,148,42,.32); }

.sufc-community-people {
  position: relative;
  width: 210px;
  height: 190px;
}

.sufc-community-person,
.sufc-community-heart {
  position: absolute;
  display: grid;
  place-items: center;
  border: 7px solid #fff;
  border-radius: 50%;
  box-shadow: 0 13px 28px rgba(21,54,90,.15);
  color: #fff;
  font-weight: 900;
}

.sufc-community-person { width: 79px; height: 79px; font-size: 1.35rem; }
.sufc-community-person--a { left: 65px; top: 0; background: linear-gradient(135deg,#23bec1,#168eaa); }
.sufc-community-person--b { right: 0; top: 63px; background: linear-gradient(135deg,#ffad52,#ec7e18); }
.sufc-community-person--c { left: 22px; top: 71px; background: linear-gradient(135deg,#6e94c8,#244e7f); }
.sufc-community-person--d { left: 76px; bottom: 0; background: linear-gradient(135deg,#e982ab,#b9537d); }
.sufc-community-heart { width: 49px; height: 49px; right: 47px; top: 67px; border-width: 5px; background: #fff0df; color: var(--community-orange); }

.sufc-community-layout {
  display: grid;
  grid-template-columns: 235px minmax(0, 650px) 235px;
  gap: 22px;
  align-items: start;
  padding-top: 30px;
  padding-bottom: 70px;
}

.sufc-community-sidebar { display: grid; gap: 18px; }
.sufc-community-panel,
.sufc-community-composer,
.sufc-community-post,
.sufc-community-welcome {
  background: #fff;
  border: 1px solid rgba(21,54,90,.09);
  border-radius: 20px;
  box-shadow: 0 10px 24px rgba(21,54,90,.06);
}

.sufc-community-panel { padding: 21px; }
.sufc-community-panel h2 { margin: 10px 0 9px; font-size: 1.4rem; }
.sufc-community-panel h3 { margin: 0 0 13px; font-size: 1.04rem; letter-spacing: -.015em; }
.sufc-community-panel > p { margin: 0; color: var(--community-muted); font-size: .89rem; line-height: 1.57; }

.sufc-community-preview-label {
  display: inline-flex;
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--community-soft-mint);
  color: #117377;
  text-transform: uppercase;
  font-size: .67rem;
  font-weight: 900;
  letter-spacing: .055em;
}

.sufc-community-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 18px 0 0;
  padding-top: 17px;
  border-top: 1px solid var(--community-border);
}

.sufc-community-stats div { min-width: 0; }
.sufc-community-stats dt { color: var(--community-navy); font-size: 1.12rem; font-weight: 900; }
.sufc-community-stats dd { margin: 0; color: var(--community-muted); font-size: .76rem; }

.sufc-community-rules { display: grid; gap: 13px; margin: 0 0 13px; padding: 0; list-style: none; }
.sufc-community-rules li { display: grid; grid-template-columns: 28px 1fr; gap: 9px; }
.sufc-community-rules li > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: var(--community-soft-blue);
  color: var(--community-navy);
  font-size: .76rem;
  font-weight: 900;
}

.sufc-community-rules p { margin: 0; color: var(--community-muted); font-size: .76rem; line-height: 1.45; }
.sufc-community-rules strong { display: block; color: var(--community-navy); font-size: .82rem; }
.sufc-community-text-button { padding: 0; border: 0; background: none; color: var(--community-teal-deep); font-size: .82rem; font-weight: 900; cursor: pointer; }

.sufc-community-feed { display: grid; gap: 16px; min-width: 0; }

.sufc-community-welcome {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 23px;
  overflow: hidden;
  background: linear-gradient(120deg,var(--community-navy-deep),#195978);
  color: #fff;
}

.sufc-community-welcome span:first-child { display: block; margin-bottom: 3px; color: #9de4e2; font-size: .78rem; font-weight: 900; text-transform: uppercase; letter-spacing: .055em; }
.sufc-community-welcome h2 { margin: 0; color: #fff; font-size: 1.4rem; }
.sufc-community-welcome__mark { color: var(--community-orange); font-size: 2.4rem; transform: rotate(9deg); }
.sufc-community-welcome__account { display: flex; align-items: center; gap: 12px; }
.sufc-community-welcome__account a { padding: 7px 10px; border: 1px solid rgba(255,255,255,.28); border-radius: 10px; color: #fff; font-size: .72rem; font-weight: 850; text-decoration: none; }
.sufc-community-welcome__account a:hover { background: rgba(255,255,255,.12); color: #fff; }

.sufc-community-member-notice { padding: 13px 16px; border: 1px solid #bde6d1; border-radius: 14px; background: #e6f7ef; color: #176047; font-size: .84rem; }
.sufc-community-member-notice--error { border-color: #f1c0bb; background: #fff0ee; color: #812f2a; }

.sufc-community-composer { display: grid; grid-template-columns: 42px 1fr; gap: 13px; padding: 18px; }
.sufc-community-composer__body > label { display: block; margin: 1px 0 8px; color: var(--community-navy); font-size: .88rem; font-weight: 900; }
.sufc-community-composer textarea {
  display: block;
  width: 100%;
  min-height: 88px;
  padding: 12px 14px;
  resize: vertical;
  border: 1px solid var(--community-border);
  border-radius: 14px;
  background: #f9fcfd;
  color: #263b4e;
  font-size: .9rem;
  line-height: 1.5;
}

.sufc-community-composer textarea:focus { border-color: var(--community-teal); outline: 3px solid rgba(31,184,189,.13); }

.sufc-community-composer__actions,
.sufc-community-composer__actions > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.sufc-community-composer__actions { margin-top: 11px; }
.sufc-community-upload,
.sufc-community-topic {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 35px;
  padding: 7px 9px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--community-navy);
  font-size: .78rem;
  font-weight: 850;
  cursor: pointer;
}

.sufc-community-upload:hover,
.sufc-community-topic:hover { background: var(--community-soft-blue); }
.sufc-community-upload span { color: var(--community-teal-deep); font-size: 1rem; }
.sufc-community-topic span { color: var(--community-orange); font-size: 1rem; }

.sufc-community-character-count { color: var(--community-muted); font-size: .7rem; }
.sufc-community-post-button {
  min-height: 36px;
  padding: 7px 17px;
  border: 0;
  border-radius: 11px;
  background: var(--community-orange);
  color: #fff;
  font-size: .82rem;
  font-weight: 900;
  cursor: pointer;
}

.sufc-community-post-button:disabled { cursor: not-allowed; background: #cbd5dc; }
.sufc-community-image-preview { position: relative; margin-top: 10px; width: 150px; }
.sufc-community-image-preview img { width: 150px; height: 100px; object-fit: cover; border-radius: 12px; }
.sufc-community-image-preview button { position: absolute; top: 5px; right: 5px; width: 25px; height: 25px; border: 0; border-radius: 50%; background: rgba(15,43,72,.88); color: #fff; cursor: pointer; }

.sufc-community-feed-tabs { display: flex; gap: 4px; padding: 5px; border: 1px solid rgba(21,54,90,.08); border-radius: 14px; background: #eaf2f6; }
.sufc-community-feed-tabs button { flex: 1; min-height: 37px; padding: 8px; border: 0; border-radius: 10px; background: transparent; color: var(--community-muted); font-size: .8rem; font-weight: 900; cursor: pointer; }
.sufc-community-feed-tabs button.is-active { background: #fff; color: var(--community-navy); box-shadow: 0 3px 10px rgba(21,54,90,.08); }

.sufc-community-posts { display: grid; gap: 16px; }
.sufc-community-empty {
  padding: 48px 32px;
  border: 1px solid rgba(21,54,90,.09);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(21,54,90,.07);
  text-align: center;
}
.sufc-community-empty__icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin: 0 auto 14px;
  border-radius: 15px;
  background: var(--community-soft-mint);
  color: var(--community-teal-deep);
  font-size: 1.5rem;
  font-weight: 900;
}
.sufc-community-empty h3 { margin: 0 0 7px; color: var(--community-navy-deep); font-size: 1.12rem; }
.sufc-community-empty p { max-width: 470px; margin: 0 auto; color: var(--community-muted); font-size: .84rem; }
.sufc-community-post { overflow: hidden; }
.sufc-community-post__header { display: grid; grid-template-columns: 42px 1fr auto; gap: 11px; align-items: center; padding: 17px 19px 10px; }
.sufc-community-post__header h3 { margin: 0 0 1px; color: var(--community-navy-deep); font-size: .91rem; letter-spacing: -.01em; }
.sufc-community-post__header p { margin: 0; color: var(--community-muted); font-size: .7rem; }
.sufc-community-more { align-self: start; padding: 3px 6px; border: 0; background: transparent; color: #758695; font-weight: 900; letter-spacing: 1px; cursor: pointer; }
.sufc-community-post-menu { position: relative; align-self: start; z-index: 4; }
.sufc-community-post-menu summary { padding: 2px 6px 5px; border-radius: 8px; color: #758695; font-size: 1rem; font-weight: 900; letter-spacing: 1px; line-height: 1; list-style: none; cursor: pointer; }
.sufc-community-post-menu summary::-webkit-details-marker { display: none; }
.sufc-community-post-menu summary:hover,
.sufc-community-post-menu[open] summary { background: var(--community-soft-blue); color: var(--community-navy); }
.sufc-community-post-menu__panel { position: absolute; top: 30px; right: 0; width: 160px; overflow: hidden; border: 1px solid var(--community-border); border-radius: 12px; background: #fff; box-shadow: 0 14px 34px rgba(15,43,72,.18); }
.sufc-community-post-menu__panel form { margin: 0; }
.sufc-community-post-menu__panel button { width: 100%; padding: 10px 12px; border: 0; background: #fff; color: var(--community-navy-deep); text-align: left; font-size: .76rem; font-weight: 850; cursor: pointer; }
.sufc-community-post-menu__panel button:hover { background: var(--community-soft-blue); }
.sufc-community-post-menu__panel .sufc-community-post-menu__danger { color: #a33a3a; }

.sufc-community-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  color: #fff;
  font-size: .86rem;
  font-weight: 900;
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.55);
}

.sufc-community-avatar--member { background: linear-gradient(135deg,#5b87bb,var(--community-navy)); }
.sufc-community-avatar--teal { background: linear-gradient(135deg,#58d4ca,#1595a1); }
.sufc-community-avatar--orange { background: linear-gradient(135deg,#ffc06f,#e9841c); }
.sufc-community-avatar--navy { background: linear-gradient(135deg,#6f93c4,#254e7b); }

.sufc-community-post__content { padding: 5px 19px 14px; }
.sufc-community-post__content > p { margin: 0 0 13px; color: #344c5f; font-size: .88rem; line-height: 1.62; }
.sufc-community-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.sufc-community-tags span { padding: 5px 9px; border-radius: 999px; background: var(--community-soft-blue); color: #36627d; font-size: .68rem; font-weight: 850; }

.sufc-community-post__image { margin: 14px 0 12px; overflow: hidden; border-radius: 15px; background: var(--community-soft-blue); }
.sufc-community-post__image img { width: 100%; max-height: 310px; object-fit: cover; object-position: center 34%; }
.sufc-community-post__image figcaption { padding: 8px 11px; color: var(--community-muted); font-size: .68rem; }
.sufc-community-post__video { display: grid; place-items: center; margin: 14px 0 12px; overflow: hidden; border: 1px solid var(--community-border); border-radius: 15px; background: #f5f8fa; }
.sufc-community-post__video--facebook { aspect-ratio: 16 / 9; background: #05080c; }
.sufc-community-video-player { display: block; max-width: 100%; border: 0; background: #fff; }
.sufc-community-video-player--facebook { width: 31.63% !important; max-width: none; height: 100% !important; aspect-ratio: 560 / 996; }
.sufc-community-video-player--tiktok { width: min(100%,390px); height: auto; aspect-ratio: 325 / 578; }

.sufc-community-post-editor,
.sufc-community-report-box { margin: 0 19px 16px; padding: 15px; border: 1px solid var(--community-border); border-radius: 14px; background: #f8fbfc; }
.sufc-community-post-editor label,
.sufc-community-report-box > label { display: block; margin: 0 0 6px; color: var(--community-navy-deep); font-size: .76rem; font-weight: 900; }
.sufc-community-post-editor textarea,
.sufc-community-report-box textarea,
.sufc-community-report-box select { width: 100%; padding: 10px 11px; border: 1px solid var(--community-border); border-radius: 10px; background: #fff; color: var(--community-ink); font: inherit; font-size: .8rem; }
.sufc-community-report-box select { margin-bottom: 12px; }
.sufc-community-post-editor textarea,
.sufc-community-report-box textarea { resize: vertical; }
.sufc-community-report-box h4 { margin: 0 0 12px; color: var(--community-navy-deep); font-size: .95rem; }
.sufc-community-report-box > p { margin: 9px 0 0; color: var(--community-muted); font-size: .7rem; }
.sufc-community-post-editor > div,
.sufc-community-report-box > div:last-child { display: flex; justify-content: flex-end; gap: 8px; margin-top: 11px; }
.sufc-community-post-editor .sufc-button,
.sufc-community-report-box .sufc-button { min-height: 38px; padding: 8px 13px; font-size: .74rem; }

.sufc-community-post__footer { border-top: 1px solid #e8eef2; }
.sufc-community-reactions { display: flex; align-items: center; gap: 4px; padding: 10px 19px; color: var(--community-muted); font-size: .69rem; }
.sufc-community-reactions > span:first-child { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--community-orange); color: #fff; font-size: .7rem; }
.sufc-community-reactions > span:last-child { margin-left: auto; }
.sufc-community-post__actions { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid #eef2f5; }
.sufc-community-post__actions > form,
.sufc-community-post__actions > button { margin: 0; border: 0; border-right: 1px solid #eef2f5; }
.sufc-community-post__actions > :last-child { border-right: 0; }
.sufc-community-post__actions button { width: 100%; min-height: 42px; padding: 8px; border: 0; background: #fff; color: #546b7c; font-size: .76rem; font-weight: 850; cursor: pointer; }
.sufc-community-post__actions button:hover,
.sufc-community-post__actions button.is-liked { background: #fff8ee; color: #d87512; }

.sufc-community-comment-box { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 12px 15px; border-top: 1px solid #eef2f5; background: #f8fbfc; }
.sufc-community-comment-box input { width: 100%; min-height: 38px; padding: 8px 11px; border: 1px solid var(--community-border); border-radius: 10px; background: #fff; font-size: .78rem; }
.sufc-community-comment-box button { min-height: 38px; padding: 8px 13px; border: 0; border-radius: 10px; background: var(--community-teal-deep); color: #fff; font-size: .75rem; font-weight: 900; cursor: pointer; }
.sufc-community-comments { display: grid; gap: 8px; padding: 12px 15px 4px; border-top: 1px solid #eef2f5; background: #f8fbfc; }
.sufc-community-comment { position: relative; padding: 10px 12px; border-radius: 12px; background: var(--community-soft-mint); color: #315763; font-size: .76rem; line-height: 1.48; scroll-margin-top: 24px; }
.sufc-community-comment__heading { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: start; }
.sufc-community-comment__heading > p { display: flex; justify-content: space-between; gap: 10px; min-width: 0; margin: 0 0 4px; color: var(--community-navy-deep); }
.sufc-community-comment__heading > p span { color: var(--community-muted); font-size: .67rem; font-weight: 700; white-space: nowrap; }
.sufc-community-comment__content { overflow-wrap: anywhere; }
.sufc-community-comment-menu { position: relative; z-index: 5; }
.sufc-community-comment-menu summary { padding: 1px 5px 4px; border-radius: 7px; color: #758695; font-size: .88rem; font-weight: 900; letter-spacing: 1px; line-height: 1; list-style: none; cursor: pointer; }
.sufc-community-comment-menu summary::-webkit-details-marker { display: none; }
.sufc-community-comment-menu summary:hover,
.sufc-community-comment-menu[open] summary { background: #fff; color: var(--community-navy); }
.sufc-community-comment-menu__panel { position: absolute; top: 25px; right: 0; width: 160px; overflow: hidden; border: 1px solid var(--community-border); border-radius: 11px; background: #fff; box-shadow: 0 12px 28px rgba(15,43,72,.17); }
.sufc-community-comment-menu__panel form { margin: 0; }
.sufc-community-comment-menu__panel button { width: 100%; padding: 9px 11px; border: 0; background: #fff; color: var(--community-navy-deep); text-align: left; font-size: .72rem; font-weight: 850; cursor: pointer; }
.sufc-community-comment-menu__panel button:hover { background: var(--community-soft-blue); }
.sufc-community-comment-menu__panel .sufc-community-comment-menu__danger { color: #a33a3a; }
.sufc-community-comment__actions { display: flex; align-items: center; margin-top: 7px; }
.sufc-community-comment__actions form { margin: 0; }
.sufc-community-comment__actions button { padding: 3px 7px; border: 0; border-radius: 7px; background: transparent; color: #5b7280; font-size: .7rem; font-weight: 850; cursor: pointer; }
.sufc-community-comment__actions button:hover,
.sufc-community-comment__actions button.is-liked { background: #fff8ee; color: #d87512; }
.sufc-community-comment__actions button b { margin-left: 2px; }
.sufc-community-comment-editor,
.sufc-community-comment-report { margin: 10px 0 1px; padding: 12px; border: 1px solid var(--community-border); border-radius: 11px; background: #fff; }
.sufc-community-comment-editor > label,
.sufc-community-comment-report > label { display: block; margin: 0 0 5px; color: var(--community-navy-deep); font-size: .72rem; font-weight: 900; }
.sufc-community-comment-editor textarea,
.sufc-community-comment-report textarea,
.sufc-community-comment-report select { width: 100%; padding: 9px 10px; border: 1px solid var(--community-border); border-radius: 9px; background: #fff; color: var(--community-ink); font: inherit; font-size: .75rem; }
.sufc-community-comment-editor textarea,
.sufc-community-comment-report textarea { resize: vertical; }
.sufc-community-comment-report select { margin-bottom: 10px; }
.sufc-community-comment-report h4 { margin: 0 0 10px; color: var(--community-navy-deep); font-size: .86rem; }
.sufc-community-comment-report > p { margin: 8px 0 0; color: var(--community-muted); font-size: .68rem; }
.sufc-community-comment-editor > div,
.sufc-community-comment-report > div:last-child { display: flex; justify-content: flex-end; gap: 7px; margin-top: 9px; }
.sufc-community-comment-editor .sufc-button,
.sufc-community-comment-report .sufc-button { min-height: 34px; padding: 7px 11px; font-size: .7rem; }

.sufc-community-safety { background: linear-gradient(150deg,#fff7ea,#fff); border-color: #f6dec1; }
.sufc-community-safety__icon { display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 12px; border-radius: 12px; background: #fff0db; color: var(--community-orange); }
.sufc-community-safety a { display: inline-block; margin-top: 12px; color: var(--community-navy); font-size: .8rem; font-weight: 900; text-decoration: none; }

.sufc-community-topic-list { display: grid; gap: 5px; }
.sufc-community-topic-list button { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 9px 10px; border: 0; border-radius: 10px; background: transparent; color: #3a586d; text-align: left; font-size: .77rem; cursor: pointer; }
.sufc-community-topic-list button:hover { background: var(--community-soft-blue); color: var(--community-navy); }
.sufc-community-topic-list b { display: grid; place-items: center; min-width: 27px; height: 24px; padding: 0 6px; border-radius: 999px; background: #eef3f6; color: var(--community-muted); font-size: .65rem; }
.sufc-community-topic-empty { margin: 0; color: var(--community-muted); font-size: .78rem; line-height: 1.55; }

.sufc-community-moderators > div { display: flex; align-items: center; gap: 10px; margin-bottom: 13px; }
.sufc-community-moderators p { margin: 0; font-size: .78rem; }
.sufc-community-moderators strong { display: block; color: var(--community-navy); }
.sufc-community-moderators small { display: block; color: var(--community-muted); font-size: .68rem; }

.sufc-community-message-dialog {
  width: min(calc(100% - 32px), 620px);
  max-height: min(88vh, 760px);
  padding: 0;
  overflow: auto;
  border: 0;
  border-radius: 24px;
  background: transparent;
  color: var(--community-ink);
  box-shadow: 0 28px 80px rgba(15,43,72,.3);
}
.sufc-community-message-dialog::backdrop { background: rgba(15,43,72,.62); backdrop-filter: blur(3px); }
.sufc-community-message-card { position: relative; padding: 32px; background: #fff; }
.sufc-community-message-card h2 { margin: 12px 42px 8px 0; color: var(--community-navy-deep); font-size: clamp(1.65rem,4vw,2.15rem); }
.sufc-community-message-card > p { margin: 0 0 22px; color: var(--community-muted); font-size: .86rem; line-height: 1.55; }
.sufc-community-message-close { position: absolute; top: 17px; right: 17px; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid var(--community-border); border-radius: 12px; background: #fff; color: var(--community-navy); font-size: 1.35rem; line-height: 1; cursor: pointer; }
.sufc-community-message-close:hover { background: var(--community-soft-blue); }
.sufc-community-message-form { display: grid; gap: 10px; }
.sufc-community-message-form > label { color: var(--community-navy); font-size: .8rem; font-weight: 900; }
.sufc-community-message-form select,
.sufc-community-message-form textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--community-border); border-radius: 12px; background: #f9fcfd; color: #263b4e; font: inherit; font-size: .86rem; }
.sufc-community-message-form textarea { min-height: 150px; resize: vertical; line-height: 1.55; }
.sufc-community-message-form select:focus,
.sufc-community-message-form textarea:focus { border-color: var(--community-teal); outline: 3px solid rgba(31,184,189,.13); }
.sufc-community-message-privacy { margin: 4px 0 2px; padding: 10px 12px; border-radius: 11px; background: var(--community-soft-mint); color: #35646b; font-size: .72rem; line-height: 1.45; }
.sufc-community-message-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 6px; }
.sufc-community-message-actions .sufc-button { min-height: 46px; }

.sufc-community-gate { display: grid; place-items: center; min-height: 555px; padding: 55px 20px 80px; background: linear-gradient(180deg,#f5fafc,#eef7fa); }
.sufc-community-gate__card { width: min(100%, 940px); padding: 43px; border: 1px solid rgba(21,54,90,.09); border-radius: 28px; background: #fff; box-shadow: 0 24px 60px rgba(21,54,90,.12); text-align: center; }
.sufc-community-gate__icon { display: grid; place-items: center; width: 66px; height: 66px; margin: 0 auto 16px; border-radius: 20px; background: var(--community-soft-blue); font-size: 1.65rem; }
.sufc-community-gate h2 { margin: 14px 0 10px; font-size: clamp(2rem,4vw,2.7rem); }
.sufc-community-gate__card > p { max-width: 610px; margin: 0 auto 24px; color: var(--community-muted); }
.sufc-community-gate__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
.sufc-community-gate__privacy { display: grid; gap: 2px; margin-top: 28px; padding: 15px; border-radius: 14px; background: var(--community-soft-mint); color: #35646b; font-size: .76rem; }
.sufc-community-gate__privacy strong { color: var(--community-navy); font-size: .82rem; }

.sufc-community-auth-errors { max-width: 700px; margin: 0 auto 22px; padding: 14px 17px; border: 1px solid #f1c0bb; border-radius: 14px; background: #fff0ee; color: #812f2a; text-align: left; font-size: .82rem; }
.sufc-community-auth-errors strong { display: block; margin-bottom: 4px; }
.sufc-community-auth-errors ul { margin: 0; padding-left: 18px; }

.sufc-community-auth-grid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); gap: 18px; margin-top: 30px; text-align: left; }
.sufc-community-auth-form { align-self: start; display: grid; gap: 14px; padding: 23px; border: 1px solid var(--community-border); border-radius: 20px; background: #f8fbfc; }
.sufc-community-auth-form--join { background: linear-gradient(145deg,#fffaf1,#fff); border-color: #f4d9b7; }
.sufc-community-auth-form__heading { display: flex; align-items: center; gap: 11px; margin-bottom: 2px; }
.sufc-community-auth-form__heading > span { display: grid; place-items: center; flex: 0 0 auto; width: 38px; height: 38px; border-radius: 12px; background: var(--community-soft-mint); color: var(--community-teal-deep); font-weight: 900; }
.sufc-community-auth-form--join .sufc-community-auth-form__heading > span { background: #fff0dc; color: var(--community-orange); }
.sufc-community-auth-form h3 { margin: 0 0 2px; font-size: 1.07rem; }
.sufc-community-auth-form__heading p { margin: 0; color: var(--community-muted); font-size: .75rem; }
.sufc-community-auth-form > label { display: grid; gap: 5px; color: var(--community-navy); font-size: .79rem; font-weight: 850; }
.sufc-community-auth-name-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.sufc-community-auth-name-grid label { display: grid; gap: 5px; color: var(--community-navy); font-size: .79rem; font-weight: 850; }
.sufc-community-name-note { margin: -5px 0 0; padding: 9px 11px; border-radius: 10px; background: #fff3e4; color: #75522e; font-size: .69rem; line-height: 1.45; }
.sufc-community-auth-form label small { color: var(--community-muted); font-size: .68rem; font-weight: 600; }
.sufc-community-auth-form input[type="text"],
.sufc-community-auth-form input[type="email"],
.sufc-community-auth-form input[type="password"] { width: 100%; min-height: 44px; padding: 9px 11px; border: 1px solid var(--community-border); border-radius: 11px; background: #fff; color: #263b4e; }
.sufc-community-auth-form input:focus { border-color: var(--community-teal); outline: 3px solid rgba(31,184,189,.13); }
.sufc-community-auth-form .sufc-community-auth-check { display: grid; grid-template-columns: 18px 1fr; gap: 8px; align-items: start; color: #526979; font-size: .72rem; font-weight: 650; line-height: 1.45; }
.sufc-community-auth-check input { width: 16px; height: 16px; margin-top: 2px; accent-color: var(--community-teal-deep); }
.sufc-community-auth-form .sufc-button { width: 100%; margin-top: 2px; }
.sufc-community-forgot { justify-self: center; color: var(--community-teal-deep); font-size: .72rem; font-weight: 850; }
.sufc-community-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

.sufc-community-welcome { position: relative; z-index: 20; overflow: visible; }
.sufc-community-notifications { position: relative; }
.sufc-community-notifications__toggle {
  position: relative;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 11px;
  background: rgba(255,255,255,.08);
  color: #fff;
  cursor: pointer;
  list-style: none;
}
.sufc-community-notifications__toggle::-webkit-details-marker { display: none; }
.sufc-community-notifications__toggle:hover,
.sufc-community-notifications__toggle[aria-expanded="true"] { background: rgba(255,255,255,.17); }
.sufc-community-notifications__toggle > span { margin: 0; color: #fff; font-size: 1.05rem; line-height: 1; text-transform: none; letter-spacing: 0; }
.sufc-community-notifications__toggle > b {
  position: absolute;
  top: -7px;
  right: -7px;
  display: grid;
  place-items: center;
  min-width: 21px;
  height: 21px;
  padding: 0 5px;
  border: 2px solid #195978;
  border-radius: 999px;
  background: var(--community-orange);
  color: #fff;
  font-size: .61rem;
  line-height: 1;
}
.sufc-community-notifications__panel {
  position: absolute;
  z-index: 50;
  top: calc(100% + 10px);
  right: -72px;
  width: min(370px,calc(100vw - 30px));
  overflow: hidden;
  border: 1px solid var(--community-border);
  border-radius: 17px;
  background: #fff;
  color: var(--community-ink);
  box-shadow: 0 22px 55px rgba(15,43,72,.28);
}
.sufc-community-notifications__panel > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 16px; border-bottom: 1px solid #e9eef2; background: #f8fbfc; }
.sufc-community-notifications__panel > header div { display: grid; gap: 1px; }
.sufc-community-notifications__panel > header strong { color: var(--community-navy-deep); font-size: .9rem; }
.sufc-community-notifications__panel > header span { margin: 0; color: var(--community-muted); font-size: .66rem; font-weight: 700; line-height: 1.3; text-transform: none; letter-spacing: 0; }
.sufc-community-notifications__panel > header button { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 9px; background: transparent; color: var(--community-muted); font-size: 1.25rem; cursor: pointer; }
.sufc-community-notifications__panel > header button:hover { background: var(--community-soft-blue); color: var(--community-navy); }
.sufc-community-notifications__hint { margin: 0; padding: 9px 15px; border-bottom: 1px solid #edf1f4; background: #fff; color: var(--community-muted); font-size: .66rem; font-weight: 750; line-height: 1.4; }
.sufc-community-notifications__list { max-height: min(440px,calc(75vh - 150px)); overflow-y: auto; overscroll-behavior: contain; }
.sufc-community-welcome__account .sufc-community-notification {
  position: relative;
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 10px;
  align-items: start;
  padding: 12px 15px;
  border: 0;
  border-bottom: 1px solid #edf1f4;
  border-radius: 0;
  background: #fff;
  color: var(--community-ink);
  text-decoration: none;
}
.sufc-community-welcome__account .sufc-community-notification:hover { background: #f5fafb; color: var(--community-ink); }
.sufc-community-welcome__account .sufc-community-notification.is-unread { background: #eef9f8; }
.sufc-community-notification.is-unread::after { position: absolute; top: 18px; right: 10px; width: 7px; height: 7px; border-radius: 50%; background: var(--community-teal-deep); content: ''; }
.sufc-community-notification__icon { display: grid !important; place-items: center; width: 32px; height: 32px; margin: 0 !important; border-radius: 10px; background: var(--community-soft-blue); color: var(--community-teal-deep) !important; font-size: .78rem !important; font-weight: 900; line-height: 1; text-transform: none !important; letter-spacing: 0 !important; }
.sufc-community-notification > span:last-child { display: grid; gap: 3px; min-width: 0; padding-right: 9px; margin: 0; color: var(--community-ink); text-transform: none; letter-spacing: 0; }
.sufc-community-notification strong { color: var(--community-navy-deep); font-size: .73rem; line-height: 1.4; }
.sufc-community-notification small { color: var(--community-muted); font-size: .63rem; }
.sufc-community-notifications__read { margin: 0; padding: 10px 14px; background: #f8fbfc; text-align: right; }
.sufc-community-notifications__read button { padding: 5px 8px; border: 0; background: transparent; color: var(--community-teal-deep); font-size: .69rem; font-weight: 900; cursor: pointer; }
.sufc-community-notifications__empty { margin: 0; padding: 22px 18px; color: var(--community-muted); font-size: .75rem; line-height: 1.5; text-align: center; }

.sufc-community-post,
.sufc-community-comment { scroll-margin-top: 112px; }
.sufc-community-post:target { outline: 3px solid rgba(31,184,189,.55); box-shadow: 0 0 0 7px rgba(31,184,189,.12), 0 16px 38px rgba(15,43,72,.12); }
.sufc-community-comment:target { border-radius: 12px; outline: 3px solid rgba(245,139,38,.55); background: rgba(255,244,229,.8); box-shadow: 0 0 0 6px rgba(245,139,38,.1); }

.sufc-community-comment--depth-1 { margin-left: 22px; }
.sufc-community-comment--depth-2 { margin-left: 44px; }
.sufc-community-comment--depth-3,
.sufc-community-comment--depth-4 { margin-left: 62px; }
.sufc-community-comment--depth-1,
.sufc-community-comment--depth-2,
.sufc-community-comment--depth-3,
.sufc-community-comment--depth-4 { border-left: 3px solid rgba(31,184,189,.32); }
.sufc-community-comment__replying { margin: 0 0 3px; color: var(--community-muted); font-size: .65rem; font-weight: 800; }
.sufc-community-mention { padding: 1px 3px; border-radius: 5px; background: rgba(31,184,189,.14); color: var(--community-teal-deep); font-weight: 900; }
.sufc-community-comment__actions { gap: 3px; }

.sufc-community-reply-context { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border-radius: 9px; background: var(--community-soft-mint); color: #35646b; font-size: .7rem; }
.sufc-community-comment-box .sufc-community-reply-context button { min-height: 0; padding: 2px 5px; background: transparent; color: var(--community-teal-deep); font-size: .68rem; }
.sufc-community-mention-control { position: relative; min-width: 0; }
.sufc-community-comment-editor > .sufc-community-mention-control { display: block; margin-top: 0; }
.sufc-community-comment-box > .sufc-community-mention-control { grid-column: 1; }
.sufc-community-mention-suggestions {
  position: absolute;
  z-index: 30;
  left: 0;
  right: 0;
  bottom: calc(100% + 5px);
  max-height: 220px;
  overflow-y: auto;
  border: 1px solid var(--community-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 15px 35px rgba(15,43,72,.2);
}
.sufc-community-comment-editor .sufc-community-mention-suggestions { top: calc(100% + 5px); bottom: auto; }
.sufc-community-composer .sufc-community-mention-suggestions { top: calc(100% + 5px); bottom: auto; }
.sufc-community-mention-suggestions button,
.sufc-community-comment-box .sufc-community-mention-suggestions button {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 9px;
  align-items: center;
  width: 100%;
  min-height: 0;
  padding: 8px 10px;
  border: 0;
  border-bottom: 1px solid #edf1f4;
  border-radius: 0;
  background: #fff;
  color: var(--community-navy-deep);
  text-align: left;
  font-size: .73rem;
  cursor: pointer;
}
.sufc-community-mention-suggestions button:last-child { border-bottom: 0; }
.sufc-community-mention-suggestions button:hover,
.sufc-community-comment-box .sufc-community-mention-suggestions button:hover,
.sufc-community-mention-suggestions button.is-active { background: var(--community-soft-blue); color: var(--community-navy-deep); }
.sufc-community-mention-suggestions button > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--community-teal-deep); color: #fff; font-size: .68rem; font-weight: 900; }
.sufc-community-mention-suggestions p { margin: 0; padding: 11px; color: var(--community-muted); font-size: .7rem; text-align: center; }
.sufc-community-mention-help { grid-column: 1 / -1; margin: -3px 0 0; color: var(--community-muted); font-size: .63rem; line-height: 1.35; }
.sufc-community-comment-editor > .sufc-community-mention-help { margin: 5px 0 0; }
.sufc-community-composer__mention-help { margin: 6px 2px 0; }
.sufc-community-composer__video-help { margin: 8px 2px 0; padding: 9px 11px; border-left: 3px solid var(--community-teal); border-radius: 7px; background: var(--community-soft-mint); color: #35646b; font-size: .68rem; line-height: 1.45; }
.sufc-community-composer__video-help strong { color: var(--community-navy-deep); }

.sufc-community-toast { position: fixed; z-index: 100; right: 22px; bottom: 22px; max-width: 340px; padding: 13px 16px; border-radius: 13px; background: var(--community-navy-deep); color: #fff; box-shadow: 0 15px 35px rgba(15,43,72,.28); font-size: .82rem; font-weight: 800; }

@media (max-width: 1100px) {
  .sufc-community-layout { grid-template-columns: 210px minmax(0,1fr); }
  .sufc-community-sidebar--right { display: none; }
}

@media (max-width: 780px) {
  .sufc-community-cover__inner { grid-template-columns: 1fr; gap: 12px; min-height: auto; padding-top: 40px; padding-bottom: 40px; }
  .sufc-community-cover__art { min-height: 220px; transform: scale(.9); }
  .sufc-community-layout { grid-template-columns: 1fr; padding-top: 18px; }
  .sufc-community-sidebar--left { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sufc-community-about { min-height: 100%; }
}

@media (max-width: 560px) {
  .sufc-community-cover h1 { font-size: 2.55rem; }
  .sufc-community-cover__copy > p { font-size: 1rem; }
  .sufc-community-cover__art { display: none; }
  .sufc-community-sidebar--left { grid-template-columns: 1fr; }
  .sufc-community-layout { width: min(calc(100% - 20px), var(--sufc-max)); }
  .sufc-community-composer { grid-template-columns: 36px 1fr; padding: 14px; }
  .sufc-community-avatar { width: 36px; height: 36px; }
  .sufc-community-composer__actions { align-items: flex-end; }
  .sufc-community-composer__actions > div:first-child { align-items: flex-start; flex-direction: column; gap: 0; }
  .sufc-community-composer__actions > div:last-child { align-items: flex-end; flex-direction: column; }
  .sufc-community-welcome { padding: 17px; }
  .sufc-community-post__header { grid-template-columns: 36px 1fr auto; padding-inline: 15px; }
  .sufc-community-post__content { padding-inline: 15px; }
  .sufc-community-post__video--facebook { aspect-ratio: 1 / 1; }
  .sufc-community-video-player--facebook { width: 56.25% !important; height: 100% !important; }
  .sufc-community-reactions { padding-inline: 15px; }
  .sufc-community-gate__card { padding: 30px 20px; }
  .sufc-community-gate__actions { flex-direction: column; }
  .sufc-community-message-card { padding: 25px 19px; }
  .sufc-community-message-actions { flex-direction: column-reverse; }
  .sufc-community-message-actions .sufc-button { width: 100%; }
  .sufc-community-auth-grid { grid-template-columns: 1fr; }
  .sufc-community-auth-name-grid { grid-template-columns: 1fr; }
  .sufc-community-welcome__account { align-items: flex-end; flex-direction: column; gap: 5px; }
  .sufc-community-notifications__panel { position: fixed; top: 72px; right: 10px; left: 10px; width: auto; }
  .sufc-community-comment--depth-1 { margin-left: 12px; }
  .sufc-community-comment--depth-2,
  .sufc-community-comment--depth-3,
  .sufc-community-comment--depth-4 { margin-left: 22px; }
}
