/* El Contraataque · Community surfaces v42 */

body.community-hub-mode {
  --v42-gold: #b96d00;
  --v42-gold-2: #df9d16;
  --v42-gold-soft: #fff7e7;
  --v42-ink: #17130f;
  --v42-muted: #777169;
  --v42-line: rgba(63, 48, 28, .09);
  --v42-page: #faf8f3;
}

/* ---------- CANALES ---------- */
body.community-hub-mode.community-v36-inner .community-v42-channels,
body.community-hub-mode .community-v42-channels {
  display: grid;
  gap: .88rem;
  width: 100%;
  min-width: 0;
  padding-bottom: 4.8rem;
}

body.community-hub-mode .community-v42-channels-hero {
  position: relative;
  display: grid;
  grid-template-columns: 4.35rem minmax(0, 1fr);
  align-items: center;
  gap: .92rem;
  min-height: 7.6rem;
  overflow: hidden;
  margin: 0;
  border: 1px solid rgba(74, 58, 34, .045);
  border-radius: 1.15rem;
  padding: 1.05rem 1rem;
  background:
    linear-gradient(100deg, rgba(255,255,255,.99), rgba(255,253,248,.97)),
    #fff;
  box-shadow: 0 .42rem 1.2rem rgba(49, 35, 15, .04);
}

body.community-hub-mode .community-v42-channels-hero__icon {
  display: grid;
  width: 4.35rem;
  height: 4.35rem;
  place-items: center;
  z-index: 2;
  border: 1.5px solid rgba(185,109,0,.9);
  border-radius: 50%;
  color: #af6800;
  background: rgba(255,255,255,.94);
}

body.community-hub-mode .community-v42-channels-hero__icon svg {
  width: 2rem;
  height: 2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.community-hub-mode .community-v42-channels-hero__copy {
  position: relative;
  z-index: 2;
  display: grid;
  min-width: 0;
  gap: .42rem;
}

body.community-hub-mode .community-v42-channels-hero__copy strong {
  color: #17130f;
  font-size: clamp(1.35rem, 6vw, 1.78rem);
  font-weight: 1000;
  line-height: 1;
  letter-spacing: -.035em;
}

body.community-hub-mode .community-v42-channels-hero__copy small {
  display: block;
  max-width: 18rem;
  color: #77716a;
  font-size: clamp(.72rem, 2.8vw, .84rem);
  line-height: 1.35;
}

body.community-hub-mode .community-v42-channels-hero__watermark {
  position: absolute;
  right: -1.2rem;
  bottom: -2.1rem;
  width: 9rem;
  height: 9rem;
  opacity: .055;
  filter: grayscale(1) sepia(.15);
  object-fit: contain;
  pointer-events: none;
}

body.community-hub-mode .community-v42-channel-group {
  display: grid;
  gap: .52rem;
}

body.community-hub-mode .community-v42-channel-group > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  padding: 0 .3rem;
}

body.community-hub-mode .community-v42-channel-group > header strong {
  color: #a66000;
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .055em;
}

body.community-hub-mode .community-v42-channel-group > header small {
  overflow: hidden;
  color: #8a837a;
  font-size: .58rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.community-hub-mode .community-v42-channel-list {
  display: grid;
  gap: .52rem;
}

body.community-hub-mode .community-v42-channel-card {
  display: grid;
  grid-template-columns: clamp(6.9rem, 31vw, 8.8rem) minmax(0,1fr) 1.3rem;
  align-items: center;
  gap: .75rem;
  width: 100%;
  min-width: 0;
  min-height: 7.15rem;
  border: 1px solid rgba(190,116,8,.22);
  border-radius: 1.08rem;
  padding: .45rem .68rem .45rem .45rem;
  color: var(--v42-ink);
  background: rgba(255,255,255,.98);
  box-shadow: 0 .34rem .95rem rgba(50,35,13,.035);
  text-align: left;
  -webkit-tap-highlight-color: transparent;
}

body.community-hub-mode .community-v42-channel-card:active {
  transform: translateY(1px);
  background: #fffdf8;
}

body.community-hub-mode .community-v42-channel-card__image {
  display: grid;
  width: 100%;
  height: 6.2rem;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(190,116,8,.17);
  border-radius: .9rem;
  color: #a46607;
  background:
    radial-gradient(circle at 35% 28%, rgba(218,158,52,.18), transparent 42%),
    linear-gradient(145deg,#faf5ea,#f1ede6);
  font-size: 1.3rem;
  font-weight: 900;
}

body.community-hub-mode .community-v42-channel-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

body.community-hub-mode .community-v42-image-fallback {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  color: #9f6508;
  font-size: 1.1rem;
  background:
    radial-gradient(circle at 50% 42%, rgba(198,125,12,.12), transparent 48%),
    linear-gradient(145deg,#fbf7ef,#f2ede3);
}

body.community-hub-mode .community-v42-channel-card__copy {
  display: grid;
  min-width: 0;
  gap: .27rem;
}

body.community-hub-mode .community-v42-channel-card__copy > strong {
  overflow: hidden;
  color: #17130f;
  font-size: clamp(.83rem, 3.35vw, .98rem);
  font-weight: 950;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.community-hub-mode .community-v42-channel-card__description {
  display: -webkit-box;
  overflow: hidden;
  color: #6f6961;
  font-size: clamp(.63rem, 2.55vw, .72rem);
  line-height: 1.28;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.community-hub-mode .community-v42-channel-card__meta {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: .32rem .48rem;
  margin-top: .16rem;
  color: #716a62;
  font-size: clamp(.56rem, 2.2vw, .64rem);
}

body.community-hub-mode .community-v42-channel-card__meta i {
  width: .43rem;
  height: .43rem;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #b8b6b2;
}
body.community-hub-mode .community-v42-channel-card__meta i.is-high,
body.community-hub-mode .community-v42-channel-card__meta i.is-medium { background: #22b95d; }
body.community-hub-mode .community-v42-channel-card__meta i.is-low { background: #b6b6b4; }

body.community-hub-mode .community-v42-channel-card__arrow {
  color: #ae6500;
  font-size: 1.65rem;
  font-weight: 500;
  line-height: 1;
}

body.community-hub-mode .community-v42-channel-card.is-locked {
  background: linear-gradient(120deg,#fffdfa,#fff9ee);
}
body.community-hub-mode .community-v42-channel-card.is-locked .community-v42-channel-card__image { filter: saturate(.85); }

body.community-hub-mode .community-v42-empty {
  border: 1px dashed rgba(63,48,28,.12);
  border-radius: .95rem;
  padding: 1rem;
  color: #7b746b;
  background: #fff;
  text-align: center;
  font-size: .7rem;
}

/* ---------- TEMAS ---------- */
body.community-hub-mode.community-v41-topics .community-hub-mine {
  display: block !important;
  overflow: visible !important;
}

body.community-hub-mode .community-v42-topics {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  padding-bottom: 5rem;
}

body.community-hub-mode .community-v42-topics-sticky {
  position: sticky;
  top: calc(4.18rem + env(safe-area-inset-top));
  z-index: 68;
  display: grid;
  gap: .56rem;
  margin: 0 0 .65rem;
  padding: .1rem 0 .1rem;
  background: linear-gradient(to bottom, rgba(250,248,243,.99) 0 88%, rgba(250,248,243,0));
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

body.community-hub-mode .community-v42-topics-head {
  display: grid;
  grid-template-columns: 2.8rem minmax(0,1fr) auto;
  align-items: center;
  gap: .67rem;
  min-height: 5.1rem;
  border: 1px solid rgba(61,48,31,.07);
  border-radius: 1.1rem;
  padding: .7rem .76rem;
  background: rgba(255,255,255,.985);
  box-shadow: 0 .32rem .9rem rgba(43,31,14,.04);
}

body.community-hub-mode .community-v42-topics-head__icon {
  display: grid;
  width: 2.8rem;
  height: 2.8rem;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(145deg,#e3a51d,#bc6f00);
  box-shadow: 0 .24rem .6rem rgba(165,96,0,.13);
}
body.community-hub-mode .community-v42-topics-head__icon svg { width:1.35rem;height:1.35rem;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round; }

body.community-hub-mode .community-v42-topics-head__copy {
  display: grid;
  min-width: 0;
  gap: .23rem;
}
body.community-hub-mode .community-v42-topics-head__copy strong { color:#111;font-size:1.1rem;font-weight:1000;line-height:1;letter-spacing:-.025em; }
body.community-hub-mode .community-v42-topics-head__copy small { overflow:hidden;color:#746e66;font-size:.66rem;text-overflow:ellipsis;white-space:nowrap; }

body.community-hub-mode .community-v42-topics-head > button {
  min-height: 2.7rem;
  border: 0;
  border-radius: .85rem;
  padding: 0 clamp(.62rem,2.4vw,.95rem);
  color: #fff;
  background: linear-gradient(135deg,#e0a11c,#b86b00);
  box-shadow: 0 .26rem .66rem rgba(165,96,0,.15);
  font-size: clamp(.57rem,2.25vw,.68rem);
  font-weight: 950;
  white-space: nowrap;
}

body.community-hub-mode .community-v42-topic-search {
  display: grid;
  grid-template-columns: 1.35rem minmax(0,1fr) 2rem;
  align-items: center;
  gap: .36rem;
  min-height: 3.25rem;
  border: 1px solid rgba(46,38,28,.1);
  border-radius: 999px;
  padding: 0 .55rem 0 .92rem;
  background: rgba(255,255,255,.985);
  box-shadow: 0 .22rem .7rem rgba(45,34,18,.035);
}

body.community-hub-mode .community-v42-topic-search > svg:first-child { width:1.2rem;height:1.2rem;fill:none;stroke:#787169;stroke-width:1.8;stroke-linecap:round; }
body.community-hub-mode .community-v42-topic-search input { width:100%;min-width:0;border:0;outline:0;padding:0;color:#211d18;background:transparent;font-size:16px;line-height:1.2; }
body.community-hub-mode .community-v42-topic-search input::placeholder { color:#888179; }
body.community-hub-mode .community-v42-topic-search button { display:grid;width:2rem;height:2rem;place-items:center;border:0;border-radius:50%;padding:0;color:#79736b;background:#f4f1ea; }
body.community-hub-mode .community-v42-topic-search button[hidden] { display:none!important; }
body.community-hub-mode .community-v42-topic-search button svg { width:.95rem;height:.95rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round; }

body.community-hub-mode .community-v42-topic-list {
  overflow: hidden;
  border: 1px solid rgba(49,40,29,.075);
  border-radius: 1.05rem;
  background: #fff;
  box-shadow: 0 .28rem .9rem rgba(42,31,15,.03);
}

body.community-hub-mode .community-v42-topic-row {
  display: grid;
  grid-template-columns: clamp(3.35rem,14vw,4.25rem) minmax(0,1.08fr) minmax(6rem,.88fr) .72rem;
  align-items: center;
  gap: clamp(.36rem,1.7vw,.66rem);
  width: 100%;
  min-width: 0;
  min-height: 5.9rem;
  border: 0;
  border-bottom: 1px solid rgba(43,35,25,.065);
  padding: .62rem clamp(.44rem,2vw,.72rem);
  color: #17130f;
  background: #fff;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
}
body.community-hub-mode .community-v42-topic-row:last-child { border-bottom:0; }
body.community-hub-mode .community-v42-topic-row:active { background:#fffdf8; }

body.community-hub-mode .community-v42-topic-row__image {
  display: grid;
  width: clamp(3.35rem,14vw,4.25rem);
  height: clamp(3.35rem,14vw,4.25rem);
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(184,111,5,.19);
  border-radius: .88rem;
  color:#9e650a;
  background:#f7f3ea;
}
body.community-hub-mode .community-v42-topic-row__image img { display:block;width:100%;height:100%;object-fit:cover;object-position:center; }

body.community-hub-mode .community-v42-topic-row__main,
body.community-hub-mode .community-v42-topic-row__latest { display:grid;min-width:0;gap:.16rem; }
body.community-hub-mode .community-v42-topic-row__main > small { overflow:hidden;color:#a76205;font-size:clamp(.51rem,1.95vw,.59rem);font-weight:950;letter-spacing:.065em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap; }
body.community-hub-mode .community-v42-topic-row__main > strong { display:-webkit-box;overflow:hidden;color:#17130f;font-size:clamp(.72rem,2.9vw,.87rem);font-weight:950;line-height:1.12;-webkit-box-orient:vertical;-webkit-line-clamp:2; }
body.community-hub-mode .community-v42-topic-row__meta { display:inline-flex;min-width:0;align-items:center;gap:.25rem;color:#756f67;font-size:clamp(.5rem,1.9vw,.59rem);white-space:nowrap; }
body.community-hub-mode .community-v42-topic-row__meta svg { width:.87rem;height:.87rem;fill:none;stroke:currentColor;stroke-width:1.7; }

body.community-hub-mode .community-v42-topic-row__latest > small { color:#787169;font-size:clamp(.49rem,1.85vw,.57rem); }
body.community-hub-mode .community-v42-topic-row__latest > strong { display:-webkit-box;overflow:hidden;color:#37322c;font-size:clamp(.55rem,2.1vw,.65rem);font-weight:550;line-height:1.2;-webkit-box-orient:vertical;-webkit-line-clamp:3; }
body.community-hub-mode .community-v42-topic-row__latest > time { color:#827b73;font-size:clamp(.48rem,1.8vw,.57rem); }
body.community-hub-mode .community-v42-topic-row__arrow { color:#17130f;font-size:1.3rem;line-height:1; }

body.community-hub-mode .community-v42-topic-empty {
  display: grid;
  justify-items: center;
  gap: .3rem;
  margin-top: .55rem;
  border: 1px dashed rgba(58,46,30,.12);
  border-radius: 1rem;
  padding: 1.2rem .8rem;
  color:#756f67;
  background:#fff;
  text-align:center;
}
body.community-hub-mode .community-v42-topic-empty[hidden] { display:none!important; }
body.community-hub-mode .community-v42-topic-empty strong { color:#24201b;font-size:.76rem; }
body.community-hub-mode .community-v42-topic-empty small { font-size:.65rem; }
body.community-hub-mode .community-v42-topic-empty button { margin-top:.25rem;border:1px solid rgba(183,107,0,.25);border-radius:999px;padding:.45rem .72rem;color:#9b5d05;background:#fff9ec;font-size:.62rem;font-weight:850; }

body.community-hub-mode .community-v42-topic-sentinel { height:1.25rem; }
body.community-hub-mode .community-v42-topic-sentinel[hidden] { display:none!important; }

body.community-hub-mode .community-v42-topic-skeleton {
  display:grid;
  grid-template-columns:4rem minmax(0,1fr) minmax(5.5rem,.75fr);
  align-items:center;
  gap:.65rem;
  min-height:5.7rem;
  border-bottom:1px solid rgba(43,35,25,.055);
  padding:.6rem;
  background:#fff;
}
body.community-hub-mode .community-v42-topic-skeleton > i { width:4rem;height:4rem;border-radius:.85rem;background:linear-gradient(90deg,#f2eee6,#faf8f3,#f2eee6);background-size:220% 100%;animation:v42-shimmer 1.2s linear infinite; }
body.community-hub-mode .community-v42-topic-skeleton > span { display:grid;gap:.35rem; }
body.community-hub-mode .community-v42-topic-skeleton b { display:block;height:.55rem;border-radius:999px;background:linear-gradient(90deg,#f2eee6,#faf8f3,#f2eee6);background-size:220% 100%;animation:v42-shimmer 1.2s linear infinite; }
body.community-hub-mode .community-v42-topic-skeleton b:nth-child(2) { width:86%; }
body.community-hub-mode .community-v42-topic-skeleton b:nth-child(3) { width:55%; }
@keyframes v42-shimmer { to { background-position:-220% 0; } }

/* El footer de Comunidad queda siempre por encima del listado. */
body.community-hub-mode .community-hub-nav { z-index: 88!important; }

@media (max-width: 390px) {
  body.community-hub-mode .community-v42-channels-hero { grid-template-columns:3.75rem minmax(0,1fr);min-height:6.7rem;gap:.7rem;padding:.85rem .72rem; }
  body.community-hub-mode .community-v42-channels-hero__icon { width:3.75rem;height:3.75rem; }
  body.community-hub-mode .community-v42-channel-card { grid-template-columns:5.75rem minmax(0,1fr) .8rem;gap:.55rem;min-height:6.35rem;padding:.4rem .5rem .4rem .4rem; }
  body.community-hub-mode .community-v42-channel-card__image { height:5.45rem; }
  body.community-hub-mode .community-v42-channel-group > header small { max-width:8.5rem; }
  body.community-hub-mode .community-v42-topics-head { grid-template-columns:2.55rem minmax(0,1fr) auto;gap:.5rem;min-height:4.7rem;padding:.6rem; }
  body.community-hub-mode .community-v42-topics-head__icon { width:2.55rem;height:2.55rem; }
  body.community-hub-mode .community-v42-topics-head__copy small { font-size:.59rem; }
  body.community-hub-mode .community-v42-topics-head > button { padding-inline:.55rem;font-size:.55rem; }
  body.community-hub-mode .community-v42-topic-row { grid-template-columns:3rem minmax(0,1fr) minmax(5.15rem,.73fr) .55rem;gap:.28rem;min-height:5.35rem;padding:.52rem .38rem; }
  body.community-hub-mode .community-v42-topic-row__image { width:3rem;height:3rem;border-radius:.72rem; }
}

@media (min-width: 700px) {
  body.community-hub-mode .community-v42-channel-card { grid-template-columns:10.8rem minmax(0,1fr) 1.4rem;min-height:8.4rem; }
  body.community-hub-mode .community-v42-channel-card__image { height:7.4rem; }
  body.community-hub-mode .community-v42-topic-row { grid-template-columns:4.7rem minmax(0,1.2fr) minmax(12rem,.9fr) 1rem; }
  body.community-hub-mode .community-v42-topic-row__image { width:4.7rem;height:4.7rem; }
}
