/* Community surface. Every rule is scoped to body.community-page. */
.community-page{
  --community-max:90.5rem;
  --community-ivory:color-mix(in srgb,var(--surface) 92%,var(--accent-highlight));
  --community-line:color-mix(in srgb,var(--accent) 20%,transparent);
  --community-line-strong:color-mix(in srgb,var(--accent) 34%,transparent);
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at 88% 4%,color-mix(in srgb,var(--accent-highlight) 13%,transparent),transparent 31rem),
    var(--community-ivory)
}
.community-page *,.community-page *::before,.community-page *::after{box-sizing:border-box}
.community-page button,.community-page input,.community-page select{font:inherit}
.community-page .community-shell{width:var(--site-rail-width);margin-inline:auto}
.community-page :where(a,button):focus-visible{outline:2px solid var(--focus);outline-offset:3px;transition:none}

.community-page .community-masthead{
  position:relative;
  overflow:hidden;
  color:var(--order-inverse-text);
  background:
    radial-gradient(circle at 82% 30%,color-mix(in srgb,var(--gold-hi) 19%,transparent),transparent 22rem),
    linear-gradient(120deg,var(--order-inverse-surface),var(--secondary) 70%,var(--order-inverse-surface))
}
.community-page .community-masthead::after{
  content:"";
  position:absolute;
  inset:-8rem -3rem auto auto;
  width:27rem;
  aspect-ratio:1;
  border:1px solid color-mix(in srgb,var(--gold-hi) 18%,transparent);
  border-radius:50%;
  box-shadow:0 0 0 3rem color-mix(in srgb,var(--gold-hi) 3.5%,transparent),0 0 0 6rem color-mix(in srgb,var(--gold-hi) 2.5%,transparent)
}
.community-page .community-masthead-inner{
  position:relative;
  z-index:2;
  min-height:10.5rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--sp-32);
  padding-block:var(--sp-32)
}
.community-page .community-masthead-copy{display:flex;align-items:center;gap:var(--sp-20)}
.community-page .community-masthead-icon{
  width:4rem;height:4rem;flex:0 0 auto;display:grid;place-items:center;
  border:1px solid color-mix(in srgb,var(--gold-hi) 42%,transparent);border-radius:var(--radius-ctl);
  background:rgba(255,255,255,.06);color:var(--accent-strong)
}
.community-page .community-masthead-icon svg{width:2rem;height:2rem;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}
.community-page .community-masthead h1{margin:0;font-size:clamp(2rem,3.2vw,3.15rem);font-weight:600;line-height:1.05}
.community-page .community-masthead p{max-width:46rem;margin:.55rem 0 0;color:color-mix(in srgb,var(--order-inverse-text) 78%,transparent);font-size:.92rem}
.community-page .community-masthead-stats{display:flex;margin:0}
.community-page .community-masthead-stats>div{
  min-width:7.8rem;padding-inline:var(--sp-20);border-inline-start:1px solid rgba(255,255,255,.16);text-align:end
}
.community-page .community-masthead-stats dt{color:rgba(255,255,255,.68);font-size:.65rem}
.community-page .community-masthead-stats dd{margin:.2rem 0 0;color:var(--accent-highlight);font-family:var(--mono);font-size:1.25rem;font-weight:600}

.community-page .community-tabs{display:flex;flex-wrap:wrap;gap:var(--sp-10);padding-block:var(--sp-24) var(--sp-16)}
.community-page .community-tabs button{
  min-height:2.75rem;padding:.5rem 1.25rem;border:1px solid var(--community-line-strong);
  border-radius:var(--radius-pill);background:color-mix(in srgb,var(--surface) 85%,transparent);
  color:var(--text-2);font-weight:600;cursor:pointer;white-space:nowrap
}
.community-page .community-tabs button:hover{border-color:var(--accent);color:var(--text)}
.community-page .community-tabs button.is-active{border-color:transparent;background:var(--button-primary-bg);color:var(--on-gold);box-shadow:var(--shadow-gold)}

.community-page .community-layout{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,21rem);gap:var(--sp-24);
  align-items:start;padding-block-end:var(--sp-64)
}
.community-page .community-stream{min-width:0}
.community-page .community-stream-head{
  display:flex;align-items:end;justify-content:space-between;gap:var(--sp-20);
  margin-block-end:var(--sp-16);padding:var(--sp-8) var(--sp-4)
}
.community-page .community-stream-head .mono,.community-page .community-panel header .mono{color:var(--accent);font-size:.63rem;letter-spacing:.1em}
.community-page .community-stream-head h2{margin:.25rem 0 0;font-size:1.25rem}
.community-page .community-stream-head p{margin:0;color:var(--text-2);font-size:.7rem}
.community-page .community-posts{display:grid;gap:var(--sp-16)}

.community-page .community-post{
  padding:var(--sp-20) var(--sp-24);
  border:1px solid var(--community-line);border-radius:calc(var(--radius-button) * 2);
  background:color-mix(in srgb,var(--surface) 95%,transparent);
  box-shadow:var(--shadow-card)
}
.community-page .community-post-author{display:flex;align-items:center;gap:var(--sp-12)}
.community-page .community-avatar{width:2.65rem;height:2.65rem;flex:0 0 auto}
.community-page .community-post-author>div{min-width:0;display:grid}
.community-page .community-post-author strong{font-size:.82rem;font-weight:600}
.community-page .community-post-author>div span{color:var(--text-3);font-size:.66rem}
.community-page .community-asset-tag{
  margin-inline-start:auto;padding:.27rem .7rem;border-radius:var(--radius-pill);
  background:var(--accent-soft);color:var(--accent);font-family:var(--mono);font-size:.65rem;font-weight:600
}
.community-page .community-post h3{margin:var(--sp-16) 0 var(--sp-8);font-size:1.08rem;line-height:1.42}
.community-page .community-post h3 a{text-decoration:none}
.community-page .community-post h3 a:hover{text-decoration:underline;text-underline-offset:.18em}
.community-page .community-post>p{margin:0;color:var(--text-2);font-size:.8rem;line-height:1.65}
.community-page .community-spark{
  height:3.75rem;margin-block:var(--sp-16);overflow:hidden;border-radius:var(--radius-button);
  background:linear-gradient(180deg,var(--accent-soft),transparent)
}
.community-page .community-spark svg{width:100%;height:100%}
.community-page .community-spark path{fill:none;stroke:var(--accent);stroke-width:1.6;vector-effect:non-scaling-stroke}
.community-page .community-spark path.area{fill:var(--accent-soft);stroke:none}
.community-page .community-post>footer{
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-16);
  padding-block-start:var(--sp-12);border-block-start:1px solid var(--community-line);color:var(--text-2);font-size:.68rem
}
.community-page .community-post>footer>div{display:flex;align-items:center;gap:var(--sp-8)}
.community-page .community-post>footer button{
  width:2.75rem;height:2.75rem;display:grid;place-items:center;border:0;border-radius:var(--radius-button);
  background:transparent;color:var(--accent);cursor:pointer
}
.community-page .community-post>footer button:hover{background:var(--accent-soft)}
.community-page .community-post>footer button svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.5}
.community-page .community-post>footer button.is-saved svg{fill:currentColor}
.community-page .community-post>footer a{
  min-height:2.75rem;display:inline-flex;align-items:center;padding-inline:var(--sp-12);
  border-radius:var(--radius-button);color:var(--accent);font-weight:600;text-decoration:none
}
.community-page .community-post>footer a:hover{background:var(--accent-soft)}
.community-page .community-empty{
  margin:0;padding:var(--sp-48);border:1px dashed var(--community-line-strong);
  border-radius:calc(var(--radius-button) * 2);color:var(--text-2);text-align:center
}
/* DISTINCT from .ui-note, deliberately. This is a centred end-of-list
   terminator — it confirms you reached the bottom of the public sample. It has
   no lead/body severity structure, and .ui-note's leading accent rule would
   assert a severity this carries none of. Kept bespoke. */
.community-page .community-end{
  margin-block-start:var(--sp-16);padding:var(--sp-20);border:1px solid var(--community-line);
  border-radius:calc(var(--radius-button) * 2);background:var(--accent-soft);text-align:center
}
.community-page .community-end span{color:var(--accent);font-size:.62rem;letter-spacing:.1em}
.community-page .community-end p{margin:.35rem 0 0;font-size:.8rem}

.community-page .community-rail{position:sticky;inset-block-start:6rem;display:grid;gap:var(--sp-16)}
.community-page .community-panel,.community-page .community-boundary{
  padding:var(--sp-20);border:1px solid var(--community-line);
  border-radius:calc(var(--radius-button) * 2);background:var(--surface);
  box-shadow:var(--shadow-card)
}
.community-page .community-panel header h2{margin:.25rem 0 0;font-size:1rem}
.community-page .community-surface-links,.community-page .community-room-links{display:grid;margin-block-start:var(--sp-12)}
.community-page .community-surface-links a{
  min-height:4rem;display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-10);
  border-block-start:1px solid var(--community-line);text-decoration:none
}
.community-page .community-surface-links a:first-child{border-block-start:0}
.community-page .community-surface-links a>span{
  width:2rem;height:2rem;display:grid;place-items:center;border:1px solid var(--community-line-strong);
  border-radius:50%;color:var(--accent);font-family:var(--mono);font-size:.62rem
}
.community-page .community-surface-links a div{display:grid}
.community-page .community-surface-links strong{font-size:.76rem}
.community-page .community-surface-links small{color:var(--text-2);font-size:.64rem}
.community-page .community-surface-links a[aria-current="page"]{color:var(--accent)}
.community-page .community-surface-links a:hover,.community-page .community-room-links a:hover{background:var(--accent-soft)}
.community-page .community-room-links a{
  min-height:3.25rem;display:flex;align-items:center;justify-content:space-between;gap:var(--sp-12);
  padding:var(--sp-8) var(--sp-10);border-block-start:1px solid var(--community-line);text-decoration:none
}
.community-page .community-room-links a:first-child{border-block-start:0}
.community-page .community-room-links span{font-family:var(--mono);font-size:.72rem;font-weight:600}
.community-page .community-room-links small{color:var(--text-2);font-size:.62rem}
.community-page .community-join{text-align:center}
.community-page .community-join-icon{
  width:3.25rem;height:3.25rem;display:grid;place-items:center;margin-inline:auto;
  border-radius:var(--radius-ctl);background:var(--accent-soft);color:var(--accent)
}
.community-page .community-join-icon svg{width:1.55rem;height:1.55rem;fill:none;stroke:currentColor;stroke-width:1.3}
.community-page .community-join h2{margin:var(--sp-12) 0 var(--sp-6);font-size:1rem}
.community-page .community-join p{margin:0 0 var(--sp-16);color:var(--text-2);font-size:.72rem;line-height:1.55}
.community-page .community-join .btn{width:100%;justify-content:center}
.community-page .community-member:not([hidden]){display:grid;gap:var(--sp-10)}
.community-page .community-member h2{margin:0;font-size:1rem}
.community-page .community-member a{color:var(--accent);font-size:.74rem}
.community-page .community-boundary{background:color-mix(in srgb,var(--surface-2) 75%,var(--accent-soft));box-shadow:none}
.community-page .community-boundary strong{font-size:.74rem}
.community-page .community-boundary p{margin:.4rem 0 0;color:var(--text-2);font-size:.67rem;line-height:1.55}

@media (hover:hover){
  .community-page .community-post{transition:transform var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard),border-color var(--dur-base) var(--ease-standard)}
  .community-page .community-post:hover{transform:translateY(-2px);border-color:var(--community-line-strong);box-shadow:var(--shadow-hover)}
}
@media (max-width:64rem){
  .community-page .community-masthead-stats>div{min-width:6.5rem;padding-inline:var(--sp-12)}
  .community-page .community-layout{grid-template-columns:minmax(0,1fr) 18rem}
}
@media (max-width:52rem){
  .community-page .community-shell{width:var(--site-rail-width)}
  .community-page .community-masthead-inner{align-items:flex-start;flex-direction:column}
  .community-page .community-masthead-stats{width:100%}
  .community-page .community-masthead-stats>div{flex:1;text-align:start;border-inline-start:0;border-inline-end:1px solid rgba(255,255,255,.16)}
  .community-page .community-masthead-stats>div:last-child{border-inline-end:0}
  .community-page .community-layout{grid-template-columns:1fr}
  .community-page .community-rail{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}
  .community-page .community-boundary{grid-column:1/-1}
}
@media (max-width:36rem){
  .community-page .community-shell{width:var(--site-rail-width)}
  .community-page .community-masthead-copy{align-items:flex-start}
  .community-page .community-masthead-icon{width:3rem;height:3rem}
  .community-page .community-masthead h1{font-size:2rem}
  .community-page .community-masthead-stats dt{font-size:.58rem}
  .community-page .community-masthead-stats dd{font-size:.95rem}
  .community-page .community-tabs{display:grid;grid-template-columns:repeat(2,1fr)}
  .community-page .community-tabs button{width:100%}
  .community-page .community-stream-head{align-items:flex-start;flex-direction:column}
  .community-page .community-post{padding:var(--sp-16)}
  .community-page .community-post-author{align-items:flex-start}
  .community-page .community-asset-tag{font-size:.58rem}
  .community-page .community-post>footer{align-items:flex-start;flex-direction:column}
  .community-page .community-post>footer>div{width:100%;justify-content:space-between}
  .community-page .community-rail{grid-template-columns:1fr}
  .community-page .community-boundary{grid-column:auto}
}
@media (prefers-reduced-motion:reduce){
  .community-page *,.community-page *::before,.community-page *::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* News-derived atmosphere with a community-specific connected-ring motif. */
.community-page{
  background-color:var(--page-atmosphere-base);
  background-image:var(--page-atmosphere-bg);
  background-attachment:fixed
}
.community-page .community-masthead{color:var(--oasis-hero-fg);background:var(--page-hero-background)}
.community-page .community-masthead::after{
  border-color:var(--oasis-hero-line);
  box-shadow:0 0 0 3rem color-mix(in srgb,var(--gold-hi) 5.5%,transparent),0 0 0 6rem color-mix(in srgb,var(--gold-hi) 3.5%,transparent)
}
.community-page .community-masthead-icon{
  border:0;background:var(--oasis-panel-bg);color:var(--accent);box-shadow:var(--shadow-card)
}
.community-page .community-masthead h1{font-family:var(--brand);font-weight:var(--fw-semibold)}
.community-page .community-masthead p{color:var(--oasis-hero-muted)}
.community-page .community-masthead-stats>div{border-color:var(--oasis-hero-line)}
.community-page .community-masthead-stats dt{color:var(--text-2)}
.community-page .community-masthead-stats dd{color:var(--accent)}
.community-page .community-tabs{gap:var(--oasis-filter-gap)}
.community-page .community-tabs button{
  min-height:var(--oasis-filter-height);padding-inline:var(--oasis-filter-pad-inline);
  border-color:var(--oasis-filter-border);border-radius:var(--oasis-filter-radius);
  background:var(--oasis-filter-bg);color:var(--oasis-filter-fg);font-size:var(--oasis-filter-label-size)
}
.community-page .community-tabs button:hover{border-color:var(--accent);background:var(--oasis-panel-bg-hover);color:var(--text)}
.community-page .community-tabs button.is-active{border-color:transparent;background:var(--oasis-filter-active-bg);color:var(--oasis-filter-active-fg)}
@media(pointer:coarse){.community-page .community-tabs button{min-height:var(--touch-target)}}
