/* =========================================================
   QG Cosplay — qgcosplay.css (CLARO / MODERNO / GALERIA)
========================================================= */

:root{
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface2: #fbfbfd;

  --text: #101318;
  --muted: #5f6673;

  --brand: #ff6b00;      /* laranja */
  --brand-2: #ff8a2a;
  --purple: #7b1fa2;

  --border: rgba(17, 24, 39, .10);
  --shadow: 0 10px 30px rgba(16, 19, 24, .08);

  --radius: 18px;
  --radius2: 22px;

  --container: 1180px;
}

*{ box-sizing: border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  background: #EDEDED;
}

a{ color: inherit; text-decoration: none; }
img{ max-width:100%; display:block; }

.qg-header{
  position: sticky;
  top:0;
  z-index: 20;
  backdrop-filter: blur(10px);
  background: rgba(246, 247, 251, .75);
  border-bottom: 1px solid var(--border);
}

.qg-header__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 14px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
}

.qg-brand{
  display:flex;
  align-items:center;
  gap: 12px;
  min-width: 220px;
}

.qg-brand__logo{
  height: 40px;
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 6px 14px rgba(0,0,0,.08));
}

.qg-brand__text{
  font-weight: 800;
  letter-spacing: -0.02em;
  font-size: 18px;
}

.qg-nav{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content:flex-end;
}

.qg-nav__link{
  padding: 10px 12px;
  border-radius: 999px;
  color: var(--muted);
  font-weight: 600;
  border: 1px solid transparent;
}
.qg-nav__link:hover{
  background: var(--surface);
  border-color: var(--border);
  color: var(--text);
  box-shadow: 0 8px 24px rgba(16, 19, 24, .06);
}

.qg-nav__cta{
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(90deg, var(--brand), var(--brand-2));
  border: 1px solid rgba(255,107,0,.25);
  box-shadow: 0 12px 28px rgba(255,107,0,.18);
}
.qg-nav__cta:hover{
  transform: translateY(-1px);
}

.qg-socialbar{
  border-top: 1px solid var(--border);
  background: rgba(255,255,255,.55);
}
.qg-socialbar__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 10px 18px;
  display:flex;
  gap: 12px;
  align-items:center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.qg-socialbar__label{
  color: var(--muted);
  font-weight: 700;
  font-size: 13px;
}
.qg-socialbar__links{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

.qg-chip{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 10px 22px rgba(16,19,24,.05);
}
.qg-chip:hover{ transform: translateY(-1px); }
.qg-chip__abbr{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  font-weight: 900;
  font-size: 12px;
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--brand));
}
.qg-chip__label{
  font-weight: 700;
  font-size: 13px;
  color: var(--text);
}

.qg-main{
  max-width: var(--container);
  margin: 0 auto;
  padding: 18px;
}

.qg-hero{
  padding: 18px 0 6px;
}
.qg-hero__inner{
  display:grid;
  grid-template-columns: 1.25fr .9fr;
  gap: 16px;
}
@media (max-width: 980px){
  .qg-hero__inner{ grid-template-columns: 1fr; }
}

.qg-hero__text{
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.70));
  border: 1px solid var(--border);
  border-radius: var(--radius2);
  padding: 22px;
  box-shadow: var(--shadow);
}
.qg-hero__title{
  margin: 0 0 8px;
  font-size: 34px;
  letter-spacing: -0.03em;
}
.qg-hero__subtitle{
  margin: 0 0 16px;
  color: var(--muted);
  line-height: 1.5;
}

.qg-hero__actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

.qg-hero__panel{
  padding: 18px;
}

.qg-search__label{
  display:block;
  font-weight: 800;
  font-size: 13px;
  margin-bottom: 10px;
  color: var(--text);
}
.qg-search__row{
  display:flex;
  gap: 10px;
}
@media (max-width: 520px){
  .qg-search__row{ flex-direction: column; }
}
.qg-search__hint{
  margin-top: 10px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}

.qg-input{
  width: 100%;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: #fff;
  outline: none;
  font-weight: 600;
}
.qg-input:focus{
  border-color: rgba(255,107,0,.45);
  box-shadow: 0 0 0 4px rgba(255,107,0,.12);
}

.qg-btn{
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-weight: 900;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
}
.qg-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(16,19,24,.08);
}
.qg-btn--primary{
  color: #fff;
  border-color: rgba(255,107,0,.25);
  background: linear-gradient(90deg, var(--brand), var(--brand-2));
  box-shadow: 0 12px 28px rgba(255,107,0,.18);
}

.qg-section{
  margin-top: 18px;
}
.qg-section__head{
  display:flex;
  align-items:flex-end;
  justify-content: space-between;
  gap: 10px;
  margin: 8px 0 12px;
}
.qg-section__title{
  margin: 0;
  font-size: 18px;
  letter-spacing: -0.02em;
}
.qg-section__more{
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid transparent;
}
.qg-section__more:hover{
  border-color: var(--border);
  background: var(--surface);
  color: var(--text);
}

.qg-empty{
  border: 1px dashed rgba(17, 24, 39, .18);
  background: rgba(255,255,255,.65);
  border-radius: var(--radius2);
  padding: 16px;
  color: var(--muted);
  font-weight: 700;
}

.qg-grid{
  display:grid;
  gap: 12px;
}
.qg-grid--cards{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 980px){ .qg-grid--cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 540px){ .qg-grid--cards{ grid-template-columns: 1fr; } }

.qg-card{
  border-radius: var(--radius2);
  overflow:hidden;
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 10px 26px rgba(16,19,24,.06);
  transition: transform .15s ease;
}
.qg-card:hover{ transform: translateY(-2px); }

.qg-card__media{
  position: relative;
  aspect-ratio: 4/3;
  background: #eef0f6;
}
.qg-card__media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.qg-card__ph{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  color: var(--muted);
  font-weight: 900;
}

.qg-badge{
  position:absolute;
  left: 12px;
  top: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 11px;
  color: #fff;
  background: linear-gradient(135deg, var(--purple), var(--brand));
  box-shadow: 0 12px 28px rgba(0,0,0,.10);
}
.qg-badge--dark{
  background: rgba(16,19,24,.82);
}

.qg-card__body{
  padding: 12px 12px 14px;
}
.qg-card__title{
  font-weight: 900;
  letter-spacing: -0.01em;
  margin-bottom: 6px;
  line-height: 1.25;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.qg-card__meta{
  color: var(--muted);
  font-weight: 700;
  font-size: 12.5px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
}
.qg-card__meta span{
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(246,247,251,.8);
}

.qg-grid--people{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 980px){ .qg-grid--people{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 540px){ .qg-grid--people{ grid-template-columns: 1fr; } }

.qg-person{
  display:flex;
  gap: 12px;
  padding: 12px;
  border-radius: var(--radius2);
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 10px 26px rgba(16,19,24,.06);
  transition: transform .15s ease;
}
.qg-person:hover{ transform: translateY(-2px); }

.qg-person__avatar{
  position: relative;
  width: 64px;
  min-width: 64px;
  height: 64px;
  border-radius: 18px;
  overflow:hidden;
  background: #eef0f6;
  border: 1px solid var(--border);
}
.qg-person__avatar img{
  width:100%;
  height:100%;
  object-fit: cover;
}
.qg-person__ph{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-weight: 900;
  color:#fff;
  background: linear-gradient(135deg, var(--purple), var(--brand));
}
.qg-verify{
  position:absolute;
  right: 8px;
  bottom: 8px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  font-weight: 900;
  font-size: 12px;
  color:#fff;
  background: rgba(16,19,24,.86);
  border: 1px solid rgba(255,255,255,.35);
}

.qg-person__body{ min-width: 0; }
.qg-person__name{
  font-weight: 900;
  letter-spacing: -0.01em;
  margin-bottom: 2px;
}
.qg-person__loc{
  color: var(--muted);
  font-weight: 800;
  font-size: 12.5px;
  margin-bottom: 6px;
}
.qg-person__bio{
  color: var(--text);
  font-weight: 600;
  font-size: 13px;
  line-height: 1.35;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.qg-person__bio--muted{ color: var(--muted); }

.qg-grid--videos{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 980px){ .qg-grid--videos{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 540px){ .qg-grid--videos{ grid-template-columns: 1fr; } }

.qg-vcard{
  border-radius: var(--radius2);
  overflow:hidden;
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 10px 26px rgba(16,19,24,.06);
  transition: transform .15s ease;
}
.qg-vcard:hover{ transform: translateY(-2px); }

.qg-vcard__media{
  position: relative;
  aspect-ratio: 16/9;
  background: #eef0f6;
}
.qg-vcard__media img{
  width:100%;
  height:100%;
  object-fit: cover;
}
.qg-vcard__ph{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  color: var(--muted);
  font-weight: 900;
}

.qg-play{
  position:absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 54px;
  height: 54px;
  border-radius: 999px;
  background: rgba(16,19,24,.68);
  border: 1px solid rgba(255,255,255,.25);
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
}
.qg-play::before{
  content:"";
  position:absolute;
  left: 22px;
  top: 16px;
  width:0;
  height:0;
  border-left: 16px solid #fff;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  opacity: .95;
}

.qg-vcard__body{ padding: 12px; }
.qg-vcard__title{
  font-weight: 900;
  letter-spacing: -0.01em;
  line-height: 1.25;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.qg-footer{
  margin-top: 22px;
  border-top: 1px solid var(--border);
  background: rgba(255,255,255,.70);
}
.qg-footer__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 16px 18px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.qg-footer__brand img{
  height: 34px;
  width:auto;
  object-fit: contain;
}
.qg-footer__links{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
}
.qg-footer__links a:hover{ color: var(--text); }
.qg-footer__legal{
  color: var(--muted);
  font-weight: 700;
  font-size: 13px;
}
/* ===== Menu responsivo ===== */
.qg-nav__toggle{
  display:none;
  width:44px; height:44px;
  border-radius:14px;
  border:1px solid var(--border);
  background: var(--surface);
  box-shadow: 0 10px 22px rgba(16,19,24,.05);
  cursor:pointer;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:10px;
}
.qg-nav__toggleBar{
  display:block;
  width:20px; height:2px;
  background: rgba(16,19,24,.78);
  border-radius: 2px;
}

@media (max-width: 980px){
  .qg-nav__toggle{ display:flex; }
  .qg-nav{
    position: fixed;
    top: 70px;
    right: 16px;
    left: 16px;
    display:none;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    border-radius: 18px;
    background: rgba(255,255,255,.92);
    border: 1px solid var(--border);
    box-shadow: 0 20px 50px rgba(16,19,24,.14);
  }
  .qg-nav.is-open{ display:flex; }
  .qg-nav__link{ width: 100%; }
  .qg-nav__cta{ width: 100%; justify-content:center; }
}

/* ===== Busca full width ===== */
.qg-hero__inner--full{ grid-template-columns: 1fr !important; }
.qg-hero__panel--full{ width: 100%; }
.qg-search__row--full{ width:100%; }
.qg-input--xl{ padding: 14px 14px; font-size: 15px; }
.qg-btn--xl{ padding: 14px 16px; }

/* deixa o main mais largo na página de busca */
.qg-main--wide{ max-width: 1280px; }

/* ===== Capa SEM corte (contain) ===== */
.qg-card__media--contain img,
.qg-vcard__media--contain img{
  width: 100%;
  height: 100%;
  object-fit: contain;     /* <- SEM CORTE */
  background: #eef0f6;     /* fundo clean para letterbox */
}

/* mantém card bonito e responsivo */
.qg-card__media,
.qg-vcard__media{
  background:#eef0f6;
}
/* ===== Ensaios: capa ocupa 100% do card (corta se precisar) ===== */
.qg-card__media--portrait{
  background: #eef0f6;
}

.qg-card__media--cover img{
  width: 100%;
  height: 100%;
}

/* (opcional) melhora visual com leve zoom on-hover */
.qg-card:hover .qg-card__media--cover img{
  transform: scale(1.02);
  transition: transform .18s ease;
}
/* =========================================================
   FIX ENSAIO: capa 100% preenchida (cover) — COLAR NO FINAL
========================================================= */
.qg-card .qg-card__media{
  position: relative;
  overflow: hidden;
}

.qg-card .qg-card__media.qg-card__media--portrait{
  aspect-ratio: 3 / 4;      /* vertical */
  background: #eef0f6;
}

/* força preencher sempre */
.qg-card .qg-card__media.qg-card__media--cover img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;         /* ocupa tudo */
  object-position: top;   /* corte central */
  display: block;
}

/* se houver alguma regra antiga de contain, isso sobrescreve */
.qg-card .qg-card__media.qg-card__media--cover{
  background: #eef0f6;
}
/* =========================================================
   FIX LIVE SEARCH: dropdown + estilos — COLAR NO FINAL
========================================================= */

/* importante: permite posicionar o dropdown relativo ao form */
.qg-search{
  position: relative;
}

/* caixa do dropdown */
.qg-live{
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 10px);
  z-index: 999;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.98);
  border-radius: 18px;
  box-shadow: 0 22px 60px rgba(16,19,24,.14);
  overflow: hidden;
}

/* em telas pequenas, garante não “estourar” */
@media (max-width: 520px){
  .qg-live{
    left: 0;
    right: 0;
  }
}

.qg-live__section + .qg-live__section{
  border-top: 1px solid var(--border);
}

.qg-live__title{
  padding: 10px 12px;
  font-weight: 900;
  font-size: 12px;
  color: var(--muted);
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(246,247,251,.85);
}

.qg-live__list{
  display: flex;
  flex-direction: column;
}

.qg-live__item{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-top: 1px solid rgba(17,24,39,.06);
}

.qg-live__item:hover{
  background: rgba(255,107,0,.08);
}

.qg-live__thumb{
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border-radius: 14px;
  overflow: hidden;
  background: #eef0f6;
  border: 1px solid rgba(17,24,39,.08);
}

.qg-live__thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.qg-live__thumb span{
  display: block;
  width: 100%;
  height: 100%;
}

.qg-live__txt{
  min-width: 0;
  flex: 1;
}

.qg-live__name{
  font-weight: 900;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.qg-live__meta{
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.qg-live__ver{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-weight: 900;
  color: #fff;
  background: rgba(16,19,24,.86);
  border: 1px solid rgba(255,255,255,.35);
}

.qg-live__empty{
  padding: 14px 12px;
  color: var(--muted);
  font-weight: 800;
}
/* ===== Fotógrafos (cards) ===== */
.qg-person__name{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}

.qg-tag{
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,107,0,.10);
  color: rgba(16,19,24,.86);
  font-weight: 900;
  font-size: 11px;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.qg-person__stats{
  margin-top: 2px;
  color: var(--muted);
  font-weight: 800;
  font-size: 12.5px;
}
/* =========================================================
   Rodapé minimal: logo centro + socials abaixo + direitos
   (COLAR NO FINAL)
========================================================= */
.qg-footer--minimal{
  margin-top: 26px;
  border-top: 1px solid var(--border);
  background: rgba(255,255,255,.72);
}

.qg-footer__inner--center{
  max-width: var(--container);
  margin: 0 auto;
  padding: 26px 18px 20px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap: 14px;
}

.qg-footer__brandBig img{
  height: 64px;
  width: auto;
  object-fit: contain;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.08));
}
@media (max-width: 540px){
  .qg-footer__brandBig img{ height: 54px; }
}

.qg-footer__brandText{
  font-weight: 900;
  font-size: 22px;
  letter-spacing: -0.02em;
}

.qg-footer__social{
  display:flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content:center;
}

.qg-footchip{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-weight: 800;
  font-size: 13px;
  color: var(--text);
  box-shadow: 0 10px 22px rgba(16,19,24,.05);
}
.qg-footchip:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(16,19,24,.08);
}

.qg-footchip__abbr{
  width: 26px;
  height: 26px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  font-weight: 900;
  background: rgba(255,107,0,.12);
  border: 1px solid rgba(255,107,0,.22);
}

.qg-footer__legal{
  margin-top: 2px;
  color: var(--muted);
  font-weight: 700;
  font-size: 13px;
}
/* =========================================================
   Ensaios recentes: MOBILE = 2 colunas por linha
   (COLAR NO FINAL)
========================================================= */

/* alvo: o grid usado em "Ensaios recentes" */
@media (max-width: 680px){
  .qg-grid.qg-grid--cards{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}

/* opcional: em telas MUITO pequenas, reduz o gap e ajusta tipografia */
@media (max-width: 380px){
  .qg-grid.qg-grid--cards{
    gap: 10px !important;
  }
  .qg-card__title{
    font-size: 13.5px;
  }
  .qg-card__meta{
    font-size: 12px;
  }
}
/* =========================================================
   Ensaio page: hero + gallery + lightbox (COLAR NO FINAL)
========================================================= */
.qg-ens-hero{
  padding: 18px 0 8px;
}
.qg-ens-hero__inner{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 18px;
  display: grid;
  grid-template-columns: 420px 1fr;
  gap: 18px;
}
@media (max-width: 980px){
  .qg-ens-hero__inner{ grid-template-columns: 1fr; }
}

.qg-ens-hero__cover{
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: #eef0f6;
  aspect-ratio: 3/4;
  position: relative;
}
.qg-ens-hero__cover img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;          /* ocupa tudo */
  object-position: center;
  display: block;
}
.qg-ens-hero__ph{
  height: 100%;
  display: grid;
  place-items: center;
  color: var(--muted);
  font-weight: 800;
}

.qg-ens-hero__info{
  border-radius: 22px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.78);
  box-shadow: 0 20px 50px rgba(16,19,24,.06);
  padding: 16px 16px 14px;
}

.qg-ens-back{
  display:inline-block;
  font-weight: 900;
  color: var(--muted);
  margin-bottom: 6px;
}
.qg-ens-title{
  margin: 0;
  font-size: 28px;
  letter-spacing: -0.02em;
}
@media (max-width: 520px){
  .qg-ens-title{ font-size: 22px; }
}

.qg-ens-chips{
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.qg-chip2{
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-weight: 900;
  font-size: 12px;
}
.qg-chip2--soft{
  background: rgba(17,24,39,.04);
}
.qg-chip2--muted{
  background: rgba(17,24,39,.03);
  color: var(--muted);
}

.qg-ens-desc{
  margin-top: 12px;
  color: rgba(16,19,24,.82);
  font-weight: 600;
  line-height: 1.55;
}

.qg-ens-tags{
  margin-top: 8px;
  display:flex;
  flex-wrap: wrap;
  gap: 6px;
}
.qg-pill{
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(255,107,0,.10);
  font-weight: 900;
  font-size: 12px;
}

.qg-person--wide{
  max-width: 860px;
}

/* Gallery */
.qg-gallery{
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
}
@media (max-width: 980px){
  .qg-gallery{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 680px){
  .qg-gallery{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

.qg-gitem{
  border: 1px solid var(--border);
  background: #eef0f6;
  border-radius: 18px;
  overflow: hidden;
  padding: 0;
  cursor: pointer;
  aspect-ratio: 3/4;
  position: relative;
}
.qg-gitem img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}
.qg-gitem:hover img{ transform: scale(1.02); transition: transform .18s ease; }

/* Lightbox */
.qg-lock{ overflow: hidden; }
.qg-lightbox{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
}
.qg-lightbox.is-open{ display: block; }
.qg-lightbox__backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.72);
}
.qg-lightbox__panel{
  position:absolute;
  inset: 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(255,255,255,.2);
  box-shadow: 0 30px 80px rgba(0,0,0,.35);
  overflow: hidden;
}
@media (max-width: 520px){
  .qg-lightbox__panel{ inset: 10px; }
}

.qg-lightbox__media{
  position:absolute;
  inset: 0 0 54px 0;
  background: #111;
  display:grid;
  place-items:center;
}
.qg-lightbox__media img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display:block;
}

.qg-lightbox__cap{
  position:absolute;
  left:0; right:0; bottom:0;
  padding: 12px 14px;
  font-weight: 800;
  color: rgba(16,19,24,.86);
  background: rgba(255,255,255,.92);
  border-top: 1px solid rgba(17,24,39,.10);
  min-height: 54px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.qg-lightbox__close{
  position:absolute;
  top: 10px; right: 10px;
  width: 44px; height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(16,19,24,.65);
  color: #fff;
  font-weight: 900;
  cursor:pointer;
  z-index: 2;
}

.qg-lightbox__nav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px; height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(16,19,24,.55);
  color: #fff;
  font-size: 34px;
  line-height: 1;
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index: 2;
}
.qg-lightbox__nav--prev{ left: 10px; }
.qg-lightbox__nav--next{ right: 10px; }
/* =========================================================
   Ensaio: Masonry gallery + Lightbox (SEM CORTE)
   COLAR NO FINAL
========================================================= */

/* Masonry (colunas) */
.qg-masonry{
  columns: 4 260px;
  column-gap: 12px;
}

@media (max-width: 980px){
  .qg-masonry{ columns: 3 240px; }
}
@media (max-width: 680px){
  .qg-masonry{ columns: 2 200px; }
}
@media (max-width: 420px){
  .qg-masonry{ columns: 2 160px; }
}

.qg-mitem{
  display: block;
  width: 100%;
  margin: 0 0 12px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 18px;
  overflow: hidden;
  background: #eef0f6;
  cursor: pointer;
  break-inside: avoid;
  box-shadow: 0 14px 30px rgba(16,19,24,.06);
}

.qg-mitem img{
  width: 100%;
  height: auto;          /* altura natural (não corta) */
  display: block;
}

.qg-mitem:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(16,19,24,.09);
}

/* Lightbox (sempre contain) */
.qg-lock{ overflow: hidden; }

.qg-lightbox{ position: fixed; inset: 0; z-index: 9999; display:none; }
.qg-lightbox.is-open{ display:block; }

.qg-lightbox__backdrop{ position:absolute; inset:0; background: rgba(0,0,0,.78); }

.qg-lightbox__panel{
  position:absolute;
  inset: 16px;
  border-radius: 22px;
  background: rgba(255,255,255,.96);
  overflow:hidden;
  box-shadow: 0 30px 90px rgba(0,0,0,.35);
}

@media (max-width: 520px){
  .qg-lightbox__panel{ inset: 10px; }
}

.qg-lightbox__close{
  position:absolute;
  top: 10px; right: 10px;
  width: 44px; height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.35);
  background: rgba(16,19,24,.65);
  color: #fff;
  font-weight: 900;
  cursor:pointer;
  z-index: 2;
}

.qg-lightbox__nav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px; height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(16,19,24,.55);
  color: #fff;
  font-size: 34px;
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index: 2;
}
.qg-lightbox__nav--prev{ left: 10px; }
.qg-lightbox__nav--next{ right: 10px; }

.qg-lightbox__media{
  position:absolute;
  inset: 0 0 64px 0;
  display:flex;
  align-items:center;
  justify-content:center;
  background: #0b0d12;
}

.qg-lightbox__media img{
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;   /* NUNCA corta */
  display:block;
}

.qg-lightbox__cap{
  position:absolute;
  left:0; right:0; bottom:0;
  padding: 14px 14px;
  min-height: 64px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-weight: 800;
  color: rgba(16,19,24,.86);
  background: rgba(255,255,255,.92);
  border-top: 1px solid rgba(17,24,39,.10);
}
/* =========================================================
   Ensaio — Hub Gallery (claro/tech) + Lightbox OK
   COLAR NO FINAL DO CSS
========================================================= */

.qg-hubgrid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 12px;
  grid-auto-flow: dense;
}

/* Responsivo */
@media (max-width: 980px){
  .qg-hubgrid{ grid-template-columns: repeat(8, 1fr); }
}
@media (max-width: 680px){
  .qg-hubgrid{ grid-template-columns: repeat(6, 1fr); }
}
@media (max-width: 420px){
  .qg-hubgrid{ grid-template-columns: repeat(2, 1fr); }
}

/* Tile */
.qg-gtile{
  grid-column: span var(--c, 3);
  grid-row: span var(--r, 3);

  position: relative;
  padding: 0;
  border: 0;
  cursor: pointer;
  border-radius: 18px;
  overflow: hidden;

  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(245,246,252,.95));
  box-shadow: 0 14px 34px rgba(16,19,24,.08);
}

/* Frame tech */
.qg-gtile__frame{
  position: absolute;
  inset: 0;
  pointer-events: none;

  border-radius: 18px;
  border: 1px solid rgba(17,24,39,.10);
  box-shadow:
    inset 0 0 0 1px rgba(255,107,0,.10),
    inset 0 0 0 2px rgba(123,31,162,.06);
}

/* Thumb ocupa o tile */
.qg-gtile img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover; /* thumb pode cortar — é “tile”; o FULL não corta no popup */
  transform: scale(1.01);
  transition: transform .22s ease, filter .22s ease;
}

/* Hover mais “hub/tech” */
.qg-gtile:hover img{
  transform: scale(1.06);
  filter: saturate(1.06) contrast(1.03);
}
.qg-gtile:hover{
  box-shadow: 0 20px 52px rgba(16,19,24,.12);
  transform: translateY(-1px);
}

/* Índice */
.qg-gtile__idx{
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 7px 10px;
  border-radius: 14px;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .02em;
  color: rgba(255,255,255,.92);
  background: rgba(16,19,24,.62);
  border: 1px solid rgba(255,255,255,.20);
  backdrop-filter: blur(8px);
}

/* Caption */
.qg-gtile__cap{
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;

  padding: 10px 12px;
  border-radius: 16px;
  color: rgba(255,255,255,.94);
  background: linear-gradient(180deg, rgba(16,19,24,.15), rgba(16,19,24,.70));
  border: 1px solid rgba(255,255,255,.18);
  font-weight: 800;
  text-align: left;

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

/* Ícone “zoom” */
.qg-gtile__zoom{
  position: absolute;
  top: 10px;
  right: 10px;
  width: 34px;
  height: 34px;
  border-radius: 14px;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(17,24,39,.10);
  box-shadow: 0 10px 22px rgba(16,19,24,.10);
}
.qg-gtile__zoom::before{
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 14px;
  height: 14px;
  border: 2px solid rgba(16,19,24,.62);
  border-radius: 50%;
  transform: translate(-2px,-2px);
}
.qg-gtile__zoom::after{
  content: "";
  position: absolute;
  width: 10px;
  height: 2px;
  background: rgba(16,19,24,.62);
  right: 9px;
  bottom: 10px;
  transform: rotate(45deg);
  border-radius: 2px;
}

/* ========= Lightbox (SEM CORTE) ========= */

html.qg-lock, body.qg-lock{ overflow: hidden; }

.qg-lightbox{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
}
.qg-lightbox.is-open{ display: block; }

.qg-lightbox__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(10,12,16,.82);
}

.qg-lightbox__panel{
  position: absolute;
  inset: 16px;
  border-radius: 22px;
  overflow: hidden;
  background: rgba(255,255,255,.96);
  box-shadow: 0 30px 90px rgba(0,0,0,.35);
}

@media (max-width: 520px){
  .qg-lightbox__panel{ inset: 10px; }
}

/* barra superior discreta */
.qg-lightbox__top{
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid rgba(17,24,39,.10);
  z-index: 2;
}

.qg-lightbox__close{
  position: absolute;
  top: 10px; right: 10px;
  width: 40px; height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(17,24,39,.12);
  background: rgba(255,255,255,.92);
  color: rgba(16,19,24,.85);
  font-weight: 900;
  cursor: pointer;
}

.qg-lightbox__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 52px; height: 52px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.24);
  background: rgba(16,19,24,.50);
  color: #fff;
  font-size: 34px;
  display: grid;
  place-items: center;
  cursor: pointer;
  z-index: 2;
}
.qg-lightbox__nav--prev{ left: 10px; }
.qg-lightbox__nav--next{ right: 10px; }

.qg-lightbox__media{
  position: absolute;
  inset: 56px 0 70px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 20% 10%, rgba(255,107,0,.10), transparent 45%),
              radial-gradient(circle at 80% 30%, rgba(123,31,162,.10), transparent 50%),
              #0b0d12;
}

.qg-lightbox__media img{
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important; /* FULL nunca corta */
  display: block;
}

.qg-lightbox__cap{
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  text-align: center;
  font-weight: 900;
  color: rgba(16,19,24,.85);
  background: rgba(255,255,255,.94);
  border-top: 1px solid rgba(17,24,39,.10);
}
/* =========================================================
   Ensaio — HUB Game (claro / profissional)
========================================================= */

.qg-hub{
  padding-top: 14px;
}

.qg-hubTop{
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto 16px;
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 14px;
}

@media (max-width: 980px){
  .qg-hubTop{ grid-template-columns: 1fr; }
}

.qg-hubGrid{
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto 26px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 980px){
  .qg-hubGrid{ grid-template-columns: 1fr; }
}

.qg-panel{
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,249,252,.96));
  border: 1px solid rgba(17,24,39,.10);
  border-radius: 22px;
  box-shadow: 0 18px 50px rgba(16,19,24,.10);
  overflow: hidden;
}

.qg-panel--module{
  padding: 14px;
}

.qg-panel__head{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(17,24,39,.08);
  margin-bottom: 12px;
}

.qg-panel__title{
  margin: 0;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: .01em;
  color: rgba(16,19,24,.90);
}

.qg-panel__meta{
  font-size: 12px;
  font-weight: 800;
  color: rgba(16,19,24,.55);
}

/* Cover banner */
.qg-panel--cover{ padding: 0; }
.qg-hubBack{
  position: absolute;
  z-index: 2;
  margin: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(17,24,39,.12);
  color: rgba(16,19,24,.82);
  text-decoration: none;
  font-weight: 900;
}
.qg-hubBack__icon{ font-size: 16px; line-height: 1; }

.qg-cover{
  position: relative;
  height: 420px;
  background: #0b0d12;
}
@media (max-width: 980px){ .qg-cover{ height: 380px; } }
@media (max-width: 520px){ .qg-cover{ height: 320px; } }

.qg-cover img{
  width: 100%;
  height: 100%;
object-position: top;
  object-fit: cover;
  display: block;
}

.qg-cover__overlay{
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(10,12,16,.10), rgba(10,12,16,.72)),
    radial-gradient(circle at 20% 20%, rgba(255,107,0,.26), transparent 55%),
    radial-gradient(circle at 80% 30%, rgba(123,31,162,.20), transparent 60%);
}

.qg-cover__meta{
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 14px;
  z-index: 1;
  color: rgba(255,255,255,.96);
}

.qg-cover__kicker{
  font-weight: 900;
  letter-spacing: .18em;
  font-size: 11px;
  opacity: .90;
}

.qg-cover__title{
  margin: 8px 0 10px;
  font-weight: 950;
  letter-spacing: -.02em;
  line-height: 1.05;
  font-size: clamp(22px, 2.8vw, 34px);
}

.qg-cover__chips{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* Pills */
.qg-pill{
  display: inline-flex;
  align-items: center;
  padding: 8px 10px;
  border-radius: 999px;
  font-weight: 900;
  font-size: 12px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.20);
  backdrop-filter: blur(8px);
}
.qg-pill--solid{
  background: rgba(255,107,0,.92);
  border-color: rgba(255,107,0,.25);
}

/* HUD */
.qg-panel--hud{ padding: 14px; }

.qg-hudHead__title{
  font-weight: 950;
  font-size: 16px;
  color: rgba(16,19,24,.90);
  margin-bottom: 2px;
}
.qg-hudHead__sub{
  font-weight: 700;
  font-size: 12px;
  color: rgba(16,19,24,.55);
}

.qg-hudStats{
  margin-top: 12px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.qg-stat{
  border-radius: 18px;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(255,255,255,.80);
  padding: 10px 12px;
}
.qg-stat__label{
  font-size: 12px;
  font-weight: 900;
  color: rgba(16,19,24,.58);
}
.qg-stat__value{
  margin-top: 2px;
  font-size: 22px;
  font-weight: 950;
  letter-spacing: -.02em;
  color: rgba(16,19,24,.92);
}

.qg-hudDesc{
  margin-top: 12px;
  padding: 12px 12px;
  border-radius: 18px;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(255,255,255,.78);
  color: rgba(16,19,24,.78);
  line-height: 1.55;
}
.qg-hudDesc--muted{ color: rgba(16,19,24,.52); }

.qg-hudActions{
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* Créditos card row */
.qg-cardRow{
  display: grid;
  grid-template-columns: 56px 1fr 24px;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border-radius: 20px;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(255,255,255,.80);
  text-decoration: none;
  color: inherit;
  margin-bottom: 12px;
}
.qg-cardRow:hover{
  box-shadow: 0 18px 44px rgba(16,19,24,.10);
  transform: translateY(-1px);
}
.qg-cardRow__avatar{
  width: 56px; height: 56px;
  border-radius: 18px;
  overflow: hidden;
  background: rgba(16,19,24,.06);
  position: relative;
}
.qg-cardRow__avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.qg-cardRow__ph{
  width:100%; height:100%;
  display:grid; place-items:center;
  font-weight: 950;
  color: rgba(16,19,24,.70);
}
.qg-cardRow__title{
  font-weight: 950;
  color: rgba(16,19,24,.92);
  display: flex;
  align-items: center;
  gap: 8px;
}
.qg-badgeMini{
  display:inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 950;
  background: rgba(255,107,0,.12);
  border: 1px solid rgba(255,107,0,.18);
  color: rgba(16,19,24,.80);
}
.qg-cardRow__sub{
  margin-top: 2px;
  font-weight: 800;
  font-size: 12px;
  color: rgba(16,19,24,.55);
}
.qg-cardRow__desc{
  margin-top: 6px;
  color: rgba(16,19,24,.70);
  font-size: 13px;
  line-height: 1.4;
}
.qg-cardRow__go{
  font-size: 22px;
  font-weight: 900;
  color: rgba(16,19,24,.42);
}

/* People grid (hub) */
.qg-peopleGrid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
@media (max-width: 980px){
  .qg-peopleGrid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px){
  .qg-peopleGrid{ grid-template-columns: 1fr; }
}

.qg-pcard{
  border-radius: 22px;
  border: 1px solid rgba(17,24,39,.10);
  background: rgba(255,255,255,.86);
  padding: 12px;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 12px 26px rgba(16,19,24,.06);
}
.qg-pcard:hover{
  box-shadow: 0 22px 54px rgba(16,19,24,.12);
  transform: translateY(-1px);
}

.qg-pcard__top{
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 10px;
  align-items: center;
}

.qg-pcard__avatar{
  width: 56px; height: 56px;
  border-radius: 18px;
  overflow: hidden;
  background: rgba(16,19,24,.06);
  position: relative;
}
.qg-pcard__avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.qg-pcard__ph{
  width:100%; height:100%;
  display:grid; place-items:center;
  font-weight: 950;
  color: rgba(16,19,24,.70);
}

.qg-pcard__name{
  font-weight: 950;
  color: rgba(16,19,24,.92);
  line-height: 1.1;
}
.qg-pcard__loc{
  margin-top: 4px;
  font-weight: 800;
  font-size: 12px;
  color: rgba(16,19,24,.55);
}

.qg-pcard__cast{
  margin-top: 10px;
  display: grid;
  gap: 10px;
}

.qg-miniChar{
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border-radius: 18px;
  border: 1px solid rgba(17,24,39,.08);
  background: rgba(248,249,252,.92);
}
.qg-miniChar__img{
  width: 46px; height: 46px;
  border-radius: 16px;
  overflow: hidden;
  background: rgba(16,19,24,.06);
}
.qg-miniChar__img img{ width:100%; height:100%; object-fit:cover; display:block; }
.qg-miniChar__name{
  font-weight: 950;
  color: rgba(16,19,24,.88);
  line-height: 1.1;
}
.qg-miniChar__meta{
  margin-top: 2px;
  font-weight: 800;
  font-size: 12px;
  color: rgba(16,19,24,.55);
}

.qg-pcard__bio{
  margin-top: 10px;
  font-size: 13px;
  color: rgba(16,19,24,.72);
  line-height: 1.45;
}

.qg-pcard__go{
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 10px 12px;
  border-radius: 16px;
  font-weight: 950;
  color: rgba(16,19,24,.82);
  background: rgba(255,107,0,.10);
  border: 1px solid rgba(255,107,0,.16);
}

/* Vídeos módulo mais compacto (opcional) */
.qg-grid--tight{ gap: 12px; }

/* Galeria ocupa largura total no grid */
.qg-panel--gallery{
  grid-column: 1 / -1;
}
/* ===== Cosplayer card (sem <a> aninhado) ===== */
.qg-peopleGrid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:14px;
}
.qg-pcard{
  grid-column:span 6;
  background:#fff;
  border:1px solid rgba(20,24,33,.10);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 26px rgba(15,20,30,.06);
}
@media (max-width: 900px){
  .qg-pcard{ grid-column:span 12; }
}

.qg-pcard__cosLink{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 14px;
  text-decoration:none;
  color:inherit;
  background:linear-gradient(180deg, rgba(255,107,0,.10), rgba(255,107,0,.00));
  border-bottom:1px solid rgba(20,24,33,.08);
}
.qg-pcard__cosLink:hover{
  background:linear-gradient(180deg, rgba(255,107,0,.14), rgba(255,107,0,.02));
}

.qg-pcard__avatar{
  position:relative;
  width:56px; height:56px;
  border-radius:14px;
  overflow:hidden;
  background:#f3f4f7;
  flex:0 0 auto;
}
.qg-pcard__avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.qg-pcard__ph{
  width:100%; height:100%;
  display:grid; place-items:center;
  font-weight:800;
  color:#111318;
}
.qg-pcard__info{ min-width:0; flex:1 1 auto; }
.qg-pcard__name{ font-weight:800; line-height:1.1; }
.qg-pcard__loc{ margin-top:3px; font-size:12.5px; color:#5f6673; }
.qg-pcard__hint{ margin-top:6px; font-size:12px; color:#7a8190; }
.qg-pcard__arrow{ font-size:22px; color:#9aa1af; padding-left:6px; }

.qg-pcard__bio{
  padding:10px 14px 0 14px;
  color:#2b2f3a;
  font-size:13.5px;
  line-height:1.45;
}

/* ===== Personagens dentro do card: link próprio ===== */
.qg-pcard__cast{ padding:12px 14px 0 14px; }
.qg-pcard__castHead{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.qg-pcard__castTitle{ font-weight:800; font-size:13px; color:#111318; }

.qg-castGrid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}

.qg-miniChar{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(20,24,33,.10);
  background:#fbfbfd;
  text-decoration:none;
  color:inherit;
}
.qg-miniChar:hover{
  background:#ffffff;
  border-color:rgba(255,107,0,.35);
  box-shadow:0 10px 22px rgba(15,20,30,.08);
}
.qg-miniChar__img{
  width:52px; height:52px;
  border-radius:12px;
  overflow:hidden;
  background:#eef0f4;
  flex:0 0 auto;
}
.qg-miniChar__img img{ width:100%; height:100%; object-fit:cover; object-position: top; display:block; }
.qg-miniChar__ph{
  width:100%; height:100%;
  display:grid; place-items: top ;
  font-weight:900;
  color:#7a8190;
}
.qg-miniChar__txt{ min-width:0; flex:1 1 auto; }
.qg-miniChar__name{ font-weight:800; line-height:1.1; }
.qg-miniChar__meta{ margin-top:2px; font-size:12.5px; color:#5f6673; }
.qg-miniChar__go{ margin-top:6px; font-size:12px; color:#ff6b00; font-weight:700; }
.qg-miniChar__arrow{ font-size:20px; color:#9aa1af; padding-left:6px; }

.qg-pcard__actions{
  padding:12px 14px 14px 14px;
  display:flex;
  justify-content:flex-end;
}

/* botão soft (se não existir no seu css) */
.qg-btn.qg-btn--soft{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px;
  border-radius:12px;
  border:1px solid rgba(255,107,0,.35);
  background:rgba(255,107,0,.08);
  color:#111318;
  text-decoration:none;
  font-weight:800;
}
.qg-btn.qg-btn--soft:hover{
  background:rgba(255,107,0,.12);
}
/* ===== Vídeos em lista (full-width) ===== */
.qg-vlist{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.qg-vrow{
  display:flex;
  gap:14px;
  align-items:stretch;
  width:100%;
  text-decoration:none;
  color:inherit;

  background:#fff;
  border:1px solid rgba(20,24,33,.10);
  border-radius:16px;
  overflow:hidden;

  box-shadow:0 10px 26px rgba(15,20,30,.06);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.qg-vrow:hover{
  transform:translateY(-1px);
  border-color:rgba(255,107,0,.35);
  box-shadow:0 14px 34px rgba(15,20,30,.10);
}

.qg-vrow__thumb{
  position:relative;
  width:320px;
  flex:0 0 320px;
  background:#eef0f4;
  overflow:hidden;
}

.qg-vrow__thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.qg-vrow__ph{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  color:#7a8190;
  font-weight:800;
}

.qg-vrow__play{
  position:absolute;
  inset:auto auto 12px 12px;
  width:44px;
  height:44px;
  border-radius:14px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(20,24,33,.12);
  box-shadow:0 10px 22px rgba(15,20,30,.16);
}

.qg-vrow__play::before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-42%,-50%);
  width:0; height:0;
  border-top:8px solid transparent;
  border-bottom:8px solid transparent;
  border-left:12px solid #ff6b00;
}

.qg-vrow__badge{
  position:absolute;
  top:12px;
  left:12px;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;

  background:rgba(17,19,24,.92);
  color:#fff;
}

.qg-vrow__body{
  flex:1 1 auto;
  padding:14px 14px;
  display:flex;
  flex-direction:column;
  min-width:0;
}

.qg-vrow__title{
  font-weight:900;
  font-size:15.5px;
  line-height:1.2;
  color:#111318;
  margin-bottom:6px;
}

.qg-vrow__meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:auto;
}

.qg-vrow__metaItem{
  font-size:12.5px;
  color:#5f6673;
  background:#f5f6fa;
  border:1px solid rgba(20,24,33,.08);
  padding:6px 10px;
  border-radius:999px;
}

.qg-vrow__cta{
  margin-top:12px;
  font-weight:900;
  color:#ff6b00;
  display:inline-flex;
  align-items:center;
  gap:6px;
}

/* Responsivo */
@media (max-width: 900px){
  .qg-vrow__thumb{
    width:220px;
    flex-basis:220px;
  }
}

@media (max-width: 640px){
  .qg-vrow{
    flex-direction:column;
  }
  .qg-vrow__thumb{
    width:100%;
    flex-basis:auto;
    aspect-ratio:16/9;
  }
}
/* =========================================================
   Ver mais ensaios (widget)
========================================================= */
.qg-moreWrap{
  max-width: 1180px;
  margin: 18px auto 28px;
  padding: 0 14px;
}

.qg-moreHead{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin: 0 0 12px;
}

.qg-moreKicker{
  font-weight:800;
  letter-spacing:.12em;
  font-size:11px;
  color: rgba(20,24,31,.55);
}

.qg-moreTitle{
  margin: 4px 0 0;
  font-size: 20px;
  line-height: 1.1;
}

.qg-moreLink{
  text-decoration:none;
  font-weight:700;
  padding:10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(20,24,31,.10);
  background: #fff;
  color: #111318;
  box-shadow: 0 10px 22px rgba(15,18,25,.06);
}
.qg-moreLink:hover{ transform: translateY(-1px); }

.qg-moreGrid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

@media (max-width: 980px){
  .qg-moreGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px){
  .qg-moreGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .qg-moreLink{ padding:9px 10px; }
}

/* Card */
.qg-ecard{
  display:flex;
  flex-direction:column;
  text-decoration:none;
  color: inherit;
  border-radius: 16px;
  overflow:hidden;
  background: #fff;
  border: 1px solid rgba(20,24,31,.10);
  box-shadow: 0 12px 26px rgba(15,18,25,.06);
  transition: transform .15s ease, box-shadow .15s ease;
}
.qg-ecard:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(15,18,25,.10);
}

.qg-ecard__media{
  position:relative;
  aspect-ratio: 3 / 4; /* valor “hub” para capa vertical */
  background: #eef2f8;
}
.qg-ecard__media img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit: cover;
}
.qg-ecard__ph{
  position:absolute; inset:0;
  display:grid; place-items:center;
  color: rgba(20,24,31,.55);
  font-weight:700;
}

.qg-ecard__overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.72) 100%);
  pointer-events:none;
}

.qg-ecard__chips{
  position:absolute;
  left:10px; top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  z-index:2;
}
.qg-ecard__chip{
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  padding:6px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(20,24,31,.12);
}
.qg-ecard__chip--soft{
  font-weight:700;
  opacity:.95;
}

.qg-ecard__body{
  padding: 12px 12px 13px;
  display:flex;
  flex-direction:column;
  gap: 8px;
}
.qg-ecard__title{
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
}
.qg-ecard__meta{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
  color: rgba(20,24,31,.65);
  font-size: 12px;
  font-weight: 600;
}
.qg-ecard__metaItem{
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(20,24,31,.04);
  border: 1px solid rgba(20,24,31,.08);
}

.qg-ecard__cta{
  margin-top: 2px;
  font-weight: 800;
  font-size: 12px;
  letter-spacing: .02em;
  color: #111318;
  opacity: .9;
}
/* =========================================================
   COSPLAYER PAGE — LIGHT CARDS + DARK TEXT + VISIBLE TABS
   (colar no FINAL do qgcosplay.css)
========================================================= */

.qg-profPage{
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 14px 26px;
}

/* Layout 2 colunas */
.qg-profPage .qg-profLayout{
  display: grid;
  grid-template-columns: minmax(260px, 320px) 1fr;
  gap: 16px;
  align-items: start;
}

@media (max-width: 980px){
  .qg-profPage .qg-profLayout{ grid-template-columns: 1fr; }
}

/* Cards CLAROS (texto escuro) */
.qg-profPage .qg-panel,
.qg-profPage .qg-sideCard{
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  color: #1c1c1f !important;
}

.qg-profPage .qg-panel * ,
.qg-profPage .qg-sideCard *{
  color: inherit;
}

/* Sidebar sticky mais estável */
@media (min-width: 981px){
  .qg-profPage .qg-sideCard{
    position: sticky;
    top: 88px;
    z-index: 2;
  }
}

/* Avatar */
.qg-profPage .qg-avatarBig{
  position: relative;
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 18px;
  overflow: hidden;
  background: #f1f2f5;
  border: 1px solid rgba(0,0,0,.10);
}

.qg-profPage .qg-avatarBig img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.qg-profPage .qg-avatarBig .qg-verify{
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 5;
}

/* =========================================================
   TABS — visíveis em fundo claro
========================================================= */

.qg-profPage .qg-tabs{
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;

  padding: 10px;

  background: #ffffff !important;

  position: relative;
  z-index: 5;
}

.qg-profPage .qg-tab{
  appearance: none;
  -webkit-appearance: none;

  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  min-height: 42px;
  padding: 10px 14px;
  border-radius: 12px;

  cursor: pointer;
  font-weight: 900;
  line-height: 1;

  background: #f2f3f6 !important;
  border: 1px solid rgba(0,0,0,.14) !important;
  color: #1c1c1f !important;

  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}

.qg-profPage .qg-tab:hover{
  transform: translateY(-1px);
  background: #e9ebf1 !important;
  border-color: rgba(0,0,0,.20) !important;
}

.qg-profPage .qg-tab[aria-selected="true"]{
  background: #ff6b00 !important;
  border-color: rgba(0,0,0,.10) !important;
  color: #ffffff !important;
}

/* Painéis */
.qg-profPage .qg-tabpanel{ display: none; }
.qg-profPage .qg-tabpanel.is-active{ display: block; }

/* Pequenos textos */
.qg-profPage .qg-muted{ color: rgba(28,28,31,.70) !important; }

/* Sociais (botões com ícone) */
.qg-profPage .qg-socialRow{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.qg-profPage .qg-sbtn{
  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding: 10px 12px;
  border-radius: 12px;

  text-decoration: none;
  background: #f2f3f6;
  border: 1px solid rgba(0,0,0,.12);

  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}

.qg-profPage .qg-sbtn:hover{
  transform: translateY(-1px);
  background: #e9ebf1;
  border-color: rgba(0,0,0,.18);
}

.qg-profPage .qg-sbtn svg{
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  fill: currentColor;
}

.qg-profPage .qg-sbtn__txt{ font-weight: 800; }

/* QR code box */
.qg-profPage .qg-qrBox{
  margin-top: 14px;
  padding: 12px;
}

.qg-profPage .qg-qrBox__img{
  width: 180px;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
}

.qg-profPage .qg-qrBox__label{
  margin-top: 10px;
  font-weight: 900;
}

.qg-profPage .qg-qrBox__url{
  margin-top: 6px;
  font-size: 12px;
  opacity: .75;
  word-break: break-all;
}
.qg-sbtn svg,
.qg-sbtn svg path{
  fill: currentColor !important;
  stroke: none !important;
}

.qg-sbtn svg{
  width: 18px !important;
  height: 18px !important;
  display: inline-block !important;
  vertical-align: middle;
  flex: 0 0 18px !important;
}
/* =========================================================
   PERSONAGENS — Card com capa 100% largura + altura relativa
   (override forte do CSS inline do cosplayer.php)
   COLE NO FINAL do qgcosplay.css
========================================================= */

.qg-profPage .qg-charGrid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
@media (max-width: 1100px){ .qg-profPage .qg-charGrid{ grid-template-columns: repeat(3, minmax(0,1fr)) !important; } }
@media (max-width: 860px){  .qg-profPage .qg-charGrid{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width: 540px){  .qg-profPage .qg-charGrid{ grid-template-columns: 1fr !important; } }

/* Card estilo ensaio */
.qg-profPage a.qg-charCard{
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 0 !important;

  border-radius: 16px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid rgba(20,24,31,.10) !important;
  box-shadow: 0 12px 26px rgba(15,18,25,.06) !important;

  text-decoration: none !important;
  color: inherit !important;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease !important;
}
.qg-profPage a.qg-charCard:hover{
  transform: translateY(-2px) !important;
  border-color: rgba(255,107,0,.25) !important;
  box-shadow: 0 18px 40px rgba(15,18,25,.10) !important;
}

/* Capa: largura 100% + altura relativa (aspect-ratio) */
.qg-profPage .qg-charCard__img{
  width: 100% !important;
  height: auto !important;                 /* altura vem do aspect-ratio */
  aspect-ratio: 3 / 4 !important;          /* ajuste aqui se quiser 4/3 */
  position: relative !important;
  overflow: hidden !important;

  border-radius: 0 !important;
  background: #eef2f8 !important;
  flex: 0 0 auto !important;
}

/* IMAGEM: 100% x 100% SEM CORTE */
.qg-profPage .qg-charCard__img img{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;

  object-fit: contain !important;          /* <- não corta */
  object-position: center !important;

  display: block !important;
  background: #eef2f8 !important;          /* “letterbox” clean */
  transform: none !important;              /* remove zoom antigo */
}

/* Placeholder */
.qg-profPage .qg-charCard__ph{
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  color: rgba(20,24,31,.55) !important;
  font-weight: 900 !important;
}

/* Body (seu 2º <div>) */
.qg-profPage .qg-charCard > div:nth-child(2){
  padding: 12px 12px 10px !important;
  min-width: 0 !important;
}

/* Título + meta */
.qg-profPage .qg-charCard__t{
  font-weight: 900 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  margin-bottom: 6px !important;

  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.qg-profPage .qg-charCard__m{
  font-weight: 700 !important;
  font-size: 12.5px !important;
  color: rgba(20,24,31,.65) !important;
}

/* Rodapé (seu 3º <div> com "›") */
.qg-profPage .qg-charCard > div:nth-child(3){
  margin: 0 !important;
  padding: 10px 12px 12px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;

  border-top: 1px solid rgba(20,24,31,.08) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(248,249,252,.95)) !important;

  opacity: 1 !important;
  font-weight: 900 !important;
  color: rgba(17,19,24,.86) !important;
}
.qg-profPage .qg-charCard > div:nth-child(3)::before{
  content: "Abrir personagem" !important;
  font-size: 12.5px !important;
  font-weight: 900 !important;
}
/* =========================================================
   COSPLAYERS — Grid + Cards no estilo "Ensaios recentes"
   Cole no FINAL do qgcosplay.css
========================================================= */

.qg-section__head--stack{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}

.qg-pageTitle{
  margin:0;
  font-size: clamp(22px, 2.2vw, 30px);
  letter-spacing:-0.02em;
}
.qg-pageSub{
  margin-top:6px;
  color: var(--muted, #8a8f98);
  font-size: 14px;
}

.qg-cosSearch{
  min-width:min(520px, 100%);
}
.qg-cosSearch__label{
  display:block;
  font-weight:700;
  margin-bottom:8px;
}
.qg-cosSearch__row{
  display:flex;
  gap:10px;
  align-items:stretch;
}
.qg-cosSearch__meta{
  margin-top:8px;
  color: var(--muted, #8a8f98);
  font-size: 13px;
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.qg-dot{
  width:4px;
  height:4px;
  border-radius:50%;
  background: rgba(255,255,255,.25);
  display:inline-block;
}

/* grid dedicado */
.qg-grid--coscards{
  margin-top: 14px;
}

/* media quadrada (avatar) */
.qg-card__media--square{
  aspect-ratio: 1 / 1;
}

/* descrição (bio) */
.qg-card__desc{
  margin-top:10px;
  color: var(--muted, #8a8f98);
  font-size: 13px;
  line-height: 1.35;
  display:-webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow:hidden;
}

/* badge verificado */
.qg-badge--verify{
  position:absolute;
  right:10px;
  top:10px;
  padding:6px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(6px);
  font-weight: 800;
}

/* pager */
.qg-pager{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  margin-top: 16px;
}
.qg-loading{
  color: var(--muted, #8a8f98);
  font-weight: 700;
}
.qg-section--tight{
  padding-top: 18px;
}
/* =========================================================
   PERSONAGENS — pequenos ajustes
========================================================= */
.qg-card--char .qg-card__desc{
  margin-top:10px;
  color: var(--muted, #8a8f98);
  font-size: 13px;
  line-height: 1.35;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
}
/* =========================================================
   /videos — Galeria topo (2 colunas)
========================================================= */
.qg-vgallery{
  display:grid;
  grid-template-columns: 2fr 1fr;
  gap: 16px;
  align-items:start;
}
@media (max-width: 980px){
  .qg-vgallery{ grid-template-columns: 1fr; }
}

.qg-vfeat{
  background: var(--surface, #111);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 16px;
  overflow:hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.qg-vfeat__top{ padding: 14px 14px 10px; }
.qg-vfeat__kicker{ font-size:12px; opacity:.8; }
.qg-vfeat__title{ font-weight:800; font-size:18px; margin-top:4px; }
.qg-vfeat__meta{ display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; opacity:.9; }

.qg-vfeat__player{
  position:relative;
  aspect-ratio: 16/9;
  background: rgba(0,0,0,.25);
}
.qg-vfeat__player iframe{
  position:absolute; inset:0;
  width:100%; height:100%;
  border:0;
}
.qg-vfeat__fallback{ display:block; width:100%; height:100%; }
.qg-vfeat__ph{
  width:100%; height:100%;
  display:flex; align-items:center; justify-content:center;
  font-weight:700;
  opacity:.9;
}
.qg-vfeat__actions{
  display:flex; gap:10px;
  padding: 12px 14px 14px;
}

.qg-vside{
  background: var(--surface, #111);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 16px;
  overflow:hidden;
}
.qg-vside__head{ padding: 14px; border-bottom:1px solid var(--border, rgba(255,255,255,.08)); }
.qg-vside__title{ font-weight:800; }
.qg-vside__sub{ font-size:12px; opacity:.8; margin-top:4px; }
.qg-vside__list{ display:flex; flex-direction:column; }

.qg-vmini{
  appearance:none; border:0; background:transparent;
  text-align:left; width:100%;
  display:grid;
  grid-template-columns: 96px 1fr;
  gap: 12px;
  padding: 12px 14px;
  cursor:pointer;
  border-bottom:1px solid var(--border, rgba(255,255,255,.08));
}
.qg-vmini:last-child{ border-bottom:0; }
.qg-vmini:hover{ background: rgba(255,255,255,.03); }
.qg-vmini.is-active{ background: rgba(255,107,0,.08); }

.qg-vmini__thumb{
  position:relative;
  border-radius: 12px;
  overflow:hidden;
  background: rgba(0,0,0,.25);
  aspect-ratio: 16/10;
  display:block;
}
.qg-vmini__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.qg-vmini__ph{ display:block; width:100%; height:100%; }
.qg-vmini__txt{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.qg-vmini__name{
  font-weight:700;
  font-size:13px;
  line-height:1.25;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
}
.qg-vmini__meta{ font-size:12px; opacity:.8; display:flex; gap:10px; flex-wrap:wrap; }

.qg-sep{ height: 14px; }
/* Filtros / categorias (vídeos) */
.qg-filterbar{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
}
.qg-filter{
  border:1px solid var(--border, rgba(255,255,255,.12));
  background: rgba(255,255,255,.03);
  color: inherit;
  padding: 10px 12px;
  border-radius: 999px;
  font-weight: 700;
  cursor:pointer;
}
.qg-filter:hover{ background: rgba(255,255,255,.06); }
.qg-filter.is-active{
  border-color: rgba(255,107,0,.45);
  background: rgba(255,107,0,.10);
}
.qg-cosSearch--videos .qg-cosSearch__row{ margin-bottom: 8px; }
/* =========================================================
   VIDEO PAGE — Correção SOMENTE do <main>
   Alvo: <main class="qg-main qg-videoPage">
   ========================================================= */

.qg-main.qg-videoPage{
  /* neutraliza regras globais do .qg-main que costumam quebrar grid (flex/width/max-width) */
  display: block !important;
  width: 100% !important;
  max-width: none !important;

  /* evita “miolo estreito” por margin/padding do main global */
  margin: 0 !important;
  padding: 0 !important;

  /* garante que o grid interno tenha espaço horizontal */
  min-width: 0 !important;
}
/* =========================================================
   VIDEO.PHP — OVERRIDE FORTE (LIGHT)
   Vence o <style> do video.php (qgv-*) usando !important
   Cole NO FINAL do qgcosplay.css
========================================================= */

/* 1) MAIN: tira o “container” do .qg-main só nesta página */
.qg-main.qg-videoPage{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}

/* 2) Container interno do vídeo (controle real de largura) */
.qg-main.qg-videoPage .qgv-wrap{
  width:100% !important;
  max-width:1240px !important;
  margin:0 auto !important;
  padding:18px 14px 22px !important;
}

/* 3) Layout: 2 colunas desktop / 1 coluna mobile */
.qg-main.qg-videoPage .qgv-layout{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 360px !important;
  gap:14px !important;
  align-items:start !important;
}
@media (max-width:1080px){
  .qg-main.qg-videoPage .qgv-layout{ grid-template-columns:1fr !important; }
}

/* 4) Breadcrumb (corrige texto branco no tema claro) */
.qg-main.qg-videoPage .qgv-crumbs{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  margin:0 0 12px !important;
  color: rgba(16,19,24,.72) !important;
}
.qg-main.qg-videoPage .qgv-crumbs a{
  color: rgba(16,19,24,.82) !important;
  text-decoration:none !important;
}
.qg-main.qg-videoPage .qgv-crumbs a:hover{
  text-decoration:underline !important;
}
.qg-main.qg-videoPage .qgv-crumbs__sep{ opacity:.35 !important; }

/* 5) Player (mantém o 16:9 bonito no claro) */
.qg-main.qg-videoPage .qgv-player16x9{
  overflow:hidden !important;
}
.qg-main.qg-videoPage .qgv-player16x9 iframe{
  width:100% !important; height:100% !important; border:0 !important;
}

/* 6) TikTok Stage (central + blur) */
.qg-main.qg-videoPage .qgv-ttStage{
  position:relative !important;
  width:100% !important;
  min-height:560px !important;
  border-radius:18px !important;
  overflow:hidden !important;
}
.qg-main.qg-videoPage .qgv-ttBg{
  position:absolute !important;
  inset:-12% !important;
  width:124% !important;
  height:124% !important;
  border:0 !important;
  filter: blur(18px) saturate(1.15) !important;
  opacity:.55 !important;
  transform:scale(1.08) !important;
  pointer-events:none !important;
}
.qg-main.qg-videoPage .qgv-ttShade{
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(to bottom, rgba(0,0,0,.10), rgba(0,0,0,.55)) !important;
  pointer-events:none !important;
}
.qg-main.qg-videoPage .qgv-ttCenter{
  position:relative !important;
  z-index:2 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:18px !important;
}
.qg-main.qg-videoPage .qgv-ttMain{
  width:min(380px, 92vw) !important;
  height:640px !important;
  max-height:76vh !important;
  border:0 !important;
  border-radius:16px !important;
  overflow:hidden !important;
  background:rgba(0,0,0,.25) !important;
  box-shadow:0 18px 60px rgba(0,0,0,.35) !important;
}

/* 7) Meta do vídeo (títulos e chips no claro) */
.qg-main.qg-videoPage .qgv-vmeta{ margin-top:12px !important; }
.qg-main.qg-videoPage .qgv-vtitle{
  margin:0 !important;
  font-weight:950 !important;
  font-size:1.35rem !important;
  line-height:1.15 !important;
  color: rgba(16,19,24,.92) !important;
}
.qg-main.qg-videoPage .qgv-vsub{
  margin-top:10px !important;
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  align-items:center !important;
}
.qg-main.qg-videoPage .qgv-chip{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:8px 10px !important;
  border-radius:999px !important;
  color: rgba(16,19,24,.86) !important;
  font-weight:900 !important;
  font-size:.86rem !important;
  box-shadow:0 10px 22px rgba(16,19,24,.06) !important;
}
.qg-main.qg-videoPage .qgv-chip:hover{ transform:translateY(-1px) !important; }

.qg-main.qg-videoPage .qgv-vstats{
  margin-top:10px !important;
  font-size:.92rem !important;
  display:flex !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  color: rgba(16,19,24,.62) !important;
}
.qg-main.qg-videoPage .qgv-vstats a{
  color: rgba(16,19,24,.70) !important;
  text-decoration:none !important;
}
.qg-main.qg-videoPage .qgv-vstats a:hover{ text-decoration:underline !important; }

/* 8) Sidebar sugestões (corrige texto branco e fundos escuros) */
.qg-main.qg-videoPage .qgv-sideHead{
  display:flex !important;
  align-items:baseline !important;
  justify-content:space-between !important;
  gap:10px !important;
}
.qg-main.qg-videoPage .qgv-sideHead h3{
  margin:0 !important;
  font-weight:950 !important;
  font-size:1.05rem !important;
  color: rgba(16,19,24,.92) !important;
}
.qg-main.qg-videoPage .qgv-sideHint{
  font-size:.85rem !important;
  color: rgba(16,19,24,.55) !important;
}

.qg-main.qg-videoPage .qgv-sugList{
  margin-top:10px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
}

.qg-main.qg-videoPage .qgv-sugRow{
  display:flex !important;
  gap:10px !important;
  padding:10px !important;

  color: rgba(16,19,24,.88) !important;

  box-shadow:0 10px 22px rgba(16,19,24,.05) !important;
  min-width:0 !important;
}
.qg-main.qg-videoPage .qgv-sugRow:hover{
  border-color: rgba(255,107,0,.25) !important;
  box-shadow:0 16px 36px rgba(16,19,24,.10) !important;
  transform:translateY(-1px) !important;
}

.qg-main.qg-videoPage .qgv-sugThumb{
  width:152px !important;
  aspect-ratio:16/9 !important;
  border-radius:14px !important;
  overflow:hidden !important;
  flex:0 0 auto !important;
  position:relative !important;
}
.qg-main.qg-videoPage .qgv-sugThumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

.qg-main.qg-videoPage .qgv-sugPlay{
  position:absolute !important;
  inset:auto 10px 10px auto !important;
  width:34px !important;
  height:34px !important;
  border-radius:999px !important;
  background:rgba(16,19,24,.70) !important;
  border:1px solid rgba(255,255,255,.18) !important;
}
.qg-main.qg-videoPage .qgv-sugPlay:before{
  content:"" !important;
  position:absolute !important;
  left:13px !important;
  top:10px !important;
  border-style:solid !important;
  border-width:7px 0 7px 10px !important;
  border-color:transparent transparent transparent rgba(255,255,255,.94) !important;
}

.qg-main.qg-videoPage .qgv-sugTitle{
  font-weight:900 !important;
  line-height:1.2 !important;
  color: rgba(16,19,24,.92) !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
.qg-main.qg-videoPage .qgv-sugMeta{
  margin-top:6px !important;
  font-size:.86rem !important;
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  color: rgba(16,19,24,.60) !important;
}

/* 9) Embed raw */
.qg-main.qg-videoPage .qgv-embedRaw{
  overflow:hidden !important;
  padding:10px !important;
}
