.community-games-page { padding-block:3rem 5rem; }
.community-games-heading { margin-bottom:2rem; }
.community-games-heading h1 { margin:0 0 .8rem; font-size:clamp(1.8rem,4vw,2.7rem); }
.community-games-heading > p:last-of-type { max-width:48rem; margin-bottom:.7rem; color:var(--muted); }
.community-games-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(17rem,1fr); gap:1.5rem; align-items:start; }
.community-games-main { display:grid; min-width:0; gap:1.5rem; }
.community-games-panel { min-width:0; padding:1.5rem; border:1px solid var(--warm-border); border-radius:var(--radius); background:var(--surface); }
.community-games-panel h2 { margin:0 0 .6rem; font-size:1.2rem; }
.community-games-panel p { color:var(--muted); font-size:.85rem; }
.community-games-panel > p:last-child { margin-bottom:0; }
.community-games-panel header > p { margin:0; }
.community-games-empty { margin:1rem 0 0; }
.community-my-votes header { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.community-my-votes h2 { margin:0; }
.community-vote-counter { padding:.3rem .7rem; border:1px solid var(--warm-border); border-radius:999px; background:var(--surface-raised); color:var(--coral); white-space:nowrap; }
.community-my-votes > p { margin:1rem 0 0; }
.community-vote-tags { display:flex; flex-wrap:wrap; gap:.5rem; padding:0; margin:1rem 0 0; list-style:none; }
.community-vote-tags a { display:block; padding:.4rem .7rem; border:1px solid var(--warm-border); border-radius:10px; color:var(--cream); font-size:.8rem; overflow-wrap:anywhere; }
.community-vote-tags a:hover { border-color:var(--coral); }
.community-games-signin { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; }
.community-games-signin p { flex:1 1 16rem; margin:0; }
.community-game-list, .community-admin-game-list { list-style:none; padding:0; margin:1.2rem 0 0; }
.community-game-list > li { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 0; border-top:1px solid var(--line); scroll-margin-top:calc(var(--header-height) + 1rem); }
.community-game-list > li:last-child { padding-bottom:0; }
.community-game-title { min-width:0; }
.community-game-title h3 { margin:0 0 .25rem; font-size:1rem; overflow-wrap:anywhere; }
.community-game-title > span { color:var(--muted); font-size:.75rem; }
.community-my-vote-label, .community-game-list .has-voted h3 { color:var(--coral); }
.community-game-list form { flex-shrink:0; }
.community-games-page button:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.community-game-title-form label { display:block; margin:.8rem 0 .4rem; font-size:.8rem; font-weight:700; overflow-wrap:anywhere; }
.community-game-title-form label span { color:var(--muted); font-size:.75rem; font-weight:400; }
.community-game-title-form > div { display:flex; align-items:stretch; gap:.7rem; }
.community-game-title-form input { width:100%; min-width:0; padding:.65rem .8rem; border:1px solid var(--control-line); border-radius:9px; background:var(--surface-raised); color:var(--ink); }
.community-game-title-form button { flex-shrink:0; }
.community-game-title-form small { display:block; margin-top:.6rem; color:var(--muted); font-size:.75rem; }
.community-game-ranking header { padding-bottom:.8rem; }
.community-game-ranking header .eyebrow { margin-bottom:.5rem; color:var(--coral); font-size:.7rem; }
.community-game-ranking header p strong { color:var(--ink); }
.community-ranking-list { padding:0; margin:0; list-style:none; counter-reset:community-rank; }
.community-ranking-list > li { display:grid; grid-template-columns:1.5rem minmax(0,1fr) auto; align-items:center; gap:.65rem; padding:.85rem 0; border-top:1px solid var(--line); }
.community-rank-position { color:var(--coral); font-size:.85rem; font-weight:800; }
.community-ranking-list a, .community-ranking-list .community-ranking-title { color:var(--ink); font-size:.85rem; font-weight:650; overflow-wrap:anywhere; }
.community-ranking-list a:hover { color:var(--coral); }
.community-rank-votes { color:var(--cream); text-align:right; font-size:.85rem; font-weight:700; white-space:nowrap; }
.community-rank-votes span { display:block; color:var(--muted); font-size:.65rem; font-weight:400; }
.community-admin-game-list > li { padding:.5rem 0 1rem; border-top:1px solid var(--line); }
.community-admin-game-list > li:last-child { padding-bottom:0; }
.community-game-reset .button { width:100%; }
.home-community-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(17rem,1fr); grid-template-areas:"signals-heading ranking-heading" "signals ranking"; gap:1.5rem; align-items:start; }
.home-community-grid > .section-heading { margin:0; }
.home-community-signals-heading { grid-area:signals-heading; }
.home-community-ranking-heading { grid-area:ranking-heading; }
.home-community-signals { grid-area:signals; min-width:0; }
.home-community-signals .discussion-list a { grid-template-columns:auto minmax(0,1fr) auto; gap:.8rem; }
.home-community-signals .discussion-list a > span:not(.discussion-signal) { grid-column:2; font-size:.68rem; }
.home-community-signals .discussion-list time { grid-column:3; grid-row:1 / span 2; font-size:.68rem; }
.home-community-signals .empty-community { grid-template-columns:auto minmax(0,1fr); }
.home-community-signals .empty-community > a { grid-column:2; justify-self:start; }
.home-community-ranking { grid-area:ranking; }
.home-community-ranking > .button { width:100%; margin-top:1rem; }
@media (max-width:900px) {
  .community-games-layout, .home-community-grid { grid-template-columns:1fr; }
  .home-community-grid { grid-template-areas:"signals-heading" "signals" "ranking-heading" "ranking"; }
  .community-game-ranking, .community-game-reset { position:static; }
}
@media (max-width:600px) {
  .community-games-page { padding-top:2rem; }
  .community-games-panel { padding:1.1rem; }
  .community-game-list > li { align-items:flex-start; flex-direction:column; gap:.75rem; }
  .community-game-title-form > div { flex-direction:column; }
  .community-game-title-form button { align-self:flex-start; }
  .home-community-signals .discussion-list a { grid-template-columns:auto minmax(0,1fr); }
  .home-community-signals .empty-community { grid-template-columns:1fr; }
  .home-community-signals .empty-community > a { grid-column:1; justify-self:stretch; }
}
