/* --- GERAL E VARIÁVEIS --- */
:root { 
  --bg-deep: #10100d;
   --bg-card: #101010; 
   --text-main: #ffffff; 
   --text-muted: #888; 
   --primary: #ffe600; 
   --secondary: #ffe600;
   --gradient: linear-gradient(135deg, var(--primary), var(--secondary)); 
  }
* { 
  margin: 0; 
  padding: 0; 
  box-sizing: border-box; 
  font-family: 'Inter', sans-serif; 
}
html, body{
  min-height: 100%;
}


body{
  background-color: var(--bg-deep);
    background-repeat: no-repeat;
  background-size: 100% 100%;
  background-attachment: fixed;
  color: var(--text-main);
  overflow-x: hidden;

  min-height: 100vh;
  display: flex;
  flex-direction: column;
  position: relative;
  isolation: isolate;

}

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--bg-deep); }
::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }

/* --- BUSCA E SUGESTÕES --- */
.sugg-item:hover { background: rgba(0, 255, 157, .1); }
.sugg-item img { width: 40px; height: 60px; object-fit: cover; border-radius: 4px; }
.sugg-info div { font-weight: 700; font-size: .9rem; color: #fff; }
.sugg-info span { font-size: .75rem; color: #888; }

/* --- BOTÕES HEADER --- */
.btn-login { border: 1px solid rgba(255, 255, 255, .15); background: rgba(255, 255, 255, .06); color: #fff; padding: 10px 16px; border-radius: 999px; cursor: pointer; font-weight: 700; letter-spacing: .5px; transition: .2s; }
.btn-login:hover { transform: scale(1.03); background: rgba(0, 255, 157, .15); border-color: rgba(0, 255, 157, .35); }

/* --- HERO SECTION --- */
.hero {
  min-height: 88vh;
  max-height: 900px;
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 12%;
  margin-bottom: 0;
  overflow: hidden;
}
.hero-layer { position: absolute; inset: 0; background-size: cover; background-position: top; transition: opacity 1s; }
.hero-overlay { position: absolute;  inset: 0; background: radial-gradient(circle, transparent 0%, var(--bg-deep) 100%), linear-gradient(to top, var(--bg-deep) 10%, transparent 50%); z-index: 1; }
.hero-content {
  position: relative;
  z-index: 2;
  max-width: 700px;
  margin-top: 20px;
  transition: .5s;
}
.hero-content.fade { opacity: 0; transform: translateY(20px); }
.hero h1 { font-size: 3rem; line-height: 1.1; margin: 1rem 0; text-shadow: 0 10px 30px rgba(0, 0, 0, .8); }
.hero p { color: #ccc; font-size: 0.8rem; margin-bottom: 2rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.btn-action { padding: 12px 35px; border-radius: 50px; font-weight: 700; text-transform: uppercase; border: none; cursor: pointer; background: var(--primary); transition: .3s; }
.btn-action:hover { transform: scale(1.05); box-shadow: 0 0 25px rgba(0, 255, 157, .4); }

/* --- CONTAINER E CONTROLES --- */
.container { 
  padding: 100px 16% 3rem 16%;
  position: relative;
  z-index: 2;
  margin: 0;
  flex: 1;
}
.section-header { display: flex; justify-content:center; align-items: center; margin-bottom: 1rem;  padding-bottom: 1rem; gap: 16px; }
.section-title { font-size: 2rem; font-weight: 700; flex: 1; min-width: 0; }
.section-title span { color: var(--primary); }
.section-title .title-plain { color: #fff; }
.section-title .title-accent { color: var(--primary); }
#homeSections .section-title{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
#homeSections .section-title::before{
  content: "";
  width: 4px;
  height: 1.15em;
  margin-right: 10px;
  border-radius: 999px;
  background: var(--primary);
  box-shadow: 0 0 14px rgba(255,230,0,.28);
  flex: 0 0 auto;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #pageTitle{
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #pageTitle::before{
  content: "";
  display: inline-block;
  width: 4px;
  height: 1.15em;
  margin-right: 10px;
  border-radius: 999px;
  background: var(--primary);
  box-shadow: 0 0 14px rgba(255,230,0,.28);
  flex: 0 0 auto;
}

.provider-title-link{
  gap: 12px;
}

.provider-title-logo,
.catalog-provider-title-logo{
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 8px 20px rgba(0,0,0,.28);
  background: rgba(255,255,255,.06);
  flex: 0 0 auto;
}

.catalog-provider-title-logo{
  width: 38px;
  height: 38px;
  margin-left: 8px;
}

.back-to-top-btn{
  position: fixed;
  top: 86px;
  left: 50%;
  z-index: 1450;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  padding: 8px 18px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  color: #151515;
  font-weight: 800;
  font-size: .92rem;
  line-height: 1;
  box-shadow: 0 14px 34px rgba(0,0,0,.28);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -12px) scale(.96);
  transition: opacity .22s ease, transform .22s ease, box-shadow .18s ease, background .18s ease;
}

.back-to-top-btn.visible{
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0) scale(1);
}

.back-to-top-btn:hover{
  background: #fff;
  box-shadow: 0 18px 42px rgba(0,0,0,.36);
  transform: translate(-50%, -1px) scale(1.02);
}

.back-to-top-btn:active{
  transform: translate(-50%, 0) scale(.98);
}

.back-to-top-btn:focus-visible{
  outline: 2px solid rgba(255,230,0,.9);
  outline-offset: 3px;
}

.back-to-top-icon{
  font-size: 1.05rem;
  line-height: 1;
  transform: translateY(-1px);
}

@media (max-width: 700px){
  .back-to-top-btn{
    top: 76px;
    padding: 8px 14px;
    font-size: .84rem;
  }
}
.provider-logo-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  text-decoration: none;
  border-radius: 12px;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.provider-logo-link:hover{
  transform: translateY(-1px) scale(1.03);
  filter: brightness(1.06);
}

.provider-logo-link:focus-visible{
  outline: 2px solid rgba(255, 230, 0, .85);
  outline-offset: 3px;
}

.provider-title-logo[role="link"],
.provider-filter-logo-link{
  cursor: pointer;
}

.provider-title-logo[role="link"]:focus-visible,
.provider-filter-logo-link:focus-visible{
  outline: 2px solid rgba(255, 230, 0, .85);
  outline-offset: 3px;
}

.provider-logo-img{
  width: 46px;
  height: 46px;
  object-fit: cover;
  display: block;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 10px 24px rgba(0,0,0,.24);
  background: rgba(255,255,255,.06);
}
.header-controls { display: flex; align-items: center; justify-content: flex-end; gap: 15px; flex: 0 0 auto; }
.sub-filters { display: flex; gap: 1rem; }
.sub-btn { background: transparent; border: 1px solid #333; color: #888; padding: 8px 20px; border-radius: 20px; cursor: pointer; transition: .3s; font-weight: 600; }
.sub-btn:hover, .sub-btn.active { border-color: var(--primary); color: #fff; background: rgba(0, 255, 157, .1); }
/* --- POSTERS (grid padrão fora do HOME) --- */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1.35rem; margin: 0; padding-top: 10px; }
.card{
  background: var(--bg-card);
  border-radius: 14px;
  overflow: visible; /* deixa o menu sair para fora */
  position: relative;
  aspect-ratio: 2/3;
  cursor: pointer;
  transition: .3s;
  isolation: isolate;
}

.card img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .85;
  transition: .4s;
  border-radius: 14px;
  display: block;
}


.card:hover { transform: translateY(-10px); z-index: 5; box-shadow: 0 15px 30px rgba(0, 0, 0, .5); }
.card-title { font-size: 1.1rem; font-weight: 800; margin-bottom: 5px; }

/* --- FILTROS, MENUS E CHECKBOXES --- */
.filter-wrapper { position: relative; z-index: 50; }
#genreFilterWrap { display: flex; position: relative; }
.btn-filter { display: inline-flex; align-items: center; gap: 8px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .2); color: #ccc; padding: 8px 15px; border-radius: 20px; cursor: pointer; font-weight: 600; transition: .3s; }
.btn-filter:hover, .btn-filter.active { border-color: var(--primary); color: #fff; background: rgba(0, 0, 0, .5); box-shadow: 0 0 15px rgba(0, 255, 157, .2); }
.filter-dropdown { position: absolute; top: 110%; right: 0; left: auto; background: #151515; border: 1px solid #333; border-radius: 12px; padding: 15px; width: 240px; box-shadow: 0 10px 40px #000; display: none; z-index: 1000; opacity: 0; transform: translateY(10px); transition: .3s; }
.filter-dropdown.open { display: block; opacity: 1; transform: translateY(0); }
.filter-header { font-size: .8rem; color: #666; text-transform: uppercase; font-weight: 800; letter-spacing: 1px; margin-bottom: 10px; border-bottom: 1px solid rgba(255, 255, 255, .1); padding-bottom: 5px; }
.genre-list { max-height: 300px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding-right: 5px; }
.filter-provider-header { margin-top: 14px; padding-top: 12px; }
.provider-filter-list { max-height: none; overflow: visible; }
.provider-filter-list .filter-item { min-height: 40px; }
.provider-filter-logo { width: 30px; height: 30px; border-radius: 7px; object-fit: cover; display: block; box-shadow: 0 6px 14px rgba(0,0,0,.32); }
.genre-list::-webkit-scrollbar { width: 4px; }
.genre-list::-webkit-scrollbar-track { background: #222; }
.genre-list::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 4px; }
.filter-item { display: flex; align-items: center; gap: 12px; font-size: .9rem; color: #ccc; cursor: pointer; user-select: none; transition: .2s; padding: 5px 0; }
.filter-item:hover { color: #fff; transform: translateX(5px); }
.filter-item input { display: none; }
.checkmark { width: 18px; height: 18px; background: rgba(255, 255, 255, .05); border: 2px solid rgba(255, 255, 255, .3); border-radius: 5px; display: flex; align-items: center; justify-content: center; transition: .3s; }
.filter-item input:checked + .checkmark { background: var(--primary); border-color: var(--primary); box-shadow: 0 0 10px var(--primary); }
.checkmark::after { content: ''; width: 4px; height: 8px; border: solid #000; border-width: 0 2px 2px 0; transform: rotate(45deg) scale(0); transition: .2s; margin-bottom: 2px; }
.filter-item input:checked + .checkmark::after { transform: rotate(45deg) scale(1); }

/* === MODAL GERAL E SELEÇÃO DE LISTAS === */
.modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .85); backdrop-filter: blur(5px); z-index: 2000; display: none; align-items: center; justify-content: center; opacity: 0; transition: opacity .3s; }
.modal-overlay.open { opacity: 1; }
#shareDetailModal{
  z-index: 20000;
}
#shareDetailModal .share-detail-modal{
  position: relative;
  z-index: 20001;
}
.modal-content { background: #181818; padding: 30px; border-radius: 10px; width: 90%; max-width: 400px; text-align: center; border: 1px solid #333; }
.modal-content input, .modal-content textarea { width: 100%; margin-bottom: 15px; padding: 10px; background: #333; border: none; color: #fff; border-radius: 5px; }
.modal-actions button { padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; font-weight: 700; }
.list-selection-grid { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; max-height: 300px; overflow-y: auto; }
.select-list-btn { background: #333; color: #fff; padding: 15px; border: 1px solid #444; border-radius: 5px; cursor: pointer; text-align: left; transition: background .2s, border-color .2s; font-size: 1rem; }
.select-list-btn:hover { background: #444; border-color: #e50914; }

/* === MODAL DE AVALIAÇÃO === */
.rating-modal { background: #1a1a1a; padding: 2rem; border-radius: 20px; border: 1px solid rgba(255, 255, 255, .1); text-align: center; box-shadow: 0 20px 50px rgba(0, 0, 0, .5); transform: scale(.8); transition: transform .3s; max-width: 90%; width: 400px; }
.modal-overlay.open .rating-modal { transform: scale(1); }
.rating-title { font-size: 1.5rem; margin-bottom: 20px; font-weight: 700; color: #fff; }
.star-container { display: flex; justify-content: center; gap: 5px; margin-bottom: 20px; direction: ltr; }
.star-item { font-size: 2rem; color: #444; cursor: pointer; transition: .2s; }
.star-item.hovered, .star-item.selected { color: #ffd700; text-shadow: 0 0 10px rgba(255, 215, 0, .5); }
.rating-display { font-size: 1.2rem; font-weight: 700; margin-bottom: 20px; color: var(--primary); min-height: 1.5rem; }
.modal-btns { display: flex; gap: 10px; justify-content: center; }
.btn-confirm { background: var(--primary); color: #000; border: none; padding: 10px 30px; border-radius: 30px; font-weight: 800; cursor: pointer; transition: .3s; }
.btn-confirm:hover { transform: scale(1.05); box-shadow: 0 0 15px rgba(0, 255, 157, .4); }
.btn-cancel { background: transparent; border: 1px solid #555; color: #ccc; padding: 10px 30px; border-radius: 30px; font-weight: 800; cursor: pointer; transition: .3s; }
.btn-cancel:hover { border-color: #fff; color: #fff; }
.clear-rating-btn { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .15); background: rgba(0, 0, 0, .45); color: #fff; display: grid; place-items: center; cursor: pointer; transition: transform .15s, background .15s, border-color .15s; z-index: 5; }
.clear-rating-btn:hover { transform: scale(1.06); background: rgba(0, 0, 0, .65); border-color: rgba(255, 255, 255, .25); }

/* --- GRID (list details) --- */
.movie-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 1.35px; padding-bottom: 40px; }

/* --- PEOPLE / CAST --- */
.card.person-card img { opacity: .95; }
.card.person-card:hover img { opacity: .35; filter: blur(1px); }
.person-card { position: relative; overflow: hidden; }
.person-name { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 12px; font-weight: 900; font-size: .95rem; color: #fff; background: linear-gradient(to top, rgba(0, 0, 0, .92), rgba(0, 0, 0, 0)); text-align: left; pointer-events: none; text-shadow: 0 8px 20px rgba(0, 0, 0, .9); }
.people-search-section { margin-top: 2.5rem; }
.people-grid .card { aspect-ratio: 2/3; }
.people-loadmore { display: flex; justify-content: center; margin-top: 14px; }

/* --- HOME: botão “mais” --- */
.home-block { margin-bottom: 2.5rem; }

.home-trailer-block{
  margin-bottom: 2.8rem;
}

.home-trailer-shell{
  position: relative;
  padding: 0;
  border-radius: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.home-trailer-shell.is-switching .home-trailer-track{
  opacity: .72;
  transform: translateY(4px);
}

.home-trailer-head{
  position: relative;
  z-index: 1;
  display:flex;
  align-items:center;
  gap:18px;
  justify-content:flex-start;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.home-trailer-heading{
  display:flex;
  flex-direction:column;
  gap: 6px;
  min-width: 0;
}

.home-trailer-kicker{
  display: none;
}

.home-trailer-title{
  flex: 0 0 auto;
  color: #fff;
}

.home-trailer-tabs{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 6px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}

.home-trailer-tab{
  border: none;
  background: transparent;
  color: rgba(255,255,255,.78);
  min-height: 40px;
  padding: 0 18px;
  border-radius: 999px;
  font-weight: 800;
  cursor: pointer;
  transition: background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.home-trailer-tab:hover{
  transform: translateY(-1px);
  color: #fff;
  background: rgba(255,255,255,.05);
}

.home-trailer-tab.active{
  background: linear-gradient(135deg, #ffe600, #f1c40f);
  color: #111;
  box-shadow: 0 10px 22px rgba(255,255,255,.1);
}

.home-trailer-track{
  position: relative;
  z-index: 1;
  display:flex;
  gap: 18px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 0 18px;
  scroll-behavior: smooth;
  transition: opacity .22s ease, transform .22s ease;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,230,0,.42) rgba(255,255,255,.08);
}

.home-trailer-track::-webkit-scrollbar{
  height: 8px;
}

.home-trailer-track::-webkit-scrollbar-thumb{
  background: rgba(255,230,0,.42);
  border-radius: 999px;
}

.home-trailer-track::-webkit-scrollbar-track{
  background: rgba(255,255,255,.08);
  border-radius: 999px;
}

.home-trailer-card{
  flex: 0 0 320px;
  min-width: 320px;
  cursor: pointer;
  opacity: 1;
  transform: translateY(0);
  transition: transform .22s ease;
}

.home-trailer-card.is-entering{
  opacity: 0;
  transform: translateY(26px);
  transition:
    opacity .48s cubic-bezier(.22,1,.36,1),
    transform .58s cubic-bezier(.22,1,.36,1);
  transition-delay: calc(var(--trailer-order, 0) * 52ms);
}

.home-trailer-card.is-entering.is-visible{
  opacity: 1;
  transform: translateY(0);
}

.home-trailer-thumb{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 16px;
  overflow: hidden;
  background: rgba(255,255,255,.08) center/cover no-repeat;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 34px rgba(0,0,0,.22);
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.home-trailer-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.03), rgba(0,0,0,.18) 45%, rgba(0,0,0,.44));
}

.home-trailer-card:hover .home-trailer-thumb{
  transform: translateY(-3px);
  border-color: rgba(255,255,255,.11);
  box-shadow: 0 24px 42px rgba(0,0,0,.32);
}

.home-trailer-play{
  position:absolute;
  inset:0;
  z-index:1;
  display:grid;
  place-items:center;
  color:#fff;
  font-size: 3rem;
  text-shadow: 0 12px 28px rgba(0,0,0,.42);
  transition: transform .18s ease, opacity .18s ease;
}

.home-trailer-card:hover .home-trailer-play{
  transform: scale(1.06);
}

.home-trailer-copy{
  padding: 14px 6px 0;
  text-align: left;
}

.home-trailer-name{
  color:#fff;
  font-size: 1.05rem;
  font-weight: 900;
  line-height: 1.2;
  margin-bottom: 4px;
}

.home-trailer-subtitle{
  color: rgba(255,255,255,.68);
  font-size: .92rem;
  line-height: 1.25;
}

.home-trailer-empty{
  min-height: 180px;
  width: 100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(255,255,255,.72);
}

.home-inline-loader{
  width: 100%;
  min-height: 156px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: rgba(255,255,255,.72);
  font-size: .92rem;
  font-weight: 800;
}

.home-inline-loader-dots{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.home-inline-loader-dots span{
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #ffe600;
  box-shadow: 0 0 18px rgba(255,255,255,.11);
  animation: hsLoaderPulse .95s ease-in-out infinite;
}

.home-inline-loader-dots span:nth-child(2){
  animation-delay: .12s;
}

.home-inline-loader-dots span:nth-child(3){
  animation-delay: .24s;
}

.home-inline-loader-text{
  color: rgba(255,255,255,.72);
}

.catalog-grid-loader{
  grid-column: 1 / -1;
  width: 100%;
  min-height: clamp(260px, 48vh, 460px);
  display: grid;
  place-items: center;
  padding: 44px 0;
}

.catalog-grid-loader .home-inline-loader{
  min-height: 0;
}

.community-grid-loader{
  grid-column: 1 / -1;
  width: 100%;
  min-height: clamp(240px, 42vh, 420px);
  display: grid;
  place-items: center;
  padding: 40px 0;
}

.community-grid-loader .home-inline-loader{
  min-height: 0;
}

@media (max-width: 900px){
  .home-trailer-shell{
    padding: 0;
    border-radius: 0;
  }

  .home-trailer-card{
    flex-basis: 280px;
    min-width: 280px;
  }
}

@media (max-width: 640px){
  .home-trailer-head{
    gap: 14px;
  }

  .home-trailer-title{
    width: 100%;
  }

  .home-trailer-tabs{
    width: 100%;
    overflow-x: auto;
    justify-content: flex-start;
    scrollbar-width: none;
  }

  .home-trailer-tabs::-webkit-scrollbar{
    display: none;
  }

  .home-trailer-tab{
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 0 16px;
  }

  .home-trailer-card{
    flex-basis: calc(100vw - 84px);
    min-width: calc(100vw - 84px);
  }
}

/* =========================== HOME: CAROUSEL =========================== */
body.is-home #topHeader {
  display: none !important;
}

body:not(.is-home) #topHeader {
  display: flex !important;
}

body.is-home #homeSections {
  display: block !important;
}

body.is-home #mainGrid {
  display: none !important;
}
body.is-home .container{
  padding-top: 0;
}
#homeSections .hs-wrap { position: relative; width: 100%; overflow: visible; }
#homeSections .hs-track { display: flex !important; flex-wrap: nowrap !important; gap: 16px; overflow-x: auto !important; overflow-y: hidden !important; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; padding: 10px 20px; margin: 0; scrollbar-width: none; }
#homeSections .hs-track::-webkit-scrollbar { display: none; }
#homeSections .hs-track .card { flex: 0 0 150px; max-width: 150px; aspect-ratio: 2/3; }
#homeSections .hs-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 9999; width: 44px; height: 44px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .18); background: rgba(0, 0, 0, .65); color: #fff; display: grid; place-items: center; cursor: pointer; font-weight: 900; font-size: 28px; line-height: 1; opacity: 1; transition: opacity .24s ease, transform .28s cubic-bezier(.22,1,.36,1), background .18s ease, border-color .18s ease; }
#homeSections .hs-left { left: 8px; }
#homeSections .hs-right { right: 8px; }
#homeSections .hs-left { opacity: 0; pointer-events: none; transform: translateY(-50%) translateX(-14px) scale(.92); }
#homeSections .hs-wrap.has-left-arrow .hs-left { opacity: 1; pointer-events: auto; transform: translateY(-50%) translateX(0) scale(1); }
#homeSections .hs-arrow:hover { background: rgba(0, 0, 0, .85); transform: translateY(-50%) scale(1.08); border-color: rgba(0, 255, 157, .35); }
#homeSections .hs-left:hover { transform: translateY(-50%) translateX(-14px) scale(.92); }
#homeSections .hs-wrap.has-left-arrow .hs-left:hover { transform: translateY(-50%) translateX(0) scale(1.08); }
#homeSections .hs-arrow:active { transform: translateY(-50%) scale(.98); }
#homeSections .hs-left:active { transform: translateY(-50%) translateX(-14px) scale(.92); }
#homeSections .hs-wrap.has-left-arrow .hs-left:active { transform: translateY(-50%) translateX(0) scale(.98); }
#homeSections .hs-wrap::before, #homeSections .hs-wrap::after { content: ""; position: absolute; top: 0; bottom: 0; width: 56px; pointer-events: none; z-index: 2; }
#homeSections .hs-wrap::before { left: 0; background: linear-gradient(to right, var(--bg-deep), rgba(5, 5, 5, 0)); }
#homeSections .hs-wrap::after { right: 0; background: linear-gradient(to left, var(--bg-deep), rgba(5, 5, 5, 0)); }

/* =========================
   FOOTER (INDEX)
========================= */
.site-footer{
  margin-top: 0;
  padding: 28px 5% 20px;
  background: linear-gradient(to top, #0b0b0b, rgba(5,5,5,0.85));
  border-top: 1px solid rgba(255,255,255,0.08);
}
.site-footer .footer-inner{
  display: grid;
  grid-template-columns: 1.1fr 1.2fr 0.9fr;
  gap: 18px;
  align-items: stretch;
}

.footer-box{
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 18px 18px;
  backdrop-filter: blur(10px);
}

.footer-box h3{
  font-size: 1.05rem;
  font-weight: 900;
  margin-bottom: 6px;
}

.footer-box p{
  color: rgba(255,255,255,0.72);
  font-size: 0.92rem;
  line-height: 1.35;
  margin-bottom: 14px;
}

.footer-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 16px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(0,0,0,0.35);
  color: #fff;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}

.footer-btn:hover{
  transform: translateY(-1px);
  background: rgba(0,0,0,0.55);
  border-color: rgba(229, 255, 0, 0.35);
}

.footer-btn-primary{
  background: var(--primary);
  border-color: var(--primary);
  color: #000;
}

.footer-btn-primary:hover{
  background: rgba(251, 255, 0, 0.9);
}

.social-row{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 6px;
}

.social-icon{
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(0,0,0,0.35);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
  text-decoration: none;
}

.social-icon:hover{
  transform: translateY(-1px) scale(1.04);
  background: rgba(0,0,0,0.6);
  border-color: rgba(238, 255, 0, 0.35);
}

.social-icon svg{
  width: 20px;
  height: 20px;
  fill: #fff;
  opacity: 0.92;
}

.footer-bottom{
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.6);
  text-align: center;
  font-size: 0.85rem;
}

/* =========================
   FOOTER - LOGIN STATE
========================= */

/* Quando estiver logado, esconde a box de login */
body.is-logged .footer-login{
  display: none;
}

/* Ajuste automático do grid quando a box some */
body.is-logged .site-footer .footer-inner{
  grid-template-columns: 1fr 1fr;
}

/* Centraliza melhor as boxes restantes */
body.is-logged .footer-box{
  justify-self: stretch;
}

/* =========================
   THEME: TRAMA (INDEX ONLY)
   Amarelo + Verde
========================= */
body.theme-trama{
  /* cores principais */
  --primary: #ffe600;          /* verde (já existente) */
  --secondary: #ffe600;        /* amarelo TRAMA */
  --accent-yellow: #ffe600;

  /* gradiente principal do site */
  --gradient: linear-gradient(135deg, var(--secondary), var(--primary));
}

/* títulos com span (ex: “Em destaque”) agora ficam amarelos */
body.theme-trama .section-title span{
  color: var(--secondary);
}

body.theme-trama .section-title .title-plain{
  color:#fff;
}

body.theme-trama .section-title .title-accent{
  color:var(--secondary);
}

/* BOTÕES principais do site ficam amarelo (mais “marca”) */
body.theme-trama .btn-action,
body.theme-trama .footer-btn-primary,
body.theme-trama .btn-confirm{
  background: var(--secondary);
  border-color: var(--secondary);
  color: #000;
}

/* Hover dos botões com glow amarelo */
body.theme-trama .btn-action:hover,
body.theme-trama .footer-btn-primary:hover,
body.theme-trama .btn-confirm:hover{
  box-shadow: 0 0 25px rgba(255, 208, 0, .35);
}

/* Hovers/seleções que antes eram “verde”, viram amarelo (mais identidade TRAMA) */
body.theme-trama .sub-btn:hover,
body.theme-trama .sub-btn.active{
  border-color: var(--secondary);
  background: rgba(255,255,255,.05);
}

body.theme-trama .btn-filter:hover,
body.theme-trama .btn-filter.active{
  border-color: var(--secondary);
  box-shadow: 0 0 15px rgba(255,255,255,.09);
}

/* setas do carrossel: borda e hover amarelos */
body.theme-trama #homeSections .hs-arrow:hover{
  border-color: rgba(255, 208, 0, .45);
}

/* sugestão do autocomplete */
body.theme-trama .sugg-item:hover{
  background: rgba(255,255,255,.06);
}

body.theme-trama ::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.125);
}

body.theme-trama nav .logo{
  background: var(--gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#listSelectionModal{
  display: flex;              /* sempre no layout */
  opacity: 0;
  pointer-events: none;       /* não clica quando fechado */
  visibility: hidden;         /* opcional, mas ajuda */
  transition: opacity 200ms ease, visibility 200ms ease;
}

#listSelectionModal.open{
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

/* caixa do modal: começa menor e sobe */
#listSelectionModal .modal-content {
  transform: scale(0.96) translateY(8px);
  opacity: 0;
  transition: transform 200ms ease, opacity 200ms ease;
  will-change: transform, opacity;
}

/* quando abre: volta ao normal */
#listSelectionModal.open .modal-content {
  transform: scale(1) translateY(0);
  opacity: 1;
}

.hero-arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.16);
  background: rgba(0,0,0,0.35);
  color: #fff;
  font-size: 34px;
  line-height: 1;
  display: grid;
  place-items: center;
  cursor: pointer;
  z-index: 5;
  backdrop-filter: blur(10px);
  transition: transform .15s ease, background .15s ease, border-color .15s ease, opacity .15s ease;
}

.hero-arrow:hover{
  transform: translateY(-50%) scale(1.05);
  background: rgba(0,0,0,0.55);
  border-color: rgba(255,230,0,0.35);
}

.hero-left{ left: 25px; }
.hero-right{ right: 25px; }



/* =========================
   COMMUNITY LISTS - VISUAL NOVO
========================= */

.community-list-card{
  position: relative;
  background:
    linear-gradient(180deg, rgba(20,20,20,0.96) 0%, rgba(10,10,10,0.98) 100%);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
  transition:
    transform .28s ease,
    box-shadow .28s ease,
    border-color .28s ease,
    background .28s ease;
  box-shadow:
    0 10px 30px rgba(0,0,0,0.30),
    inset 0 1px 0 rgba(255,255,255,0.03);
}

.community-list-card::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at bottom right, rgba(255,255,255,.025), transparent 30%);
  opacity: .9;
  pointer-events: none;
  z-index: 0;
}

.community-list-card:hover{
  transform: translateY(-8px) scale(1.01);
  border-color: rgba(255,255,255,.11);
  box-shadow:
    0 22px 55px rgba(0,0,0,0.48),
    0 0 0 1px rgba(255,255,255,.025) inset;
}

/* topo / capa */
.community-list-cover{
  position: relative;
  z-index: 1;
  padding: 14px 14px 10px;
  background:
    linear-gradient(to bottom, rgba(255,255,255,0.02), transparent);
}

/* grade de posters verticais */
.community-list-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  align-items: stretch;
}

/* slot individual */
.community-poster-slot{
  position: relative;
  aspect-ratio: 2 / 3;
  border-radius: 16px;
  overflow: hidden;
  background: #121212;
  border: 1px solid rgba(255,255,255,0.05);
  box-shadow:
    0 8px 18px rgba(0,0,0,0.22),
    inset 0 1px 0 rgba(255,255,255,0.02);
  transition:
    transform .35s ease,
    box-shadow .35s ease,
    border-color .35s ease,
    filter .35s ease;
}

.community-poster-slot::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.22), transparent 45%);
  pointer-events: none;
}

.community-poster-slot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity .25s ease;
}
/* animação em cascata */
.community-list-card:hover .community-poster-slot{
  border-color: rgba(255,255,255,0.08);
}

/* poster vazio */
.community-poster-slot.is-empty{
  background:
    linear-gradient(135deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border: 1px dashed rgba(255,255,255,0.10);
}

.community-empty-poster{
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  font-size: 1.8rem;
  color: rgba(255,255,255,0.18);
  background:
    radial-gradient(circle at center, rgba(255,255,255,.02), transparent 60%);
}

/* contador */
.community-list-count {
  position: static;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.06);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,0.10);
  white-space: nowrap;
}

/* corpo */
.community-list-body {
  padding: 16px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.community-list-title{
  margin: 0 0 8px;
  color: #fff;
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 1.22;
  letter-spacing: -0.01em;
}

.community-list-meta{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.06);
  min-width: 0;
}

.community-list-meta .community-list-owner,
.community-review-meta .community-review-owner{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.community-card-stats{
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex: 0 0 auto;
  white-space: nowrap;
}

.community-card-stats .home-list-stat{
  font-size: .84rem;
}

.community-list-owner{
  color: #d8d8d8;
  font-size: 0.84rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.community-list-owner::before{
  display: none;
}

.community-owner-inline,
.community-list-owner,
.community-review-owner{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.community-owner-avatar{
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  border-radius: 50%;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,230,0,.32);
  box-shadow: 0 0 10px rgba(255,255,255,.09);
}

.community-owner-avatar img,
.community-owner-avatar-fallback{
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.community-owner-avatar img{
  object-fit: cover;
  display: block;
}

.community-owner-avatar-fallback{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #ffe600;
  font-size: .68rem;
  font-weight: 900;
  line-height: 1;
}

.community-owner-name{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.community-list-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

/* melhora no grid geral de listas */
.lists-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 20px;
  padding: 8px 0 20px;
}

/* detalhes da lista aberta */
#listItemsGrid.movie-grid .card{
  border-radius: 16px;
  overflow: hidden;
}

#listItemsGrid.movie-grid .card img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#listItemsGrid.movie-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 170px));
  justify-content: center;
  gap: 1.35rem;
  padding-top: 10px;
}

#listItemsGrid.movie-grid .card{
  width: 100%;
  max-width: 170px;
  justify-self: center;
}

/* responsivo */
@media (max-width: 900px){
  .lists-grid{
    grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
    gap: 22px;
  }

  .community-list-grid{
    gap: 8px;
  }
}

@media (max-width: 640px){
  .community-list-card{
    border-radius: 20px;
  }

  .community-list-cover{
    padding: 12px 12px 8px;
  }

  .community-list-grid{
    gap: 7px;
  }

  .community-list-title{
    font-size: 1rem;
  }

  .community-list-count{
    font-size: 0.72rem;
    padding: 7px 11px;
  }
}

.community-list-owner{
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  color: #d8d8d8;
  font-size: 0.84rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  transition: color .2s ease, transform .2s ease;
  position: relative;
  z-index: 30;
  pointer-events: auto;
}

.community-list-owner:hover{
  color: #ffe600;
  transform: translateX(2px);
}

.community-list-owner:focus{
  outline: none;
}

.community-list-owner::before{
  display: none;
}

.community-list-body,
.community-list-meta{
  position: relative;
  z-index: 20;
}

.community-list-likes-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid rgba(255,77,79,.28);
  background:rgba(255,77,79,.12);
  color:#ff6b6d;
  font-size:.72rem;
  font-weight:900;
  line-height:1;
}

.community-list-likes-badge[hidden]{
  display:none !important;
}

#currentListMeta{
  color: #bdbdbd;
  font-size: 0.92rem;
  font-weight: 700;
}

#currentListMeta .community-list-owner{
  display: inline-flex;
  font-size: 0.92rem;
}

.reviews-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 16px;
  margin-top: 14px;
}

.community-review-card{
  background: #111;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 15px;
  overflow: hidden;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.community-review-card:hover{
  transform: translateY(-4px);
  border-color: rgba(255,230,0,.35);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

.community-review-cover{
  display:flex;
  gap:10px;
  padding:10px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.community-review-poster{
  width: 90px;
  min-width: 90px;
  height: 135px;
  border-radius: 12px;
  overflow:hidden;
  background:#1a1a1a;
}

.community-review-poster img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.community-review-head{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:10px;
  padding-top: 2px;
  padding-right: 46px;
}

.community-review-badges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.community-review-type-badge{
  position: absolute;
  top: 16px;
  right: 64px;
  z-index: 34;
  display: inline-flex;
  max-width: 150px;
}

.community-review-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:700;
  background: rgba(255,255,255,.06);
  color:#fff;
}

.community-review-badge.public{
  background: rgba(0,153,255,.12);
  color:#70c4ff;
}

.community-review-badge.friends{
  background: rgba(0,255,157,.12);
  color:#58f0b1;
}

.community-review-title{
  color:#fff;
  font-size:1.1rem;
  font-weight:800;
  line-height:1.2;
  overflow-wrap: anywhere;
}

.community-review-created-at{
  position: absolute;
  left: 132px;
  bottom: 32px;
  color: rgba(255,255,255,.38);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.community-review-rating-line{
  position: absolute;
  left: 132px;
  bottom: 54px;
  color: rgba(255,230,0,.86);
  font-size: .82rem;
  font-weight: 850;
  line-height: 1.2;
  white-space: nowrap;
}

.community-review-body{
  padding:14px;
}

.community-review-text{
  color:#ddd;
  line-height:1.6;
  font-size:.95rem;

  display:-webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow:hidden;
}

.community-review-meta{
  margin-top:14px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  color:#888;
  font-size:.85rem;
  min-width: 0;
}

.community-review-owner{
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
  color: #ffe600;
  font-size: .85rem;
  font-weight: 800;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  position: relative;
  z-index: 30;
  pointer-events: auto;
  transition: color .18s ease, transform .18s ease;
}

.community-review-owner:hover{
  color: #fff07a;
  transform: translateX(2px);
}

.community-review-owner:focus{
  outline: none;
}

.community-review-body,
.community-review-meta,
.review-detail-content,
.review-detail-meta{
  position: relative;
  z-index: 20;
}

.community-review-meta > div:last-child{
  pointer-events: none;
}

.review-detail-card{
  background:
    linear-gradient(180deg, rgba(22,22,22,.98) 0%, rgba(12,12,12,.99) 100%);
  border:1px solid rgba(255,255,255,.09);
  border-radius:24px;
  padding:22px;
  display:grid;
  grid-template-columns: 180px 1fr;
  gap:22px;
  margin-top:20px;
  box-shadow: 0 18px 44px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.035);
}

.review-detail-poster{
  position: relative;
  width:180px;
  height:270px;
  border-radius:16px;
  overflow:hidden;
  background:#1a1a1a;
}

.review-detail-poster img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.review-detail-content h3{
  color:#fff;
  font-size:1.8rem;
  margin:0 0 8px;
}

.review-detail-meta{
  color:#aaa;
  margin-bottom:14px;
  line-height:1.6;
}

.review-detail-text{
  color:#eee;
  line-height:1.9;
  white-space:pre-wrap;
}

#listDetailsView{
  margin-top: 8px;
}

#listDetailHero{
  margin-bottom: 22px;
}

.list-detail-actions-top{
  margin-bottom: 0;
}

.list-detail-card{
  position: relative;
  background:
    linear-gradient(180deg, rgba(19,19,19,.98), rgba(10,10,10,.99));
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 24px;
  padding: 22px;
  display: grid;
  grid-template-columns: minmax(360px, 440px) minmax(0, 1fr);
  align-items: center;
  gap: 24px;
  box-shadow: 0 20px 48px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.03);
}

.list-detail-cover{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.list-detail-preview-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  min-height: 210px;
  height: 210px;
  padding: 10px;
  border-radius: 20px;
  background: rgba(255,255,255,.025);
}

.list-detail-preview-slot{
  position: relative;
  min-width: 0;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, rgba(80,80,80,.28), rgba(30,30,30,.95));
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
  overflow: hidden;
}

.list-detail-preview-slot img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.list-detail-preview-slot.is-empty::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,.03), rgba(0,0,0,.15));
}

.list-detail-preview-slot.is-extra{
  background:
    linear-gradient(135deg, rgba(120,120,120,.32), rgba(42,42,42,.96)),
    #2b2b2b;
}

.list-detail-empty-plus,
.list-detail-extra-count{
  position: relative;
  z-index: 1;
  color: #ffe600;
  font-size: 1.15rem;
  font-weight: 900;
}

.list-detail-extra-count{
  color: #fff;
  font-size: clamp(1.15rem, 2.2vw, 1.8rem);
  font-weight: 950;
}

.list-detail-items-toggle{
  width: 100%;
  min-height: 40px;
  border: 1px solid rgba(255,230,0,.30);
  border-radius: 8px;
  background: rgba(255,255,255,.05);
  color: #ffe600;
  font-size: .88rem;
  font-weight: 900;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.list-detail-items-toggle:hover{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,230,0,.48);
  color: #fff27a;
}

.list-detail-submeta{
  color: rgba(255,255,255,.58);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

#listItemsGrid.is-hidden,
#listItemsGrid.movie-grid.is-hidden{
  display: none;
}

.list-detail-content{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
  justify-content: flex-start;
  min-height: 270px;
}

.list-detail-kicker{
  position: absolute;
  top: 22px;
  right: 22px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  width: fit-content;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: #ffe600;
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.list-detail-kicker-count{
  color: rgba(255,255,255,.92);
  font-weight: 800;
  letter-spacing: .02em;
}

.list-detail-title{
  margin: 0;
  color: #fff;
  font-size: clamp(1.8rem, 2.6vw, 2.5rem);
  line-height: 1.08;
  letter-spacing: -.03em;
  order: 2;
}

.list-detail-meta-row{
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  color: #a8a8a8;
  order: 1;
  padding-right: 160px;
}

.list-detail-owner-stack{
  display: inline-flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}

.list-detail-owner{
  font-size: .92rem;
}

.list-detail-owner-with-avatar{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.list-detail-owner-with-avatar::before{
  display: none;
}

.list-detail-owner-avatar-img,
.list-detail-owner-avatar-fallback{
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 50%;
}

.list-detail-owner-avatar-img{
  object-fit: cover;
  display: inline-block;
  background: rgba(255,255,255,.08);
}

.list-detail-owner-avatar-fallback{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,230,0,.35);
  color: #ffe600;
  font-size: .9rem;
  font-weight: 900;
  line-height: 1;
}

.list-detail-owner-text,
.list-detail-date{
  color: #d0d0d0;
  font-size: .9rem;
  font-weight: 700;
}

.list-detail-card .list-detail-date{
  color: rgba(255,255,255,.42);
  font-weight: 700;
}

.list-detail-stats{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  order: 4;
  margin-top: auto;
}

.list-detail-action-btn{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 4px 2px;
  background: transparent;
  border: none;
  border-radius: 0;
  cursor: pointer;
  color: rgba(255,255,255,.82);
  font-size: .92rem;
  font-weight: 900;
  line-height: 1;
  transition: transform .22s ease, color .22s ease;
}

.list-detail-action-btn:hover{
  transform: translateY(-1px);
  color: #fff;
}

.list-detail-action-icon{
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
}

.list-detail-heart-icon{
  fill: transparent;
  stroke: rgba(255,255,255,.8);
  stroke-width: 1.9;
  transition: fill .22s ease, stroke .22s ease, transform .22s ease;
}

.list-detail-like-btn:hover .list-detail-heart-icon{
  stroke: #ff7b7b;
}

.list-detail-like-btn.active{
  color: #ff6b6b;
  animation: likePop .25s ease;
}

.list-detail-like-btn.active .list-detail-heart-icon{
  fill: #ff4d4f;
  stroke: #ff4d4f;
  transform: scale(1.14);
}

.list-detail-comment-btn .list-detail-action-icon{
  fill: none;
  stroke: rgba(255,255,255,.82);
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke .22s ease;
}

.list-detail-comment-btn:hover .list-detail-action-icon{
  stroke: #fff;
}

.list-detail-comment-btn .list-comment-count,
.list-detail-like-btn .list-like-count{
  min-width: 10px;
  font-weight: 900;
}

.list-detail-save-btn.save-inline-btn{
  min-width: 36px;
  height: 36px;
  padding: 0 2px;
  border: none;
  border-radius: 0;
  background: transparent;
  color: rgba(255,255,255,.82);
  box-shadow: none;
  gap: 6px;
}

.list-detail-save-btn.save-inline-btn:hover{
  background: transparent;
  border-color: transparent;
  color: #ffe082;
}

.list-detail-save-btn.save-inline-btn.active{
  background: transparent;
  border-color: transparent;
  color: #ffe600;
}

.list-detail-save-icon,
.list-detail-save-icon path{
  fill: transparent;
  stroke: rgba(255,255,255,.82);
  stroke-width: 1.8;
  transition: fill .2s ease, stroke .2s ease, transform .2s ease;
}

.list-detail-save-btn:hover .list-detail-save-icon,
.list-detail-save-btn:hover .list-detail-save-icon path{
  stroke: #ffe082;
}

.list-detail-save-btn.active .list-detail-save-icon,
.list-detail-save-btn.active .list-detail-save-icon path{
  fill: #ffe600;
  stroke: #ffe600;
  transform: translateY(-1px);
}

.list-detail-save-btn .save-count{
  min-width: 10px;
  font-weight: 900;
  color: rgba(255,255,255,.9);
  transition: color .2s ease;
}

.list-detail-save-btn.active .save-count{
  color: #ffe600;
}

.review-detail-social-actions{
  margin: 12px 0 14px;
}

.list-detail-desc{
  margin: 0;
  color: #dfdfdf;
  line-height: 1.72;
  white-space: pre-wrap;
  order: 3;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
}

.list-detail-desc.is-empty{
  color: #909090;
}

#listItemsGrid.movie-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 18px;
  padding-top: 6px;
}

#listItemsGrid.movie-grid .card{
  background: linear-gradient(180deg, rgba(18,18,18,.98), rgba(10,10,10,.99));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 14px 32px rgba(0,0,0,.28);
}

#listItemsGrid.movie-grid .card img{
  aspect-ratio: 2 / 3;
  object-fit: cover;
}

#listItemsGrid.movie-grid .card-overlay{
  background: linear-gradient(to top, rgba(0,0,0,.96), rgba(0,0,0,.18));
}

#listItemsGrid.movie-grid .card-title{
  font-size: .92rem;
  line-height: 1.35;
}

#listItemsGrid.movie-grid:not(.is-hidden) .card{
  animation: listItemsReveal .34s ease both;
}

#listItemsGrid.movie-grid:not(.is-hidden) .card:nth-child(2n){
  animation-delay: .03s;
}

#listItemsGrid.movie-grid:not(.is-hidden) .card:nth-child(3n){
  animation-delay: .06s;
}

@keyframes listItemsReveal{
  from{
    opacity: 0;
    transform: translateY(10px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

.skeleton-card{
  pointer-events: none;
  overflow: hidden;
}

.skeleton-poster{
  width: 100%;
  height: 100%;
  border-radius: 12px;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0.04) 0%,
    rgba(255,255,255,0.10) 50%,
    rgba(255,255,255,0.04) 100%
  );
  background-size: 200% 100%;
  animation: skeletonShimmer 1.2s ease-in-out infinite;
}

/* =========================
   VOTOS ESTILO DETALHES
========================= */

.review-votes{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:12px;
  align-items:center;
  flex-wrap:wrap;
}

.rv-btn{
  display:flex;
  align-items:center;
  gap:6px;
  background:none;
  border:none;
  cursor:pointer;
  color:#aaa;
  font-weight:700;
  font-size:.92rem;
  transition: all .25s ease;
  padding: 4px 2px;
}

.rv-btn:hover{
  transform: translateY(-1px);
}

.rv-count{
  font-weight:900;
  color:#ddd;
  min-width: 10px;
}

.rv-icon{
  width:20px;
  height:20px;
  fill:transparent;
  stroke:#aaa;
  stroke-width:2;
  transition: all .25s ease;
}

.rv-btn:hover .rv-icon{
  stroke:#fff;
}

.rv-btn.active .rv-icon{
  fill:#ffd54a;
  stroke:#ffd54a;
  transform: scale(1.18);
}

.rv-btn.active{
  animation: likePop .25s ease;
}

@keyframes likePop{
  0%{ transform:scale(1); }
  50%{ transform:scale(1.18); }
  100%{ transform:scale(1); }
}

.community-comments-section {
  margin-top: 28px;
  width: 100%;
}

.community-comments-box {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 18px;
  padding: 18px;
  margin-bottom: 18px;
}

.community-comment-textarea {
  width: 100%;
  min-height: 110px;
  resize: vertical;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.12);
  background: #121212;
  color: #fff;
  padding: 14px;
  font-size: .95rem;
  outline: none;
}

.community-comment-actions {
  display: flex;
  gap: 10px;
  margin-top: 12px;
  flex-wrap: wrap;
}

.community-comment-status {
  margin-top: 10px;
  color: #aaa;
  font-size: .92rem;
}

.community-comments-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.community-comment-item {
  background: linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.025));
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 18px;
  padding: 14px;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.community-comment-item:hover{
  border-color: rgba(255,255,255,.09);
  box-shadow: 0 10px 25px rgba(0,0,0,.22);
}

.community-comment-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.community-comment-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #222;
  background-size: cover;
  background-position: center;
  flex: 0 0 auto;
}

.community-comment-user {
  color: #fff;
  font-weight: 700;
}

.community-comment-date {
  color: #999;
  font-size: .85rem;
}

.community-comment-body {
  color: #ddd;
  line-height: 1.55;
  white-space: pre-line;
}

#communityListCommentsList,
#communityReviewCommentsList{
  max-height: none;
  overflow: visible;
  padding-right: 0;
}

#communityListCommentsList::-webkit-scrollbar,
#communityReviewCommentsList::-webkit-scrollbar{
  display: none;
  width: 0;
}

#communityListCommentsList::-webkit-scrollbar-thumb,
#communityReviewCommentsList::-webkit-scrollbar-thumb{
  background: transparent;
}

#communityListCommentsList::-webkit-scrollbar-track,
#communityReviewCommentsList::-webkit-scrollbar-track{
  background: transparent;
}

/* =========================
   COMENTÁRIOS - BOTÕES / MODAL
========================= */

.review-toolbar{
  display:flex;
  justify-content:flex-start;
  margin-bottom:14px;
}

.review-open-btn{
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  color:#fff;
  padding: 10px 14px;
  border-radius: 12px;
  cursor:pointer;
  font-weight:800;
  transition: all .18s ease;
}

.review-open-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(255,230,0,.45);
  background: rgba(255,255,255,0.10);
}

.review-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
}

.review-btn{
  border: 0;
  border-radius: 12px;
  padding: 10px 16px;
  cursor: pointer;
  font-weight: 800;
  transition: all .18s ease;
}

.review-btn.save{
  background: var(--primary);
  color: #000;
}

.review-btn.save:hover{
  transform: translateY(-1px) scale(1.02);
  box-shadow: 0 0 18px rgba(255,255,255,.11);
}

.review-close{
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  cursor: pointer;
  font-weight: 900;
  font-size: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .18s ease;
}

.review-close:hover{
  background: rgba(255,255,255,.12);
  border-color: rgba(255,230,0,.35);
  transform: scale(1.04);
}

#composeCommentModal .modal-content.review-modal{
  width: min(760px, 94vw);
  max-width: none;
  text-align: left;
  border-radius: 18px;
  padding: 22px;
  background: #181818;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
}

#composeCommentModal .section-label{
  text-align: left;
  margin-bottom: 4px;
}

#composeCommentModal .review-box{
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 14px;
  margin-top: 14px;
}

#composeCommentModal .review-textarea{
  width: 100%;
  min-height: 130px;
  resize: vertical;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.12);
  background: #121212;
  color: #fff;
  padding: 14px;
  font-size: .96rem;
  outline: none;
  text-align: left;
}

#composeCommentModal .review-textarea:focus{
  border-color: rgba(255,230,0,.35);
  box-shadow: 0 0 0 3px rgba(255,255,255,.04);
}

#composeCommentModal .review-status{
  margin-top: 10px;
  color: #aaa;
  font-size: .92rem;
}

#composeCommentModal .review-status.is-error{
  color:#ff6b7a;
}

#composeCommentModal .search-comment-textarea{
  min-height: 130px;
  resize: vertical;
}

#composeCommentModal .index-comment-spoiler-check{
  display: flex;
  width: fit-content;
  margin: 14px auto 0 auto;
}

#composeCommentModal .index-comment-actions{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  gap: 10px;
  margin-top: 12px;
}

#composeCommentModal .index-comment-actions .index-comment-btn.primary{
  margin-left: auto;
}

.index-comment-media-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}

.index-comment-media-btn{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.045);
  color:#ffe600;
  border-radius:10px;
  padding:9px 12px;
  font-weight:900;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease;
}

.index-comment-media-btn:hover{
  background:rgba(255,255,255,.085);
  border-color:rgba(255,230,0,.42);
}

.index-comment-media-preview{
  margin-top:12px;
}

.index-comment-media-preview-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.index-comment-media-preview-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}

.index-comment-media-preview-card img,
.index-comment-media-preview-card video{
  width:58px;
  height:58px;
  object-fit:cover;
  border-radius:10px;
  background:#050505;
}

.index-comment-media-preview-card span{
  flex:1;
  color:#eee;
  font-weight:800;
  font-size:.86rem;
}

.index-comment-media-preview-card button{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:#ffe600;
  border-radius:10px;
  padding:8px 10px;
  font-weight:900;
  cursor:pointer;
}

.index-comment-btn{
  min-width: 104px;
  min-height: 40px;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 8px;
  background: rgba(255,255,255,0.06);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  padding: 10px 14px;
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.index-comment-btn:hover{
  transform: translateY(-1px);
  border-color: rgba(255,230,0,0.34);
  background: rgba(255,255,255,0.10);
}

.index-comment-btn.primary{
  border-color: rgba(255,230,0,0.55);
  background: #ffe600;
  color: #000;
}

#composeReviewModal{
  background: rgba(0, 0, 0, .78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  align-items: flex-start;
  overflow-y: auto;
  padding: 88px 0 24px;
}

#composeReviewModal .modal-content.review-modal{
  width: min(720px, 94vw);
  max-width: none;
  max-height: calc(100vh - 112px);
  overflow-y: auto;
  text-align: left;
  border-radius: 18px;
  padding: 18px 22px;
  background: linear-gradient(180deg, rgba(30,30,30,.98), rgba(20,20,20,.98));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 30px 90px rgba(0,0,0,.55);
  transform: translateY(22px) scale(.96);
  opacity: 0;
  transition: transform 240ms ease, opacity 240ms ease;
  will-change: transform, opacity;
}

#composeReviewModal.open .modal-content.review-modal{
  transform: translateY(0) scale(1);
  opacity: 1;
}

#editListModal .modal-content.review-modal{
  width: min(760px, 94vw);
  max-width: none;
  text-align: left;
  border-radius: 24px;
  padding: 26px;
}

#editListModal .compose-review-box{
  width: 100%;
}

#editListModal .compose-review-actions,
#composeReviewModal .compose-review-actions{
  justify-content: space-between;
  width: 100%;
}

#editListModal .compose-review-submit,
#composeReviewModal .compose-review-submit{
  margin-left: auto;
}

#editListModal .compose-review-cancel,
#composeReviewModal .compose-review-cancel{
  min-width: 104px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  color: #fff;
  box-shadow: none;
}

#editListModal .compose-review-cancel:hover,
#composeReviewModal .compose-review-cancel:hover{
  border-color: rgba(255,230,0,0.34);
  background: rgba(255,255,255,0.10);
}

.compose-review-head{
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  min-height: 36px;
}

.compose-review-head-copy{
  width: 100%;
  text-align: center;
}

.compose-review-kicker{
  margin: 0 0 4px;
  color: #ffd000;
  font-size: 1.28rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.compose-review-title{
  max-width: 620px;
  margin: 0 auto;
  color: #f5f5f5;
  font-size: .98rem;
  font-weight: 800;
  line-height: 1.35;
  text-wrap: balance;
}

.compose-review-close{
  position: absolute;
  top: 0;
  right: 0;
}

.compose-review-box{
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 12px;
  margin-top: 10px;
}

.compose-review-rating-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.compose-review-rating-label{
  color: #cfcfcf;
  font-weight: 700;
  font-size: .98rem;
}

.compose-review-rating-value{
  color: #ffd54a;
  font-weight: 900;
  font-size: 1.22rem;
}

.compose-review-textarea{
  height: 96px;
  min-height: 96px;
  max-height: 150px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.03);
  color: #fff;
  padding: 14px;
  font-size: .96rem;
  line-height: 1.5;
  resize: vertical;
}

.compose-review-textarea::placeholder{
  color: rgba(255,255,255,0.34);
}

.compose-review-textarea:focus{
  border-color: rgba(255,208,0,.35);
  box-shadow: 0 0 0 3px rgba(255,255,255,.04);
  outline: none;
}

.compose-review-options{
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.compose-review-check{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 196px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.04);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.compose-review-check:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.11);
  background: rgba(255,255,255,0.055);
}

.compose-review-check input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.compose-review-check-box{
  width: 22px;
  height: 22px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.04);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.compose-review-check-box::after{
  content: '';
  width: 10px;
  height: 6px;
  border-left: 2px solid #101010;
  border-bottom: 2px solid #101010;
  transform: rotate(-45deg) scale(0);
  transition: transform .18s ease;
}

.compose-review-check-text{
  color: #f1f1f1;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
}

.compose-review-check input:checked + .compose-review-check-box{
  background: #ffd000;
  border-color: #ffd000;
  box-shadow: 0 0 0 4px rgba(255,255,255,.06);
}

.compose-review-check input:checked + .compose-review-check-box::after{
  transform: rotate(-45deg) scale(1);
}

.compose-review-actions{
  justify-content: flex-start;
  margin-top: 10px;
}

.compose-review-submit{
  min-width: 140px;
  min-height: 48px;
  border-radius: 16px;
  font-size: 1rem;
  padding: 12px 20px;
}

.compose-review-status{
  margin-top: 14px;
  min-height: 1.25rem;
}

@keyframes skeletonShimmer{
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@media (max-width: 768px){
  .review-detail-card{
    grid-template-columns: 1fr;
  }

  .review-detail-card .review-media-link{
    position: static;
    justify-self: end;
    width: fit-content;
    margin-bottom: 6px;
  }

  .review-detail-card .review-detail-content{
    padding-right: 0;
  }

  .review-detail-poster{
    width:160px;
    height:240px;
  }
}

/* opcional: no mobile fica menor */
@media (max-width: 700px){
  .hero-arrow{
    width: 40px;
    height: 40px;
    font-size: 30px;
  }
  .hero-left{ left: 10px; }
  .hero-right{ right: 10px; }
}

/* Responsivo */
@media (max-width: 980px){
  .site-footer .footer-inner{
    grid-template-columns: 1fr;
  }
}

/* ===== Clamp de texto longo (comentários/reviews) ===== */

.clamp-text{
  white-space: pre-wrap;
  line-height: 1.55;
}

/* fechado em 5 linhas */
.clamp-text.is-clamped{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;
}

/* botão mostrar mais / menos */
.clamp-toggle{
  margin-top: 10px;
  display: none;
  align-items: center;
  gap: 6px;
  width: fit-content;

  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.06);
  color: #fff;
  border-radius: 999px;
  padding: 6px 12px;
  cursor: pointer;
  font-weight: 800;
  transition: .18s ease;
}

.clamp-toggle:hover{
  background: rgba(255,255,255,0.10);
  transform: translateY(-1px);
}

.clamp-toggle .chev{
  display: inline-block;
  transition: transform .18s ease;
}

.is-expanded .clamp-toggle .chev{
  transform: rotate(180deg);
}

.review-detail-card{
  position: relative;
}

.review-detail-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 90% 90%, rgba(255,255,255,.045), transparent 34%);
  pointer-events:none;
}

.review-detail-top-actions{
  position: relative;
  z-index: 50;
}

.review-detail-menu-btn{
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: #0b0b0b;
  color: #fff;
  font-size: 1.5rem;
  font-weight: 900;
  line-height: 1;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}

.review-detail-menu-btn:hover{
  background: #000;
  border-color: rgba(255,230,0,.35);
  transform: scale(1.05);
}

.review-detail-menu{
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 190px;
  background: #151515;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  padding: 8px;
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
  display: none;
}

.review-detail-menu.open{
  display: block;
}

.review-detail-menu-item{
  width: 100%;
  border: none;
  background: transparent;
  color: #fff;
  text-align: left;
  padding: 11px 12px;
  border-radius: 10px;
  cursor: pointer;
  font-size: .92rem;
  font-weight: 700;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}

.review-detail-menu-item:hover{
  background: rgba(255,255,255,.06);
  transform: none;
}

.review-detail-menu-item.danger{
  color: #ff7b7b;
}

.review-detail-menu-item.danger:hover{
  background: rgba(255,80,80,.10);
  color: #ff9b9b;
}

/* menção */

.mention-suggestions{
  margin-top:8px;
  background:#111;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:14px;
  max-height:220px;
  overflow-y:auto;
  box-shadow:0 14px 30px rgba(0,0,0,0.28);
}

.mention-item{
  width:100%;
  border:none;
  background:transparent;
  color:#fff;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  cursor:pointer;
  text-align:left;
}

.mention-item:hover,
.mention-item.active{
  background:rgba(255,255,255,.04);
}

.mention-avatar{
  width:36px;
  height:36px;
  border-radius:50%;
  background:#222;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  flex:0 0 36px;
}

.mention-avatar.no-img{
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
}

.mention-meta{
  min-width:0;
}

.mention-name{
  font-weight:700;
  font-size:14px;
}

.mention-code{
  font-size:12px;
  color:#999;
}

.comment-mention-link {
  color: #ffe600 !important;
  font-weight: 700;
  text-decoration: none;
}

.comment-mention-link:hover {
  text-decoration: underline;
}

/* comunidade e review */
.home-social-block {
  margin-top: 10px;
}

.home-community-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 10px;
}

.home-tierlists-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 10px;
  overflow: visible;
}

.home-tierlist-card{
  width:100%;
  min-width:0;
  min-height:326px;
  background:
    linear-gradient(180deg, rgba(22,22,22,.98) 0%, rgba(12,12,12,.99) 100%);
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  overflow:visible;
  cursor:pointer;
  position:relative;
  box-shadow: 0 18px 44px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.035);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.home-tierlist-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 90% 90%, rgba(255,255,255,.045), transparent 34%);
  pointer-events:none;
}

.home-tierlist-card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,230,0,.28);
  box-shadow:0 16px 40px rgba(0,0,0,.35);
}

.home-tierlist-card-top{
  position:relative;
  z-index:1;
  padding:16px 56px 12px 16px;
}

.home-tierlist-card-headline{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  margin-bottom:4px;
}

.home-tierlist-card-title{
  flex:1 1 auto;
  min-width:0;
  font-size:1.12rem;
  font-weight:900;
  color:#fff;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-tierlist-card-meta{
  color: rgba(255,255,255,.58);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 10px;
}

.home-tierlist-card-desc{
  color:#aaa;
  font-size:.92rem;
  line-height:1.5;
  min-height:42px;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}

.home-tierlist-preview{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:10px;
  padding:0 18px 18px;
}

.home-tierlist-preview-item{
  width:100%;
  aspect-ratio: 2 / 3;
  height:auto;
  border-radius:10px;
  overflow:hidden;
  background:#1a1a1a;
  border:1px solid rgba(255,255,255,.06);
  flex:0 0 auto;
}

.home-tierlist-preview-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.home-tierlist-preview-empty,
.home-tierlist-preview-extra{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  color:#666;
  font-weight:900;
  font-size:1.2rem;
}

.home-tierlist-card-bottom{
  position:relative;
  z-index:1;
  border-top:1px solid rgba(255,255,255,.06);
  padding:12px 16px 16px;
  color:#8e8e8e;
  font-size:.84rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  background:rgba(255,255,255,.015);
}

.home-tierlist-owner{
  max-width:45%;
  color:#d8d8d8;
  font-size:.84rem;
  font-weight:800;
}

.home-tierlist-owner:hover{
  color:#ffe600;
}

.home-tierlist-footer-stats{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-weight:900;
  flex-shrink:0;
}

.home-tierlist-footer-stat{
  appearance:none;
  -webkit-appearance:none;
  border:0;
  background:transparent;
  padding:0;
  display:inline-flex;
  align-items:center;
  gap:5px;
  line-height:1;
  font:inherit;
  font-weight:900;
  cursor:pointer;
  transition:transform .18s ease, filter .18s ease;
}

.home-tierlist-footer-stat:hover{
  transform:translateY(-1px);
  filter:brightness(1.15);
}

.home-tierlist-footer-stat svg{
  width:14px;
  height:14px;
  display:block;
  color:currentColor;
}

.home-tierlist-footer-stat svg path{
  fill:currentColor;
  stroke:currentColor;
  stroke-width:1.8;
}

.home-tierlist-like-stat{
  color:#ff4d5f;
}

.home-tierlist-like-stat svg path{
  fill:transparent;
  stroke:#ff4d5f;
}

.home-tierlist-like-stat.active svg path{
  fill:#ff4d5f;
  stroke:#ff4d5f;
}

.home-tierlist-comment-stat{
  color:#f1f1f1;
}

.home-tierlist-comment-stat svg,
.home-tierlist-comment-stat svg path{
  fill:transparent;
  stroke:rgba(255,255,255,.82);
  stroke-width:1.9;
}

.home-tierlist-save-stat{
  color:#ffe600;
}

.home-tierlist-save-stat svg path{
  fill:transparent;
  stroke:#ffe600;
}

.home-tierlist-save-stat.active svg path{
  fill:#ffe600;
  stroke:#ffe600;
}

.home-tierlist-actions .home-tierlist-more-btn{
  width:38px;
  height:38px;
}

.home-tierlist-actions-menu .home-tierlist-menu-like .menu-like-icon{
  color:#ff4d5f;
}

.home-tierlist-actions-menu .home-tierlist-menu-like .menu-like-icon path{
  fill:transparent;
  stroke:#ff4d5f;
}

.home-tierlist-actions-menu .home-tierlist-menu-like.active{
  color:#ff4d5f;
  background:rgba(255,77,79,.12);
}

.home-tierlist-actions-menu .home-tierlist-menu-like.active .menu-like-icon path{
  fill:#ff4d5f;
  stroke:#ff4d5f;
}

.home-mini-card {
  width: 100%;
  min-width: 0;
  min-height: 220px;
  background: linear-gradient(180deg, rgba(18,18,18,.96), rgba(9,9,9,.98));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px;
  overflow: hidden;
  cursor: pointer;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.home-mini-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255,230,0,.35);
  box-shadow: 0 12px 26px rgba(0,0,0,.35);
}

.home-mini-cover {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 14px;
  padding: 14px;
  align-items: start;
}

.home-mini-poster {
  width: 96px;
  height: 140px;
  border-radius: 14px;
  overflow: hidden;
  background: #1b1b1b;
  flex-shrink: 0;
  position: relative;
}

.home-mini-poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.community-review-poster{
  position: relative;
}

.home-review-rating-badge{
  position: absolute;
  left: 7px;
  bottom: 7px;
  z-index: 2;
  max-width: calc(100% - 14px);
  padding: 4px 7px;
  border-radius: 8px;
  background: rgba(0,0,0,.72);
  border: 1px solid rgba(255,230,0,.38);
  color: #ffe600;
  font-size: .72rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  box-shadow: 0 8px 18px rgba(0,0,0,.35);
}

.home-list-grid4 {
  width: 96px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  flex-shrink: 0;
}

.home-list-grid4 .slot {
  width: 100%;
  aspect-ratio: 2 / 3;
  border-radius: 10px;
  overflow: hidden;
  background: #1b1b1b;
}

.home-list-grid4 .slot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.home-mini-content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.home-mini-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.11);
  color: #ffe600;
  font-size: .75rem;
  font-weight: 800;
  margin-bottom: 10px;
}

.home-mini-title {
  color: #fff;
  font-size: 1.02rem;
  font-weight: 800;
  line-height: 1.3;
  margin-bottom: 8px;
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.home-mini-text {
  color: #b8b8b8;
  font-size: .88rem;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}

.home-mini-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 0 14px 14px;
  color: #8f8f8f;
  font-size: .8rem;
  font-weight: 700;
}

.home-mini-footer span {
  min-width: 0;
}

.home-mini-footer span:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.page-loader {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(5, 5, 5, 0.82);
  backdrop-filter: blur(4px);
  display: none;
  align-items: center;
  justify-content: center;
}

.page-loader.show {
  display: flex !important;
}

.page-loader-spinner {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 4px solid rgba(255,255,255,.15);
  border-top-color: #ffe600;
  animation: tramaSpin .8s linear infinite;
}

.review-detail-actions-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:16px;
  flex-wrap:wrap;
}

.review-back-btn{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:#fff;
  padding:10px 16px;
  border-radius:999px;
  cursor:pointer;
  font-weight:800;
  font-size:.92rem;
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}

.review-back-btn:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.10);
  border-color:rgba(255,230,0,.35);
  color:#ffe600;
}

.review-media-link{
  text-decoration:none;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(255,255,255,.04);
  color:#ffe600;
  padding:10px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:.9rem;
  display:inline-flex;
  align-items:center;
  gap:8px;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}

.review-media-link:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.07);
  border-color:rgba(255,230,0,.38);
  color:#fff07a;
}

.review-media-link:visited{
  color:#ffe600;
}

.review-detail-card .review-detail-content{
  min-height: 270px;
  padding-right: 0;
  display: flex;
  flex-direction: column;
}

.review-detail-owner-row{
  margin-bottom: 0;
}

.review-detail-owner-line{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
}

.review-detail-top-links{
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  margin-left: auto;
}

.review-detail-top-links .review-detail-top-actions{
  margin-bottom: 0;
  flex: 0 0 auto;
}

.review-detail-top-links .review-detail-menu-btn{
  width: 36px;
  height: 36px;
  font-size: 1.35rem;
}

.review-detail-meta-row{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
  padding-right: 0;
  color: rgba(255,255,255,.62);
}

.review-detail-owner-stack{
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
}

.review-detail-owner-stack .list-detail-owner,
.review-detail-owner-stack .list-detail-owner-text{
  max-width: 100%;
}

.review-detail-inline-rating{
  color: rgba(255,230,0,.86);
  font-size: .84rem;
  font-weight: 850;
  line-height: 1.2;
  white-space: nowrap;
}

.review-detail-menu-media-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  color:#ffe600;
  flex:0 0 16px;
}

.review-detail-menu-media-icon svg{
  width:16px;
  height:16px;
  display:block;
}

.review-detail-menu-media-icon svg path{
  fill:currentColor;
  stroke:currentColor;
  stroke-width:1.1;
}

#reviewDetailsView .review-detail-menu-btn{
  background:#0b0b0b;
}

#reviewDetailsView .review-detail-menu-btn:hover{
  background:#000;
}

#listDetailHero .review-detail-menu-btn{
  background:#0b0b0b;
}

#listDetailHero .review-detail-menu-btn:hover{
  background:#000;
}

.review-detail-card .list-detail-date{
  color: rgba(255,255,255,.42);
  font-weight: 700;
}

.review-detail-rating-badge{
  left: 10px;
  bottom: 10px;
  padding: 6px 9px;
  font-size: .82rem;
}

.review-detail-poster-link{
  display: block;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.review-detail-poster-link:hover{
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(0,0,0,.42);
  }

  .review-detail-title-link{
    color: inherit;
    text-decoration: none;
    transition: color .18s ease, text-shadow .18s ease;
  }

  .review-detail-title-link:hover,
  .review-detail-title-link:focus-visible{
    color: var(--trama-yellow, #ffe600);
    text-shadow: 0 0 18px rgba(255,255,255,.11);
    outline: none;
  }

.review-detail-card .review-detail-text{
  flex: 1 1 auto;
}

.review-detail-card .review-detail-social-actions{
  margin: auto 0 0;
  padding-top: 18px;
}

#reviewDetailsView .review-detail-actions-top .review-detail-menu-row{
  position: relative;
  top: auto;
  right: auto;
  z-index: 50;
  margin-bottom: 0;
  align-self: center;
}

@media (max-width: 768px){
  .review-detail-card .review-media-link{
    position: static;
    justify-self: end;
    width: fit-content;
    margin-bottom: 6px;
  }

  .review-detail-card .review-detail-content{
    min-height: 0;
    padding-right: 0;
  }
}

.community-list-like-inline{
  appearance:none;
  -webkit-appearance:none;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#d8d8d8;
  border-radius:999px;
  padding:6px 10px;
  cursor:pointer;
  font-size:.8rem;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  gap:6px;
  transition:all .18s ease;
}

.community-list-like-inline:hover{
  transform:translateY(-1px);
  border-color:rgba(255,230,0,.35);
  color:#ffe600;
  background:rgba(255,255,255,.04);
}

.community-list-like-inline.active{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,230,0,.38);
  color:#ffe600;
}

.community-list-like-inline .list-like-count{
  font-weight:900;
  min-width:10px;
}

.review-detail-top-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  margin-bottom:12px;
  position:relative;
  z-index:40;
}

.review-detail-menu-btn,
.comment-actions-btn{
  appearance:none;
  -webkit-appearance:none;
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:#fff;
  font-size:1.2rem;
  font-weight:900;
  cursor:pointer;
  display:grid;
  place-items:center;
  transition:all .18s ease;
}

.review-detail-menu-btn:hover,
.comment-actions-btn:hover{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,230,0,.35);
  color:#ffe600;
}

.review-detail-menu-btn.open,
.comment-actions-wrap.open .comment-actions-btn{
  background:rgba(0,0,0,.62);
  border-color:rgba(255,230,0,.55);
  color:#ffe600;
}

.review-detail-menu,
.comment-actions-menu{
  position:absolute;
  top:46px;
  right:0;
  min-width:190px;
  width:230px;
  background:#111;
  border:1px solid rgba(255,255,255,.09);
  border-radius:14px;
  box-shadow:0 14px 34px rgba(0,0,0,.35);
  padding:7px;
  display:flex;
  flex-direction:column;
  gap:6px;
  z-index:60;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(12px) scale(.98);
  transform-origin:top right;
  transition:opacity .18s ease, transform .22s cubic-bezier(.22,1,.36,1), visibility .18s ease;
}

.review-detail-menu.open,
.comment-actions-menu.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}

.review-detail-menu-item,
.comment-actions-item{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  text-align:left;
  border:none;
  background:transparent;
  color:#f1f1f1;
  padding:10px 12px;
  border-radius:10px;
  cursor:pointer;
  font-weight:700;
  transition:background .18s ease, color .18s ease;
}

.review-detail-menu-item:hover,
.comment-actions-item:hover{
  background:rgba(255,255,255,.08);
}

.comment-actions-item.danger{
  color:#ff7c7c;
}

.comment-actions-item.danger:hover{
  background:rgba(255,80,80,.12);
  color:#ff7c7c;
}

.comment-delete-btn{
  color:#ff7c7c;
}

.review-detail-menu-item.danger:hover{
  background:rgba(255,80,80,.12);
  color:#ff7c7c;
}

.comment-actions-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
}

.community-comment-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.review-card-actions{
  position:absolute;
  top:12px;
  right:12px;
  z-index:30;
}

.community-comments-list{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-top:14px;
}

.community-comment-item{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px;
  padding:14px;
}

.community-comment-row{
  display:flex;
  align-items:flex-start;
  gap:12px;
}

.community-comment-avatar{
  width:42px;
  height:42px;
  min-width:42px;
  border:none;
  background:transparent;
  padding:0;
  border-radius:50%;
  overflow:hidden;
  cursor:pointer;
  display:grid;
  place-items:center;
}

.community-comment-avatar-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:50%;
}

.community-comment-avatar-fallback{
  width:100%;
  height:100%;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.06);
  color:#ffe600;
  font-weight:900;
  font-size:.95rem;
}

.community-comment-main{
  flex:1;
  min-width:0;
}

.community-comment-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:6px;
}

.community-comment-user-wrap{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.community-comment-author{
  border:none;
  background:none;
  padding:0;
  margin:0;
  color:#fff;
  font-weight:800;
  font-size:.95rem;
  cursor:pointer;
  text-align:left;
}

.community-comment-author:hover{
  color:#ffe600;
}

.community-comment-date{
  color:#9a9a9a;
  font-size:.78rem;
}

.community-comment-text{
  color:#e7e7e7;
  line-height:1.65;
  word-break:break-word;
}

.index-comment-media-open{
  border:0;
  padding:0;
  background:transparent;
  display:block;
  cursor:zoom-in;
  max-width:100%;
  width:100%;
  height:100%;
}

.index-comment-media-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  margin-top:10px;
  max-width:min(500px,100%);
}

.index-comment-media-grid.count-1{
  grid-template-columns:minmax(0, 1fr);
  max-width:min(220px,100%);
  height:min(220px, 42vw);
}

.index-comment-media-grid.count-2{
  max-width:min(460px,100%);
  height:min(220px, 42vw);
}

.index-comment-media-grid.count-4{
  max-width:min(460px,100%);
  grid-template-columns:repeat(2, minmax(0, 1fr));
  grid-template-rows:repeat(2, minmax(0, 1fr));
  height:min(220px, 42vw);
}

.index-comment-media-grid.count-3{
  grid-template-columns:minmax(0, .88fr) minmax(0, 220px);
  grid-template-rows:repeat(2, minmax(0, 1fr));
  max-width:min(460px,100%);
  height:min(220px, 42vw);
  align-items:stretch;
  column-gap:20px;
  row-gap:12px;
}

.index-comment-media-grid.count-3 .index-comment-media-cell:first-child{
  grid-row:1 / span 2;
  grid-column:1;
}

.index-comment-media-grid.count-3 .index-comment-media-cell:nth-child(2){
  grid-column:2;
  grid-row:1;
  margin-left:44px;
}

.index-comment-media-grid.count-3 .index-comment-media-cell:nth-child(3){
  grid-column:2;
  grid-row:2;
  margin-left:44px;
}

.index-comment-media-grid.count-3 .index-comment-media-cell{
  height:100%;
  min-height:0;
}

.index-comment-media-grid.count-1 .index-comment-media-cell,
.index-comment-media-grid.count-2 .index-comment-media-cell,
.index-comment-media-grid.count-4 .index-comment-media-cell{
  height:100%;
  min-height:0;
  aspect-ratio:auto;
}

.index-comment-media-cell{
  position:relative;
  aspect-ratio:1 / 1;
  overflow:hidden;
  border-radius:14px;
  background:#050505;
  box-shadow:0 0 0 1px rgba(255,255,255,.09);
}

.index-comment-media-img,
.index-comment-media-video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:14px;
  background:#050505;
}

.index-comment-media-video{
  margin-top:0;
}

.index-gif-modal,
.index-media-lightbox{
  position:fixed;
  inset:0;
  z-index:12000;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.82);
  backdrop-filter:blur(8px);
  padding:24px;
  box-sizing:border-box;
}

.index-gif-modal.open,
.index-media-lightbox.open{
  display:flex;
}

.index-gif-panel{
  width:min(680px,calc(100vw - 28px));
  max-height:min(760px,calc(100vh - 28px));
  border:1px solid rgba(255,230,0,.28);
  border-radius:22px;
  background:#101010;
  padding:16px;
  box-shadow:0 24px 80px rgba(0,0,0,.6);
}

.index-gif-head,
.index-gif-search{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}

.index-gif-head{
  justify-content:space-between;
  color:#fff;
}

.index-gif-head button,
.index-gif-search button{
  border:0;
  border-radius:10px;
  background:#ffe600;
  color:#000;
  font-weight:900;
  padding:9px 12px;
  cursor:pointer;
}

.index-gif-search input{
  flex:1;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:#070707;
  color:#fff;
  padding:11px 12px;
  outline:none;
}

.index-gif-status{
  min-height:20px;
  color:#aaa;
  font-size:.85rem;
}

.index-gif-results{
  max-height:520px;
  overflow-y:auto;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(120px,1fr));
  gap:10px;
}

.index-gif-card{
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  overflow:hidden;
  padding:0;
  cursor:pointer;
}

.index-gif-card img{
  width:100%;
  height:112px;
  object-fit:cover;
  display:block;
}

.index-media-lightbox img{
  max-width:min(82vw,900px);
  max-height:72vh;
  object-fit:contain;
  border-radius:18px;
  box-shadow:0 20px 80px rgba(0,0,0,.7);
}

.index-media-lightbox-close{
  position:fixed;
  top:20px;
  right:20px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(0,0,0,.55);
  color:#fff;
  width:42px;
  height:42px;
  cursor:pointer;
}

.comment-mention-link{
  color:#ffe600;
  text-decoration:none;
  font-weight:700;
}

.comment-mention-link:hover{
  text-decoration:underline;
}

.comment-actions-item.danger:hover{
  background: rgba(255, 80, 80, .12);
  color: #ff7c7c;
}

.home-mini-footer span:first-child {
  white-space: normal;
  line-height: 1.4;
}

.comment-spoiler-badge,
.review-spoiler-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 8px 0 10px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255, 196, 0, 0.35);
  color: #ffd54a;
  font-size: 0.85rem;
  font-weight: 700;
}

.spoiler-toggle-btn {
  appearance: none;
  border: 1px solid rgba(255, 230, 0, 0.28);
  background: rgba(255,255,255,.05);
  color: #ffe600;
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 0.84rem;
  font-weight: 800;
  cursor: pointer;
  transition: .18s ease;
  margin: 0 0 10px 0;
}

.spoiler-toggle-btn:hover {
  background: rgba(255,255,255,.09);
  transform: translateY(-1px);
}

.spoiler-toggle-btn.is-revealed {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.18);
  color: #fff;
}

.spoiler-hidden {
  filter: blur(7px);
  user-select: none;
  transition: filter .18s ease, opacity .18s ease;
}

.spoiler-hidden * {
  user-select: none;
}

.spoiler-revealed {
  filter: blur(0);
  user-select: text;
}


/* =========================================================
   CATÁLOGO: Filmes e Séries
   20 posters por página = 4 linhas x 5 colunas
   sem afetar a Home
========================================================= */

#mainGrid{
  width: 100%;
}

/* aplica só quando NÃO está na home */
:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid.grid{
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
}

/* posters menores nas abas Filmes e Séries */
:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card{
  width: 100%;
  max-width: 170px;
  justify-self: center;
  border-radius: 14px;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card.catalog-card-enter{
  opacity: 0;
  transform: translateY(16px) scale(.985);
  transition:
    opacity .38s cubic-bezier(.22,.61,.36,1),
    transform .46s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--catalog-card-delay, 0ms);
  will-change: transform, opacity;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card.catalog-card-enter.catalog-card-visible{
  opacity: 1;
  transform: translateY(0) scale(1);
  will-change: auto;
}


:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card-title{
  font-size: .95rem;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .icon-action{
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  font-size: 1rem;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card-more-menu{
  min-width: 190px;
  right: -6px;
}

/* paginação abaixo do grid */
.catalog-footer-controls{
  margin-top: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  min-height: 56px;
}

.catalog-page-btn{
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: #fff;
  font-size: 1.8rem;
  font-weight: 900;
  cursor: pointer;
  transition: .2s ease;
}

.catalog-page-btn:hover:not(:disabled){
  transform: scale(1.06);
  border-color: rgba(255,230,0,.45);
  background: rgba(255,255,255,.1);
}

.catalog-page-btn:disabled{
  opacity: .35;
  cursor: not-allowed;
}

.catalog-page-status{
  min-width: 150px;
  text-align: center;
  color: #ccc;
  font-weight: 700;
  letter-spacing: .2px;
}


.card-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:12px;
  position: relative;
  z-index: 20;
}

.icon-action{
  appearance:none;
  -webkit-appearance:none;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:
    transform .18s ease,
    background .18s ease,
    border-color .18s ease,
    color .18s ease,
    box-shadow .18s ease;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(0,0,0,.24);
}

.icon-action:hover{
  background: rgba(255,255,255,0.18);
  border-color: rgba(255,230,0,0.38);
  transform: translateY(-1px) scale(1.05);
  color:#fff;
}

.icon-action.active-eye{
  background: rgba(0,229,255,0.22);
  color: #9ff6ff;
  border-color: rgba(0,229,255,0.50);
}

.icon-action.active-love{
  background: rgba(255,0,85,0.22);
  color: #ff9cbc;
  border-color: rgba(255,0,85,0.48);
}

.icon-watch,
.icon-fav,
.icon-more{
  display:flex;
  align-items:center;
  justify-content:center;
}

.icon-watch{
  font-size: 1rem;
}

.icon-fav{
  font-size: 1rem;
}

.icon-more{
  font-size: 1.08rem;
  letter-spacing: 0;
  font-weight: 900;
}

/* wrapper do botão ... */
.card-more-wrap{
  position: relative;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 50;
}



.card-more-menu.open{
  display: block;
  animation: cardMenuIn .16s ease;
}

.card-more-item{
  width: 100%;
  border: none;
  background: transparent;
  color: #fff;
  text-align: left;
  padding: 11px 12px;
  border-radius: 10px;
  cursor: pointer;
  font-size: .92rem;
  font-weight: 700;
  transition: background .18s ease, transform .18s ease, color .18s ease;
}

.card-more-item:hover{
  background: rgba(255,255,255,0.07);
  transform: translateX(2px);
}

.card{
  background: var(--bg-card);
  border-radius: 14px;
  overflow: visible;
  position: relative;
  aspect-ratio: 2/3;
  cursor: pointer;
  transition: .3s;
  isolation: isolate;
  z-index: 1;
}

.card:hover,
.card.card-menu-open{
  transform: translateY(-10px);
  z-index: 80;
  box-shadow: 0 15px 30px rgba(0, 0, 0, .5);
}

.card:hover img,
.card.card-menu-open img{
  opacity: .3;
  filter: blur(2px);
}




.card-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:12px;
  position: relative;
  z-index: 30;
}

.icon-action{
  appearance:none;
  -webkit-appearance:none;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:
    transform .18s ease,
    background .18s ease,
    border-color .18s ease,
    color .18s ease,
    box-shadow .18s ease;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(0,0,0,.24);
  position: relative;
  z-index: 35;
}

.icon-more{
  font-size: 1.15rem;
  font-weight: 900;
}

.card-more-wrap{
  position: relative;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index: 200;
}

/* =========================================================
   NOVO CARD FIXO COM AÇÕES EMBAIXO
========================================================= */

.card{
  background: #111;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 18px;
  overflow: visible;
  position: relative;
  aspect-ratio: auto;
  cursor: default;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  box-shadow: 0 10px 24px rgba(0,0,0,.20);
}

.card:hover{
  transform: translateY(-4px);
  border-color: rgba(255,255,255,.11);
  box-shadow: 0 16px 32px rgba(0,0,0,.30);
}

.card.card-menu-open{
  z-index: 9999;
}

.card-media{
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 3;
  border-radius: 16px 16px 0 0;
  overflow: hidden;
  cursor: pointer;
  background: #0d0d0d;
}

.card-media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 1;
  filter: none;
  transition: transform .25s ease;
}

.card-media:hover img{
  transform: scale(1.03);
}

.card-footer{
  padding: 12px 12px 14px;
  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border-top: 1px solid rgba(255,255,255,0.05);
  border-radius: 0 0 18px 18px;
}

.card-title-static{
  color: #fff;
  font-size: .95rem;
  font-weight: 800;
  line-height: 1.3;
  min-height: 2.5em;
  margin-bottom: 12px;
  cursor: pointer;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.card-title-static:hover{
  color: #ffe600;
}

.card-actions{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  position: relative;
}

.icon-action{
  appearance: none;
  -webkit-appearance: none;
  width: 40px;
  height: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform .16s ease, background .16s ease, border-color .16s ease, color .16s ease;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1;
}

.icon-watch{
  color: #26c6ff;
  border-color: rgba(38,198,255,0.32);
}

.icon-fav{
  color: #ff4d5f;
  border-color: rgba(255,77,95,0.32);
}

.card-action-svg{
  width: 19px;
  height: 19px;
  display: block;
}

.card-action-svg path,
.card-action-svg circle{
  fill: transparent;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: fill .16s ease, stroke .16s ease;
}

.icon-action:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,230,0,0.35);
}

.icon-watch:hover{
  background: rgba(38,198,255,0.13);
  border-color: rgba(38,198,255,0.58);
  color: #5ed9ff;
}

.icon-fav:hover{
  background: rgba(255,77,95,0.13);
  border-color: rgba(255,77,95,0.58);
  color: #ff6d7c;
}

.icon-action.active-eye{
  background: #148fd1;
  color: #8fe8ff;
  border-color: rgba(94,217,255,0.88);
  box-shadow: 0 10px 22px rgba(20,143,209,0.34);
}

.icon-action.active-love{
  background: #e7354c;
  color: #fff;
  border-color: rgba(255,109,124,0.9);
  box-shadow: 0 10px 22px rgba(231,53,76,0.34);
}

.icon-action.active-eye .card-action-eye path,
.icon-action.active-eye .card-action-eye circle,
.icon-action.active-love .card-action-heart path{
  fill: currentColor;
  stroke: currentColor;
}

.icon-action.active-eye .card-action-eye path{
  fill: rgba(143,232,255,0.28);
  stroke: #8fe8ff;
}

.icon-action.active-eye .card-action-eye circle{
  fill: #e6fbff;
  stroke: #e6fbff;
}

.icon-more{
  font-size: 1.2rem;
  font-weight: 900;
}

.card-more-wrap{
  position: relative;
  z-index: 20;
}

.card-more-menu{
  position: absolute;
  left: 50%;
  bottom: calc(100% + 12px);
  min-width: 190px;
  background: #151515;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
  padding: 8px;
  display: none;
  z-index: 99999;
  box-shadow: 0 18px 40px rgba(0,0,0,.45);

  transform: translateX(-50%) translateY(8px) scale(.98);
  transform-origin: bottom center;
  opacity: 0;
  pointer-events: none;
}

.card-more-menu::after{
  content: "";
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translateX(-50%);
  width: 10px;
  height: 10px;
  background: #151515;
  border-right: 1px solid rgba(255,255,255,0.10);
  border-bottom: 1px solid rgba(255,255,255,0.10);
  rotate: 45deg;
  margin-top: -5px;
}

.card-more-menu.open{
  display: block;
  opacity: 1;
  pointer-events: auto;
  animation: menuDotsUpDown .18s ease forwards;
}

@keyframes menuDotsUpDown{
  0%{
    opacity: 0;
    transform: translateX(-50%) translateY(8px) scale(.98);
  }
  100%{
    opacity: 1;
    transform: translateX(-50%) translateY(0) scale(1);
  }
}

.card-more-item{
  width: 100%;
  border: none;
  background: transparent;
  color: #fff;
  text-align: left;
  padding: 11px 12px;
  border-radius: 10px;
  cursor: pointer;
  font-size: .92rem;
  font-weight: 700;
  transition: background .18s ease, transform .18s ease;
}

.card-more-item:hover{
  background: rgba(255,255,255,0.06);
  transform: translateX(2px);
}

.card-more-rate-icon{
  color: #ffe600;
}

.card-rating-line{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 8px;
}

.card-global-rating{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #ffe600;
  font-size: .88rem;
  font-weight: 900;
  line-height: 1;
}

/* =========================
   SHARE MODAL
========================= */

.share-detail-modal{
  width: min(680px, 94vw);
  max-width: none;
  text-align: left;
  border-radius: 18px;
  padding: 22px;
  background: #181818;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
}

#shareDetailModal.open .share-detail-modal{
  transform: translateY(0) scale(1);
  opacity: 1;
}

.share-detail-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.share-detail-head h3{
  margin:0 0 6px;
  color:#ffe600;
  font-size:1.35rem;
  font-weight:950;
}

.share-detail-head p{
  margin:0;
  color:rgba(255,255,255,.68);
  font-size:.92rem;
  font-weight:700;
}

#shareDetailModal .review-close{
  position:static;
  top:auto;
  right:auto;
  flex:0 0 40px;
  width:40px;
  height:40px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
  color:#fff;
  cursor:pointer;
  font-size:1.15rem;
  font-weight:900;
}

#shareDetailModal .review-close:hover{
  border-color:rgba(255,230,0,.42);
  color:#ffe600;
}

.share-detail-copy-row{
  display:flex;
  gap:10px;
  align-items:stretch;
  margin-bottom:8px;
}

.share-detail-input{
  flex:1;
  min-width:0;
  height:44px;
  box-sizing:border-box;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.12);
  background:#121212;
  color:#fff;
  padding:12px 14px;
  font-size:.95rem;
  outline:none;
  margin:0;
}

.share-copy-btn{
  min-width:76px;
  height:44px;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:#fff;
  padding:12px 14px;
  border-radius:8px;
  cursor:pointer;
  font-weight:850;
  transition:all .18s ease;
  white-space:nowrap;
}

.share-copy-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(255,230,0,.35);
  background:rgba(255,255,255,.10);
  color:#ffe600;
}

.tierlist-share-status{
  min-height:18px;
  margin:0 0 10px;
  color:#ffe600;
  font-size:.82rem;
  font-weight:800;
}

.share-friends-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  max-height:320px;
  overflow-y:auto;
  padding-right:6px;
}

.share-friends-list::-webkit-scrollbar{
  width:8px;
}

.share-friends-list::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.18);
  border-radius:999px;
}

.share-friends-list::-webkit-scrollbar-track{
  background:rgba(255,255,255,.04);
  border-radius:999px;
}

.share-friend-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border-radius:8px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
}

.share-friend-left{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.share-friend-avatar{
  width:38px;
  height:38px;
  border-radius:50%;
  background:#2b2b2b center/cover no-repeat;
  border:1px solid rgba(255,255,255,.12);
  flex:0 0 38px;
}

.share-friend-meta{
  min-width:0;
}

.share-friend-name{
  color:#fff;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.share-friend-code{
  color:rgba(255,255,255,.48);
  font-size:.78rem;
  font-weight:800;
}

.share-friend-send-btn{
  border:0;
  background:#ffe600;
  color:#111;
  padding:9px 13px;
  border-radius:8px;
  cursor:pointer;
  font-weight:950;
  transition:all .18s ease;
}

.share-friend-send-btn:hover{
  transform:translateY(-1px);
  filter:brightness(1.03);
}

.share-friend-send-btn:disabled{
  opacity:.55;
  cursor:wait;
}

/* =========================
   HOVER STATS DENTRO DO POSTER
========================= */

.card-media{
  position: relative;
  overflow: hidden;
}

.card-hover-stats{
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 10px;
  padding: 16px 14px;
  background: rgba(80, 80, 80, 0.42);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
}

.card:hover .card-hover-stats,
#homeSections .hs-track .card:hover .card-hover-stats{
  opacity: 1;
}

.card-hover-stat{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,0.46);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: 0 6px 18px rgba(0,0,0,0.22);
}

.card-hover-stat-icon{
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 16px;
}

.card-stat-svg{
  width: 16px;
  height: 16px;
  display: block;
  fill: currentColor;
}

.card-hover-stat-text{
  color: #fff;
  font-size: .85rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .1px;
}

.card-hover-stat-rating{
  color: #ffd84d;
}

.card-hover-stat-review{
  color: #ffffff;
}

.card-hover-stat-fav{
  color: #ff7b96;
}

.card-hover-stats{
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 14px;
  padding: 18px 16px;
  background: rgba(80, 80, 80, 0.42);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
}

.card-hover-stat{
  width: min(88%, 124px);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(0,0,0,0.52);
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: 0 8px 22px rgba(0,0,0,0.26);
  text-align: center;
}

.card-hover-stat-icon{
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 22px;
}

.card-stat-svg{
  width: 22px;
  height: 22px;
  display: block;
  fill: currentColor;
}

.card-hover-stat-text{
  color: #fff;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .15px;
  min-width: 38px;
  text-align: center;
}

.card-hover-stat-rating .card-stat-svg{
  filter: drop-shadow(0 0 8px rgba(255,216,77,.28));
}

.card-hover-stat-fav .card-stat-svg{
  filter: drop-shadow(0 0 8px rgba(255,123,150,.18));
}

/* garante que o overlay apareça limpo no home também */
#homeSections .hs-track .card .card-media img{
  transition: transform .25s ease, opacity .25s ease;
}

#homeSections .hs-track .card:hover .card-media img{
  opacity: .78;
}



@media (max-width: 640px){
  .share-detail-copy-row{
    flex-direction:column;
    align-items:stretch;
  }

  .share-friend-row{
    flex-direction:column;
    align-items:stretch;
  }

  .share-friend-send-btn{
    width:100%;
  }
}

@keyframes cardMenuIn{
  from{
    opacity: 0;
    transform: translateY(6px) scale(.98);
  }
  to{
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* responsivo */
@media (max-width: 1200px){
  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid.grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 900px){
  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid.grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card{
    max-width: 160px;
  }
}

@media (max-width: 640px){
  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid.grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }

  .catalog-footer-controls{
    gap: 12px;
  }

  .catalog-page-status{
    min-width: auto;
    font-size: .9rem;
  }
}

@keyframes tramaSpin {
  to { transform: rotate(360deg); }
}

@media (max-width: 1100px) {
  .home-community-grid,
  .home-tierlists-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .home-community-grid,
  .home-tierlists-grid {
    grid-template-columns: 1fr;
  }

  .home-mini-cover {
    grid-template-columns: 86px 1fr;
  }

  .home-mini-poster {
    width: 86px;
    height: 128px;
  }

  .home-list-grid4 {
    width: 86px;
  }

  .home-tierlist-preview-item{
    width:100%;
    height:auto;
  }

  .home-tierlist-card-headline,
  .home-tierlist-card-bottom{
    align-items:flex-start;
    flex-direction:column;
  }

  .home-tierlist-card-badges,
  .home-tierlist-owner{
    max-width:100%;
  }
}

/* =========================================================
   Ajustes solicitados: catálogo e hero principal
========================================================= */

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid.grid{
  width: min(100%, 980px);
  margin: 0 auto;
  grid-template-columns: repeat(5, 160px);
  justify-content: center;
  gap: 18px 16px;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card{
  max-width: 160px;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card-footer{
  padding: 10px 10px 12px;
}

:is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card-actions{
  gap: 8px;
}

body.is-home .hero{
  min-height: clamp(520px, 74vh, 760px);
  max-height: none;
  align-items: center;
  justify-content: center;
  padding: 118px 5% 56px;
  overflow: visible;
}

body.is-home .hero::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(5,5,5,.45), var(--bg-deep) 92%);
  z-index: 0;
  pointer-events: none;
}

body.is-home .hero-layer{
  inset: auto;
  width: min(1180px, calc(100% - 72px));
  height: min(680px, 74vh);
  left: 50%;
  top: 112px;
  transform: translateX(-50%);
  border-radius: 18px;
  background-position: center;
  box-shadow: 0 28px 90px rgba(0,0,0,.72);
  overflow: hidden;
}

body.is-home .hero-overlay{
  inset: auto;
  width: min(1220px, calc(100% - 48px));
  height: min(720px, 78vh);
  left: 50%;
  top: 102px;
  transform: translateX(-50%);
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(90deg, rgba(0,0,0,.66) 0%, rgba(0,0,0,.2) 48%, rgba(0,0,0,.52) 100%),
    linear-gradient(0deg, rgba(0,0,0,.97) 0%, rgba(0,0,0,.72) 28%, rgba(0,0,0,.12) 78%),
    linear-gradient(to top, var(--bg-deep) 0%, rgba(8,8,8,.92) 18%, transparent 34%);
  box-shadow: inset 0 -190px 145px rgba(0,0,0,.92);
  z-index: 1;
  pointer-events: none;
}

body.is-home .hero-content{
  width: min(1180px, calc(100% - 72px));
  max-width: none;
  min-height: min(680px, 74vh);
  margin: 0;
  padding: clamp(24px, 4vw, 48px);
  display: grid;
  grid-template-columns: minmax(120px, 170px) minmax(0, 560px);
  grid-template-areas:
    "poster title"
    "poster desc"
    "poster action";
  align-content: end;
  align-items: end;
  column-gap: clamp(20px, 3vw, 36px);
  z-index: 2;
}

.hero-poster-card{
  grid-area: poster;
  align-self: end;
  width: 100%;
  aspect-ratio: 2 / 3;
  border-radius: 14px;
  overflow: hidden;
  background: #151515;
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 20px 46px rgba(0,0,0,.68);
  cursor: pointer;
}

.hero-poster-card img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

body.is-home .hero h1{
  grid-area: title;
  max-width: 620px;
  margin: 0 0 8px;
  font-size: clamp(2rem, 4vw, 4.1rem);
  line-height: .98;
}

body.is-home .hero p{
  grid-area: desc;
  max-width: 620px;
  margin: 0 0 20px;
  color: rgba(255,255,255,.78);
  font-size: clamp(.92rem, 1.15vw, 1.06rem);
  line-height: 1.55;
}

body.is-home .hero .btn-action{
  grid-area: action;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 13px 24px;
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 12px 30px rgba(0,0,0,.42);
}

body.is-home .hero .btn-action::before{
  content: "";
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: inline-block;
  background: #000;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
  clip-path: polygon(32% 22%, 32% 78%, 78% 50%);
}

body.is-home .hero-arrow{
  top: calc(112px + min(680px, 74vh) / 2);
  width: 58px;
  height: 74px;
  border-radius: 12px;
  background: rgba(0,0,0,.28);
  border-color: rgba(255,255,255,.30);
  z-index: 4;
}

body.is-home .hero-left{
  left: max(18px, calc((100% - 1180px) / 2 + 14px));
}

body.is-home .hero-right{
  right: max(18px, calc((100% - 1180px) / 2 + 14px));
}

@media (max-width: 1100px){
  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid.grid{
    width: min(100%, 790px);
    grid-template-columns: repeat(4, 160px);
  }
}

@media (max-width: 820px){
  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid.grid{
    width: min(100%, 610px);
    grid-template-columns: repeat(3, 160px);
  }
}

@media (max-width: 700px){
  body.is-home .hero{
    min-height: 560px;
    padding: 96px 16px 38px;
  }

  body.is-home .hero-layer{
    width: calc(100% - 28px);
    height: 490px;
    top: 94px;
    border-radius: 16px;
  }

  body.is-home .hero-overlay{
    width: calc(100% - 12px);
    height: 510px;
    top: 84px;
    border-radius: 16px;
  }

  body.is-home .hero-content{
    width: calc(100% - 28px);
    min-height: 490px;
    grid-template-columns: 96px minmax(0, 1fr);
    column-gap: 16px;
    padding: 18px;
  }

  body.is-home .hero h1{
    font-size: 1.55rem;
  }

  body.is-home .hero p{
    -webkit-line-clamp: 2;
    font-size: .82rem;
    margin-bottom: 14px;
  }

  body.is-home .hero .btn-action{
    padding: 10px 16px;
    font-size: .78rem;
  }

  body.is-home .hero .btn-action::before{
    width: 28px;
    height: 28px;
  }

  body.is-home .hero-arrow{
    top: calc(94px + 245px);
    width: 42px;
    height: 58px;
  }
}

@media (max-width: 560px){
  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid.grid{
    width: min(100%, 336px);
    grid-template-columns: repeat(2, 156px);
    gap: 16px 12px;
  }

  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="people"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card{
    max-width: 156px;
  }
}

/* =========================================================
   Polimento visual: reviews e listas
========================================================= */

body.is-home .hero-layer,
body.is-home .hero-overlay{
  height: min(700px, 76vh);
}

body.is-home .hero-content{
  min-height: min(700px, 76vh);
}

body.is-home .hero-overlay{
  width: min(1220px, calc(100% - 48px));
  height: min(730px, 78vh);
  top: 102px;
  box-shadow: inset 0 -245px 165px rgba(0,0,0,.95);
  background:
    linear-gradient(90deg, rgba(0,0,0,.74) 0%, rgba(0,0,0,.22) 48%, rgba(0,0,0,.58) 100%),
    linear-gradient(0deg, rgba(0,0,0,.99) 0%, rgba(0,0,0,.78) 34%, rgba(0,0,0,.14) 78%),
    linear-gradient(to top, var(--bg-deep) 0%, rgba(8,8,8,.95) 20%, transparent 32%);
}

body.is-home .hero-arrow{
  top: calc(112px + min(700px, 76vh) / 2);
}

.home-social-block{
  margin-top: 34px;
}

.home-community-grid{
  gap: 22px;
}

@keyframes tramaPageReveal {
  from {
    opacity: 0;
    transform: translateY(-16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes tramaCardReveal {
  from {
    opacity: 0;
    transform: translateY(-18px) scale(.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes hsLoaderPulse {
  0%, 80%, 100% {
    opacity: .35;
    transform: scale(.78);
  }
  40% {
    opacity: 1;
    transform: scale(1);
  }
}

body.is-home:not(.page-entrance-ready) .hero-content,
body.is-home:not(.page-entrance-ready) .home-block,
body.is-home:not(.page-entrance-ready) .home-social-block{
  opacity: 0;
  transform: translateY(-16px);
}

body.is-home.page-entrance-ready .hero-content{
  animation: tramaPageReveal .62s cubic-bezier(.22,.61,.36,1) both;
}

body.is-home.page-entrance-ready .home-block{
  animation: tramaPageReveal .58s cubic-bezier(.22,.61,.36,1) both;
}

body.is-home.page-entrance-ready .home-block:nth-of-type(1){ animation-delay: .08s; }
body.is-home.page-entrance-ready .home-block:nth-of-type(2){ animation-delay: .13s; }
body.is-home.page-entrance-ready .home-block:nth-of-type(3){ animation-delay: .18s; }
body.is-home.page-entrance-ready .home-block:nth-of-type(4){ animation-delay: .23s; }
body.is-home.page-entrance-ready .home-block:nth-of-type(5){ animation-delay: .28s; }
body.is-home.page-entrance-ready .home-block:nth-of-type(6){ animation-delay: .33s; }

body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card,
body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card,
body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card{
  opacity: 0;
  animation: tramaCardReveal .52s cubic-bezier(.22,.61,.36,1) forwards;
  will-change: transform, opacity;
}

body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card:nth-child(6n + 1),
body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card:nth-child(6n + 1),
body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card:nth-child(6n + 1){ animation-delay: .04s; }

body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card:nth-child(6n + 2),
body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card:nth-child(6n + 2),
body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card:nth-child(6n + 2){ animation-delay: .08s; }

body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card:nth-child(6n + 3),
body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card:nth-child(6n + 3),
body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card:nth-child(6n + 3){ animation-delay: .12s; }

body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card:nth-child(6n + 4),
body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card:nth-child(6n + 4),
body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card:nth-child(6n + 4){ animation-delay: .16s; }

body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card:nth-child(6n + 5),
body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card:nth-child(6n + 5),
body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card:nth-child(6n + 5){ animation-delay: .20s; }

body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card:nth-child(6n),
body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card:nth-child(6n),
body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card:nth-child(6n){ animation-delay: .24s; }

#homeSections .hs-wrap{
  min-height: 252px;
}

#homeSections .hs-row-loader{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
  z-index: 4;
}

#homeSections .hs-row-loader-dots{
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

#homeSections .hs-row-loader-text{
  color: rgba(255,255,255,.72);
  font-size: .92rem;
  font-weight: 800;
}

#homeSections .hs-wrap.is-loading .hs-row-loader{
  opacity: 1;
}

#homeSections .hs-wrap.is-loading-empty .hs-track{
  opacity: 0;
}

#homeSections .hs-row-loader-dot{
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #ffe600;
  box-shadow: 0 0 18px rgba(255,255,255,.11);
  animation: hsLoaderPulse .95s ease-in-out infinite;
}

#homeSections .hs-row-loader-dot:nth-child(2){
  animation-delay: .12s;
}

#homeSections .hs-row-loader-dot:nth-child(3){
  animation-delay: .24s;
}

#homeSections .hs-track .card.home-row-enter{
  opacity: 0;
  transform: translateY(-18px) scale(.985);
  transition:
    opacity .42s cubic-bezier(.22,.61,.36,1),
    transform .52s cubic-bezier(.22,.61,.36,1);
  transition-delay: var(--home-row-enter-delay, 0ms);
  will-change: transform, opacity;
}

#homeSections .hs-track .card.home-row-enter.is-visible{
  opacity: 1;
  transform: translateY(0) scale(1);
}

@media (prefers-reduced-motion: reduce){
  body.is-home:not(.page-entrance-ready) .hero-content,
  body.is-home:not(.page-entrance-ready) .home-block,
  body.is-home:not(.page-entrance-ready) .home-social-block{
    opacity: 1;
    transform: none;
  }

  body.is-home.page-entrance-ready .hero-content,
  body.is-home.page-entrance-ready .home-block,
  body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card,
  body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card,
  body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card{
    animation: none;
    opacity: 1;
    transform: none;
  }

  #homeSections .hs-track .card.home-row-enter{
    opacity: 1;
    transform: none;
    transition: none;
  }

  :is(body[data-tab="movie"], body[data-tab="tv"], body[data-tab="best"], body[data-tab="provider"], body[data-tab="intheaters"], body[data-tab="upcoming"]) #mainGrid .card.catalog-card-enter{
    opacity: 1;
    transform: none;
    transition: none;
  }
}

.home-mini-card,
.community-list-card,
.community-review-card{
  background:
    linear-gradient(180deg, rgba(22,22,22,.98) 0%, rgba(12,12,12,.99) 100%);
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 18px 44px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.035);
}

.home-mini-card,
.community-review-card{
  border-radius: 24px;
}

.home-mini-card:hover,
.community-list-card:hover,
.community-review-card:hover{
  transform: translateY(-6px);
  border-color: rgba(255,230,0,.30);
  box-shadow: 0 24px 62px rgba(0,0,0,.50), 0 0 0 1px rgba(255,255,255,.025) inset;
}

.home-mini-cover,
.community-review-cover{
  position: relative;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01));
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  overflow: hidden;
}

.home-mini-poster,
.community-review-poster,
.home-list-grid4 .slot,
.community-poster-slot{
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 12px 26px rgba(0,0,0,.38);
}

.home-mini-poster,
.community-review-poster{
  border-radius: 16px;
}

.home-mini-title,
.community-review-title,
.community-list-title{
  letter-spacing: -.015em;
}

.home-mini-text,
.community-review-text{
  color: rgba(255,255,255,.70);
}

.home-mini-footer,
.community-list-meta,
.community-review-meta{
  border-top: 1px solid rgba(255,255,255,.075);
}

.home-mini-footer{
  padding: 12px 16px 16px;
  background: rgba(255,255,255,.015);
}

.home-mini-footer span:last-child,
.community-review-meta > div:last-child{
  color: #ffe600;
  font-weight: 900;
}

.home-mini-badge,
.community-review-badge,
.community-list-count,
.rv-comment-count{
  min-height: 30px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.11);
  color: rgba(255,255,255,.86);
  font-weight: 850;
}

.home-mini-badge,
.community-review-badge:first-child{
  background: rgba(255,255,255,.065);
  border-color: rgba(255,230,0,.28);
  color: #ffe600;
}

.community-list-topbar,
.community-review-badges{
  align-items: center;
}

.community-list-like-inline,
.rv-btn,
.rv-comment-count{
  height: 36px;
}

.community-review-card{
  position: relative;
  overflow: hidden;
}

.community-review-card::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 90% 90%, rgba(255,255,255,.045), transparent 34%);
  pointer-events: none;
}

.community-review-cover,
.community-review-body{
  position: relative;
  z-index: 1;
}

.community-review-cover{
  gap: 14px;
  padding: 14px;
}

.community-review-poster{
  width: 104px;
  min-width: 104px;
  height: 156px;
}

.community-review-body{
  padding: 16px;
}

.community-review-text{
  min-height: 4.8em;
  padding: 12px 0 2px;
}

.review-votes{
  margin-top: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.rv-comment-count{
  display: inline-flex;
  align-items: center;
  padding: 0 13px;
  color: rgba(255,255,255,.76);
  font-size: .84rem;
}

.review-spoiler-badge{
  width: fit-content;
  margin-bottom: 8px;
}

.spoiler-toggle-btn{
  margin: 0 0 10px;
}

.reviews-grid,
.lists-grid{
  gap: 22px;
}

#reviewsSection .reviews-grid{
  grid-template-columns: repeat(2, minmax(0, 560px));
  justify-content: center;
  max-width: 1160px;
  margin-left: auto;
  margin-right: auto;
  align-items: stretch;
  gap: 24px;
}

#reviewsSection{
  width: min(1440px, calc(100vw - 120px));
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}

#reviewsSection .community-page-head,
#reviewsSection .community-tabs{
  width: min(1160px, 100%);
  margin-left: auto !important;
  margin-right: auto !important;
}

#reviewsSection .community-review-card{
  display: flex;
  flex-direction: column;
  height: 100%;
}

#reviewsSection .community-review-body{
  display: flex;
  flex: 1;
  flex-direction: column;
}

#reviewsSection .community-review-meta{
  margin-top: auto;
}

@media (max-width: 1160px){
  #reviewsSection .reviews-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 100%;
  }

  #reviewsSection{
    width: min(100%, calc(100vw - 36px));
  }
}

@media (max-width: 780px){
  #reviewsSection .reviews-grid{
    grid-template-columns: minmax(0, 520px);
    max-width: 520px;
  }

  #reviewsSection{
    width: min(100%, calc(100vw - 24px));
  }
}

@media (max-width: 700px){
  body.is-home .hero-layer,
  body.is-home .hero-overlay{
    height: 515px;
  }

  body.is-home .hero-content{
    min-height: 515px;
  }

  .community-review-poster{
    width: 92px;
    min-width: 92px;
    height: 138px;
  }

  .community-review-created-at{
    left: 120px;
    bottom: 30px;
  }

  .community-review-rating-line{
    left: 120px;
    bottom: 52px;
  }
}

/* Ajustes finos de reviews/listas */
.community-review-card .spoiler-toggle-btn,
.home-mini-card .spoiler-toggle-btn{
  display: inline-flex;
  width: fit-content;
  max-width: max-content;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  white-space: nowrap;
  padding: 7px 13px;
}

.community-list-cover{
  padding: 0;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  overflow: hidden;
}

.community-list-grid{
  display: flex;
  width: 100%;
  gap: 0;
  min-height: 176px;
}

.community-poster-slot{
  flex: 1 1 0;
  min-width: 0;
  aspect-ratio: auto;
  height: 176px;
  border-radius: 0;
  border-top: 0;
  border-bottom: 0;
  border-left: 0;
}

.community-poster-slot:first-child{
  border-top-left-radius: 24px;
}

.community-poster-slot:last-child{
  border-top-right-radius: 24px;
  border-right: 0;
}

.community-poster-slot.is-extra,
.home-list-grid4 .slot.is-extra{
  background:
    linear-gradient(135deg, rgba(120,120,120,.32), rgba(42,42,42,.96)),
    #2b2b2b;
}

.list-extra-count{
  font-size: clamp(1.15rem, 2.2vw, 1.8rem);
  font-weight: 950;
  color: #fff;
  letter-spacing: -.03em;
  text-shadow: 0 12px 30px rgba(0,0,0,.55);
}

.community-list-body{
  padding-top: 18px;
}

.home-list-card .home-mini-cover{
  display: block;
  padding: 0;
}

.home-list-card .home-list-grid4{
  width: 100%;
  display: flex;
  gap: 0;
}

.home-list-card .home-list-grid4 .slot{
  flex: 1 1 0;
  min-width: 0;
  height: 180px;
  aspect-ratio: auto;
  border-radius: 0;
  border-top: 0;
  border-left: 0;
  border-bottom: 0;
}

.home-list-card .home-list-grid4 .slot:first-child{
  border-top-left-radius: 24px;
}

.home-list-card .home-list-grid4 .slot:last-child{
  border-top-right-radius: 24px;
  border-right: 0;
}

.home-list-card .home-mini-content{
  padding: 16px 16px 2px;
}

.home-list-empty-poster{
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: rgba(255,255,255,.72);
  font-size: 1.2rem;
}

@media (max-width: 700px){
  .community-list-grid,
  .community-poster-slot{
    min-height: 142px;
    height: 142px;
  }

  .home-list-card .home-list-grid4 .slot{
    height: 148px;
  }
}

/* Ajustes finais das listas */

.community-list-grid{
  min-height: 154px;
}

.community-poster-slot{
  height: 154px;
}

.home-list-card .home-list-grid4 .slot{
  height: 150px;
}

.community-poster-slot.is-empty,
.home-list-grid4 .slot.is-empty{
  background:
    linear-gradient(135deg, rgba(96,96,96,.42), rgba(35,35,35,.96)),
    #2f2f2f;
}

.community-empty-poster,
.home-list-empty-poster{
  font-size: 0;
}

.community-empty-poster.list-extra-count,
.home-list-empty-poster.list-extra-count{
  display: grid;
  place-items: center;
  font-size: clamp(1.15rem, 2.2vw, 1.8rem);
  font-weight: 950;
  color: #fff;
  letter-spacing: -.03em;
}

.community-empty-poster.list-empty-plus,
.home-list-empty-poster.list-empty-plus{
  display: grid;
  place-items: center;
  font-size: 1.15rem;
  font-weight: 900;
  color: #ffe600;
}

@media (max-width: 700px){
  .community-list-grid,
  .community-poster-slot{
    min-height: 126px;
    height: 126px;
  }

  .home-list-card .home-list-grid4 .slot{
    height: 128px;
  }
}

/* Footer: redes sociais coloridas e TMDB */
.social-icon{
  color: #fff;
  background: rgba(255,255,255,.055);
}

.social-icon svg{
  fill: currentColor;
  opacity: 1;
}

/* Tabs de listas e reviews */
.community-page-head{
  flex-direction: column;
  text-align: center;
  gap: 8px;
  margin-bottom: 1.25rem;
  padding-bottom: .25rem;
}

.community-page-head h2{
  margin: 0;
  font-size: 2.3rem;
  font-weight: 900;
  line-height: 1.15;
}

.community-page-head h2 span:last-child{
  color: var(--primary);
}

.community-page-head p{
  margin: 0;
  color: #aaa;
  font-size: 1rem;
  line-height: 1.5;
}

.community-tabs{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
}

.community-tab-btn{
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: #d9d9d9;
  min-height: 42px;
  padding: 10px 18px;
  border-radius: 999px;
  cursor: pointer;
  font-size: .86rem;
  font-weight: 800;
  letter-spacing: .01em;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.community-tab-btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.12);
  color: #fff;
}

.community-tab-btn.active{
  background: linear-gradient(180deg, rgba(255,230,0,.96), rgba(255,207,0,.92));
  border-color: rgba(255,230,0,.98);
  color: #0b0b0b;
  box-shadow: 0 10px 24px rgba(255,255,255,.08);
}

.community-tabs .nav-sep{
  color: rgba(255,255,255,.24);
  font-weight: 700;
}

/* Ajuste visual dos cards de listas */
.home-community-grid{
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.lists-grid{
  grid-template-columns: repeat(3, minmax(0, 330px));
  justify-content: center;
  max-width: 1034px;
  margin-left: auto;
  margin-right: auto;
  gap: 22px;
}

#listsSection .lists-grid{
  grid-template-columns: repeat(2, minmax(0, 560px));
  max-width: 1160px;
  align-items: stretch;
  gap: 24px;
}

#listsSection{
  width: min(1440px, calc(100vw - 120px));
  max-width: none;
  margin-left: 50%;
  transform: translateX(-50%);
}

#listsSection .community-page-head,
#listsSection .community-tabs{
  width: min(1160px, 100%);
  margin-left: auto !important;
  margin-right: auto !important;
}

#listsSection .community-list-card{
  display: flex;
  flex-direction: column;
  height: 100%;
}

#listsSection .home-list-card.community-list-card{
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 0;
  gap: 0;
  min-height: 0;
  border-radius: 24px;
}

#listsSection .home-list-card.community-list-card.actions-open{
  overflow: visible;
}

#listsSection .community-list-cover{
  padding: 0;
}

#listsSection .community-list-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  min-height: 184px;
  height: 184px;
  padding: 10px;
}

#featuredListsGrid .community-list-grid{
  min-height: 164px;
  height: 164px;
}

#listsSection .community-poster-slot{
  height: auto;
  min-height: 0;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
}

#listsSection .community-list-body{
  display: flex;
  flex: 1;
  flex-direction: column;
}

#listsSection .community-list-meta{
  margin-top: auto;
}

#listsSection .home-list-card .home-list-grid4{
  display: flex;
  gap: 10px;
  width: auto;
  min-height: 0;
  height: auto;
  margin: 0;
  padding: 18px 18px 16px;
  overflow-x: auto;
}

#listsSection .home-list-card .home-list-grid4 .slot{
  width: 108px;
  height: 162px;
  flex: 0 0 auto;
  min-width: 0;
  min-height: 0;
  aspect-ratio: auto;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.06);
}

#listsSection .home-list-card .home-list-grid4 .slot:first-child,
#listsSection .home-list-card .home-list-grid4 .slot:last-child{
  border-radius: 10px;
}

#listsSection .home-list-footer{
  padding-top: 16px;
}

@media (max-width: 1080px){
  .lists-grid{
    grid-template-columns: repeat(2, minmax(0, 330px));
    max-width: 682px;
  }

  #listsSection .lists-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 100%;
  }

  #listsSection{
    width: min(100%, calc(100vw - 36px));
  }
}

@media (max-width: 700px){
  .lists-grid{
    grid-template-columns: minmax(0, 330px);
    max-width: 330px;
  }

  #listsSection .lists-grid{
    grid-template-columns: minmax(0, 520px);
    max-width: 520px;
  }

  #listsSection{
    width: min(100%, calc(100vw - 24px));
  }

  #listsSection .community-list-grid{
    min-height: 152px;
    height: 152px;
  }

  #featuredListsGrid .community-list-grid{
    min-height: 152px;
    height: 152px;
  }

  #listsSection .home-list-card .home-list-grid4{
    gap: 10px;
    width: auto;
    min-height: 0;
    height: auto;
    padding: 0 12px 18px;
    overflow-x: auto;
  }

  #listsSection .home-list-card .home-list-grid4 .slot{
    width: 86px;
    height: 129px;
  }
}

.home-list-card{
  min-width: 0;
}

.home-list-card .home-list-grid4{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-height: 170px;
}

.home-list-card .home-list-grid4 .slot{
  height: 170px;
}

.home-list-card .home-mini-content{
  position: relative;
  padding: 16px 64px 14px 18px;
  gap: 10px;
}

.home-list-card .home-mini-title{
  font-size: 1.1rem;
  line-height: 1.24;
  margin-bottom: 0;
}

.home-list-card-headline{
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.home-list-card-headline .home-mini-title{
  flex: 1 1 auto;
  min-width: 0;
}

.home-list-card-meta{
  color: rgba(255,255,255,.58);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.2;
  margin-top: 4px;
}

.home-list-footer{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 14px 18px 18px;
}

.home-list-footer-meta{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #b8b8b8;
  font-size: .84rem;
  font-weight: 800;
  line-height: 1.35;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  white-space: nowrap;
}

#homeFeaturedLists{
  align-items: start;
}

#homeFeaturedLists .home-list-card{
  align-self: start;
  min-height: 0;
}

#homeFeaturedLists .home-list-card .home-mini-cover{
  display: block;
  padding: 0;
}

#homeFeaturedLists .home-list-card .home-list-grid4{
  display: flex;
  width: 100%;
  min-height: 0;
  gap: 0;
}

#homeFeaturedLists .home-list-card .home-list-grid4 .slot{
  flex: 1 1 0;
  min-width: 0;
  height: 184px;
  aspect-ratio: auto;
  border-radius: 0;
  border-top: 0;
  border-left: 0;
  border-bottom: 0;
}

#homeFeaturedLists .home-list-card .home-list-grid4 .slot:first-child{
  border-top-left-radius: 24px;
}

#homeFeaturedLists .home-list-card .home-list-grid4 .slot:last-child{
  border-top-right-radius: 24px;
  border-right: 0;
}

#homeFeaturedLists{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}

#homeFeaturedLists .home-list-card{
  display: flex;
  flex-direction: column;
  align-self: stretch;
  height: 100%;
  min-height: 326px;
}

#homeFeaturedLists .home-list-card .home-list-grid4{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  min-height: 164px;
  height: 164px;
  padding: 10px;
}

#homeFeaturedLists .home-list-card .home-list-grid4 .slot{
  height: auto;
  min-height: 0;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
}

#homeFeaturedLists .home-list-card .home-list-grid4 .slot:first-child,
#homeFeaturedLists .home-list-card .home-list-grid4 .slot:last-child{
  border-radius: 12px;
}

#homeFeaturedLists .home-list-card .home-mini-content{
  padding: 16px 64px 14px 18px;
}

#homeFeaturedLists .home-famous-list-footer{
  margin-top: auto;
}

.home-review-footer,
.home-famous-list-footer{
  grid-template-columns: minmax(0, 1fr) auto;
}

.home-list-card .home-mini-content > .community-card-actions{
  top: 14px;
  right: 16px;
}

.home-list-card .home-mini-content > .community-card-actions .comment-actions-btn{
  width: 34px;
  height: 34px;
}

.home-review-owner{
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
  font-size: .84rem;
  font-weight: 800;
  cursor: pointer;
  transition: color .18s ease, transform .18s ease;
}

.home-mini-footer .home-review-owner,
.home-mini-footer .home-review-owner .community-owner-name{
  color: #fff;
}

.home-review-owner:hover{
  color: #ffe600;
  transform: translateX(2px);
}

.home-mini-footer .home-review-owner:hover,
.home-mini-footer .home-review-owner:hover .community-owner-name{
  color: #ffe600;
}

.home-review-owner:focus{
  outline: none;
}

.home-review-owner .community-owner-avatar{
  width: 24px;
  height: 24px;
  flex-basis: 24px;
}

.home-mini-footer .community-owner-avatar{
  min-width: 24px;
  overflow: hidden;
  white-space: nowrap;
}

.home-review-footer .home-review-stats,
.home-famous-list-footer .home-review-stats{
  width: auto;
  overflow: visible;
  justify-content: flex-end;
  flex-shrink: 0;
}

.home-list-stat{
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: rgba(255,255,255,.9);
  font-weight: 900;
  font: inherit;
  cursor: pointer;
  line-height: 1;
  transition: transform .18s ease, filter .18s ease, color .18s ease;
}

.home-list-stat:hover{
  transform: translateY(-1px);
  filter: brightness(1.12);
}

.home-list-stat:disabled{
  cursor: wait;
  opacity: .72;
}

.home-list-stat svg{
  width: 15px;
  height: 15px;
  display: block;
  flex: 0 0 15px;
}

.home-list-like-stat svg{
  fill: transparent;
  stroke: #ff4d5f;
  transform-origin: center;
}

.home-list-like-stat svg path{
  fill: transparent;
  stroke: #ff4d5f;
  stroke-width: 1.8;
  transform-origin: center;
}

.home-list-like-stat.active svg,
.home-list-like-stat.active svg path{
  fill: #ff4d5f;
  stroke: #ff4d5f;
}

.home-list-comment-stat svg{
  fill: transparent;
  stroke: #f1f1f1;
  stroke-width: 1.9;
}

.home-list-like-stat,
.home-list-like-stat .compact-count,
.home-list-like-stat .list-like-count,
.home-list-like-stat .review-like-count{
  color: #ff4d5f;
}

.home-list-comment-stat,
.home-list-comment-stat .compact-count{
  color: #f1f1f1;
}

.home-list-save-stat,
.home-list-save-stat .compact-count,
.home-list-save-stat .list-save-count,
.home-list-save-stat .review-save-count{
  color: #ffe600;
}

.home-list-save-stat svg,
.home-list-save-stat svg path{
  fill: transparent;
  stroke: #ffe600;
  stroke-width: 1.8;
  transform-origin: center;
}

.home-list-save-stat.active svg,
.home-list-save-stat.active svg path{
  fill: #ffe600;
  stroke: #ffe600;
}

.home-list-like-stat.home-like-animating svg,
.home-list-like-stat.home-like-animating svg path,
.home-tierlist-like-stat.home-like-animating svg,
.home-tierlist-like-stat.home-like-animating svg path,
.community-card-actions-menu .home-like-animating .menu-like-icon,
.community-card-actions-menu .home-like-animating .menu-like-icon path,
.community-card-actions-menu .like-animating .menu-like-icon,
.community-card-actions-menu .like-animating .menu-like-icon path{
  animation: reviewHeartFill .30s ease;
}

.home-list-like-stat.home-like-unanimating svg,
.home-list-like-stat.home-like-unanimating svg path,
.home-tierlist-like-stat.home-like-unanimating svg,
.home-tierlist-like-stat.home-like-unanimating svg path,
.community-card-actions-menu .home-like-unanimating .menu-like-icon,
.community-card-actions-menu .home-like-unanimating .menu-like-icon path,
.community-card-actions-menu .like-unanimating .menu-like-icon,
.community-card-actions-menu .like-unanimating .menu-like-icon path{
  animation: reviewHeartUnfill .30s ease;
}

.home-list-save-stat.home-save-animating svg,
.home-list-save-stat.home-save-animating svg path,
.home-tierlist-save-stat.home-save-animating svg,
.home-tierlist-save-stat.home-save-animating svg path,
.save-inline-btn.home-save-animating .save-inline-icon,
.save-inline-btn.home-save-animating .save-inline-icon path,
.save-inline-btn.save-animating .save-inline-icon,
.save-inline-btn.save-animating .save-inline-icon path{
  animation: reviewBookmarkFill .30s ease;
}

.home-list-save-stat.home-save-unanimating svg,
.home-list-save-stat.home-save-unanimating svg path,
.home-tierlist-save-stat.home-save-unanimating svg,
.home-tierlist-save-stat.home-save-unanimating svg path,
.save-inline-btn.home-save-unanimating .save-inline-icon,
.save-inline-btn.home-save-unanimating .save-inline-icon path,
.save-inline-btn.save-unanimating .save-inline-icon,
.save-inline-btn.save-unanimating .save-inline-icon path{
  animation: reviewBookmarkUnfill .30s ease;
}

.community-card-actions-menu .like-animating,
.community-card-actions-menu .like-unanimating,
.community-card-actions-menu .save-animating,
.community-card-actions-menu .save-unanimating{
  animation: none;
}

@keyframes homeMenuLikePulse{
  0%{ transform: none; }
  55%{ transform: none; }
  100%{ transform: none; }
}

.list-votes{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.list-votes .community-list-like-inline{
  border: none;
  background: none;
  padding: 4px 2px;
  border-radius: 0;
  color: #aaa;
  box-shadow: none;
}

.list-votes .community-list-like-inline:hover{
  transform: translateY(-1px);
  border-color: transparent;
  background: none;
  color: #fff;
}

.list-votes .community-list-like-inline.active{
  background: none;
  border-color: transparent;
  color: #ffd54a;
  animation: likePop .25s ease;
}

.list-votes .list-comment-count{
  padding: 0 13px;
  color: rgba(255,255,255,.76);
}

.community-list-grid{
  min-height: 184px;
}

.community-poster-slot{
  height: 184px;
}

.community-list-body{
  padding: 18px 18px 20px;
  gap: 12px;
}

.community-list-title{
  margin-bottom: 2px;
}

.community-list-meta{
  align-items: flex-start;
  gap: 14px;
}

@media (max-width: 700px){
  .section-header{
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .provider-logo-img{
    width: 42px;
    height: 42px;
  }

  .list-detail-card{
    grid-template-columns: 1fr;
    padding: 18px;
    gap: 18px;
  }

  .list-detail-kicker{
    position: static;
    margin-left: auto;
  }

  .list-detail-content{
    gap: 16px;
    min-height: 220px;
  }

  .list-detail-meta-row{
    padding-right: 0;
  }

  .list-detail-preview-grid{
    min-height: 196px;
    height: 196px;
  }

  .list-detail-title{
    margin-top: 6px;
    font-size: 1.65rem;
  }

  .home-community-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .community-tabs .nav-sep{
    display: none;
  }

  .home-list-card .home-list-grid4{
    min-height: 152px;
  }

  .home-list-card .home-list-grid4 .slot{
    height: 152px;
  }

  #homeFeaturedLists .home-list-card .home-list-grid4{
    min-height: 152px;
    height: 152px;
  }

  #homeFeaturedLists .home-list-card .home-list-grid4 .slot{
    height: auto;
  }

  .community-list-grid{
    min-height: 152px;
  }

  .community-poster-slot{
    height: 152px;
  }

  .home-list-footer{
    grid-template-columns: 1fr;
    align-items: start;
  }
}

@media (max-width: 520px){
  .list-detail-preview-grid{
    min-height: 176px;
    height: 176px;
  }

  .home-community-grid{
    grid-template-columns: 1fr;
  }

  .home-list-card .home-list-grid4{
    min-height: 132px;
  }

  .home-list-card .home-list-grid4 .slot{
    height: 132px;
  }

  #homeFeaturedLists{
    grid-template-columns: 1fr;
  }

  #homeFeaturedLists .home-list-card .home-list-grid4{
    min-height: 132px;
    height: 132px;
  }

  #homeFeaturedLists .home-list-card .home-list-grid4 .slot{
    height: auto;
  }

  .community-list-grid{
    min-height: 132px;
  }

  .community-poster-slot{
    height: 132px;
  }
}

.social-instagram{
  color: #fff;
  background:
    radial-gradient(circle at 30% 110%, #feda75 0 22%, transparent 23%),
    radial-gradient(circle at 12% 16%, #4f5bd5 0 24%, transparent 25%),
    linear-gradient(135deg, #833ab4, #fd1d1d 55%, #fcb045);
  border-color: rgba(255,255,255,.18);
}

.social-x{
  color: #fff;
  background: #0f0f0f;
  border-color: rgba(255,255,255,.18);
}

.social-youtube{
  color: #ff0000;
  background: #ffffff;
  border-color: rgba(255,255,255,.72);
}

.social-youtube svg{
  width: 25px;
  height: 25px;
}

.social-youtube svg path:first-child{
  fill: #ff0000;
}

.social-youtube svg path:last-child{
  fill: #ffffff;
}

.social-facebook{
  color: #fff;
  background: #1877f2;
  border-color: rgba(24,119,242,.35);
}

.social-tiktok{
  color: #fff;
  background:
    linear-gradient(135deg, #00f2ea 0 18%, #111 19% 70%, #ff0050 71% 100%);
  border-color: rgba(255,255,255,.18);
}

.social-icon:hover{
  filter: brightness(1.08) saturate(1.08);
  box-shadow: 0 12px 28px rgba(0,0,0,.35);
}

.footer-tmdb-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 950;
  letter-spacing: .04em;
  color: #061a21;
  background: linear-gradient(135deg, #90cea1 0%, #3cbec9 48%, #01b4e4 100%);
  border: 1px solid rgba(255,255,255,.20);
  box-shadow: 0 8px 22px rgba(1,180,228,.18);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.footer-tmdb-link:hover{
  transform: translateY(-1px);
  filter: brightness(1.08);
  box-shadow: 0 12px 28px rgba(1,180,228,.28);
}



/* Salvos */
.save-inline-btn {
  height: 32px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  color: #f5f5f5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition: .2s ease;
  white-space: nowrap;
}

.save-inline-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  flex:0 0 16px;
}

.save-inline-icon svg{
  width:16px;
  height:16px;
  display:block;
}

.save-inline-icon path{
  fill: transparent;
  stroke: currentColor;
  stroke-width: 1.8;
  transition: fill .2s ease, stroke .2s ease, transform .2s ease;
}

.save-inline-btn:hover {
  border-color: rgba(255,230,0,.35);
  background: rgba(255,255,255,.055);
  color: #ffe600;
}

.save-inline-btn.active {
  border-color: rgba(255,230,0,.48);
  background: rgba(255,255,255,.08);
  color: #ffe600;
}

.save-inline-btn.active .save-inline-icon path{
  fill: currentColor;
  stroke: currentColor;
}

.menu-like-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  flex:0 0 16px;
}

.menu-like-icon svg{
  width:16px;
  height:16px;
  display:block;
}

.menu-like-icon path{
  fill: transparent;
  stroke: currentColor;
  stroke-width: 1.8;
  transform-origin: center;
  transition: fill .2s ease, stroke .2s ease, transform .2s ease;
}

.menu-like-label{
  flex: 1 1 auto;
}

.menu-like-count{
  margin-left: auto;
  color: currentColor;
  font-weight: 900;
  min-width: 18px;
  text-align: right;
}

.community-list-like-inline.active .menu-like-icon path{
  fill: currentColor;
  stroke: currentColor;
}

.index-card-menu-like.active{
  background: rgba(255,255,255,.07);
  color: #ffe600;
}

.rv-btn.like.active .menu-like-icon path,
.index-card-menu-like.active .menu-like-icon path{
  fill: currentColor;
  stroke: currentColor;
}

.save-inline-btn:disabled {
  opacity: .65;
  cursor: wait;
}

.home-mini-footer .home-list-stat,
.community-card-stats .home-list-stat{
  min-width: 0;
  min-height: 0;
  height: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  color: rgba(255,255,255,.9);
}

.home-mini-footer .home-list-stat:hover,
.community-card-stats .home-list-stat:hover,
.home-mini-footer .home-list-stat.active,
.community-card-stats .home-list-stat.active{
  border: 0;
  background: transparent;
  box-shadow: none;
}

.home-mini-footer .home-list-save-stat,
.community-card-stats .home-list-save-stat,
.home-mini-footer .home-list-save-stat.active,
.community-card-stats .home-list-save-stat.active{
  color: #ffe600;
}

.home-mini-footer .home-list-like-stat,
.community-card-stats .home-list-like-stat,
.home-mini-footer .home-list-like-stat.active,
.community-card-stats .home-list-like-stat.active{
  color: #ff4d5f;
}

.home-mini-footer .home-list-comment-stat,
.community-card-stats .home-list-comment-stat{
  color: #f1f1f1;
}

/* Menus de ações nos cards de listas/reviews da comunidade */
.community-card-actions{
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 35;
}

.home-mini-card.actions-open,
.community-list-card.actions-open,
.community-review-card.actions-open{
  position: relative;
  z-index: 3000;
}

.home-block.actions-open{
  position: relative;
  z-index: 3000;
}

.comment-actions-wrap.open,
.comment-actions-menu.open,
.community-card-actions-menu.open{
  z-index: 3100;
}

.comment-actions-menu.is-home-layer{
  position: absolute;
  top: var(--actions-menu-top);
  left: var(--actions-menu-left);
  right: auto;
  bottom: auto;
  z-index: 3900;
  min-width: 190px;
  width: 230px;
  max-height: var(--actions-menu-max-height, calc(100vh - 24px));
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.comment-actions-menu.is-home-layer::-webkit-scrollbar{
  width: 0;
  height: 0;
}

.community-comment-menu{
  min-width:190px;
  width:220px;
  padding:7px;
  gap:6px;
}

.community-comment-menu.is-home-layer{
  min-width:190px;
  width:220px;
  max-height:none;
  overflow:hidden;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.community-comment-menu.is-home-layer::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}

.community-comment-menu.is-home-layer::after{
  display:none;
}

.community-comment-menu .community-comment-menu-item{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-height:36px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:rgba(255,255,255,.86);
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  font-size:.92rem;
  font-weight:900;
  cursor:pointer;
  text-align:left;
  transition:background .18s ease, color .18s ease;
}

.community-comment-menu .community-comment-menu-item:hover{
  background:rgba(255,255,255,.06);
  color:#ffe600;
  transform:none;
}

.community-comment-menu .community-comment-menu-item.danger{
  color:#ff7c7c;
}

.community-comment-menu .community-comment-menu-item.danger:hover{
  background:rgba(255,80,80,.14);
  color:#ff8d8d;
}

.comment-actions-menu.is-home-layer.opens-above{
  transform-origin: bottom right;
  transform: translateY(12px) scale(.98);
}

.comment-actions-menu.is-home-layer::after{
  content: "";
  position: absolute;
  left: var(--actions-arrow-left);
  width: 10px;
  height: 10px;
  background: #111;
  border-left: 1px solid rgba(255,255,255,.09);
  border-top: 1px solid rgba(255,255,255,.09);
  pointer-events: none;
}

.comment-actions-menu.is-home-layer.opens-below::after{
  top: -6px;
  transform: translateX(-50%) rotate(45deg);
}

.comment-actions-menu.is-home-layer.opens-above::after{
  bottom: -6px;
  transform: translateX(-50%) rotate(225deg);
}

.community-card-actions .comment-actions-btn{
  background: rgba(0,0,0,.62);
  backdrop-filter: blur(8px);
}

.community-card-actions-menu{
  min-width: 190px;
  width: 230px;
  padding: 7px;
}

.community-card-actions-menu .comment-actions-item,
.community-card-actions-menu .save-inline-btn{
  width: 100%;
  min-height: 36px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: rgba(255,255,255,.86);
  font-size: .86rem;
  font-weight: 850;
  text-align: left;
  padding: 8px 10px;
  box-shadow: none;
}

.community-card-actions-menu .comment-actions-item:hover,
.community-card-actions-menu .save-inline-btn:hover,
.community-card-actions-menu .comment-actions-item.active,
.community-card-actions-menu .save-inline-btn.active{
  background: rgba(255,255,255,.06);
  color: #ffe600;
  transform: none;
}

.community-card-actions-menu .comment-actions-item.community-list-like-inline .menu-like-icon,
.community-card-actions-menu .comment-actions-item.rv-btn.like .menu-like-icon,
.community-card-actions-menu .comment-actions-item.home-tierlist-menu-like .menu-like-icon{
  color: #ff4d5f;
}

.community-card-actions-menu .comment-actions-item.community-list-like-inline .menu-like-icon path,
.community-card-actions-menu .comment-actions-item.rv-btn.like .menu-like-icon path,
.community-card-actions-menu .comment-actions-item.home-tierlist-menu-like .menu-like-icon path{
  stroke: #ff4d5f;
}

.community-card-actions-menu .comment-actions-item.community-list-like-inline,
.community-card-actions-menu .comment-actions-item.rv-btn.like,
.community-card-actions-menu .comment-actions-item.home-tierlist-menu-like{
  color: #ff4d5f;
  background: transparent;
}

.community-card-actions-menu .comment-actions-item.community-list-like-inline:hover,
.community-card-actions-menu .comment-actions-item.rv-btn.like:hover,
.community-card-actions-menu .comment-actions-item.home-tierlist-menu-like:hover{
  color: #ff4d5f;
  background: rgba(255,77,95,.12);
}

.community-card-actions-menu .comment-actions-item.community-list-like-inline.active,
.community-card-actions-menu .comment-actions-item.rv-btn.like.active,
.community-card-actions-menu .comment-actions-item.home-tierlist-menu-like.active{
  color: #ff4d5f;
  background: rgba(255,77,95,.12);
}

.community-card-actions-menu .comment-actions-item.community-list-like-inline.active .menu-like-icon path,
.community-card-actions-menu .comment-actions-item.rv-btn.like.active .menu-like-icon path,
.community-card-actions-menu .comment-actions-item.home-tierlist-menu-like.active .menu-like-icon path{
  fill: #ff4d5f;
  stroke: #ff4d5f;
}

.community-card-actions-menu .comment-actions-item.danger{
  color: #ff7c7c;
}

.community-card-actions-menu .comment-actions-item.danger:hover{
  background: rgba(255,80,80,.12);
  color: #ff7c7c;
}

.community-card-actions-menu .rv-btn,
.community-card-actions-menu .community-list-like-inline{
  margin: 0;
  padding: 8px 10px;
  transition: background .18s ease, color .18s ease;
}

.community-card-actions-menu .rv-btn:hover,
.community-card-actions-menu .community-list-like-inline:hover,
.community-card-actions-menu .rv-btn.active,
.community-card-actions-menu .community-list-like-inline.active{
  transform: none;
  animation: none;
}

/* Rodapé das reviews igual ao rodapé das listas */
.community-review-meta{
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,.075);
}

.community-review-owner{
  color: #d8d8d8;
  font-size: .84rem;
  font-weight: 800;
  gap: 8px;
}

.community-review-owner::before{
  display: none;
}

.community-review-owner:hover{
  color: #ffe600;
}

.community-review-meta > div:last-child{
  color: #ffe600;
  font-size: .78rem;
  font-weight: 900;
  white-space: nowrap;
}

.home-mini-card {
  position: relative;
}

#homeFeaturedReviews .home-mini-card,
#homeFeaturedLists .home-mini-card{
  overflow: visible;
}

#homeFeaturedReviews{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}

#homeFeaturedReviews .home-mini-card{
  display: flex;
  flex-direction: column;
  min-height: 386px;
}

#homeFeaturedReviews .home-mini-cover{
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 14px;
  padding: 14px;
}

#homeFeaturedReviews .home-mini-poster{
  width: 104px;
  height: 156px;
}

#homeFeaturedReviews .home-mini-content{
  padding-right: 46px;
}

#homeFeaturedReviews .home-mini-title{
  font-size: 1.08rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}


#homeFeaturedReviews .home-featured-review-rating{
  position: absolute;
  left: 132px;
  bottom: 54px;
  color: rgba(255,230,0,.86);
  font-size: .82rem;
  font-weight: 850;
  line-height: 1.2;
  white-space: nowrap;
}

#homeFeaturedReviews .home-featured-review-created-at{
  position: absolute;
  left: 132px;
  bottom: 32px;
  color: rgba(255,255,255,.38);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

#homeFeaturedReviews .home-featured-review-body{
  flex: 1;
  padding: 16px;
  border-top: 1px solid rgba(255,255,255,.075);
}

#homeFeaturedReviews .home-mini-text{
  -webkit-line-clamp: 5;
  font-size: .94rem;
  line-height: 1.55;
}

#homeFeaturedReviews .home-review-footer{
  margin-top: auto;
}

@media (max-width: 700px){
  #homeFeaturedReviews{
    grid-template-columns: 1fr;
  }

  #homeFeaturedReviews .home-mini-cover{
    grid-template-columns: 92px minmax(0, 1fr);
  }

  #homeFeaturedReviews .home-mini-poster{
    width: 92px;
    height: 138px;
  }

  #homeFeaturedReviews .home-mini-content{
    padding-right: 120px;
  }

  #homeFeaturedReviews .home-featured-review-rating{
    left: 120px;
    bottom: 52px;
  }

  #homeFeaturedReviews .home-featured-review-created-at{
    left: 120px;
    bottom: 30px;
  }
}

#homeFeaturedReviews,
#homeFeaturedLists,
#homeFeaturedTierlists,
#homeFeaturedReviewsBlock,
#homeFeaturedListsBlock,
#homeFeaturedTierlistsBlock,
#homeFeaturedReviewsBlock .home-community-grid,
#homeFeaturedListsBlock .home-community-grid,
#homeFeaturedTierlistsBlock .home-tierlists-grid{
  overflow: visible;
}

#homeFeaturedReviewsBlock.actions-open,
#homeFeaturedListsBlock.actions-open{
  contain: none;
  isolation: isolate;
  z-index: 9990;
}

#homeFeaturedReviews .home-mini-card.actions-open,
#homeFeaturedLists .home-mini-card.actions-open{
  z-index: 10000;
}

#homeFeaturedReviews .community-card-actions-menu.open,
#homeFeaturedLists .community-card-actions-menu.open{
  z-index: 10001;
}

#homeFeaturedReviews .community-card-actions,
#homeFeaturedLists .community-card-actions{
  top: 12px;
  right: 12px;
}

.menu-save-btn {
  width: 100%;
  height: auto;
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: rgba(255,255,255,.86);
  justify-content: flex-start;
  padding: 8px 10px;
  font-size: .86rem;
  font-weight: 850;
  box-shadow: none;
}

.menu-save-btn:hover,
.menu-save-btn.active {
  background: rgba(255,255,255,.05);
  color: #ffe600;
}

#listDetailMenu .community-list-like-inline,
#reviewDetailMenu .rv-btn.like,
#listDetailMenu .community-list-like-inline.active,
#reviewDetailMenu .rv-btn.like.active{
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: flex-start;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  border-radius: 8px;
  font-size: .86rem;
  font-weight: 850;
  color: #ff4d5f;
  background: transparent;
  box-shadow: none;
}

#listDetailMenu .community-list-like-inline:hover,
#reviewDetailMenu .rv-btn.like:hover{
  color: #ff4d5f;
  background: rgba(255,77,95,.12);
}

.list-detail-stats {
  align-items: center;
  flex-wrap: wrap;
}

#listDetailMenu .menu-save-btn {
  margin: 0;
}

#listDetailMenu .list-detail-edit-action:hover{
  background: rgba(255,255,255,.08);
  color: #ffe600;
  transform: none;
}

#listDetailMenu .review-detail-menu-item:hover:not(.community-list-like-inline):not(.danger):not(.menu-save-btn){
  background: rgba(255,255,255,.08);
  color: #ffe600;
  transform: none;
}

#reviewDetailMenu,
#listDetailMenu{
  padding: 8px;
  gap: 8px;
}

#reviewDetailMenu{
  width: 246px;
  min-width: 246px;
  display: grid;
  grid-auto-rows: max-content;
  row-gap: 10px;
  align-content: start;
  transform: translateY(12px) !important;
  will-change: opacity, transform;
}

#reviewDetailMenu.open{
  transform: translateY(0) !important;
}

#reviewDetailMenu > *{
  margin: 0 !important;
}

#listDetailMenu{
  display: grid;
  grid-auto-rows: max-content;
  row-gap: 10px;
  align-content: start;
  transform: translateY(12px) !important;
  will-change: opacity, transform;
}

#listDetailMenu.open{
  transform: translateY(0) !important;
}

#listDetailMenu > *{
  margin: 0 !important;
}

#reviewDetailMenu .review-detail-menu-item,
#reviewDetailMenu .menu-save-btn{
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 8px 10px;
  font-size: .86rem;
  font-weight: 850;
  margin: 0;
  border-radius: 8px;
  box-sizing: border-box;
  transition: background .18s ease, color .18s ease;
}

#reviewDetailMenu .rv-btn.like,
#reviewDetailMenu .rv-btn.like.active,
#reviewDetailMenu .menu-save-btn,
#reviewDetailMenu .review-detail-menu-item{
  box-sizing: border-box;
}

#reviewDetailMenu .menu-like-label{
  min-width: 104px;
}

#reviewDetailMenu .menu-like-count{
  min-width: 22px;
  flex: 0 0 22px;
}

#reviewDetailMenu .tier-menu-item{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-height:36px;
  height:auto;
  border:0;
  border-radius:8px;
  background:transparent;
  color:rgba(255,255,255,.86);
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  font-size:.86rem;
  font-weight:850;
  cursor:pointer;
  text-align:left;
  box-shadow:none;
  transition:background .18s ease, color .18s ease;
}

#reviewDetailMenu .tier-menu-item:hover,
#reviewDetailMenu .tier-menu-item.active{
  background:rgba(255,255,255,.06);
  color:#ffe600;
  transform:none;
}

#reviewDetailMenu .tier-menu-item.tier-menu-like{
  color:#ff4d5f;
}

#reviewDetailMenu .tier-menu-item.tier-menu-like:hover,
#reviewDetailMenu .tier-menu-item.tier-menu-like.active{
  background:rgba(255,77,95,.12);
  color:#ff4d5f;
}

#reviewDetailMenu .tier-menu-item.danger{
  color:#ff7c7c;
}

#reviewDetailMenu .tier-menu-item.danger:hover{
  background:rgba(255,80,80,.14);
  color:#ff8d8d;
}

#reviewDetailMenu .tier-menu-like-icon,
#reviewDetailMenu .tier-menu-save-icon{
  width:16px;
  height:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 16px;
}

#reviewDetailMenu .tier-menu-like-icon svg,
#reviewDetailMenu .tier-menu-save-icon svg{
  width:16px;
  height:16px;
  display:block;
}

#reviewDetailMenu .tier-menu-like-icon path,
#reviewDetailMenu .tier-menu-save-icon path{
  fill:transparent;
  stroke:currentColor;
  stroke-width:1.8;
  transform-origin:center;
  transition:fill .2s ease, stroke .2s ease, transform .2s ease;
}

#reviewDetailMenu .tier-menu-item.tier-menu-like .tier-menu-like-icon,
#reviewDetailMenu .tier-menu-item.tier-menu-like .tier-menu-like-icon path{
  color:#ff4d5f;
  stroke:#ff4d5f;
}

#reviewDetailMenu .tier-menu-item.tier-menu-like.active .tier-menu-like-icon path{
  fill:#ff4d5f;
  stroke:#ff4d5f;
}

#reviewDetailMenu .tier-menu-save-label,
#reviewDetailMenu .tier-menu-like-label{
  flex:1 1 auto;
  min-width:0;
}

#reviewDetailMenu .tier-menu-item.tier-menu-save.active{
  background:rgba(255,255,255,.06);
  color:#ffe600;
}

#reviewDetailMenu .tier-menu-item.tier-menu-save.active .tier-menu-save-icon path{
  fill:#ffe600;
  stroke:#ffe600;
}

#reviewDetailMenu .tier-menu-like-count{
  margin-left:auto;
  min-width:18px;
  text-align:right;
  color:currentColor;
  font-weight:900;
}

#listDetailMenu .community-list-like-inline .menu-like-icon,
#reviewDetailMenu .rv-btn.like .menu-like-icon{
  color: #ff4d4f;
}

#listDetailMenu .community-list-like-inline .menu-like-icon path,
#reviewDetailMenu .rv-btn.like .menu-like-icon path{
  stroke: #ff4d4f;
}

#listDetailMenu .community-list-like-inline.active,
#reviewDetailMenu .rv-btn.like.active{
  background: rgba(255,77,79,.12);
  color: #ff4d4f;
}

#listDetailMenu .community-list-like-inline.active .menu-like-icon path,
#reviewDetailMenu .rv-btn.like.active .menu-like-icon path{
  fill: #ff4d4f;
  stroke: #ff4d4f;
}

#listDetailHero .list-detail-like-btn.community-list-like-inline{
  border: none;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  padding: 4px 2px;
  animation: none;
}

#listDetailHero .list-detail-like-btn.community-list-like-inline:hover{
  border-color: transparent;
  background: transparent;
  color: #fff;
}

#listDetailHero .list-detail-like-btn.community-list-like-inline.active{
  border-color: transparent;
  background: transparent;
  color: #ff4d4f;
  animation: none;
}

#listDetailHero .list-detail-like-btn .list-detail-heart-icon,
#listDetailHero .list-detail-like-btn .list-detail-heart-icon path{
  fill: transparent;
  stroke: rgba(255,255,255,.82);
  stroke-width: 1.9;
  transform-origin: center;
  transition: fill .18s ease, stroke .18s ease, transform .18s ease, opacity .18s ease;
}

#listDetailHero .list-detail-like-btn .list-like-count{
  color: rgba(255,255,255,.9);
  transition: color .18s ease;
}

#listDetailHero .list-detail-like-btn.active .list-detail-heart-icon,
#listDetailHero .list-detail-like-btn.active .list-detail-heart-icon path{
  fill: #ff4d4f;
  stroke: #ff4d4f;
  transform: scale(1);
}

#listDetailHero .list-detail-like-btn.active .list-like-count{
  color: #ff8080;
}

#listDetailHero .list-detail-like-btn.like-animating .list-detail-heart-icon{
  animation: detailHeartFill .30s ease;
}

#listDetailHero .list-detail-like-btn.like-animating .list-detail-heart-icon path{
  animation: detailHeartFill .30s ease;
}

#listDetailHero .list-detail-like-btn.like-unanimating .list-detail-heart-icon{
  animation: detailHeartUnfill .30s ease;
}

#listDetailHero .list-detail-like-btn.like-unanimating .list-detail-heart-icon,
#listDetailHero .list-detail-like-btn.like-unanimating .list-detail-heart-icon path{
  fill: #ff4d4f;
  stroke: #ff4d4f;
}

#listDetailHero .list-detail-like-btn.like-unanimating .list-like-count{
  color: rgba(255,255,255,.9);
}

#listDetailHero .list-detail-like-btn.like-unanimating .list-detail-heart-icon path{
  animation: detailHeartUnfill .30s ease;
}

@keyframes detailHeartFill{
  0%{
    transform: none;
    opacity: .72;
    fill: transparent;
    stroke: rgba(255,255,255,.82);
  }
  55%{
    transform: none;
    opacity: 1;
    fill: #ff6b6b;
    stroke: #ff6b6b;
  }
  100%{
    transform: none;
    opacity: 1;
    fill: #ff4d4f;
    stroke: #ff4d4f;
  }
}

@keyframes detailHeartUnfill{
  0%{
    transform: none;
    opacity: 1;
    fill: #ff4d4f;
    stroke: #ff4d4f;
  }
  45%{
    transform: none;
    opacity: .82;
    fill: #ff7d7f;
    stroke: #ff7d7f;
  }
  100%{
    transform: none;
    opacity: 1;
    fill: transparent;
    stroke: rgba(255,255,255,.82);
  }
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn{
  animation: none;
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn:hover{
  color: #fff;
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn .list-detail-heart-icon,
#reviewDetailsView .review-detail-social-actions .list-detail-like-btn .list-detail-heart-icon path{
  fill: transparent;
  stroke: rgba(255,255,255,.82);
  stroke-width: 1.9;
  transform-origin: center;
  transition: fill .18s ease, stroke .18s ease, transform .18s ease, opacity .18s ease;
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn .review-like-count{
  color: rgba(255,255,255,.92);
  transition: color .18s ease;
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.active{
  background: transparent;
  border-color: transparent;
  color: #ff4d4f;
  animation: none;
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.active .list-detail-heart-icon,
#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.active .list-detail-heart-icon path{
  fill: #ff4d4f;
  stroke: #ff4d4f;
  transform: scale(1);
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.active .review-like-count{
  color: #ff4d5f;
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.like-animating .list-detail-heart-icon,
#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.like-animating .list-detail-heart-icon path,
#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.like-animating .review-like-count{
  animation: reviewHeartFill .30s ease;
}

#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.like-unanimating .list-detail-heart-icon,
#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.like-unanimating .list-detail-heart-icon path,
#reviewDetailsView .review-detail-social-actions .list-detail-like-btn.like-unanimating .review-like-count{
  fill: #ff4d4f;
  stroke: #ff4d4f;
  animation: reviewHeartUnfill .30s ease;
}

@keyframes reviewHeartFill{
  0%{
    transform: none;
    opacity: .72;
    fill: transparent;
    stroke: rgba(255,255,255,.82);
  }
  55%{
    transform: none;
    opacity: 1;
    fill: #ff6b6b;
    stroke: #ff6b6b;
  }
  100%{
    transform: none;
    opacity: 1;
    fill: #ff4d4f;
    stroke: #ff4d4f;
  }
}

@keyframes reviewHeartUnfill{
  0%{
    transform: none;
    opacity: 1;
    fill: #ff4d4f;
    stroke: #ff4d4f;
  }
  45%{
    transform: none;
    opacity: .82;
    fill: #ff7d7f;
    stroke: #ff7d7f;
  }
  100%{
    transform: none;
    opacity: 1;
    fill: transparent;
    stroke: rgba(255,255,255,.82);
  }
}

@keyframes reviewBookmarkFill{
  0%{
    transform: scale(.82);
    opacity: .72;
    fill: transparent;
    stroke: #ffe600;
  }
  55%{
    transform: scale(1.18);
    opacity: 1;
    fill: #ffe600;
    stroke: #ffe600;
  }
  100%{
    transform: scale(1);
    opacity: 1;
    fill: #ffe600;
    stroke: #ffe600;
  }
}

@keyframes reviewBookmarkUnfill{
  0%{
    transform: scale(1.08);
    fill: #ffe600;
    stroke: #ffe600;
  }
  100%{
    transform: scale(1);
    fill: transparent;
    stroke: #ffe600;
  }
}

/* Home: otimizações de scroll e composição */
body.is-home{
  background-attachment: scroll;
}

body.is-home .home-block{
  content-visibility: auto;
  contain-intrinsic-size: 1px 520px;
  contain: layout paint style;
}

body.is-home .home-block.actions-open{
  contain: none;
}

body.is-home .home-mini-card,
body.is-home .home-tierlist-card,
body.is-home #homeSections .hs-track .card{
  backface-visibility: hidden;
  transform: translateZ(0);
}

body.is-home #homeSections .hs-track .card.home-row-enter{
  will-change: transform, opacity;
}

body.is-home.page-entrance-ready #homeFeaturedReviews .home-mini-card,
body.is-home.page-entrance-ready #homeFeaturedLists .home-mini-card,
body.is-home.page-entrance-ready #homeFeaturedTierlists .home-tierlist-card{
  will-change: auto;
}

body.is-home #homeSections .hs-track .card.home-row-enter.is-visible{
  will-change: auto;
}

body.is-home .home-mini-card,
body.is-home .community-list-card,
body.is-home .community-review-card{
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

body.is-home .home-mini-card:hover,
body.is-home .community-list-card:hover,
body.is-home .community-review-card:hover{
  transform: translate3d(0, -4px, 0);
  box-shadow: 0 16px 38px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.025) inset;
}

/* List previews use the same poster rhythm as profile list cards. */
.home-list-card .home-list-grid4,
#homeFeaturedLists .home-list-card .home-list-grid4,
#listsSection .community-list-grid{
  display: flex;
  gap: 10px;
  width: auto;
  min-height: 0;
  height: auto;
  margin: 0;
  padding: 18px 18px 0;
  overflow-x: auto;
}

.home-list-card .home-list-grid4 .slot,
#homeFeaturedLists .home-list-card .home-list-grid4 .slot,
#listsSection .community-poster-slot{
  width: 108px;
  height: 162px;
  flex: 0 0 auto;
  min-width: 0;
  min-height: 0;
  aspect-ratio: auto;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.06);
}

.home-list-card .home-list-grid4 .slot:first-child,
.home-list-card .home-list-grid4 .slot:last-child,
#homeFeaturedLists .home-list-card .home-list-grid4 .slot:first-child,
#homeFeaturedLists .home-list-card .home-list-grid4 .slot:last-child,
#listsSection .community-poster-slot:first-child,
#listsSection .community-poster-slot:last-child{
  border-radius: 10px;
}

@media (max-width: 620px){
  .home-list-card .home-list-grid4,
  #homeFeaturedLists .home-list-card .home-list-grid4,
  #listsSection .community-list-grid{
    gap: 10px;
    width: auto;
    min-height: 0;
    height: auto;
    padding: 0 12px 14px;
    overflow-x: auto;
  }

  .home-list-card .home-list-grid4 .slot,
  #homeFeaturedLists .home-list-card .home-list-grid4 .slot,
  #listsSection .community-poster-slot{
    width: 86px;
    height: 129px;
  }
}

/* Wider home content so social cards and carousel titles are not squeezed. */
body.is-home .container{
  width: min(1440px, calc(100vw - 120px));
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}

body.is-home #homeSections,
body.is-home .home-block{
  width: 100%;
}

body.is-home .section-header{
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

#homeSections .home-block > .section-header{
  box-sizing: border-box;
  padding-left: 20px;
  padding-right: 20px;
}

#homeFeaturedReviewsBlock > .section-header,
#homeFeaturedListsBlock > .section-header{
  max-width: 1160px;
  padding-left: 0;
  padding-right: 0;
}

#homeFeaturedTierlistsBlock > .section-header{
  max-width: 1084px;
  padding-left: 0;
  padding-right: 0;
}

#homeFeaturedReviewsBlock .home-community-grid,
#homeFeaturedListsBlock .home-community-grid,
#homeFeaturedTierlistsBlock .home-tierlists-grid{
  margin-left: auto;
  margin-right: auto;
}

#homeFeaturedReviewsBlock .home-community-grid,
#homeFeaturedListsBlock .home-community-grid{
  grid-template-columns: repeat(2, minmax(520px, 1fr));
  max-width: 1160px;
  justify-content: center;
}

#homeFeaturedTierlistsBlock .home-tierlists-grid{
  max-width: 1084px;
  justify-content: center;
}

@media (max-width: 1100px){
  #homeFeaturedReviewsBlock .home-community-grid,
  #homeFeaturedListsBlock .home-community-grid{
    grid-template-columns: minmax(0, 560px);
    max-width: 560px;
  }

  #homeFeaturedTierlistsBlock .home-tierlists-grid{
    grid-template-columns: minmax(0, 560px);
    max-width: 560px;
  }
}

@media (max-width: 640px){
  body.is-home .container{
    width: min(100%, calc(100vw - 24px));
  }

  #homeSections .home-block > .section-header{
    padding-left: 12px;
    padding-right: 12px;
  }

  #homeFeaturedReviewsBlock > .section-header,
  #homeFeaturedListsBlock > .section-header,
  #homeFeaturedTierlistsBlock > .section-header{
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  #homeFeaturedReviewsBlock .home-community-grid,
  #homeFeaturedListsBlock .home-community-grid,
  #homeFeaturedTierlistsBlock .home-tierlists-grid{
    grid-template-columns: minmax(0, 1fr);
    max-width: 100%;
  }
}

/* One shared title/card column for every home section. */
body.is-home{
  --home-content-gutter: 20px;
}

body.is-home #homeSections .home-block > .section-header,
body.is-home .home-trailer-head,
body.is-home #homeBoxOfficeBlock > .section-header,
body.is-home #homeFeaturedReviewsBlock > .section-header,
body.is-home #homeFeaturedListsBlock > .section-header,
body.is-home #homeFeaturedTierlistsBlock > .section-header{
  max-width: none;
  width: 100%;
  box-sizing: border-box;
  padding-left: var(--home-content-gutter);
  padding-right: var(--home-content-gutter);
  margin-left: 0;
  margin-right: 0;
}

body.is-home #homeSections .hs-track,
body.is-home .home-trailer-track,
body.is-home #homeBoxOfficeGrid,
body.is-home #homeFeaturedReviewsBlock .home-community-grid,
body.is-home #homeFeaturedListsBlock .home-community-grid,
body.is-home #homeFeaturedTierlistsBlock .home-tierlists-grid{
  box-sizing: border-box;
  padding-left: var(--home-content-gutter);
  padding-right: var(--home-content-gutter);
}

.home-boxoffice-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 8px;
}

.home-boxoffice-card{
  position: relative;
  min-width: 0;
  display: grid;
  grid-template-columns: 34px 74px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 132px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(18,18,18,.96), rgba(9,9,9,.98));
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.home-boxoffice-card:hover{
  transform: translateY(-3px);
  border-color: rgba(255,230,0,.30);
  box-shadow: 0 16px 38px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.025) inset;
}

.home-boxoffice-rank{
  color: #fff;
  font-size: 1.05rem;
  font-weight: 950;
  text-align: center;
}

.home-boxoffice-poster{
  width: 74px;
  height: 111px;
  border-radius: 8px;
  overflow: hidden;
  background: #1b1b1b;
  border: 1px solid rgba(255,255,255,.08);
}

.home-boxoffice-poster img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.home-boxoffice-poster-empty{
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  padding: 8px;
  color: rgba(255,255,255,.55);
  font-size: .72rem;
  font-weight: 800;
  text-align: center;
}

.home-boxoffice-body{
  min-width: 0;
}

.home-boxoffice-title{
  color: #4d91ff;
  font-size: .98rem;
  font-weight: 850;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-boxoffice-revenue{
  margin-top: 7px;
  color: #fff;
  font-size: .92rem;
  font-weight: 900;
}

.home-boxoffice-note{
  margin-top: 4px;
  color: rgba(255,255,255,.58);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.25;
}

.home-boxoffice-empty{
  color: rgba(255,255,255,.68);
  font-weight: 800;
}

.home-section-title-link,
.home-boxoffice-title-link{
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  cursor: pointer;
  text-align: left;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.home-section-title-link .title-arrow,
.home-boxoffice-title-link .title-arrow{
  color: #fff;
  font-size: 1.18em;
  line-height: 1;
  transition: transform .18s ease, color .18s ease;
}

.home-section-title-link:hover .title-arrow,
.home-boxoffice-title-link:hover .title-arrow{
  color: #ffe600;
  transform: translateX(3px);
}

.boxoffice-section{
  padding-top: 6px;
}

.boxoffice-page-subtitle{
  margin-top: 4px;
  color: rgba(255,255,255,.68);
  font-size: .94rem;
  font-weight: 750;
}

.boxoffice-filter-shell{
  position: relative;
  width: min(1120px, 100%);
  margin: 0 auto 18px;
}

.boxoffice-filter-toggle,
.boxoffice-apply{
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.78);
  min-height: 36px;
  padding: 0 14px;
  font-weight: 850;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.boxoffice-filter-toggle:hover,
.boxoffice-apply:hover{
  transform: translateY(-1px);
  color: #fff;
  border-color: rgba(255,230,0,.32);
}

.boxoffice-filter-toggle[aria-expanded="true"],
.boxoffice-apply{
  background: #ffe600;
  border-color: rgba(255,230,0,.90);
  color: #111;
}

.boxoffice-filter-panel{
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 100;
  display: none;
  width: min(560px, calc(100vw - 32px));
  padding: 16px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(13,13,13,.98);
  box-shadow: 0 22px 50px rgba(0,0,0,.54);
}

.boxoffice-filter-panel.open{
  display: grid;
  gap: 16px;
}

.boxoffice-filter-group{
  display: grid;
  gap: 9px;
}

.boxoffice-filter-label,
.boxoffice-year-field span{
  color: rgba(255,255,255,.62);
  font-size: .8rem;
  font-weight: 900;
  text-transform: uppercase;
}

.boxoffice-country-options{
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.boxoffice-country,
.boxoffice-check{
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 8px;
  background: rgba(255,255,255,.045);
  color: rgba(255,255,255,.84);
  padding: 0 12px;
  font-weight: 850;
}

.boxoffice-country{
  cursor: pointer;
}

.boxoffice-country.active{
  border-color: rgba(255,230,0,.82);
  background: rgba(255,255,255,.07);
  color: #ffe600;
}

.boxoffice-check,
.boxoffice-country{
  cursor: pointer;
}

.boxoffice-check input{
  accent-color: #ffe600;
}

.boxoffice-year-field{
  display: grid;
  gap: 7px;
}

.boxoffice-year-field input{
  width: 140px;
  min-height: 38px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  color: #fff;
  padding: 0 10px;
  font-weight: 850;
}

.boxoffice-year-field input:disabled{
  opacity: .45;
}

.boxoffice-list{
  width: min(1120px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 14px;
}

.boxoffice-row{
  display: grid;
  grid-template-columns: 38px 92px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(18,18,18,.96), rgba(9,9,9,.98));
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.boxoffice-row:hover{
  transform: translateY(-3px);
  border-color: rgba(255,230,0,.30);
  box-shadow: 0 16px 38px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.025) inset;
}

.boxoffice-row-rank{
  color: #fff;
  font-size: 1.1rem;
  font-weight: 950;
  text-align: center;
}

.boxoffice-row-poster{
  width: 92px;
  height: 138px;
  border-radius: 10px;
  overflow: hidden;
  background: #1b1b1b;
  border: 1px solid rgba(255,255,255,.08);
}

.boxoffice-row-poster img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.boxoffice-row-body{
  min-width: 0;
}

.boxoffice-row-head{
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.boxoffice-row-head h3{
  margin: 0;
  min-width: 0;
  color: #fff;
  font-size: 1.08rem;
  font-weight: 950;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.boxoffice-row-rating{
  flex: 0 0 auto;
  color: #ffe600;
  font-size: .92rem;
  font-weight: 900;
}

.boxoffice-row-money{
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  color: rgba(255,255,255,.72);
  font-size: .9rem;
  font-weight: 800;
}

.boxoffice-row-money strong{
  color: #fff;
}

.boxoffice-row-body p{
  margin: 10px 0 0;
  color: rgba(255,255,255,.70);
  font-size: .92rem;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

body.is-home #homeFeaturedReviewsBlock .home-community-grid,
body.is-home #homeFeaturedListsBlock .home-community-grid{
  grid-template-columns: repeat(auto-fit, minmax(min(520px, 100%), 560px));
  max-width: none;
  justify-content: start;
  margin-left: 0;
  margin-right: 0;
}

body.is-home #homeFeaturedTierlistsBlock .home-tierlists-grid{
  grid-template-columns: repeat(auto-fit, minmax(min(500px, 100%), 520px));
  max-width: none;
  justify-content: start;
  margin-left: 0;
  margin-right: 0;
}

@media (max-width: 640px){
  body.is-home{
    --home-content-gutter: 12px;
  }

  .home-boxoffice-grid{
    grid-template-columns: minmax(0, 1fr);
  }

  .home-boxoffice-card{
    grid-template-columns: 28px 62px minmax(0, 1fr);
    min-height: 116px;
    gap: 10px;
  }

  .home-boxoffice-poster{
    width: 62px;
    height: 93px;
  }

  .boxoffice-list{
    width: 100%;
  }

  .boxoffice-row{
    grid-template-columns: 26px 72px minmax(0, 1fr);
    gap: 10px;
    padding: 12px;
  }

  .boxoffice-row-poster{
    width: 72px;
    height: 108px;
  }

  .boxoffice-row-head{
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .boxoffice-row-head h3{
    white-space: normal;
  }
}

/* Contadores de listas/reviews: mesmo padrão visual dos tierlists */
#homeFeaturedReviews .home-list-like-stat,
#homeFeaturedReviews .home-list-like-stat .compact-count,
#homeFeaturedReviews .home-list-like-stat svg,
#homeFeaturedReviews .home-list-like-stat svg path,
#homeFeaturedLists .home-list-like-stat,
#homeFeaturedLists .home-list-like-stat .compact-count,
#homeFeaturedLists .home-list-like-stat svg,
#homeFeaturedLists .home-list-like-stat svg path,
#reviewsSection .home-list-like-stat,
#reviewsSection .home-list-like-stat .compact-count,
#reviewsSection .home-list-like-stat svg,
#reviewsSection .home-list-like-stat svg path,
#listsSection .home-list-like-stat,
#listsSection .home-list-like-stat .compact-count,
#listsSection .home-list-like-stat svg,
#listsSection .home-list-like-stat svg path{
  color: #ff4d5f !important;
  stroke: #ff4d5f !important;
}

#homeFeaturedReviews .home-list-like-stat.active svg,
#homeFeaturedReviews .home-list-like-stat.active svg path,
#homeFeaturedLists .home-list-like-stat.active svg,
#homeFeaturedLists .home-list-like-stat.active svg path,
#reviewsSection .home-list-like-stat.active svg,
#reviewsSection .home-list-like-stat.active svg path,
#listsSection .home-list-like-stat.active svg,
#listsSection .home-list-like-stat.active svg path{
  fill: #ff4d5f !important;
  stroke: #ff4d5f !important;
}

#homeFeaturedReviews .home-list-like-stat:not(.active) svg,
#homeFeaturedReviews .home-list-like-stat:not(.active) svg path,
#homeFeaturedLists .home-list-like-stat:not(.active) svg,
#homeFeaturedLists .home-list-like-stat:not(.active) svg path,
#reviewsSection .home-list-like-stat:not(.active) svg,
#reviewsSection .home-list-like-stat:not(.active) svg path,
#listsSection .home-list-like-stat:not(.active) svg,
#listsSection .home-list-like-stat:not(.active) svg path{
  fill: transparent !important;
}

#homeFeaturedReviews .home-list-comment-stat,
#homeFeaturedReviews .home-list-comment-stat .compact-count,
#homeFeaturedReviews .home-list-comment-stat svg,
#homeFeaturedReviews .home-list-comment-stat svg path,
#homeFeaturedLists .home-list-comment-stat,
#homeFeaturedLists .home-list-comment-stat .compact-count,
#homeFeaturedLists .home-list-comment-stat svg,
#homeFeaturedLists .home-list-comment-stat svg path,
#reviewsSection .home-list-comment-stat,
#reviewsSection .home-list-comment-stat .compact-count,
#reviewsSection .home-list-comment-stat svg,
#reviewsSection .home-list-comment-stat svg path,
#listsSection .home-list-comment-stat,
#listsSection .home-list-comment-stat .compact-count,
#listsSection .home-list-comment-stat svg,
#listsSection .home-list-comment-stat svg path{
  color: #f1f1f1 !important;
  stroke: #f1f1f1 !important;
}

#homeFeaturedReviews .home-list-save-stat,
#homeFeaturedReviews .home-list-save-stat .compact-count,
#homeFeaturedReviews .home-list-save-stat svg,
#homeFeaturedReviews .home-list-save-stat svg path,
#homeFeaturedLists .home-list-save-stat,
#homeFeaturedLists .home-list-save-stat .compact-count,
#homeFeaturedLists .home-list-save-stat svg,
#homeFeaturedLists .home-list-save-stat svg path,
#reviewsSection .home-list-save-stat,
#reviewsSection .home-list-save-stat .compact-count,
#reviewsSection .home-list-save-stat svg,
#reviewsSection .home-list-save-stat svg path,
#listsSection .home-list-save-stat,
#listsSection .home-list-save-stat .compact-count,
#listsSection .home-list-save-stat svg,
#listsSection .home-list-save-stat svg path{
  color: #ffe600 !important;
  stroke: #ffe600 !important;
}

#homeFeaturedReviews .home-list-save-stat.active svg,
#homeFeaturedReviews .home-list-save-stat.active svg path,
#homeFeaturedLists .home-list-save-stat.active svg,
#homeFeaturedLists .home-list-save-stat.active svg path,
#reviewsSection .home-list-save-stat.active svg,
#reviewsSection .home-list-save-stat.active svg path,
#listsSection .home-list-save-stat.active svg,
#listsSection .home-list-save-stat.active svg path{
  fill: #ffe600 !important;
}

#homeFeaturedReviews .home-list-save-stat:not(.active) svg,
#homeFeaturedReviews .home-list-save-stat:not(.active) svg path,
#homeFeaturedLists .home-list-save-stat:not(.active) svg,
#homeFeaturedLists .home-list-save-stat:not(.active) svg path,
#reviewsSection .home-list-save-stat:not(.active) svg,
#reviewsSection .home-list-save-stat:not(.active) svg path,
#listsSection .home-list-save-stat:not(.active) svg,
#listsSection .home-list-save-stat:not(.active) svg path{
  fill: transparent !important;
}