/* Forum polish v2.19.8: compact game UI, cohesive raster emblems and collision-free mobile cards. */
:root{
  --forum-navy:#10384a;
  --forum-ink:#173746;
  --forum-mint:#29a96e;
  --forum-mint-soft:#eaf8f1;
  --forum-coral:#ec5d61;
  --forum-coral-soft:#fff0f0;
  --forum-gold:#dc9b1c;
  --forum-blue:#2f91db;
  --forum-surface:#fff;
  --forum-line:#d9e8e4;
}

.community-sections{background:linear-gradient(180deg,#f8fcfa 0,#f3faf7 58%,#f8fcfa 100%)}
.community-section-head{margin-bottom:28px}

.community-emblem{
  display:block;
  flex:0 0 auto;
  background-image:url('/community-assets-v2198/community-icons-v2198.webp');
  background-repeat:no-repeat;
  background-size:300% 200%;
}
.community-emblem.is-bug{background-position:0 0}
.community-emblem.is-idea{background-position:50% 0}
.community-emblem.is-talk{background-position:100% 0}
.community-emblem.is-investigate{background-position:0 100%}
.community-emblem.is-resolved{background-position:50% 100%}
.community-emblem.is-moderation{background-position:100% 100%}

.community-kind-grid{gap:14px}
.community-kind{
  display:grid;
  grid-template-columns:104px minmax(0,1fr) 32px;
  align-items:center;
  column-gap:16px;
  min-height:138px;
  padding:16px 16px 16px 14px;
  border-radius:22px;
  overflow:visible;
  isolation:isolate;
  box-shadow:0 7px 24px rgba(25,72,75,.05);
}
.community-kind:before{
  position:absolute;
  z-index:-1;
  inset:9px auto 9px 9px;
  width:112px;
  content:"";
  border-radius:17px;
  background:#f4f8f7;
  transition:background-color .2s ease;
}
.community-kind.is-bug:before{background:#fff2f1}
.community-kind.is-idea:before{background:#fff8e9}
.community-kind.is-talk:before{background:#edf8ff}
.community-kind:hover,.community-kind.is-active{transform:translateY(-2px);box-shadow:0 15px 34px rgba(24,69,75,.1)}
.community-kind.is-active:after{
  position:absolute;
  left:24px;
  right:24px;
  bottom:-2px;
  height:4px;
  content:"";
  border-radius:4px;
  background:var(--forum-blue);
}
.community-kind.is-bug.is-active:after{background:var(--forum-coral)}
.community-kind.is-idea.is-active:after{background:var(--forum-gold)}
.community-kind>.community-emblem{width:104px;height:104px}
.community-kind__copy{display:flex;min-width:0;align-self:stretch;flex-direction:column;justify-content:center}
.community-kind .community-kind__copy b{align-self:auto;font-size:21px;line-height:1.1}
.community-kind .community-kind__copy small{margin:7px 0 12px;font-size:12px;line-height:1.38}
.community-kind .community-kind__copy em{font-size:10px}
.community-kind__arrow{
  display:grid;
  width:30px;
  height:30px;
  place-items:center;
  border:1px solid #dbe8e5;
  border-radius:50%;
  color:#6d858c;
  font-size:15px;
  transition:.2s ease;
}
.community-kind:hover .community-kind__arrow,.community-kind.is-active .community-kind__arrow{border-color:currentColor;color:var(--forum-navy);transform:translateX(2px)}

.community-toolbar{
  position:static;
  grid-template-columns:minmax(250px,1fr) auto auto;
  gap:10px;
  margin:28px 0 18px;
}
.community-search,.community-statuses,.community-sort{border-color:var(--forum-line);box-shadow:0 5px 18px rgba(26,71,76,.04)}
.community-search{height:50px;padding:0 15px 0 8px}
.community-search .community-search__icon{width:38px;height:38px;color:transparent;font-size:0}
.community-search input{font-size:13px}
.community-statuses{gap:2px;padding:4px}
.community-statuses button{display:flex;height:40px;align-items:center;gap:7px;padding:0 13px;border-radius:10px;font-size:12px}
.community-statuses button i{width:7px;height:7px;border-radius:50%;background:#9badaf}
.community-statuses button:nth-child(2) i{background:#f1a24a}
.community-statuses button:nth-child(3) i{background:#34b77a}
.community-statuses button.is-active i{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.18)}
.community-sort{height:50px;padding:0 11px 0 14px}
.community-sort>span{font-size:11px}
.community-sort select{min-width:91px}

.community-layout{grid-template-columns:minmax(0,1fr) 294px;gap:18px}
.community-feed{gap:10px}
.topic-card{
  grid-template-columns:70px minmax(0,1fr) 178px;
  gap:17px;
  min-height:142px;
  padding:18px 18px 18px 16px;
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 7px 23px rgba(27,70,75,.045);
}
.topic-card:before{width:4px}
.topic-card.has-stamp{padding-top:18px}
.topic-emblem{
  width:70px;
  height:70px;
  align-self:start;
  border-radius:17px;
  background-color:#f4f8f7;
}
.topic-card.is-bug .topic-emblem{background-color:var(--forum-coral-soft)}
.topic-card.is-idea .topic-emblem{background-color:#fff8e8}
.topic-card.is-discussion .topic-emblem,.topic-card.is-balance .topic-emblem{background-color:#edf8ff}
.topic-copy{align-self:center}
.topic-copy h3{margin:8px 0 6px;font-size:19px;line-height:1.25}
.topic-copy>p{font-size:13px;line-height:1.48}
.topic-tags span{padding:4px 7px;border-radius:6px}
.topic-meta{flex-wrap:wrap;gap:6px 13px;margin-top:9px;font-size:10px}
.topic-meta span:nth-child(2){font-weight:850;color:#6e858b}
.topic-side{
  min-width:0;
  align-self:stretch;
  justify-content:space-between;
  gap:8px;
  padding-left:14px;
  border-left:1px solid #e5eeeb;
}
.topic-status{
  display:inline-flex;
  align-items:center;
  gap:7px;
  align-self:flex-end;
  padding:7px 10px;
  border-radius:999px;
  font-size:9px;
}
.topic-status i{width:7px;height:7px;border-radius:50%;background:#88a09e}
.topic-status.is-open i{background:#61a5d8}
.topic-status.is-investigating i{background:#ef9646}
.topic-status.is-needs_info i{background:#e2a73e}
.topic-status.is-planned i{background:#7f7fe1}
.topic-resolution{
  display:flex;
  width:100%;
  box-sizing:border-box;
  align-items:center;
  gap:7px;
  padding:5px 9px 5px 5px;
  border:1px solid #bfe9d4;
  border-radius:13px;
  background:linear-gradient(135deg,#f1fbf6,#e8f8f0);
  color:#187e51;
}
.topic-resolution>.community-emblem{width:38px;height:38px}
.topic-resolution>span:last-child{display:grid;min-width:0;gap:1px;text-align:left}
.topic-resolution b{font-size:10px;letter-spacing:.07em;text-transform:uppercase}
.topic-resolution small{overflow:hidden;color:#5d8070;font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.topic-votes{
  display:grid;
  grid-template-columns:34px 27px 34px;
  align-items:center;
  justify-content:end;
  gap:4px;
  padding:0;
}
.topic-votes button{width:34px;height:32px;border-radius:10px;background:#f7faf9;font-size:16px;font-weight:900}
.topic-votes b{text-align:center;font-size:17px}
.topic-votes small{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-size:8px;
  white-space:nowrap;
}
.topic-votes small i{width:3px;height:3px;border-radius:50%;background:#b0bfbd}
.topic-side .topic-comments{
  display:flex;
  width:100%;
  min-height:32px;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:5px 8px;
  border:1px solid #e2ece9;
  border-radius:10px;
  background:#f9fbfa;
  color:#536d74;
  font-size:10px;
}
.topic-side .topic-comments span{color:var(--topic-color);font-size:8px}
.topic-stamp{display:none!important}

.community-aside{top:86px;gap:12px}
.community-aside-card{padding:18px;border-radius:20px;box-shadow:0 7px 22px rgba(26,70,74,.04)}
.community-aside-card>.community-art{display:none}
.community-aside-card__head{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.community-aside-card__head>.community-emblem{width:62px;height:62px;border-radius:15px;background-color:#f1f8f5}
.community-aside-card__head>span:last-child{display:grid;min-width:0;gap:3px}
.community-aside-card__head small{color:var(--forum-mint);font-size:9px;font-weight:950;letter-spacing:.11em}
.community-aside-card__head h3{margin:0;font-size:19px;line-height:1.12}
.community-aside-card ol{gap:10px;margin-top:0}
.community-aside-card li{min-height:32px;gap:9px;padding-bottom:9px;border-bottom:1px solid #e8f0ed}
.community-aside-card li:last-child{padding-bottom:0;border-bottom:0}
.community-aside-card li>i{width:25px;height:25px;font-size:11px}
.community-aside-card li.is-resolved>.community-emblem{width:29px;height:29px}
.community-aside-card li span{font-size:11px}
.community-aside-card li b{font-size:12px}
.community-aside-card p{margin:4px 0 14px;font-size:12px;line-height:1.55}
.community-aside-card>a{font-size:12px}

@media(max-width:1120px){
  .community-kind{grid-template-columns:86px minmax(0,1fr) 28px;column-gap:11px;padding-left:11px}
  .community-kind:before{width:92px}
  .community-kind>.community-emblem{width:86px;height:86px}
  .community-kind .community-kind__copy b{font-size:18px}
  .community-kind .community-kind__copy small{font-size:11px}
}

@media(max-width:1000px){
  .community-kind{padding-left:11px}
  .community-layout{grid-template-columns:1fr}
  .community-aside{grid-template-columns:1fr 1fr;position:static}
  .community-toolbar{grid-template-columns:1fr auto}
  .community-sort{grid-column:1/-1;justify-self:end}
}

@media(max-width:700px){
  .community-section-head{margin-bottom:22px}
  .community-section-head h2{font-size:34px}
  .community-kind-grid{display:grid;grid-template-columns:1fr;gap:9px;max-width:none;overflow:visible;scroll-snap-type:none}
  .community-kind{
    grid-template-columns:74px minmax(0,1fr) 30px;
    min-width:0;
    min-height:96px;
    padding:10px 12px 10px 10px;
    column-gap:11px;
    scroll-snap-align:none;
    border-radius:18px;
  }
  .community-kind:before{inset:7px auto 7px 7px;width:78px;border-radius:14px}
  .community-kind>.community-emblem{width:74px;height:74px}
  .community-kind .community-kind__copy b{font-size:18px}
  .community-kind .community-kind__copy small{margin:4px 0 7px;font-size:11px;line-height:1.3}
  .community-kind__arrow{width:28px;height:28px}
  .community-toolbar{grid-template-columns:1fr;margin:22px 0 14px}
  .community-search{height:48px}
  .community-statuses{display:grid;grid-template-columns:repeat(3,1fr);overflow:visible}
  .community-statuses button{justify-content:center;padding:0 5px;font-size:11px}
  .community-sort{grid-column:auto;justify-self:stretch;justify-content:space-between;height:48px}
  .community-sort select{flex:1;text-align:right}
  .community-layout{gap:16px}
  .topic-card{
    grid-template-columns:48px minmax(0,1fr);
    gap:10px 11px;
    min-height:0;
    padding:15px 14px 13px;
    border-radius:18px;
  }
  .topic-card.has-stamp{padding-top:15px}
  .topic-emblem{grid-column:1;grid-row:1;width:48px;height:48px;border-radius:13px}
  .topic-copy{grid-column:2;grid-row:1}
  .topic-tags{flex-wrap:wrap;gap:5px}
  .topic-copy h3{margin:7px 0 5px;font-size:16px;line-height:1.22}
  .topic-copy>p{font-size:12px;-webkit-line-clamp:2}
  .topic-meta{gap:5px 9px;margin-top:8px;font-size:9px}
  .topic-side{
    grid-column:1/-1;
    display:flex;
    min-width:0;
    flex-flow:row wrap;
    align-items:center;
    justify-content:space-between;
    gap:9px;
    padding:11px 0 0;
    border-top:1px solid #e7efed;
    border-left:0;
  }
  .topic-status,.topic-resolution{order:1;flex:0 0 100%;align-self:auto;width:auto}
  .topic-status{box-sizing:border-box;justify-content:center}
  .topic-resolution{justify-content:flex-start}
  .topic-resolution small{white-space:normal}
  .topic-votes{order:2;grid-template-columns:38px 28px 38px;justify-content:start}
  .topic-votes button{width:38px;height:38px}
  .topic-votes small{display:none}
  .topic-side .topic-comments{order:3;width:auto;min-height:38px;padding:6px 10px}
  .community-aside{grid-template-columns:1fr}
  .community-aside-card{padding:16px}
  .community-aside-card__head>.community-emblem{width:54px;height:54px}
}

@media(max-width:360px){
  .community-kind .community-kind__copy small{display:none}
  .community-kind{min-height:82px}
  .community-statuses button{gap:5px;font-size:10px}
  .topic-side .topic-comments{font-size:9px}
}

@media(prefers-reduced-motion:reduce){
  .community-kind,.community-kind__arrow,.topic-card{transition:none}
}
