/* Matching GR clubhouse rooms; loaded after the existing theme. */
:root{--gr-scenery:url('/scenery/clubhouse/lounge.webp')}
html[data-clubhouse='lounge']{--gr-scenery:url('/scenery/clubhouse/lounge.webp')}
html[data-clubhouse='community']{--gr-scenery:url('/scenery/clubhouse/community.webp')}
html[data-clubhouse='gaming']{--gr-scenery:url('/scenery/clubhouse/gaming.webp')}
html[data-clubhouse='kitchen']{--gr-scenery:url('/scenery/clubhouse/kitchen.webp')}
html[data-clubhouse='studio']{--gr-scenery:url('/scenery/clubhouse/studio.webp')}
html[data-clubhouse='gym']{--gr-scenery:url('/scenery/clubhouse/gym.webp')}
html[data-clubhouse='staff']{--gr-scenery:url('/scenery/clubhouse/staff.webp')}
html[data-clubhouse='theater']{--gr-scenery:url('/scenery/clubhouse/theater.webp')}

.section-page main::before{height:1100px;background-image:linear-gradient(90deg,rgba(10,14,8,.66),rgba(10,14,8,.88) 28%,rgba(10,14,8,.88) 72%,rgba(10,14,8,.66)),linear-gradient(0deg,var(--bg),transparent 58%),var(--gr-scenery);background-position:center top}
.clubhouse-preview{position:relative;margin:24px auto 20px;max-width:850px;border:1px solid #52633b;border-radius:14px;overflow:hidden;background:#111b12;box-shadow:0 18px 45px #0004}
.clubhouse-preview picture{display:block}.clubhouse-preview img{display:block;width:100%;height:clamp(200px,29vw,330px);object-fit:cover;object-position:center}
.clubhouse-preview figcaption{position:absolute;inset:auto 0 0;padding:36px 20px 16px;background:linear-gradient(transparent,#071009f5);color:#f2f6e9;font-size:.88rem;font-weight:700;letter-spacing:.03em}
[data-theme="light"] .section-page main::before{background-image:linear-gradient(90deg,rgba(245,247,237,.76),rgba(245,247,237,.94) 28%,rgba(245,247,237,.94) 72%,rgba(245,247,237,.76)),linear-gradient(0deg,var(--bg),transparent 58%),var(--gr-scenery)}
@media(max-width:700px){
:root{--gr-scenery:url('/scenery/clubhouse/lounge-mobile.webp')}
html[data-clubhouse='lounge']{--gr-scenery:url('/scenery/clubhouse/lounge-mobile.webp')}
html[data-clubhouse='community']{--gr-scenery:url('/scenery/clubhouse/community-mobile.webp')}
html[data-clubhouse='gaming']{--gr-scenery:url('/scenery/clubhouse/gaming-mobile.webp')}
html[data-clubhouse='kitchen']{--gr-scenery:url('/scenery/clubhouse/kitchen-mobile.webp')}
html[data-clubhouse='studio']{--gr-scenery:url('/scenery/clubhouse/studio-mobile.webp')}
html[data-clubhouse='gym']{--gr-scenery:url('/scenery/clubhouse/gym-mobile.webp')}
html[data-clubhouse='staff']{--gr-scenery:url('/scenery/clubhouse/staff-mobile.webp')}
html[data-clubhouse='theater']{--gr-scenery:url('/scenery/clubhouse/theater-mobile.webp')}
.section-page main::before{height:760px;background-position:60% top}.clubhouse-preview{margin-top:20px}.clubhouse-preview img{height:220px}.clubhouse-preview figcaption{font-size:.8rem;padding:32px 14px 12px}
}

/* Dedicated backgrounds for each existing channel category. */
html[data-clubhouse='treehouse']{--gr-scenery:url('/scenery/clubhouse/treehouse.webp')}
html[data-clubhouse='pub']{--gr-scenery:url('/scenery/clubhouse/pub.webp')}
html[data-clubhouse='gambling']{--gr-scenery:url('/scenery/clubhouse/gambling.webp')}
html[data-clubhouse='pets']{--gr-scenery:url('/scenery/clubhouse/pets.webp')}
html[data-clubhouse='photography']{--gr-scenery:url('/scenery/clubhouse/photography.webp')}
html[data-clubhouse='parking']{--gr-scenery:url('/scenery/clubhouse/parking.webp')}
html[data-clubhouse='sports']{--gr-scenery:url('/scenery/clubhouse/sports.webp')}
html[data-clubhouse='dressing']{--gr-scenery:url('/scenery/clubhouse/dressing.webp')}
html[data-clubhouse='outside']{--gr-scenery:url('/scenery/clubhouse/outside.webp')}
@media(max-width:700px){
html[data-clubhouse='treehouse']{--gr-scenery:url('/scenery/clubhouse/treehouse-mobile.webp')}
html[data-clubhouse='pub']{--gr-scenery:url('/scenery/clubhouse/pub-mobile.webp')}
html[data-clubhouse='gambling']{--gr-scenery:url('/scenery/clubhouse/gambling-mobile.webp')}
html[data-clubhouse='pets']{--gr-scenery:url('/scenery/clubhouse/pets-mobile.webp')}
html[data-clubhouse='photography']{--gr-scenery:url('/scenery/clubhouse/photography-mobile.webp')}
html[data-clubhouse='parking']{--gr-scenery:url('/scenery/clubhouse/parking-mobile.webp')}
html[data-clubhouse='sports']{--gr-scenery:url('/scenery/clubhouse/sports-mobile.webp')}
html[data-clubhouse='dressing']{--gr-scenery:url('/scenery/clubhouse/dressing-mobile.webp')}
html[data-clubhouse='outside']{--gr-scenery:url('/scenery/clubhouse/outside-mobile.webp')}
}

/* Desktop width trial — restore version 76 to undo. Mobile/tablet rules unchanged. */
@media (min-width:1280px){
  .container{width:min(1680px,calc(100% - 64px))}
  .room-explorer .channel-showcase,.clubhouse-preview{max-width:1200px}
  .page-grid{gap:20px}
}

/* Mobile header: every control occupies its own grid area above the menu. */
@media(max-width:700px){
  header .nav.container{display:grid;grid-template-columns:minmax(0,1fr) 44px;grid-template-areas:"brand theme" "count count" "join join";height:auto;min-height:0;gap:10px;padding-block:12px}
  header .nav .brand{grid-area:brand;min-width:0;white-space:normal}
  header .nav .theme-toggle{grid-area:theme;order:initial;margin:0;width:44px;height:44px;min-height:44px;padding:10px;justify-self:end}
  header .nav .gr-member-count{grid-area:count;order:initial;margin:0;width:100%;min-width:0;min-height:40px;white-space:normal;flex-wrap:wrap}
  header .nav>.button{grid-area:join;order:initial;margin:0;width:100%;min-height:44px;white-space:normal}
  header .mobile-pages{position:relative;margin-top:0;padding-bottom:12px}
  header .mobile-pages summary{min-height:44px}
  header .mobile-pages nav a{min-height:44px;display:flex;align-items:center}
}
