/* Shared ELM web shell. Keep route-specific functionality; unify its surfaces. */
:root {
  color-scheme: light;
  --page: #f5f3ef; --surface: #ffffff; --surface-soft: #f8f7f4;
  --surface-muted: #eeece6; --ink: #242b28; --text-strong: #242b28;
  --text-main: #3d4641; --text-soft: #68726b; --text-faint: #7b847d;
  --line: #ddded7; --line-soft: #e8e8e2; --accent-1: #325e47;
  --accent-2: #a56e3a; --accent-soft: #edf3ec; --max: 1920px;
}
body.site-body { background: var(--page); color: var(--text-main); }
body.site-body.page-social-hub { background: #f5f3ef; color: #3d4641; }
.site-body .wrap { width: min(calc(100% - 48px), 1920px); max-width: 1920px; }
.site-body .site-header { background: #fffefb; border-color: var(--line); backdrop-filter: none; }
.site-body .site-header-inner { min-height: 76px; gap: 22px; }
.site-body .brand-name { color: var(--text-strong); }
.site-body .brand-subtitle { color: var(--text-soft); font-size: 11px; }
.site-body .brand-mark { background: #242b28; color: white; border: 1px solid #242b28; }
.site-body .site-search-form, .site-body .site-search-input { background: var(--surface-soft); color: var(--text-main); border-color: var(--line); }
.site-body .site-search-input::placeholder { color: var(--text-soft); }
.site-body .site-header-actions { gap: 8px; }
.site-body .site-icon-btn, .site-body .site-user-trigger { background: #fffefb; color: #325e47; border-color: #ddded7; }
.site-body .site-header-inner { grid-template-columns: auto minmax(120px, 1fr) auto; }
.site-body .site-header-actions { min-width: 0; }
.site-body .site-nav-app { flex-shrink: 0; }
.site-body .site-nav-app a { white-space: nowrap; }
.site-body .site-nav-app svg { width: 16px; height: 16px; }
.site-body .site-notifications { position: relative; }
.site-body .site-notifications-panel {
  position: absolute; top: calc(100% + 14px); right: 0; width: min(380px, calc(100vw - 32px));
  border: 1px solid var(--line); border-radius: 14px; background: #fffefb; color: var(--ink);
  box-shadow: 0 12px 36px #242b2826; overflow: hidden;
}
.site-body .site-notifications-panel[hidden] { display: none; }
.site-body .site-notifications-panel:focus { outline: none; }
.site-body .site-notifications-heading { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--line-soft); }
.site-body .site-notifications-heading h2 { margin: 0; font-size: 16px; }
.site-body .site-notifications-heading button { border: 0; background: transparent; color: var(--text-soft); width: 32px; height: 32px; font-size: 24px; cursor: pointer; border-radius: 8px; }
.site-body .site-notifications-content { max-height: min(460px, calc(100dvh - 210px)); overflow-y: auto; overscroll-behavior: contain; padding: 8px; font-size: 14px; }
.site-body .site-notifications-content h3 { margin: 8px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--text-soft); }
.site-body .site-notifications-content h3 span { margin-left: 6px; }
.site-body .site-notifications-list { padding: 0; margin: 0; list-style: none; }
.site-body .site-notifications-list a { display: grid; gap: 4px; border-radius: 8px; padding: 12px 8px; text-decoration: none; color: var(--ink); overflow-wrap: anywhere; }
.site-body .site-notifications-list span { color: var(--text-main); line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.site-body .site-notifications-list small { color: var(--text-soft); font-size: 12px; }
.site-body .site-notifications-list .site-notifications-action { color: var(--accent-1); font-weight: 650; }
.site-body .site-notifications-empty { margin: 20px 8px; color: var(--text-soft); line-height: 1.5; }
.site-body .site-notifications-all { display: block; padding: 14px 16px; border-top: 1px solid var(--line-soft); text-align: center; color: var(--accent-1); font-size: 13px; font-weight: 650; text-decoration: none; }
.site-body .site-notifications-pending { display: block; padding: 12px 8px; color: var(--text-soft); font-size: 12px; }
.site-body .site-notifications-retry { display: inline-block; margin: 0 8px 12px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--accent-1); background: var(--accent-soft); font: inherit; cursor: pointer; }
.site-body .site-notifications-list a:hover, .site-body .site-notifications-all:hover, .site-body .site-notifications-heading button:hover, .site-body [data-notifications-toggle][aria-expanded="true"] { background: var(--accent-soft); }
.site-body .site-notifications-panel :is(a,button):focus-visible { outline: 2px solid var(--accent-1); outline-offset: -2px; }
.site-body .site-nav-app { display: flex; gap: 4px; }
.site-body .site-nav-app a { color: var(--text-soft); background: transparent; font-size: 13px; padding: 10px; }
.site-body .site-icon-button, .site-body .site-user-button { background: var(--surface); color: var(--text-main); border-color: var(--line); }
.site-body .site-user-menu { background: var(--surface); border-color: var(--line); color: var(--text-main); }
.site-body .site-user-menu a { color: var(--text-main); }
.site-body .site-main { padding: 24px 0 48px; }
.site-body .hub-shell { grid-template-columns: 216px minmax(0, 1fr) 288px; gap: 24px; }
.site-body.page-social-hub .wrap { width: min(calc(100% - 48px), 1920px); max-width: 1920px; }
.site-body.page-social-hub .hub-shell { grid-template-columns: 216px minmax(0, 1fr) 288px; gap: 24px; }
.site-body .hub-main-column { gap: 18px; }
.site-body .hub-rail, .site-body .hub-panel { border-radius: 12px; border-color: var(--line); color: var(--text-main); box-shadow: none; backdrop-filter: none; background: var(--surface); }
.site-body .hub-rail { padding: 10px; gap: 3px; }
.site-body .hub-rail__link { min-height: 44px; padding: 0 12px; font-weight: 600; font-size: 14px; }
.site-body .hub-rail__link { color: var(--text-soft); border-radius: 8px; }
.site-body .hub-rail__link.is-active { background: #edf3ec; color: #325e47; border-color: #d6e3d4; }
.site-body .hub-left-column, .site-body .hub-right-column { top: 96px; }
.site-body .hub-panel__summary { padding: 17px; }
.site-body .hub-panel__summary strong { font-size: 15px; font-weight: 650; }
.site-body .hub-panel__summary small { font-weight: 400; line-height: 1.4; }
.site-body .feature-page, .site-body .app-page-shell { max-width: none; width: 100%; }
.site-body .feature-head, .site-body .app-page-head { padding: 8px 0 20px; }
.site-body .feature-head h1, .site-body .app-page-head h1 { font-size: 30px; color: var(--text-strong); font-weight: 700; }
.site-body .feature-head p, .site-body .app-page-head p { color: var(--text-soft); font-weight: 400; }
.site-body .feature-panel, .site-body .feature-row, .site-body .app-panel, .site-body .app-card { background: var(--surface); color: var(--text-main); border-color: var(--line); }
.site-body .feature-panel h2, .site-body .feature-row strong, .site-body .app-panel h2 { color: var(--text-strong); }
.site-body .feature-row span, .site-body .feature-empty { color: var(--text-soft); }
.site-body .feature-actions a, .site-body .feature-actions button { background: #edf3ec; color: #325e47; border-color: #d6e3d4; }
.site-body .spaces-signed-hero { padding: 24px; border-radius: 12px; background: #edf1e9; border-color: #d9dfd3; color: var(--text-main); }
.site-body .spaces-signed-hero__title { font-size: clamp(28px, 3vw, 40px); max-width: none; line-height: 1.15; }
.site-body .spaces-signed-hero__copy { max-width: 680px; font-weight: 400; }
.site-body .spaces-signed-hero__stats { gap: 10px; }
.site-body .spaces-signed-stat { padding: 12px; }
.site-body .spaces-signed-stat strong { font-size: 22px; }
.site-body .spaces-section-panel { border-radius: 16px; box-shadow: none; }
.site-body .community-card-grid { gap: 16px; }
.site-body.page-spaces .hub-spaces-page { grid-template-columns: minmax(0, 1fr); min-width: 0; }
.site-body.page-spaces #spaces-content-root,
.site-body.page-spaces .spaces-section-panel,
.site-body.page-spaces .community-card-grid,
.site-body.page-spaces .community-card-link { min-width: 0; }
.site-body .spaces-topbar-card { flex-wrap: wrap; gap: 14px; }
.site-body .messages-shell { grid-template-columns: 340px minmax(0, 1fr); gap: 18px; height: calc(100dvh - 124px); color: var(--text-main); }
.site-body .messages-list-panel, .site-body .messages-thread-panel { background: var(--surface); border-color: var(--line); border-radius: 16px; }
.site-body .messages-list-head, .site-body .messages-thread-head, .site-body .messages-compose { border-color: var(--line); background: var(--surface); }
.site-body .messages-list-head h1, .site-body .messages-contact-top strong, .site-body .messages-thread-person strong, .site-body .messages-empty strong { color: var(--text-strong); }
.site-body .messages-contact-preview, .site-body .messages-contact-top small, .site-body .messages-thread-person small, .site-body .messages-empty span, .site-body .messages-no-selection p { color: var(--text-soft); }
.site-body .messages-contact { border-color: var(--line-soft); }
.site-body .messages-contact:hover, .site-body .messages-contact.is-active { background: #edf3ec; border-color: #d6e3d4; }
.site-body .messages-avatar { background: #e9eee6; color: #325e47; }
.site-body .messages-compose textarea { background: #f8f7f4; border-color: var(--line); color: var(--text-main); }
.site-body .messages-compose button { background: #325e47; color: white; }
.site-body .messages-no-selection, .site-body .messages-empty { background: transparent; color: var(--text-main); }
.site-body .site-mobile-tabbar { background: #fffefb; border-color: var(--line); }
.site-body .site-mobile-tabbar a { color: var(--text-soft); }
.site-body .site-mobile-tabbar a.is-active { color: #325e47; background: #edf3ec; }
.site-mobile-tabbar svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; }

/* Public ELM: show actual posts, not large empty display panels. */
.public-home { background: #f5f3ef; color: #3d4641; }
.public-home::before { display: none; }
.public-home .public-home__shell { width: min(calc(100% - 48px), 1920px); max-width: 1920px; }
.public-home .public-home__topbar { margin-bottom: 24px; padding: 12px 0 20px; border-bottom: 1px solid #ddded7; }
.public-home .public-home__brand img { width: 38px; height: 38px; }
.public-home .public-home__nav { gap: 5px; }
.public-home .public-home__nav-btn { font-weight: 550; padding: 10px 14px; font-size: 14px; color: #68726b; border-radius: 6px; }
.public-home .public-home__nav-btn.is-active { background: #edf3ec; color: #325e47; }
.public-home .public-home__hero { padding: 28px 32px; margin-bottom: 24px; grid-template-columns: minmax(0, 1fr) 320px; gap: 36px; border-radius: 12px; background: #eeeee5; border: 1px solid #dddfd2; box-shadow: none; }
.public-home .public-home__hero::before { display: none; }
.public-home .public-home__title { font-size: clamp(34px, 3.3vw, 52px); font-family: Georgia, 'Times New Roman', serif; line-height: 1.08; letter-spacing: -.035em; margin: 8px 0 14px; font-weight: 500; color: #242b28; }
.public-home .public-home__subtitle { font-size: 16px; line-height: 1.6; max-width: 660px; font-weight: 400; margin: 0; }
.public-home .public-home__feature-row { margin-top: 20px; gap: 22px; }
.public-home .public-home__feature { padding: 0; border: 0; background: transparent; box-shadow: none; min-height: 0; }
.public-home .public-home__feature strong { font-size: 13px; font-weight: 600; }
.public-home .public-home__feature span { font-size: 12px; color: #68726b; }
.public-home .public-home__hero-side { align-content: center; }
.public-home .public-home__hero-side-card { padding: 0; background: transparent; border: none; box-shadow: none; }
.public-home .public-home__hero-side-card h3 { font-size: 19px; }
.public-home .public-home__hero-side-card p { font-size: 14px; line-height: 1.6; font-weight: 400; }
.public-home .public-home__grid { grid-template-columns: 200px minmax(0, 1fr) 300px; gap: 24px; }
.public-home .public-home__sidebar { padding: 14px; border-radius: 12px; background: #fffefb; backdrop-filter: none; border-color: #ddded7; }
.public-home .public-home__sidebar-btn { min-height: 44px; font-size: 14px; font-weight: 550; padding: 10px 12px; }
.public-home .public-home__stage { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; min-height: 0; }
.public-home .public-home__stage-head { padding: 0 0 18px; }
.public-home .public-home__stage-copy h2 { font-size: 24px; font-weight: 650; }
.public-home .public-home__stage-copy p { font-size: 14px; font-weight: 400; }
.public-home .public-home__rail { border-radius: 12px; padding: 18px; background: #fffefb; backdrop-filter: none; border-color: #ddded7; }
.public-home .public-home__grid-cards { margin-top: 20px; }
.elm-welcome-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.elm-primary-action, .elm-secondary-action { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 10px 17px; border: 1px solid #cbd0c6; border-radius: 6px; font-size: 14px; font-weight: 600; text-decoration: none; cursor: pointer; }
.elm-primary-action { background: #242b28; color: #fffefb; border-color: #242b28; }
.elm-secondary-action { background: #fffefb; color: #3d4641; }
.elm-primary-action:hover { background: #325e47; }
.elm-secondary-action:hover { background: #e9eee6; }
.elm-public-feed { display: grid; gap: 18px; }
.elm-public-post, .elm-feed-empty { border: 1px solid #ddded7; border-radius: 12px; background: white; overflow: hidden; }
.elm-public-post__header { display: flex; gap: 12px; align-items: center; padding: 14px 18px; }
.elm-public-post__header a { text-decoration: none; color: #242b28; }
.elm-public-post__header strong { font-size: 15px; font-weight: 650; }
.elm-public-post__header small { display: block; font-size: 12px; color: #68726b; margin-top: 3px; }
.elm-public-post__avatar { width: 42px; height: 42px; border-radius: 50%; overflow: hidden; background: #e9eee6; display: grid; place-items: center; flex-shrink: 0; }
.elm-public-post__avatar img { width: 100%; height: 100%; object-fit: cover; }
.elm-post-open { margin-left: auto; padding: 10px; }
.elm-post-text { padding: 0 18px 14px; margin: 0; font-size: 16px; line-height: 1.65; overflow-wrap: anywhere; color: #3d4641; }
.elm-post-text p { margin: 0 0 12px; }
/* Keep the feed frame landscape, independently of the photo's own orientation.
   Explicit bounds avoid intrinsic portrait sizes expanding or stretching it. */
.site-body .hub-post-card__media, .elm-public-post__media {
  position: relative; display: block; width: auto; min-height: 0;
  aspect-ratio: 2 / 1; overflow: hidden; background: #eeece6;
}
.elm-public-post__media[style]::before {
  content: ''; position: absolute; inset: -18px; z-index: 0;
  background-image: var(--post-media-bg); background-size: cover;
  background-position: center; filter: blur(24px) saturate(1.04) brightness(.82);
  transform: scale(1.08); opacity: .86; pointer-events: none;
}
.elm-public-post__media[style]::after {
  content: ''; position: absolute; inset: 0; z-index: 0;
  background: rgba(15, 23, 42, .18); pointer-events: none;
}
.site-body .hub-post-card__media > img,
.site-body .hub-post-card__media > video,
.elm-public-post__media .elm-post-media {
  position: absolute; inset: 0; width: 100%; height: 100%;
  max-width: 100%; max-height: 100%; margin: 0;
  display: block; object-fit: contain; object-position: center;
  background: transparent; z-index: 1;
}
.elm-public-post__media > .elm-media-guard-wrap {
  position: absolute; inset: 0; width: 100%; height: 100%;
}
/* Signed-in photo cards hug the actual image; no empty letterbox/backdrop. */
.site-body .hub-post-card__media {
  display: flex; width: fit-content; max-width: 100%; margin-inline: auto;
  aspect-ratio: auto; min-height: 0; background: transparent;
}
.site-body .hub-post-card__media[style]::before,
.site-body .hub-post-card__media[style]::after { content: none; }
.site-body .hub-post-card__media > img,
.site-body .hub-post-card__media > video {
  position: relative; inset: auto; width: auto; height: auto;
  max-width: 100%; max-height: min(52vh, 520px); object-fit: contain;
}
.site-body .hub-post-card__media-pill {
  position: absolute; bottom: 12px; right: 12px; z-index: 3;
  display: inline-flex; padding: 8px 12px; border-radius: 999px;
  background: rgba(16, 30, 23, .86); color: white;
  font-size: 12px; font-weight: 650; text-decoration: none;
}
.elm-public-post__footer { display: flex; justify-content: space-between; gap: 12px; padding: 12px 18px; border-top: 1px solid #e8e8e2; font-size: 13px; color: #68726b; }
.elm-public-post__footer a { color: #325e47; text-decoration: none; }
.elm-feed-empty { padding: 28px; line-height: 1.6; color: #68726b; }
.elm-feed-empty strong { color: #242b28; font-size: 18px; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 2px solid #325e47; outline-offset: 3px; }
.site-body.page-social-hub {
  --hub-bg: #f5f3ef; --hub-bg-soft: #f8f7f4; --hub-panel: white;
  --hub-panel-strong: #fffefb; --hub-line: #ddded7; --hub-line-strong: #cdd4c8;
  --hub-text: #242b28; --hub-muted: #68726b; --hub-accent: #325e47;
}
.site-body .hub-panel__summary strong, .site-body .hub-panel__body, .site-body .hub-space-card__copy strong,
.site-body .spaces-signed-hero__title, .site-body .spaces-section-title, .site-body .spaces-signed-stat strong { color: #242b28; }
.site-body .hub-panel__summary small, .site-body .hub-space-card__copy small, .site-body .spaces-signed-hero__copy,
.site-body .spaces-section-copy, .site-body .spaces-signed-stat span { color: #68726b; }
.site-body .hub-hero { padding: 0; min-height: 0; background: none; border: 0; }
.site-body .hub-hero::after { display: none; }
.site-body .hub-composer__input::placeholder { color: #68726b; }
.site-body .hub-composer__avatar, .site-body .hub-person-link__avatar { background: #e9eee6; color: #325e47; }
.site-body .hub-space-card__body { background: #fffefb; }
.site-body .hub-space-card__banner { background: #e9eee6; }
.site-body .hub-space-card__banner:empty { aspect-ratio: auto; height: 12px; }
.site-body .hub-friend-mood { color: #68726b; }
.site-body .hub-feature-card--empty { background: #f8f7f4; border-color: #ddded7; color: #3d4641; padding: 16px; border-radius: 8px; }
.site-body .hub-feature-card--empty strong { color: #242b28; }
.site-body .hub-feature-card--empty small { color: #68726b; }
.site-body .hub-feature-card__cta { color: #325e47; border-color: #d6e3d4; }
.site-body .hub-feature-card__pill.is-muted { color: #68726b; background: #eeece6; }
/* Bounded sidebar tracks and rows: long titles must never widen a card. */
.site-body .hub-right-column {
  min-width: 0; grid-template-columns: minmax(0, 1fr); gap: 12px;
  padding-right: 0;
}
.site-body .hub-right-column .hub-panel { min-width: 0; overflow: hidden; }
.site-body .hub-right-column .hub-panel__summary {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 15px 16px;
}
.site-body .hub-right-column .hub-panel__summary > span:first-child { min-width: 0; flex: 1; }
.site-body .hub-right-column .hub-panel__summary small {
  text-transform: none; letter-spacing: 0; font-size: 12px;
}
.site-body .hub-right-column .hub-panel__chevron {
  flex: 0 0 24px; width: 24px; height: 24px;
  border: 0; background: #f4f5f0; font-size: 11px;
}
.site-body .hub-right-column .hub-panel__body { padding: 0 12px 12px; min-width: 0; }
.site-body .hub-right-column .hub-panel__body--list { grid-template-columns: minmax(0, 1fr); gap: 4px; }
.site-body .hub-right-column .hub-mini-row {
  display: flex; align-items: center; gap: 10px; padding: 8px 4px;
  min-width: 0; width: 100%; box-sizing: border-box;
  border: 0; border-radius: 8px; background: transparent;
}
.site-body .hub-right-column .hub-mini-row:hover { background: #f4f6f0; }
.site-body .hub-right-column .hub-mini-row__badge {
  flex: 0 0 40px; width: 40px; height: 40px; border-radius: 10px;
  background: #edf1e8; color: #325e47; font-size: 16px; font-weight: 650;
  overflow: visible;
}
.site-body .hub-right-column .hub-mini-row__badge img { border-radius: 10px; width: 40px; height: 40px; object-fit: cover; }
.site-body .hub-right-column .hub-mini-row__content { flex: 1; min-width: 0; display: block; }
.site-body .hub-right-column .hub-mini-row__content strong {
  display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis;
  font-size: 13px; font-weight: 650; line-height: 1.4;
}
.site-body .hub-right-column .hub-mini-row--post strong {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  white-space: normal; overflow-wrap: anywhere;
}
.site-body .hub-right-column .hub-mini-row__content small { display: block; margin-top: 3px; font-size: 11px; }
.site-body .hub-right-column .hub-friend-mood {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  overflow: hidden; padding: 0; margin-top: 3px; background: none; border-radius: 0;
  font-size: 11px; line-height: 1.45; color: #68726b;
}
.site-body .hub-right-column .hub-friend-mood::before { content: none; }

/* App-style system-message icons, shared by People, chats and rich messages. */
.site-body .elm-message-tag { display: inline-flex; align-items: baseline; gap: 7px; max-width: 100%; vertical-align: bottom; }
.site-body .elm-message-tag__icon { display: inline-flex; flex: 0 0 15px; align-self: flex-start; margin-top: .15em; color: inherit; }
.site-body .elm-message-tag__icon svg { display: block; width: 15px; height: 15px; }
.site-body .elm-message-tag__text { min-width: 0; overflow-wrap: anywhere; }
.site-body .messages-contact-preview .elm-message-tag { display: flex; }
.site-body .messages-contact-preview .elm-message-tag__text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.site-body .hub-right-column .hub-mini-row__badge.is-friend::after {
  border: 2px solid white; box-shadow: none; width: 8px; height: 8px;
}
.site-body .hub-right-column .hub-empty-copy { padding: 0 4px; font-size: 12px; }
.site-body .hub-right-column .hub-rail-footer-link {
  display: block; padding: 10px 4px 0; color: #325e47;
  font-size: 12px; font-weight: 600; text-decoration: none;
}
.site-body .hub-right-column .hub-rail-footer-link:hover { text-decoration: underline; }
.site-body.page-spaces.page-social-hub .spaces-topbar-card,
.site-body.page-spaces.page-social-hub .spaces-main-tabs,
.site-body.page-spaces.page-social-hub .spaces-section-panel,
.site-body.page-spaces.page-social-hub .spaces-panel-card { background: #fffefb !important; border-color: #ddded7 !important; color: #3d4641 !important; }
.site-body.page-spaces.page-social-hub .spaces-topbar-input { background: #f8f7f4 !important; border-color: #ddded7 !important; color: #3d4641 !important; }
.site-body .spaces-main-tabs { display: flex; flex-wrap: wrap; padding: 8px; gap: 6px; }
.site-body .spaces-main-tabs .spaces-main-tab { padding: 10px 14px; text-decoration: none; }
.site-body .spaces-section-kicker, .site-body .spaces-signed-hero__eyebrow { color: #325e47; }
.site-body .spaces-section-count { background: #edf3ec; color: #325e47; border-color: #d6e3d4; }
.site-body.page-spaces .community-card-media.is-fallback { background: #edf0e7 !important; }
.site-body.page-spaces .community-card-media.is-fallback::before,
.site-body.page-spaces .community-card-media.is-fallback .community-card-scrim { display: none; }
.site-body.page-spaces .community-card-media.is-fallback .community-card-main h3 { color: #242b28; font-size: 22px; }
.site-body.page-spaces .community-card-media.is-fallback .community-card-main p,
.site-body.page-spaces .community-card-media.is-fallback .community-card-owner-name { color: #68726b; }
.site-body.page-spaces .community-card-media.is-fallback .community-card-top span,
.site-body.page-spaces .community-card-media.is-fallback .community-card-meta span { background: #fffefb; color: #325e47; border-color: #d6e3d4; }
.site-body .hub-hero__headline { color: #242b28; font-family: Georgia, 'Times New Roman', serif; font-size: 30px; font-weight: 500; }
.site-body .hub-hero__copy p, .site-body .hub-composer__intro small, .site-body .hub-composer__visibility-copy small { color: #68726b; }
.site-body .hub-hero__eyebrow, .site-body .hub-composer__intro strong, .site-body .hub-composer__visibility-copy strong { color: #325e47; }
.site-body .hub-composer { background: #fafaf6; border-color: #ddded7; border-radius: 10px; }
.site-body .hub-composer__input, .site-body .hub-composer__audience { background: #fffefb; color: #3d4641; border-color: #ddded7; }
.site-body .hub-composer__tools button, .site-body .hub-composer__tools a { background: white; color: #3d4641; border-color: #ddded7; border-radius: 6px; }
.site-body .hub-composer__submit { background: #242b28; color: white; border-radius: 6px; }
.site-body .hub-composer__submit:disabled { opacity: .5; }
.site-body .hub-post-card { background: white; border-color: #ddded7; border-radius: 12px; box-shadow: none; }
.site-body .hub-post-card__header {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center; gap: 10px; padding: 14px 16px;
}
.site-body .hub-post-card__text { padding-bottom: 14px; }
.site-body .hub-post-card__footer { padding: 12px 16px; }
.site-body .hub-post-card__header, .site-body .hub-post-card__footer { border-color: #e8e8e2; }
.site-body .hub-post-card__meta strong, .site-body .hub-post-card__text { color: #3d4641; }
.site-body .hub-post-card__footer, .site-body .hub-post-card__subline { color: #68726b; }
.site-body .hub-post-card__open { color: #325e47; background: #edf3ec; border-color: #d6e3d4; }
.site-body .hub-post-card__avatar { background: #e9eee6; color: #325e47; }
.site-body .hub-post-card__footer { flex-wrap: wrap; align-items: center; }
.site-body .hub-post-card__reply-button,
.site-body .hub-post-card__reply-actions button { border: 1px solid #d6e3d4; background: #edf3ec; color: #325e47; border-radius: 8px; padding: 8px 12px; cursor: pointer; font: inherit; font-weight: 600; }
.site-body .hub-post-card__reply { margin: 0; padding: 14px 16px; border-top: 1px solid #e8e8e2; background: #fafbf8; }
.site-body .hub-post-card__reply[hidden] { display: none; }
.site-body .hub-post-card__reply label { display: block; color: #3d4641; font-size: 13px; font-weight: 600; }
.site-body .hub-post-card__reply textarea { display: block; box-sizing: border-box; width: 100%; min-height: 76px; margin: 8px 0; padding: 12px; resize: vertical; background: #fff; color: #293e32; border: 1px solid #cbd7c9; border-radius: 8px; font: inherit; font-size: 16px; font-weight: 400; }
.site-body .hub-post-card__reply textarea:focus { outline: 2px solid #497659; outline-offset: 2px; }
.site-body .hub-post-card__reply-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.site-body .hub-post-card__reply-actions button[type=submit] { background: #325e47; border-color: #325e47; color: #fff; }
.site-body .hub-post-card__reply-actions button:disabled { opacity: .6; cursor: wait; }
.site-body .hub-post-card__reply-status { color: #325e47; font-size: 13px; }
.site-body .hub-post-card__reply-error { color: #943d36; font-size: 14px; }
.site-body .hub-post-card__sent-replies:empty { display: none; }
.site-body .hub-post-card__sent-replies { border-top: 1px solid #e8e8e2; padding: 0 16px; }
.site-body .hub-post-card__sent-replies p { color: #3d4641; font-size: 14px; white-space: pre-wrap; overflow-wrap: anywhere; }
.site-body .social-paid-lock { margin: 14px 16px; padding: 16px; background: #f1f4eb; border: 1px solid #d6dfcc; border-radius: 10px; color: #354638; }
.site-body .social-paid-lock p { margin: 8px 0 12px; font-size: 14px; line-height: 1.5; }
.site-body .social-paid-confirm { display: flex; align-items: flex-start; gap: 8px; margin: 10px 0; font-size: 14px; }
.site-body .social-paid-confirm[hidden] { display: none; }
.site-body .social-paid-lock input[type=checkbox] { flex-shrink: 0; margin-top: 3px; accent-color: #325e47; }
.site-body .social-paid-lock button, .site-body .social-paid-signin { display: inline-block; padding: 10px 14px; background: #325e47; color: white; border: 0; border-radius: 8px; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.site-body .social-paid-lock button:disabled { opacity: .6; cursor: wait; }
.site-body .social-paid-lock form > a { display: inline-block; margin: 8px 12px; color: #325e47; }
.site-body .social-paid-lock [data-inline-error] { color: #943d36; margin: 8px 0; }
.site-body .social-post-pricing { box-sizing: border-box; min-width: 0; width: 100%; margin: 8px 0; padding: 12px; border: 1px solid #d6dfcc; border-radius: 8px; color: #354638; text-align: left; }
.site-body .social-post-pricing legend { font-size: 13px; font-weight: 600; }
.site-body .social-post-pricing label { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.site-body .social-post-pricing input[type=number] { width: 95px; margin: 8px 0; padding: 8px; border: 1px solid #cbd7c9; border-radius: 6px; color: #354638; background: white; font: inherit; }
.site-body .social-post-pricing small { display: block; font-size: 12px; line-height: 1.5; color: #68726b; }
.site-body .hub-composer__actions, .site-body .space-view-compose-actions { flex-wrap: wrap; }
.site-body .social-post-pricing [hidden] { display: none; }
.site-body .social-paid-audience-note { flex-basis: 100%; color: #68726b; font-size: 12px; line-height: 1.5; }
.site-body .social-post-gift { position: relative; z-index: 3; margin: 12px 16px; color: #354638; font-size: 14px; }
.site-body .social-post-gift summary { display: list-item; cursor: pointer; font-weight: 600; padding: 6px 0; }
.site-body .social-post-gift form { display: grid; gap: 10px; padding: 14px; margin-top: 8px; background: #f4f6ef; border: 1px solid #d6dfcc; border-radius: 10px; max-width: 440px; }
.site-body .social-post-gift select { padding: 8px; border: 1px solid #d6dfcc; border-radius: 6px; background: white; color: #354638; font: inherit; }
.site-body .social-post-gift button { width: fit-content; padding: 10px 16px; border: 0; border-radius: 8px; background: #325e47; color: white; font: inherit; cursor: pointer; }
.site-body .social-post-gift button:disabled { opacity: .65; cursor: default; }
.site-body .social-post-gift small { line-height: 1.5; color: #68726b; }
.site-body .social-post-gift [data-inline-error] { color: #943d36; }
.site-body .social-post-gift [data-inline-status] { font-weight: 600; }
.site-body .hub-feed-loading { color: #68726b; padding: 24px 0; }
.site-body .hub-feed-loading button { background: #edf3ec; color: #325e47; border: 1px solid #d6e3d4; border-radius: 6px; padding: 6px 12px; }
.site-body .spaces-topbar-card, .site-body .spaces-section-panel, .site-body .spaces-panel-card,
.site-body .spaces-signed-stat, .site-body .spaces-topbar-input { background: #fffefb; color: #3d4641; border-color: #ddded7; }
.site-body .spaces-main-tab, .site-body .spaces-topbar-btn { background: #fffefb; color: #68726b; border-color: #ddded7; border-radius: 6px; }
.site-body .spaces-main-tab.is-active, .site-body .spaces-topbar-btn-primary { background: #325e47; color: white; border-color: #325e47; }
.site-body .feature-head { background: transparent; border: 0; box-shadow: none; }
.public-home h2, .public-home h3, .public-home strong, .public-home label { color: #242b28; }
.public-home p, .public-home small { color: #68726b; }
.public-home .public-home__brand, .public-home .public-home__eyebrow,
.public-home .public-home__sidebar-title { color: #325e47; }
.public-home .public-home__search-link, .public-home .public-home__chip,
.public-home .public-home__secondary, .public-home .public-home__sidebar-btn { background: #fffefb; color: #3d4641; border-color: #ddded7; border-radius: 6px; }
.public-home .public-home__sidebar-btn.is-active { background: #edf3ec; color: #325e47; border-color: #d6e3d4; }
.public-home .public-home__rail-card, .public-home .public-home__rail-tabs,
.public-home .public-home__input, .public-home .public-home__oauth, .public-home .public-home__rail-link,
.public-home .public-home__support-card, .public-home .public-home__empty { background: white; color: #3d4641; border-color: #ddded7; box-shadow: none; border-radius: 8px; }
.public-home .public-home__rail-tab { background: transparent; color: #68726b; border-radius: 5px; }
.public-home .public-home__rail-tab.is-active { background: #edf3ec; color: #325e47; }
.public-home .public-home__submit { background: #242b28; color: white; border-color: #242b28; border-radius: 6px; }
.public-home .public-home__rail-avatar { background: #e9eee6; color: #325e47; }
.public-home .public-home__rail-footer a { color: #68726b; }
.public-home .public-home__card strong, .public-home .public-home__card small,
.public-home .public-home__card p { color: white; }
.public-home .public-home__story-card.is-text { background: #edf3ec; }
.public-home .public-home__story-card.is-text strong, .public-home .public-home__story-card.is-text p { color: #3d4641; }
.site-body .hub-composer__input { min-height: 80px; }
.site-body.page-contacts .contacts-page { color: #3d4641; }
.site-body.page-contacts .contacts-topbar, .site-body.page-contacts .contacts-card,
.site-body.page-contacts .contacts-empty { background: #fffefb; border-color: #ddded7; border-radius: 10px; }
.site-body.page-contacts .contacts-topbar h1, .site-body.page-contacts .contacts-name-row h2,
.site-body.page-contacts .contacts-section-head h2, .site-body.page-contacts .contacts-empty h2 { color: #242b28; }
.site-body.page-contacts .contacts-topbar p, .site-body.page-contacts .contacts-empty p,
.site-body.page-contacts .contacts-card p { color: #68726b; font-weight: 400; }
.site-body.page-contacts .contacts-badge, .site-body.page-contacts .contacts-section-head span,
.site-body.page-contacts .contacts-actions a + a { background: #edf3ec; color: #325e47; }
.site-body.page-contacts .contacts-primary-action, .site-body.page-contacts .contacts-empty a,
.site-body.page-contacts .contacts-actions a { background: #325e47; color: white; border-radius: 6px; }
.site-body.page-discover-site .discover-page { color: #3d4641; }
.site-body.page-discover-site .discover-topbar-card, .site-body.page-discover-site .discover-search-pill,
.site-body.page-discover-site .discover-empty { background: #f8f7f4; border-color: #ddded7; color: #3d4641; box-shadow: none; }
.site-body.page-discover-site .discover-topbar-tab { color: #68726b; background: transparent; border-radius: 6px; }
.site-body.page-discover-site .discover-topbar-tab.is-active { color: #325e47; background: #edf3ec; border-color: #d6e3d4; }
.site-body.page-discover-site .discover-section-head h2, .site-body.page-discover-site .discover-empty h2 { color: #242b28; }
.site-body.page-discover-site .discover-section-head span, .site-body.page-discover-site .discover-empty p { color: #68726b; }
.site-body.page-discover-site .discover-post-card.is-text-only { background: #f8f7f4; background-image: none; height: auto; min-height: 0; border: 1px solid #ddded7; }
.site-body.page-discover-site .discover-post-card.is-text-only::before,
.site-body.page-discover-site .discover-post-card.is-text-only::after { display: none; }
.site-body.page-discover-site .discover-tab.is-active { color: #325e47; background: #edf3ec; border-color: #d6e3d4; }
.site-body.page-spaces .spaces-message-card p { color: #68726b !important; }
.site-body.page-spaces .hub-main-column { min-width: 0; }
.site-body.page-discover-site .discover-post-card.is-text-only .discover-post-shade { display: none; }
.site-body.page-discover-site .discover-post-card.is-text-only .discover-post-overlay { position: relative; inset: auto; padding: 16px; color: #3d4641; }
.site-body.page-discover-site .discover-post-card.is-text-only .discover-post-author-row h3 { color: #242b28; }
.site-body.page-discover-site .discover-post-card.is-text-only .discover-post-author-row p { color: #68726b; }
.site-body.page-discover-site .discover-post-card.is-text-only .discover-post-text { font-size: 14px; font-weight: 400; line-height: 1.55; color: #3d4641; -webkit-line-clamp: 5; }
.site-body.page-discover-site .discover-post-card.is-text-only .discover-post-meta span { background: #edf3ec; color: #325e47; }
@media (max-width: 1280px) {
  .site-body.page-social-hub .hub-shell { grid-template-columns: 190px minmax(0,1fr); }
  .site-body .hub-shell { grid-template-columns: 190px minmax(0, 1fr); }
  .site-body .hub-right-column { display: none; }
  .site-body .site-nav-app { gap: 0; }
  .site-body .site-nav-app a { padding: 8px; }
  .site-body .site-header-search { display: none; }
  .public-home .public-home__grid { grid-template-columns: minmax(0, 1fr) 300px; }
  .public-home .public-home__sidebar { display: none; }
}
@media (max-width: 760px) {
  .site-body.page-spaces.page-social-hub .community-card-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .site-body.page-social-hub .wrap { width: calc(100% - 24px); }
  .site-body.page-social-hub .hub-shell { grid-template-columns: minmax(0,1fr); gap: 14px; }
  .site-body .site-nav-app { display: none; }
  .site-body .wrap, .public-home .public-home__shell { width: calc(100% - 24px); }
  .site-body .site-header-inner { min-height: 64px; gap: 8px; }
  .site-body .brand-subtitle, .site-body .site-header-search { display: none; }
  .site-body .site-main { padding-top: 16px; padding-bottom: calc(90px + env(safe-area-inset-bottom)); }
  .site-body .hub-shell { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .site-body .hub-left-column { display: none; }
  .site-body .site-mobile-tabbar { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; padding: 8px 6px calc(8px + env(safe-area-inset-bottom)); }
  .site-body .site-mobile-tabbar a { display: grid; justify-items: center; align-content: center; gap: 4px; font-size: 10px; border-radius: 9px; padding: 7px 1px; min-width: 0; }
  .site-body .messages-shell { grid-template-columns: minmax(0, 1fr); height: calc(100dvh - 166px - env(safe-area-inset-bottom)); }
  .site-body .messages-shell:not(.has-thread) .messages-thread-panel { display: none; }
  .site-body .messages-shell.has-thread .messages-list-panel { display: none; }
  .site-body .messages-compose { padding: 12px; }
  .site-body .messages-compose textarea { font-size: 16px; }
  .site-body .activity-layout { grid-template-columns: minmax(0, 1fr); }
  .site-body .spaces-signed-hero { padding: 20px; }
  .site-body .spaces-signed-hero__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-body .spaces-topbar-actions { flex-wrap: wrap; }
  .public-home .public-home__topbar { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; padding: 4px 0 14px; }
  .public-home .public-home__brand { font-size: 17px; }
  .public-home .public-home__actions { margin-left: auto; }
  .public-home .public-home__nav { display: flex; flex-wrap: nowrap; width: 100%; order: 3; overflow-x: auto; white-space: nowrap; gap: 2px; padding-bottom: 3px; }
  .public-home .public-home__nav-btn { flex-shrink: 0; }
  .site-body .hub-composer__top { display: grid; grid-template-columns: 36px minmax(0,1fr); gap: 12px; }
  .site-body .hub-composer__avatar { width: 36px; height: 36px; }
  .site-body .hub-composer__intro strong { font-size: 16px; }
  .site-body .hub-composer__audience-wrap { grid-column: 1 / -1; }
  .site-body .hub-composer__audience { min-height: 36px; }
  .site-body .hub-hero__copy { display: none; }
  .site-body .hub-composer { padding: 14px; }
  .site-body .hub-composer__tools { display: flex; flex-wrap: wrap; gap: 6px; }
  .site-body .hub-composer__tools button, .site-body .hub-composer__tools a { width: auto; min-height: 38px; flex: 1 1 auto; padding: 8px 10px; font-size: 12px; }
  .site-body .hub-composer__submit { width: auto; min-width: 100px; }
  .public-home .public-home__nav-btn { padding: 9px 11px; font-size: 13px; }
  .public-home .public-home__hero { padding: 22px; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-bottom: 22px; }
  .public-home .public-home__hero-side, .public-home .public-home__feature-row { display: none; }
  .public-home .public-home__title { font-size: 32px; }
  .public-home .public-home__subtitle { font-size: 14px; }
  .public-home .public-home__grid { display: flex; flex-direction: column; gap: 22px; }
  .public-home .public-home__stage, .public-home .public-home__rail { width: 100%; min-width: 0; }
  .public-home .public-home__stage-head { flex-wrap: wrap; gap: 12px; }
  .public-home .public-home__stage-actions { display: none; }
  .public-home .public-home__rail { position: static; order: 2; }
  .elm-public-post__header { padding: 14px; }
  .elm-post-text { padding: 0 14px 14px; font-size: 15px; }
  .elm-post-media { max-height: 480px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }

/* Community context belongs beside the conversation, not above it twice. */
.site-body.page-community-detail .hub-shell { grid-template-columns: 280px minmax(0,1fr) 260px; }
.site-body.page-community-detail .hub-left-column { position: sticky; top: 96px; max-height: calc(100dvh - 112px); overflow-y: auto; scrollbar-width: thin; padding-right: 2px; }
.site-body.page-community-detail .space-view-layout { display: block !important; grid-template-columns: minmax(0,1fr) !important; }
.site-body.page-community-detail .space-view-main { width: 100% !important; min-width: 0; }
.site-body.page-community-detail .space-view-section-head { margin-top: 0; padding: 0 0 16px; }
.site-body.page-community-detail .space-view-section-head h2 { font-size: 24px; }
.site-body.page-community-detail :is(.space-view-main, .space-view-section-head, .space-view-layout) { background: transparent !important; color: #3d4641 !important; box-shadow: none !important; }
.site-body.page-community-detail .space-view-section-head { display: flex !important; flex-direction: row !important; align-items: center; justify-content: space-between; gap: 12px; }
.site-body.page-community-detail :is(.space-view-section-head h2, .space-view-post-name, .space-view-compose h3, .space-manage-titlebar h3, .spaces-message-card h3, .space-admin-panel h4) { color: #242b28 !important; }
.site-body.page-community-detail :is(.space-view-post-card, .space-view-compose, .space-admin-panel, .space-view-focused-post, .spaces-message-card) { background: #fffefb !important; border-color: #ddded7 !important; color: #3d4641 !important; box-shadow: none !important; border-radius: 14px; }
.site-body.page-community-detail :is(.space-view-post-text, .space-view-post-text p, .space-view-post-text div, .space-view-post-text span, .space-view-post-text strong, .space-view-post-text em, .space-view-post-text li, .space-view-post-footer, .space-view-post-meta-row, .space-manage-form label span, .space-view-message, .space-focused-empty) { color: #3d4641 !important; }
.site-body.page-community-detail :is(.space-view-inline-action, .space-view-btn, .space-post-tab-form button, .space-post-pin-form button) { background: #edf3ec !important; color: #325e47 !important; border-color: #d6e3d4 !important; box-shadow: none !important; text-decoration: none; }
.site-body.page-community-detail .space-view-btn-primary { background: #325e47 !important; color: #fff !important; }
.site-body.page-community-detail :is(.space-view-textarea, .space-manage-form input, .space-manage-form select, .space-manage-form textarea, .space-tab-form input, .space-tab-form select, .space-delete-form input) { background: #f8f7f4 !important; color: #242b28 !important; border-color: #ddded7 !important; }
.site-body.page-community-detail .space-view-post-footer { background: transparent !important; border-color: #e8e8e2 !important; }
.site-body.page-community-detail :is(.space-focused-back, .space-focused-end a, .space-view-post-text a, .space-view-comment-cta a) { color: #325e47 !important; }
.site-body.page-community-detail .space-view-textarea::placeholder { color: #68726b !important; }
.site-body.page-community-detail .space-view-post-media-wrap { background: #eeece6 !important; }
.site-body.page-spaces.page-community-detail .space-view-post-media-wrap::before {
  background-color: transparent !important;
  filter: blur(24px) saturate(.9) brightness(1.04) !important;
}
.site-body.page-spaces.page-community-detail .space-view-post-media-wrap::after {
  background: rgba(245, 243, 239, .42) !important;
}
.site-body.page-spaces.page-community-detail .space-view-post-footer span {
  background: #edf3ec !important; color: #325e47 !important;
  border-color: #d6e3d4 !important;
}
.site-body.page-spaces.page-community-detail .space-view-post-footer span:hover,
.site-body.page-spaces.page-community-detail .space-view-post-footer span.is-active {
  background: #325e47 !important; color: #fff !important;
}
.site-body.page-spaces.page-community-detail .space-view-post-footer span.is-error {
  background: #fef2f2 !important; color: #b91c1c !important;
}
.site-body.page-community-detail .space-view-post-media-wrap {
  position: relative !important; display: block !important;
  min-height: 0 !important; height: auto !important; aspect-ratio: 2 / 1;
}
.site-body.page-community-detail .space-view-post-media-wrap > .elm-media-guard-wrap,
.site-body.page-community-detail .space-view-post-media {
  position: absolute !important; inset: 0 !important;
  width: 100% !important; height: 100% !important;
  max-width: 100% !important; max-height: 100% !important; margin: 0 !important;
  object-fit: contain !important; background: transparent !important;
}
.site-body .space-view-post-media-wrap.is-video,
.site-body .post-view-media-wrap.is-video {
  position: relative !important; display: block !important;
  width: 100% !important; padding: 0 !important; min-height: 0 !important;
  height: auto !important; aspect-ratio: 16 / 9;
  max-height: min(70svh, 640px); overflow: hidden !important;
  background: #151a17 !important;
}
.site-body .space-view-post-media-wrap.is-video > video,
.site-body .post-view-media-wrap.is-video > video {
  display: block !important; position: absolute !important; inset: 0 !important;
  width: 100% !important; height: 100% !important; margin: 0 !important;
  max-width: 100% !important; max-height: 100% !important;
  object-fit: contain !important;
}
.site-body .is-video > .post-video-preview {
  position: absolute; inset: 0; z-index: 2; display: block;
  width: 100%; height: 100%; padding: 0; border: 0;
  background: #151a17; color: white; cursor: pointer;
}
.site-body .is-video > .post-video-preview[hidden] { display: none !important; }
.site-body .post-video-preview > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.site-body .post-video-preview__play {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(12, 20, 15, .78); border: 1px solid rgba(255,255,255,.65);
}
.site-body .post-video-preview:focus-visible { outline: 3px solid #7fb090; outline-offset: -3px; }
.site-body.page-spaces.page-social-hub.page-community-detail :is(.space-focused-nav a, .space-focused-end a) { color: #325e47 !important; }
.site-body .community-empty { padding: 28px !important; }
.site-body .community-empty p { margin: 10px 0 0; line-height: 1.6; }
.site-body .community-back { display: block; color: #68726b; font-size: 13px; padding: 4px 0 12px; text-decoration: none; }
.site-body .community-context { background: #fffefb; border: 1px solid #ddded7; border-radius: 14px; overflow: hidden; color: #3d4641; }
.site-body .community-context__identity { list-style: none; cursor: pointer; }
.site-body .community-context__identity::-webkit-details-marker { display: none; }
.site-body .community-context__cover { display: block; width: 100%; height: 104px; object-fit: cover; }
.site-body .community-context__heading { display: flex; align-items: flex-start; gap: 12px; padding: 18px 16px 10px; }
.site-body .community-context__heading > span:last-child { min-width: 0; }
.site-body .community-context h1 { margin: 4px 0 0; font-size: 21px; line-height: 1.25; letter-spacing: -.5px; color: #242b28; overflow-wrap: anywhere; }
.site-body .community-context.is-creator h1 { font-size: 18px; }
.site-body .community-context__heading small { color: #68726b; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; }
.site-body .community-context__avatar { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 12px; overflow: hidden; display: grid; place-items: center; background: #edf3ec; color: #325e47; font-size: 23px; font-weight: 600; }
.site-body .community-context__avatar img { width: 100%; height: 100%; object-fit: cover; }
.site-body .community-context__mobile-hint { display: none; }
.site-body .community-context__body { padding: 0 16px 18px; }
.site-body .community-context__description { font-size: 14px; line-height: 1.65; margin: 6px 0 16px; white-space: pre-line; overflow-wrap: anywhere; }
.site-body .community-context__membership { display: flex; flex-wrap: wrap; gap: 8px; font-size: 12px; color: #68726b; margin: 0 0 16px; }
.site-body .community-context__membership span + span::before { content: '·'; margin-right: 8px; }
.site-body .community-context__nav { display: grid; gap: 4px; border-top: 1px solid #e8e8e2; padding: 12px 0; }
.site-body .community-context__nav a, .site-body .community-switcher a { display: block; padding: 10px 12px; border-radius: 8px; text-decoration: none; font-size: 14px; color: #3d4641; overflow-wrap: anywhere; }
.site-body .community-context__nav a:hover, .site-body .community-switcher a:hover { background: #f5f3ef; }
.site-body .community-context__nav a[aria-current], .site-body .community-switcher a[aria-current] { background: #edf3ec; color: #325e47; font-weight: 650; }
.site-body .community-context__join { width: 100%; border: 1px solid #325e47; border-radius: 8px; background: #325e47; color: white; padding: 11px 14px; font-weight: 600; cursor: pointer; }
.site-body .community-context__join.is-secondary { background: #fffefb; border-color: #ddded7; color: #68726b; }
.site-body .community-context__guest-join { display: block; box-sizing: border-box; text-align: center; text-decoration: none; }
.site-body .community-context__app { display: block; padding: 14px 0 0; font-size: 13px; color: #325e47; text-align: center; text-decoration: none; }
.site-body .community-context__info { margin-top: 18px; font-size: 13px; border-top: 1px solid #e8e8e2; padding-top: 14px; }
.site-body .community-context__info summary, .site-body .community-switcher summary { cursor: pointer; color: #68726b; }
.site-body .community-context__info dl { margin-bottom: 0; }
.site-body .community-context__info dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; }
.site-body .community-context__info dd { margin: 0; text-align: right; overflow-wrap: anywhere; }
.site-body .community-context__section { border-top: 1px solid #e8e8e2; margin-top: 16px; padding-top: 16px; font-size: 13px; }
.site-body .community-context__section h2 { font-size: 13px; margin: 0 0 10px; color: #68726b; font-weight: 600; }
.site-body .community-context__section a { color: #325e47; }
.site-body .community-context__pinned { display: block; text-decoration: none; padding: 8px 0; line-height: 1.5; }
.site-body .community-shortcuts { display: flex; flex-wrap: wrap; gap: 16px; padding: 16px 4px; font-size: 12px; }
.site-body .community-shortcuts a { color: #68726b; text-decoration: none; }
.site-body .community-switcher { padding: 0 4px 16px; font-size: 13px; }
#spaces-content-root[aria-busy='true'] { opacity: .65; }
@media (min-width: 761px) { .site-body .community-context__identity { pointer-events: none; } }
.site-body.page-community-public, .page-community-public .guest-public { background: #f5f3ef !important; color: #3d4641; }
.page-community-public .guest-public::before { display: none; }
.page-community-public .guest-public__shell { width: min(calc(100% - 48px),1920px); max-width: 1920px; }
.page-community-public .guest-public__grid { grid-template-columns: 280px minmax(0,1fr) 260px; }
.page-community-public .community-public-sidebar, .page-community-public .guest-public__stage { background: none; border: 0; padding: 0; box-shadow: none; backdrop-filter: none; }
.page-community-public .community-public-sidebar { max-height: calc(100dvh - 40px); overflow-y: auto; scrollbar-width: thin; }
.page-community-public :is(.guest-public__rail,.guest-public__post,.guest-public__card) { background: #fffefb; border-color: #ddded7; box-shadow: none; backdrop-filter: none; border-radius: 14px; }
.page-community-public :is(.guest-public__brand,.guest-public__section-head h2,.guest-public__author-copy strong,.guest-public__rail-item strong,.guest-public__card-title,.guest-public__body) { color: #242b28; }
.page-community-public :is(.guest-public__brand-copy small,.guest-public__nav a,.guest-public__empty,.guest-public__card-copy,.guest-public__rail-copy,.guest-public__rail-item small,.guest-public__author-copy span) { color: #68726b; }
.page-community-public .guest-public__empty { color: #68726b !important; }
.page-community-public :is(.guest-public__top-btn,.guest-public__rail-item,.guest-public__btn,.guest-public__chip) { background: #edf3ec; color: #325e47; border-color: #ddded7; box-shadow: none; }
.page-community-public .guest-public__top-btn.is-primary { background: #325e47; color: #fff; }
.page-community-public .guest-public__kicker { color: #68726b; }
.page-community-public :is(.guest-public__notice,.guest-public__section-head p,.guest-public__mini-meta,.guest-public__footer-links a) { color: #68726b; }
.page-community-public .guest-public__rail-item--creator { background: #f8f7f4; }
.page-community-public .guest-public__rail-item--creator::before { display: none; }
.page-community-public .guest-public__section-head h2 { font-size: 24px; }
@media (max-width: 1280px) { .site-body.page-community-detail .hub-shell { grid-template-columns: 260px minmax(0,1fr); } }
@media (max-width: 1280px) { .page-community-public .guest-public__grid { grid-template-columns: 260px minmax(0,1fr); } .page-community-public .guest-public__rail { display: none; } }
@media (max-width: 760px) {
  .page-community-public .guest-public__shell { width: calc(100% - 24px); }
  .page-community-public .guest-public__grid { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .page-community-public .community-public-sidebar { display: block; position: static; max-height: none; overflow: visible; }
  .site-body.page-community-detail .hub-shell { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .site-body.page-community-detail .hub-left-column { display: block; position: static; max-height: none; overflow: visible; padding: 0; }
  .site-body .community-context__cover { display: none; }
  .site-body .community-context__heading { padding: 14px 16px 10px; align-items: center; }
  .site-body .community-context h1 { font-size: 18px; }
  .site-body .community-context__mobile-hint { display: flex; align-items: center; justify-content: space-between; padding: 0 16px 12px; font-size: 12px; color: #68726b; }
  .site-body .community-context[open] .community-context__mobile-hint span { transform: rotate(180deg); }
  .site-body .community-shortcuts, .site-body .community-switcher { display: none; }
  .site-body.page-community-detail .space-view-section-head { padding-bottom: 12px; }
}
.guest-public__topbar {
  display: flex; align-items: center; flex-wrap: wrap; gap: 16px;
  padding: 14px 0; margin: 0 0 20px; border-bottom: 1px solid #ddded7;
}
.guest-public__brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: #242b28 !important; flex-shrink: 0; }
.guest-public__brand img { width: 36px; height: 36px; object-fit: contain; }
.guest-public__brand-copy { display: grid; font-weight: 800; }
.guest-public__brand-copy small { font-size: 11px; font-weight: 400; color: #68726b; }
.guest-public__nav { display: flex; flex: 1; align-items: center; flex-wrap: wrap; gap: 4px; justify-content: center; }
.guest-public__nav a, .guest-public__top-btn { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 10px; color: #57635b !important; text-decoration: none; border-radius: 8px; font-size: 13px; font-weight: 650; background: transparent; border: 0; }
.guest-public__nav a.is-active { color: #325e47 !important; background: #edf3ec; }
.guest-public__top-actions { display: flex; gap: 4px; flex-wrap: wrap; }
.guest-public__top-btn.is-primary { color: #fff !important; background: #325e47; box-shadow: none; }
.public-home .public-home__creator-card { min-height: 220px; border-radius: 12px; }
.public-home [data-home-panel="people"] .elm-public-feed, .public-home [data-home-panel="discover"] .elm-public-feed { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; align-items: start; }
.public-home .public-home__directory-count { color: #68726b; font-size: 12px; }
.public-home .public-home__card-avatar { position: absolute; top: 14px; right: 14px; width: 42px; height: 42px; border: 2px solid #fffefb; border-radius: 50%; overflow: hidden; display: grid; place-items: center; background: #edf3ec; color: #325e47; font-weight: 700; z-index: 4; }
.public-home .public-home__card-avatar img { position: static; width: 100%; height: 100%; object-fit: cover; filter: none; }
.public-home .public-home__card.is-missing-media { background: #edf3ec; }
.public-home .public-home__card.is-missing-media .public-home__shade { display: none; }
.public-home .public-home__card.is-missing-media :is(strong,small) { color: #242b28; }
.public-home .public-home__card.is-missing-media .public-home__kind { color: #325e47; background: #fffefb; }
.public-home .public-home__card img[hidden] { display: none; }
.public-home .public-home__places-guide { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 0 0 24px; }
.public-home .public-home__places-guide article { padding: 20px; border: 1px solid #ddded7; border-radius: 12px; background: #fffefb; }
.public-home .public-home__places-guide h3 { margin: 12px 0 8px; font-size: 18px; color: #242b28; }
.public-home .public-home__places-guide p { font-size: 14px; line-height: 1.6; color: #68726b; }
.public-home .public-home__places-guide a { color: #325e47; font-size: 14px; font-weight: 600; }
.public-home .public-home__places-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; color: #325e47; background: #edf3ec; }
.public-home [data-home-panel="people"] .elm-public-post { margin: 0; }
.public-home [data-home-panel="people"] .elm-public-post__media { height: 300px; }
@media (prefers-reduced-motion: no-preference) {
  .public-home__view.is-active .elm-public-post { animation: guest-post-appear .3s ease-out both; }
  .public-home__view.is-active .elm-public-post:nth-child(2n) { animation-delay: .06s; }
  .public-home .public-home__creator-card { transition: transform .18s ease, box-shadow .18s ease; }
  .public-home .public-home__creator-card:hover { transform: translateY(-3px); box-shadow: 0 8px 20px #24372b20; }
}
@keyframes guest-post-appear { from { opacity: .3; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (max-width: 760px) {
  .guest-public__topbar { gap: 8px; }
  .guest-public__nav { order: 3; flex-basis: 100%; justify-content: start; gap: 2px; }
  .guest-public__top-actions { margin-left: auto; }
  .guest-public__top-btn { font-size: 12px; padding: 6px 8px; }
  .guest-public__top-actions > a:first-child { display: none; }
  .guest-public__brand-copy small { display: none; }
  .public-home [data-home-panel="people"] .elm-public-feed, .public-home [data-home-panel="discover"] .elm-public-feed, .public-home .public-home__places-guide { grid-template-columns: minmax(0,1fr); }
}
.public-home .public-home__hero[hidden] { display: none !important; }
/* Guard wrappers must own the frame of absolutely positioned banner images. */
.public-home .public-home__card > .elm-media-guard-wrap {
  position: absolute; inset: 0; width: 100%; height: 100%;
}
