:root {
  --black: #08090a;
  --black-alt: #0f1113;
  --gray-700: #202428;
  --gray-500: #3a4046;
  --gray-300: #7d8894;
  --gray-100: #d7dfe7;
  --white: #ffffff;
  --blue: #00b7ff;
  --blue-glow: #00cfff;
  --red: #ff2d2d;
  --red-glow: #ff5151;
  --accent-gradient: radial-gradient(circle at 30% 20%, rgba(0,183,255,.15), transparent 60%),
                     radial-gradient(circle at 80% 70%, rgba(255,45,45,.12), transparent 65%);
  --font-stack: 'Montserrat', system-ui, sans-serif;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 28px;
  --shadow-sm: 0 2px 6px -2px rgba(0,0,0,0.55);
  --shadow-glow-blue: 0 0 0 1px #00b7ff55, 0 0 14px -2px #00b7ff55;
  --shadow-glow-red: 0 0 0 1px #ff2d2d55, 0 0 16px -2px #ff2d2d66;
  --transition: .28s cubic-bezier(.4,.14,.2,1);
}

@font-face {
  font-family: 'RevMiniPixel';
  src: url('fonts/RevMiniPixel.ttf') format('truetype');
  font-display: swap;
}

* { box-sizing: border-box; -webkit-font-smoothing: antialiased; }
html,body { margin:0; padding:0; background: var(--black); color: var(--gray-100); font-family: var(--font-stack); }
body {
  position: relative;
  min-height: 100vh;
  background: #08090a url('images/bg2.png') center center / cover no-repeat fixed;
  overflow-x: hidden;
}

/* Noise overlay */
#noise {
  position: fixed;
  inset: 0;
  width:100%;height:100%;
  pointer-events:none;
  z-index:1;
  opacity:.07;
  mix-blend-mode:overlay;
}

/* HEADER WIDTH CONTAINER */
.site-header {
  /* ...existing code... */
  background: transparent;          /* remove fundo full-bleed */
  border-bottom: none;              /* linha vira no pseudo */
  position: sticky;
  top:0;
  z-index:10;
  isolation:isolate;                /* garante stacking para pseudo */
}
.site-header:before {
  content:"";
  position:absolute;
  inset:0;
  left:50%;
  width:100%;
  max-width:1200px;                 /* mesma largura do hero/sections */
  transform:translateX(-50%);
  background: rgba(10,12,14,0.72);
  backdrop-filter: blur(12px);
  border-bottom:1px solid #1c2227;
  pointer-events:none;
  z-index:-1;
}

.nav-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding: .65rem 1.25rem; }
.logo { height:46px; width:auto; filter: drop-shadow(0 0 6px #ffffff00); }
.logo {
  transition: filter .35s ease, opacity .35s ease;
}
.logo:hover,
.brand:hover .logo {
  filter: brightness(0) invert(1) drop-shadow(0 0 8px #ffffffaa);
  opacity:1;
}

.main-nav ul { list-style:none; margin:0; padding:0; display:flex; gap:1.1rem; }
.main-nav a {
  position:relative;
  text-decoration:none;
  font-weight:600;
  letter-spacing:.5px;
  color: var(--gray-300);
  padding:.55rem .75rem;
  border-radius: var(--radius-sm);
  font-size:.9rem;
  transition: var(--transition);
  font-family: 'RevMiniPixel', var(--font-stack);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.main-nav a:hover,
.main-nav a.active {
  color: var(--white);
  background: linear-gradient(90deg,#13242c,#1d1f24);
}
.main-nav a.active:after,
.main-nav a:hover:after {
  content:"";
  position:absolute;
  left:12px; right:12px; bottom:4px;
  height:2px;
  background: linear-gradient(90deg,var(--blue),var(--red));
  border-radius:4px;
}
.main-nav a.login-link {
  background: linear-gradient(90deg,#002a38,#03202a);
  border:1px solid #02475e;
  box-shadow: 0 0 0 1px #02475e66, 0 0 12px -2px #00b7ff55;
  font-weight:700;
}
.main-nav a.login-link:hover,
.main-nav a.login-link.active {
  background: linear-gradient(90deg,#015b7a,#013c4f);
  color:#fff;
}

.nav-toggle { display:none; background:none; border:0; cursor:pointer; }
.nav-toggle span { display:block; width:26px; height:3px; background:var(--gray-300); margin:5px 0; transition:var(--transition); border-radius:3px; }

/* Hero */
.hero {
  position:relative;
  display:grid;
  gap:3rem;
  max-width:1200px;
  margin:0 auto;
  padding:6.5rem 1.5rem 5rem;
  grid-template-columns: repeat(auto-fit,minmax(330px,1fr));
  align-items:center;
}
.hero:before {
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 35% 40%, rgba(0,183,255,0.08), transparent 55%),
              radial-gradient(circle at 75% 55%, rgba(255,45,45,0.10), transparent 60%);
  z-index:0;
}
.hero-content {
  position:relative;
  z-index:2;
  background: linear-gradient(145deg,#13171aee,#0d0f10f2);
  border:1px solid #1c2328;
  border-radius: 14px;
  padding:2.2rem 2.4rem 2.6rem;
  box-shadow:0 4px 18px -6px #000, 0 0 0 1px #1c2328, 0 14px 46px -24px #000;
  max-width: 760px;
  backdrop-filter: blur(4px);
  position:relative;
  z-index:2;
}
.hero h1 {
  margin:0 0 1.2rem;
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  line-height:1.05;
  font-weight:800;
  text-wrap:balance;
  background: linear-gradient(90deg,#fff,#bcd9ff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter: drop-shadow(0 6px 24px #000);
}
.hero h1 .accent { color: var(--blue); background:none; -webkit-text-fill-color: var(--blue); }
.hero h1 .murder { color: var(--red); -webkit-text-fill-color: var(--red); }

.lead {
  font-size: clamp(1rem,1.6vw,1.25rem);
  max-width: 600px;
  color: var(--gray-300);
  line-height:1.55;
}

.cta-group { margin:2rem 0 2.4rem; display:flex; gap:1rem; flex-wrap:wrap; }

.btn {
  --btn-bg: var(--gray-700);
  --btn-color: var(--white);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.9rem 1.4rem;
  font-weight:600;
  font-size:.95rem;
  text-decoration:none;
  border-radius: var(--radius-md);
  position:relative;
  letter-spacing:.6px;
  transition: var(--transition);
  border:1px solid #2c3237;
  background: linear-gradient(145deg,#14181b,#101214);
  color: var(--white);
  font-family: 'RevMiniPixel', var(--font-stack);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.btn.primary {
  background: linear-gradient(135deg,#003d54,#00212c 55%);
  border:1px solid #024d68;
  box-shadow: var(--shadow-glow-blue);
}
.btn.primary:hover {
  background: linear-gradient(135deg,#00739d,#004257);
  border-color:#0fb8ff;
}
.btn.ghost {
  background: rgba(255,255,255,0.04);
  border:1px solid #2a3035;
  color: var(--gray-100);
}
.btn.ghost:hover {
  background: rgba(255,255,255,0.09);
}
.btn.small { padding:.65rem 1.05rem; font-size:.78rem; letter-spacing:.8px; text-transform:uppercase; }
.btn.small {
  font-family: 'RevMiniPixel', var(--font-stack);
  letter-spacing: 1.1px;
}
.btn.large { padding:1.1rem 1.9rem; font-size:1.05rem; }
.btn.large {
  font-family: 'RevMiniPixel', var(--font-stack);
  letter-spacing: 1.2px;
}

.meta-stats {
  display:none !important;
}

/* Sections */
.section {
  position:relative;
  max-width:1200px;
  margin:0 auto;
  padding:4.5rem 1.5rem 4.2rem;
}
.section.alt {
  background: linear-gradient(180deg,#0c0f12,#0b0c0e);
  border-top: 1px solid #161b1e;
  border-bottom: 1px solid #161b1e;
  box-shadow: inset 0 0 35px -18px #000;
}
.section-title {
  margin:0 0 2.8rem;
  font-size: clamp(1.9rem,3.2vw,2.7rem);
  font-weight:800;
  letter-spacing:.6px;
  background: linear-gradient(90deg,var(--white),#c2eaff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  position:relative;
}
.section-title:after {
  content:"";
  display:block;
  margin-top:10px;
  width:120px;
  height:3px;
  background: linear-gradient(90deg,var(--blue),var(--red));
  border-radius:6px;
  box-shadow:0 0 14px -2px #00b7ff99;
}

/* Cards (partidas) */
.cards-grid {
  display:grid;
  gap:1.6rem;
  grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
}
.card {
  background: linear-gradient(145deg,#121518,#0d0f11);
  border:1px solid #1f262c;
  padding:1.2rem 1.2rem 1.3rem;
  border-radius: var(--radius-md);
  position:relative;
  display:flex;
  flex-direction:column;
  gap:.35rem;
  min-height:172px;
  transition: var(--transition);
  box-shadow: var(--shadow-sm);
  overflow:hidden;
}
.card:before {
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 20% 15%, rgba(0,183,255,0.12), transparent 60%);
  opacity:0;
  transition: var(--transition);
}
.card:hover {
  transform: translateY(-6px);
  border-color:#26414c;
  box-shadow:0 12px 40px -18px #000, var(--shadow-glow-blue);
}
.card:hover:before { opacity:1; }
.card header { display:flex; align-items:center; justify-content:space-between; }
.card h3 { margin:0; font-size:1rem; font-weight:700; letter-spacing:.5px; }
.card p { margin:.15rem 0; font-size:.82rem; color: var(--gray-300); }
.card-link {
  margin-top:auto;
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:1px;
  font-weight:600;
  text-decoration:none;
  color: var(--blue);
  padding-top:.5rem;
  transition:var(--transition);
}
.card-link:hover { color: var(--red); }

.badge {
  font-size:.65rem;
  letter-spacing:1.3px;
  padding:.35rem .55rem;
  border-radius:999px;
  font-weight:700;
  background:#1e262b;
  color: var(--gray-300);
  border:1px solid #263035;
}
.badge.live { color:#fff; background: linear-gradient(90deg,#ff2d2d,#ff6b6b); box-shadow: var(--shadow-glow-red); }
.badge.waiting { color: var(--blue); background:#0e242d; border-color:#0d3b49; }
.badge.finished { color:#bbb; background:#1d1d1d; }

/* Roles */
.roles-grid {
  display:grid;
  gap:1.4rem;
  grid-template-columns: repeat(auto-fit,minmax(200px,1fr));
}
.role {
  background: linear-gradient(145deg,#13171a,#0d0f10);
  border:1px solid #1c2328;
  padding:1rem 1.1rem 1.3rem;
  border-radius: var(--radius-sm);
  font-size:.82rem;
  line-height:1.4;
  position:relative;
  transition: var(--transition);
  min-height:130px;
}
.role:before {
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 65% 30%, rgba(255,45,45,0.18), transparent 70%);
  opacity:0;
  transition: var(--transition);
}
.role h3 { margin:.1rem 0 .45rem; font-size:.95rem; font-weight:700; color: var(--white); }
.role:hover {
  border-color:#31454e;
  transform:translateY(-4px);
  box-shadow:0 14px 42px -20px #000, var(--shadow-glow-blue);
}
.role:hover:before { opacity:1; }

.role-legend {
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
  margin:-.4rem 0 2rem;
  font-size:.65rem;
  letter-spacing:1.3px;
  text-transform:uppercase;
  font-weight:700;
}
.role-legend span {
  padding:.4rem .7rem;
  border:1px solid #1f262b;
  background:#12171a;
  border-radius:999px;
  position:relative;
}
.role-legend span[data-cat=vip] { color:#00f8ff; border-color:#00f8ff55; }
.role-legend span[data-cat=nitro] { color:#bf00ff; border-color:#bf00ff55; }
.role-legend span[data-cat=loja] { color:#00ca14; border-color:#00ca1455; }
.role-legend span[data-cat=padrao] { color:#62a3ce; border-color:#62a3ce55; }

.faction-group { margin-bottom:2.8rem; }
.faction-title {
  margin:0 0 1.1rem;
  font-size:1.05rem;
  letter-spacing:1px;
  text-transform:uppercase;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:.55rem;
}
.faction-title.civil { color:#00b7ff; }
.faction-title.mafia { color:#ff2d2d; }

.role {
  padding-top: .9rem;
  overflow:hidden;
}
.role[data-category] { border-top:3px solid #1c2328; }
.role[data-category=vip] { border-color:#00f8ff; }
.role[data-category=nitro] { border-color:#bf00ff; }
.role[data-category=loja] { border-color:#00ca14; }
.role[data-category=padrao] { border-color:#62a3ce; }

.role h3 {
  display:flex;
  align-items:center;
  gap:.4rem;
  flex-wrap:wrap;
}
.role img.role-img {
  width:64px;
  height:64px;
  object-fit:cover;
  border-radius:10px;
  border:1px solid #1f262c;
  background:#0d1113;
  box-shadow:0 2px 8px -4px #000;
  flex-shrink:0;
}
.role .role-header {
  display:flex;
  align-items:flex-start;
  gap:.75rem;
  margin:0 0 .4rem;
}
.role .badges {
  display:flex;
  gap:.4rem;
  flex-wrap:wrap;
  margin-top:.45rem;
}
.role .role-header { align-items:flex-start; }
/* Novo: fonte pixel no nome e espaçamentos */
.role h3.role-name {
  font-family:'RevMiniPixel', var(--font-stack);
  font-size:1.05rem;
  margin:0;
  line-height:1.05;
  letter-spacing:.5px;
}
.role .badges.under-name {
  margin:.35rem 0 0;
  display:flex;
  gap:.45rem;
}
.role .role-desc {
  margin:.65rem 0 0;
  font-size:.78rem;
  line-height:1.5;
  color: var(--gray-300);
  letter-spacing:.2px;
}
/* Remover espaço extra anterior dentro do header */
.role .role-text p { display:none; }

.center { text-align:center; margin-top:2.5rem; }

/* Steps */
.steps {
  margin:0;
  padding-left:1.2rem;
  counter-reset:step;
  display:grid;
  gap:.85rem;
  max-width:760px;
  line-height:1.5;
  font-size:.95rem;
}
.steps li { position:relative; list-style:none; background:#111417; padding: .9rem 1rem .95rem 3.1rem; border:1px solid #1e262c; border-radius: var(--radius-sm); transition: var(--transition); }
.steps li:before {
  counter-increment:step;
  content: counter(step);
  position:absolute;
  left:.9rem; top:50%; transform:translateY(-50%);
  width:1.85rem;height:1.85rem;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;
  font-size:.85rem;
  border-radius:50%;
  background: linear-gradient(135deg,#003c52,#002530);
  color: var(--white);
  box-shadow: var(--shadow-glow-blue);
}
.steps li:hover {
  border-color:#2a3a41;
  background:#151b1f;
}

/* CTA final */
.cta-final {
  text-align:center;
  padding:6rem 1.5rem;
  background:
    radial-gradient(circle at 50% 10%, rgba(0,183,255,0.17), transparent 60%),
    linear-gradient(180deg,#0d1013,#090b0d);
  border-top:1px solid #151b1c;
  border-bottom:1px solid #161b1e;
}
.cta-final h2 {
  font-size: clamp(2.2rem,4vw,3.2rem);
  margin:0 0 1.2rem;
  font-weight:800;
  background: linear-gradient(90deg,#fff,#b3e3ff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.cta-final p {
  max-width:640px;
  margin:0 auto 2.2rem;
  color: var(--gray-300);
  font-size:1.05rem;
  line-height:1.55;
}

.site-footer {
  text-align:center;
  font-size:.7rem;
  letter-spacing:1px;
  padding:2.4rem 1rem 3rem;
  color: var(--gray-500);
  background:#080a0c;
  border-top:1px solid #121619;
  max-width:1200px;
  margin:0 auto;
  padding-left:1.5rem;
  padding-right:1.5rem;
}

.site-footer .credit {
  margin:0.4rem 0 0;
  font-size:.65rem;
  letter-spacing:.9px;
  color:#5d6973;
}
.site-footer .credit-link {
  position:relative;
  color:#7fa4b7;
  text-decoration:none;
  font-weight:700;
  transition:color .3s, text-shadow .4s;
}
.site-footer .credit-link:hover,
.site-footer .credit-link:focus-visible {
  color:#00b7ff;
  text-shadow:0 0 6px #00b7ff, 0 0 14px #0090c9;
  outline:none;
}
.site-footer .credit-link:active {
  filter:brightness(1.2);
}

/* Fix: garantir fonte RevMiniPixel em todos os botões/links com .btn */
.btn,
button.btn,
a.btn,
.user-menu .um-actions button,
.user-menu .um-actions a {
  font-family:'RevMiniPixel', var(--font-stack) !important;
  text-transform:uppercase;
  letter-spacing:1.05px;
  font-weight:700;
}

/* Fix: badge de cargo usando seletor case-insensitive e cores explícitas */
.user-menu .um-role[data-role="admin" i] {
  --role-color:#df0007;
  color:#df0007;
  border-color:#df0007;
  background:#2a0b0b;
  text-shadow:0 0 6px #df000777;
}
.user-menu .um-role[data-role="host" i] {
  --role-color:#006fff;
  color:#006fff;
  border-color:#006fff;
  background:#061c38;
  text-shadow:0 0 6px #006fff55;
}
.user-menu .um-role[data-role="vip" i] {
  --role-color:#00f8ff;
  color:#00f8ff;
  border-color:#00f8ff;
  background:#052a2d;
  text-shadow:0 0 6px #00f8ff66;
}
.user-menu .um-role[data-role="nitro" i] {
  --role-color:#bf00ff;
  color:#bf00ff;
  border-color:#bf00ff;
  background:#24002e;
  text-shadow:0 0 6px #bf00ff66;
}
.user-menu .um-role[data-role="loja" i] {
  --role-color:#00ca14;
  color:#00ca14;
  border-color:#00ca14;
  background:#07240c;
  text-shadow:0 0 6px #00ca1466;
}
.user-menu .um-role[data-role="membro" i] {
  --role-color:#62a3ce;
  color:#62a3ce;
  border-color:#62a3ce;
  background:#14222b;
  text-shadow:0 0 6px #62a3ce55;
}

/* Garantir que variáveis reflitam cor aplicada mesmo sem suporte a color-mix */
@supports not (color: color-mix(in srgb, red, blue)) {
  .user-menu .um-role {
    background:rgba(255,255,255,0.05);
  }
}

/* Mobile nav */
@media (max-width: 880px) {
  .main-nav ul {
    position:fixed;
    top:68px; right:0;
    flex-direction:column;
    background:#0d0f11;
    width:230px;
    padding:1.2rem .9rem 1.4rem;
    border-left:1px solid #1d2327;
    transform:translateX(100%);
    height:calc(100vh - 68px);
    overflow:auto;
    gap:.2rem;
    box-shadow:-8px 0 24px -10px #000;
  }
  .main-nav ul.open { transform:translateX(0); }
  .main-nav a { width:100%; border-radius:8px; }
  .nav-toggle { display:block; }
  body.menu-open { overflow:hidden; }
  .hero { padding-top:7.5rem; }
  .hero-art { order:-1; min-height:300px; }
  .meta-stats { gap:1.2rem; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .orb, .outline { animation:none !important; }
  .car-track { transition:none; }
  .card, .role, .btn { transition: none; }
}

/* Utility */
.discord-link {
  background: linear-gradient(90deg,#002c3a,#00202a);
  border-radius:8px;
  border:1px solid #064052;
  box-shadow: var(--shadow-glow-blue);
}
.discord-link:hover {
  background: linear-gradient(90deg,#005b7a,#003949);
  color:#fff;
}

/* Tabs */
.tab-section { display:none !important; }
.tab-section.active { display:block !important; }
/* Remover scroll suave global não é obrigatório; âncoras agora prevenidas no JS */

/* === HERO FULL WIDTH PANEL (ajuste bordas quadradas) === */
.hero.full {
  /* remove padding externo para o painel colar no topo e na section seguinte */
  padding:0;
  max-width:1200px;
  margin:0 auto;
  position:relative;
  /* painel agora no próprio hero */
  background: linear-gradient(145deg,#13171acc,#0d0f10ee);
  border:1px solid #1c2328;
  border-bottom:none;          /* cola com a próxima section */
  border-radius:0;        /* antes: 14px 14px 0 0 */
  box-shadow:0 0 0 1px #1c2328, 0 40px 120px -40px #000;
  backdrop-filter: blur(4px);
}

/* tira estilos de painel do conteúdo interno (era onde estava o fundo) */
.hero.full .hero-content {
  background:transparent;
  border:0;
  box-shadow:none;
  border-radius:0;
  max-width:100%;
  width:100%;
  margin:0;
  padding:6rem 2rem 3.2rem; /* distribui espaço superior/inferior dentro do painel */
}

/* garante alinhamento tipográfico igual ao restante */
@media (min-width:900px){
  .hero.full .hero-content { padding:6.5rem 3rem 3.4rem; }
}

/* mobile: painel continua full, reduz padding */
@media (max-width:880px){
  .hero.full {
    border-radius:0; /* opcional: colar nas bordas em telas pequenas */
  }
  .hero.full .hero-content {
    padding:5rem 1.25rem 2.6rem;
  }
}

/* remove versão anterior (evita conflito) */
.hero.full .hero-content.box-shadow,
.hero.full .hero-content[style*="box-shadow"] {
  box-shadow:none !important;
}

/* remove regra anterior de hero.full .hero-content (caso ainda exista abaixo) */

/* Remover bordas/sombras laterais do hero */
.hero.full,
.hero.full .hero-content {
  border:none !important;
  box-shadow:none !important;
}

/* Se quiser manter só um leve sombreado inferior (opcional), descomente:
.hero.full { box-shadow:0 30px 80px -50px #000 !important; }
*/

/* Badges de categoria */
.cat-badge {
  display:inline-block;
  font-weight:700;
  font-size:.58rem;
  letter-spacing:1px;
  padding:.38rem .75rem .42rem;
  border:1px solid currentColor;
  border-radius:10px;
  background:#0d1417;
  line-height:1;
  user-select:none;
}
.cat-badge.vip    { color:#00f8ff; }
.cat-badge.nitro  { color:#bf00ff; }
.cat-badge.loja   { color:#00ca14; }
.cat-badge.padrao { color:#62a3ce; }

.cat-badge.vip:hover    { box-shadow:0 0 6px -1px #00f8ffaa; }
.cat-badge.nitro:hover  { box-shadow:0 0 6px -1px #bf00ffaa; }
.cat-badge.loja:hover   { box-shadow:0 0 6px -1px #00ca14aa; }
.cat-badge.padrao:hover { box-shadow:0 0 6px -1px #62a3ceaa; }

/* Esconde badge Civil (mantém só Máfia) */
.faction-badge.civil { display:none !important; }
.faction-badge.mafia {
  display:inline-block;
  font-size:.58rem;
  font-weight:700;
  letter-spacing:1px;
  padding:.38rem .65rem .42rem;
  border:1px solid #ff2d2d;
  border-radius:10px;
  background:#1a0c0c;
  color:#ff2d2d;
}

/* Hover: cor do nome conforme facção */
.role.faction-civil:hover .role-name { color:#00b7ff; }
.role.faction-mafia:hover .role-name { color:#ff2d2d; }
/* === HOVER POR FACÇÃO (civil azul / mafia vermelho) === */
.role.faction-civil:hover {
  border-color:#00b7ff !important;
  box-shadow:0 14px 42px -20px #000, var(--shadow-glow-blue) !important;
}
.role.faction-civil:hover:before {
  opacity:1;
  background: radial-gradient(circle at 60% 30%, rgba(0,183,255,0.25), transparent 72%);
}
.role.faction-civil:hover .role-name {
  color:#00b7ff;
}

.role.faction-mafia:hover {
  border-color:#ff2d2d !important;
  box-shadow:0 14px 42px -20px #000, var(--shadow-glow-red) !important;
}
.role.faction-mafia:hover:before {
  opacity:1;
  background: radial-gradient(circle at 60% 30%, rgba(255,45,45,0.28), transparent 72%);
}
.role.faction-mafia:hover .role-name {
  color:#ff2d2d;
}
/* === FIM HOVER POR FACÇÃO === */

/* Footer social links */
.site-footer .social-links {
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:.75rem;
  margin:0 0 1.1rem;
  padding-top:.3rem;
}
.site-footer .social-links a {
  --size:42px;
  width:var(--size);
  height:var(--size);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #1e272d;
  border-radius:12px;
  background:rgba(255,255,255,0.04);
  color:#eef2f6;
  text-decoration:none;
  position:relative;
  transition: background .25s, border-color .25s, box-shadow .35s, color .25s;
}
.site-footer .social-links a svg {
  width:21px;
  height:21px;
  display:block;
}
.site-footer .social-links a:hover {
  background:rgba(255,255,255,0.08);
}

/* Platform specific hover accents */
.site-footer .social-links a.github:hover {
  border-color:#ffffff55;
  box-shadow:0 0 0 1px #ffffff22,0 0 10px -2px #ffffff55;
}
.site-footer .social-links a.discord:hover {
  border-color:#5865F2;
  box-shadow:0 0 0 1px #5865F255,0 0 14px -2px #5865F299;
  color:#aeb6ff;
}
.site-footer .social-links a.email:hover {
  border-color:#00b7ff;
  box-shadow:0 0 0 1px #00b7ff55,0 0 14px -2px #00b7ff99;
  color:#c6f2ff;
}
.site-footer .social-links a.x:hover {
  border-color:#cccccc;
  box-shadow:0 0 0 1px #cccccc55,0 0 14px -2px #ffffff33;
  color:#ffffff;
}
.site-footer .social-links a.youtube:hover {
  border-color:#ff2d2d;
  box-shadow:0 0 0 1px #ff2d2d55,0 0 16px -2px #ff2d2daa;
  color:#ffb3b3;
}

/* Focus style reuse */
.site-footer .social-links a:focus-visible {
  outline:2px solid var(--blue);
  outline-offset:3px;
}

/* Mobile tweak */
@media (max-width:560px){
  .site-footer .social-links a {
    --size:38px;
    border-radius:10px;
  }
  .site-footer .social-links { gap:.55rem; }
}

#loginArea { display:flex; flex-direction:column; align-items:flex-start; gap:1.2rem; }
.user-card {
  display:flex;
  align-items:center;
  gap:1rem;
  padding:1rem 1.25rem;
  background:#101417;
  border:1px solid #1d2428;
  border-radius:12px;
  box-shadow:0 4px 18px -10px #000;
  max-width:360px;
}
.user-card img {
  width:64px; height:64px;
  border-radius:50%;
  border:2px solid #0f2e38;
  background:#0a0d0f;
}
.user-card .uc-meta { display:flex; flex-direction:column; line-height:1.2; }
.user-card .uc-name { font-weight:700; font-size:1rem; }
.user-card .uc-tag { font-size:.7rem; letter-spacing:1px; color:#5d6b74; }
#logoutBtn { margin-top:.3rem; }

.support-section .support-intro {
  max-width:760px;
  margin:-.6rem 0 2rem;
  line-height:1.5;
  color:var(--gray-300);
}
.ticket-form {
  display:grid;
  gap:1.2rem;
  max-width:760px;
  margin:0 0 3.2rem;
  background: linear-gradient(145deg,#121518,#0d0f11);
  padding:1.6rem 1.7rem 1.9rem;
  border:1px solid #1f262c;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}
.ticket-form .field { display:flex; flex-direction:column; gap:.45rem; }
.ticket-form label {
  font-size:.72rem;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
  color: var(--gray-300);
}
.ticket-form input,
.ticket-form textarea {
  background:#0e1214;
  border:1px solid #242b30;
  color: var(--white);
  font:inherit;
  padding:.85rem 1rem;
  border-radius:10px;
  resize:vertical;
  outline:none;
  transition:border-color .25s, background .25s;
}
.ticket-form input:focus,
.ticket-form textarea:focus { border-color: var(--blue); background:#12181b; }
.ticket-form .ticket-note {
  margin:.2rem 0 -.3rem;
  font-size:.7rem;
  letter-spacing:.6px;
  color: var(--gray-500);
}
.ticket-status {
  font-size:.75rem;
  letter-spacing:.5px;
  font-weight:600;
  min-height:1em;
  margin-top:.2rem;
}
.ticket-status.ok { color:#35d58a; }
.ticket-status.err { color:#ff6b6b; }

.faq-title {
  margin:0 0 1.6rem;
  font-size:1.4rem;
  font-weight:800;
  letter-spacing:.8px;
}
.faq-list {
  display:flex;
  flex-direction:column;
  gap:1.1rem;
  max-width:1200px;
}
.faq-item {
  background: linear-gradient(145deg,#161b20,#111417);
  border:1px solid #1e262c;
  padding:1.15rem 1.25rem 1.2rem;
  border-radius:14px;
  position:relative;
  overflow:hidden;
  transition: var(--transition);
}
.faq-item:before {
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 20% 15%, rgba(0,183,255,0.08), transparent 60%),
    radial-gradient(circle at 80% 70%, rgba(255,45,45,0.06), transparent 65%);
  opacity:0;
  transition: var(--transition);
}
.faq-item:hover {
  border-color:#273239;
  transform:translateY(-4px);
  box-shadow:0 10px 36px -20px #000, var(--shadow-glow-blue);
}
.faq-item:hover:before { opacity:1; }
.faq-item h4 {
  margin:0 0 .55rem;
  font-size:1.05rem;
  font-weight:700;
  letter-spacing:.5px;
  color: var(--white);
}
.faq-item p {
  margin:0;
  font-size:.82rem;
  line-height:1.5;
  color: var(--gray-300);
}
.faq-item code {
  background:#0f1619;
  padding:.15rem .4rem;
  border:1px solid #1f2a2f;
  border-radius:6px;
  font-size:.7rem;
  letter-spacing:.5px;
  color: var(--blue);
}
/* Mobile tweak */
@media (max-width:640px){
  .ticket-form { padding:1.2rem 1.1rem 1.35rem; }
  .faq-item { padding:1rem 1rem 1.05rem; }
}

/* === SUPORTE (centralização) === */
.support-section .support-wrap {
  max-width:1200px;
  margin:0 auto;
  width:100%;
}
.support-section .ticket-form {
  margin-left:auto;
  margin-right:auto;
  max-width:760px;
  width:100%;
}
.support-section .faq-list {
  max-width:1200px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
}
.support-section .faq-item {
  width:100%;
}

/* Removidas regras antigas:
.support-section .ticket-form,
.support-section .faq-list { margin-left:auto; margin-right:auto; }
.support-section .ticket-form { width:100%; max-width:760px; }
.support-section .faq-list { width:100%; max-width:980px; }
*/

/* Centraliza formulário e FAQ */
.support-section .ticket-form,
.support-section .faq-list {
  margin-left:auto;
  margin-right:auto;
}
.support-section .ticket-form { width:100%; max-width:760px; }
.support-section .faq-list { width:100%; max-width:980px; }
/* Opcional: centralizar título e intro (descomente se quiser
.support-section .section-title,
.support-section .support-intro { text-align:center; }
*/

/* Ajuste de alinhamento preciso da seção Suporte */
.support-section.section.alt {
  margin:0 auto;              /* removes possíveis margens extras */
  padding:4.5rem 1.25rem 4.2rem; /* mesmo topo/baixo da .section, laterais = nav-inner (1.25rem) */
  border-radius:0;            /* sem radius para ficar igual às outras alt */
  background: linear-gradient(180deg,#0c0f12,#0b0c0e); /* garante mesmo gradiente */
  box-shadow: inset 0 0 35px -18px #000;
}
.support-section .support-wrap { max-width:1200px; margin:0 auto; }
/* .support-section .ticket-form rule removed (was empty) */
.support-section .support-intro { margin-top:-.4rem; } /* leve ajuste vertical opcional */

/* Centralização visual da seção Suporte */
.support-section .section-title,
.support-section .support-intro,
.support-section .faq-title {
  text-align:center;
}

.support-section .support-intro {
  max-width:860px;
  margin-left:auto;
  margin-right:auto;
}

.support-section .ticket-form {
  margin-left:auto;
  margin-right:auto;
}

.support-section .faq-list {
  margin-left:auto;
  margin-right:auto;
}

/* Garante que itens internos continuem alinhados à esquerda */
.support-section .ticket-form,
.support-section .faq-item { text-align:left; }

/* Link dentro da intro (Discord brand color) */
.support-section .support-intro a {
  color:#5865F2;
  text-decoration:none;
  font-weight:600;
  transition:color .25s;
}
.support-section .support-intro a:hover,
.support-section .support-intro a:focus-visible {
  color:#6d79ff;
}

/* Override: título "Suporte" alinhado à esquerda */
.support-section .section-title {
  text-align:left !important;
}

.ticket-form .g-recaptcha {
  justify-self:center;
  margin:.4rem auto .2rem;
  transform:translateZ(0); /* evita blur em alguns browsers */
}

/* Botão CTA final (Entrar no Discord) com fonte pixel */
#discord .btn {
  font-family: 'RevMiniPixel', var(--font-stack);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;
}

/* Avatar do usuário na barra de navegação */
a.nav-user {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  padding:0;
  background:linear-gradient(90deg,#002c38,#03202a);
  border:1px solid #02475e;
  border-radius: var(--radius-sm);
  box-shadow:0 0 0 1px #02475e66,0 0 10px -2px #00b7ff55;
  cursor:pointer;
  position:relative;
}
a.nav-user:hover {
  background:linear-gradient(90deg,#015b7a,#013c4f);
}
a.nav-user .nav-avatar {
  width:30px;
  height:30px;
  border-radius:50%;
  object-fit:cover;
  border:1px solid #0d3b49;
  background:#0a1013;
  display:block;
}
a.nav-user .nav-username { display:none !important; } /* nome removido */

/* Dropdown perfil */
.user-menu {
  position:absolute;
  top:100%;
  right:0;
  margin-top:.55rem;
  width:240px;
  background:#0f1417;
  border:1px solid #1f272c;
  border-radius:12px;
  box-shadow:0 18px 42px -18px #000,0 0 0 1px #1f272c;
  padding:.9rem .95rem 1rem;
  z-index:50;
  animation:fadeMenu .18s ease;
}
@keyframes fadeMenu { from{opacity:0;transform:translateY(-4px);} to{opacity:1;transform:translateY(0);} }
.user-menu:before {
  content:"";
  position:absolute;
  top:-6px; right:14px;
  width:12px;height:12px;
  background:#0f1417;
  border-left:1px solid #1f272c;
  border-top:1px solid #1f272c;
  transform:rotate(45deg);
  z-index:-1;
}
.user-menu .um-head {
  display:flex;
  gap:.65rem;
  align-items:center;
  margin:0 0 .75rem;
}
.user-menu .um-head img {
  width:48px;height:48px;border-radius:50%;object-fit:cover;
  border:2px solid #024d68;background:#0c1215;
}
.user-menu .um-names {
  display:flex;
  flex-direction:column;
  line-height:1.15;
  font-size:.78rem;
  letter-spacing:.5px;
}
.user-menu .um-display {
  font-family:'RevMiniPixel', var(--font-stack);
  font-size:.9rem;
  letter-spacing:1px;
  font-weight:700;
  color:#fff;
  max-width:120px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.user-menu .um-tag { color: var(--gray-300); font-size:.65rem; }
.user-menu .um-role {
  --role-color:#9ec9da;
  display:inline-block;
  margin-top:.35rem;
  font-size:.6rem;
  letter-spacing:1px;
  font-weight:700;
  padding:.38rem .65rem .42rem;
  border:1px solid var(--role-color);
  background:color-mix(in srgb, var(--role-color) 15%, #121a1e);
  color:var(--role-color);
  border-radius:8px;
  text-shadow:0 0 6px color-mix(in srgb, var(--role-color) 55%, transparent);
  transition:.25s;
}
.user-menu .um-role[data-role=ADMIN] { --role-color:#df0007; }
.user-menu .um-role[data-role=HOST]  { --role-color:#006fff; }
.user-menu .um-role[data-role=VIP]   { --role-color:#00f8ff; }
.user-menu .um-role[data-role=NITRO] { --role-color:#bf00ff; }
.user-menu .um-role[data-role=LOJA]  { --role-color:#00ca14; }
.user-menu .um-role[data-role=MEMBRO]{ --role-color:#62a3ce; }
@supports not (color: color-mix(in srgb, red, blue)) {
  /* Fallback sem color-mix */
  .user-menu .um-role {
    background:rgba(255,255,255,0.04);
    text-shadow:none;
  }
}
.user-menu .um-actions {
  display:flex;
  flex-direction:column;
  gap:.4rem;
  margin-top:.4rem;
}
.user-menu .um-actions button,
.user-menu .um-actions a {
  all:unset;
  background:#151d21;
  border:1px solid #243035;
  padding:.55rem .7rem;
  font-size:.68rem;
  letter-spacing:.9px;
  font-weight:600;
  border-radius:8px;
  cursor:pointer;
  color:#d5e7ef;
  text-transform:uppercase;
  text-align:left;
  transition:background .25s,border-color .25s,color .25s;
}
.user-menu .um-actions button:hover,
.user-menu .um-actions a:hover {
  background:#1f2a2f;
  border-color:#2f3c42;
}
.user-menu .um-actions button.logout {
  color:#ff8d8d;
  border-color:#3a2626;
  background:#1d1212;
}
.user-menu .um-actions button.logout:hover {
  background:#291717;
  border-color:#4b3030;
}

/* PARTIDAS */
.partidas-grid {
  display:grid;
  gap:1.25rem;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  margin-top:1.2rem;
}
@media (min-width:900px){
  .partidas-grid { grid-template-columns:repeat(5,1fr); }
}
.partida-card {
  position:relative;
  background:linear-gradient(145deg,#11181c,#0c1012);
  border:1px solid #1f2a30;
  border-radius:14px;
  padding:.85rem .85rem 1rem;
  display:flex;
  flex-direction:column;
  gap:.55rem;
  min-height:150px;
  overflow:hidden;
  transition:transform .25s, box-shadow .25s, border-color .25s;
  cursor:default;
}
.partida-card:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 30% 20%,#0d3644cc,transparent 70%),
    radial-gradient(circle at 80% 75%,#05324099,transparent 60%);
  opacity:.18;
  pointer-events:none;
  transition:opacity .3s;
}
.partida-card:hover{
  transform:translateY(-4px);
  border-color:#267396;
  box-shadow:0 14px 42px -20px #000,0 0 0 1px #1f2a30;
}
.partida-card:hover:before{ opacity:.28; }
.partida-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.35rem;
}
.partida-title{
  font-size:.70rem;
  letter-spacing:1.2px;
  font-weight:700;
  font-family:'RevMiniPixel',var(--font-stack);
  color:#e2f8ff;
  line-height:1.1;
  text-transform:uppercase;
  flex:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.partida-status {
  font-size:.55rem;
  letter-spacing:1px;
  font-weight:700;
  padding:.35rem .45rem .4rem;
  border-radius:6px;
  line-height:1;
  border:1px solid;
  text-transform:uppercase;
  white-space:nowrap;
}
.partida-status.lobby      { color:#62a3ce; border-color:#255065; background:#122027; }
.partida-status.ao_vivo    { color:#ff2d2d; border-color:#742121; background:#241011; }
.partida-status.recriando  { color:#ffc861; border-color:#6a4d19; background:#241a0d; }
.partida-status.finalizada { color:#8f96a0; border-color:#383e44; background:#1a1d1d; }
.partida-meta{
  font-size:.60rem;
  letter-spacing:.7px;
  color:#9fb3bc;
  display:flex;
  flex-direction:column;
  gap:.15rem;
  line-height:1.25;
  margin-top:.2rem;
}
.partida-meta strong{ color:#fff; font-weight:600; }
.partida-footer{
  margin-top:auto;
  display:flex;
  justify-content:flex-start;
}
.partida-card a.card-link{
  font-size:.58rem;
  letter-spacing:1px;
  font-weight:700;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:.25rem;
  padding:.5rem .6rem .55rem;
  border:1px solid #1e3139;
  border-radius:8px;
  color:#b6dff0;
  background:#132228;
  text-transform:uppercase;
  transition:background .25s,border-color .25s,color .25s;
}
.partida-card a.card-link:hover{
  background:#1d323a;
  border-color:#2c4b56;
  color:#fff;
}

.user-profile-card {
  display:flex;
  gap:1.2rem;
  align-items:flex-start;
  background:linear-gradient(145deg,#13171a,#0d0f10);
  border:1px solid #1c2328;
  padding:1.2rem 1.35rem 1.35rem;
  border-radius:14px;
  max-width:520px;
  box-shadow:0 6px 26px -18px #000,0 0 0 1px #1c2328;
}
.user-profile-card img {
  width:92px;
  height:92px;
  border-radius:12px;
  object-fit:cover;
  border:2px solid #0f2f3a;
  background:#0b0f11;
  box-shadow:0 2px 10px -6px #000;
}
.user-profile-card .up-meta {
  display:flex;
  flex-direction:column;
  gap:.4rem;
  font-size:.78rem;
  letter-spacing:.4px;
  line-height:1.35;
}
.user-profile-card .up-name {
  font-family:'RevMiniPixel', var(--font-stack);
  font-size:1.05rem;
  letter-spacing:1px;
  font-weight:700;
  color:#fff;
  margin-bottom:.2rem;
}

.login-section { display:flex; justify-content:center; align-items:flex-start; }
.login-panel {
  width:100%;
  max-width:480px;
  margin:0 auto;
  background:linear-gradient(145deg,#0f1417,#0b0d0f);
  border:1px solid #1d2428;
  border-radius:18px;
  padding:2.2rem 2.1rem 2.4rem;
  box-shadow:0 8px 34px -18px #000,0 0 0 1px #1d2428;
  position:relative;
  display:flex;
  flex-direction:column;
  gap:1.4rem;
  min-height:380px;
  align-items:center;              /* centraliza itens internos */
  text-align:center;               /* texto central */
}
.login-panel .login-back {
  position:absolute;
  top:1rem;left:1rem;
  width:42px;height:42px;
  border:1px solid #233037;
  background:#121a1f;
  border-radius:10px;
  color:#c5d8e0;
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;
  text-decoration:none;
  transition:.25s;
}
.login-panel .login-back:hover { background:#182228; color:#fff; border-color:#2e4048; }
.login-panel .logo-box {
  display:flex;justify-content:center;align-items:center;
  margin-top:.3rem;
  justify-content:center;
}
.login-panel h1 {
  width:100%;
  text-align:center;
  margin-top:.2rem;
  font-size:1.65rem;
  font-weight:800;
  letter-spacing:1px;
  font-family:'RevMiniPixel',var(--font-stack);
  background:linear-gradient(90deg,#fff,#c2eaff);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.login-panel .login-actions {
  margin-top:.5rem;
  display:flex;
  flex-direction:column;
  gap:1rem;
  align-items:center;              /* centraliza dentro do bloco */
  width:100%;
}
.login-panel .login-actions .captcha-block,
.login-panel .login-actions .btn,
.login-panel .login-actions .hint {
  align-self:center;
}

/* LOGIN: centralizar tudo e reduzir logo */
#loginArea { /* era align-items:flex-start */
  align-items:center !important;
  text-align:center;
  gap:1.4rem;
}
.login-panel .logo-box img {
  max-width:240px;
  width:70%;
  height:auto;
  display:block;
  filter:drop-shadow(0 0 10px #ffffff25);
}
.login-panel h1 {
  width:100%;
  text-align:center;
  margin-top:.2rem;
}

/* Badge de cargo no menu: texto perfeitamente centralizado */
.user-menu .um-role {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.40rem .70rem .44rem; /* ajuste vertical */
  line-height:1;
}

/* SUPORTE: centralizar captcha + botão e nota abaixo */
.ticket-form {
  justify-items:stretch;
}
.ticket-form #ticketCaptchaWrapper,
.ticket-form #ticketTurnstile {
  justify-self:center;
  text-align:center;
}
.cf-turnstile { margin:0 auto; }
.ticket-form button[type=submit] {
  justify-self:center;
  margin-top:.4rem;
}
.ticket-form .ticket-note {
  order: 99; /* garante que fique depois (fallback caso HTML antigo) */
  text-align:center;
  margin-top:.6rem;
}

/* Caso queira forçar nota depois sem mexer no DOM antigo */
.ticket-form .ticket-note + #ticketCaptchaWrapper { order: 10; }
.ticket-form #ticketCaptchaWrapper + button + .ticket-status + .ticket-note { order:99; }

/* Novos estilos para perfil, busca e banner */
.profile-search { margin:.75rem 0 1rem; display:flex; gap:.5rem; flex-wrap:wrap; }
.profile-search input { flex:1 1 280px; background:#11181c; border:1px solid #223036; padding:.55rem .65rem; border-radius:8px; color:#d5dfe4; }
.profile-search-results { margin-top:.5rem; display:flex; flex-direction:column; gap:.35rem; max-height:230px; overflow:auto; }
.profile-search-results .pr-item { padding:.4rem .55rem; background:#121d22; border:1px solid #1e2a30; border-radius:6px; cursor:pointer; font-size:.85rem; display:flex; justify-content:space-between; align-items:center; }
.profile-search-results .pr-item:hover { background:#16252b; }
.profile-view { margin-top:1rem; background:#0f1417; border:1px solid #1d272c; border-radius:14px; padding:1rem; position:relative; }
.profile-banner { width:100%; height:140px; background:#131e23 center/cover no-repeat; border-radius:10px; margin-bottom:.75rem; position:relative; }
.profile-basic { display:flex; gap:1rem; align-items:flex-start; }
.profile-basic .avatar { width:86px; height:86px; border-radius:50%; border:3px solid #152328; background:#0d1418; }
.profile-meta h2 { margin:0; font-size:1.15rem; }
.profile-status { font-size:.75rem; opacity:.8; margin-top:.15rem; }
.badges { display:flex; gap:.4rem; flex-wrap:wrap; margin-top:.5rem; }
.badge { background:#16252b; border:1px solid #223037; padding:.25rem .55rem; border-radius:20px; font-size:.65rem; letter-spacing:.5px; }
.profile-bio { margin-top:.85rem; font-size:.8rem; line-height:1.3; white-space:pre-wrap; }
.profile-highlights { margin-top:.9rem; display:grid; gap:.6rem; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.ph-block { background:#111a1f; border:1px solid #1e2b30; padding:.6rem .7rem; border-radius:10px; }
.ph-block h4 { margin:.1rem 0 .45rem; font-size:.7rem; letter-spacing:.5px; opacity:.75; }
.profile-edit { margin-top:1.5rem; background:#111a1e; border:1px solid #1e2d33; padding:1rem; border-radius:12px; }
.profile-edit.hidden { display:none; }
.profile-edit label { display:flex; flex-direction:column; gap:.25rem; font-size:.7rem; text-transform:uppercase; letter-spacing:.5px; margin-bottom:.55rem; }
.profile-edit input, .profile-edit textarea { background:#0e161a; border:1px solid #203037; border-radius:8px; padding:.5rem .6rem; color:#d0dbe0; font-size:.78rem; }
.profile-edit textarea { min-height:110px; resize:vertical; }
.save-status { font-size:.65rem; margin-left:.6rem; opacity:.75; }
.profile-actions { position:absolute; top:.75rem; right:.75rem; display:flex; gap:.4rem; }
.profile-actions button { font-size:.6rem; padding:.35rem .55rem; }
.profile-empty { opacity:.55; font-size:.75rem; }

/* Estilos básicos para loja (mantendo existentes) */
.shop-panel { background:#10171b; border:1px solid #1e272c; padding:1rem 1.1rem 1.2rem; border-radius:14px; }
.shop-header { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:.75rem; }
.shop-balance { font-size:.85rem; display:flex; align-items:center; }
.sb-label { opacity:.7; margin-right:.35rem; font-weight:600; letter-spacing:.5px; }
.sb-value { font-weight:700; color:#ffd36b; }
.shop-subtitle { font-size:.9rem; margin:.2rem 0 .6rem; letter-spacing:.5px; }
.shop-items-grid { display:grid; gap:.8rem; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); }
.shop-item { background:#121d22; border:1px solid #1e2a30; padding:.55rem .6rem .6rem; border-radius:10px; cursor:pointer; display:flex; flex-direction:column; justify-content:space-between; transition:background .18s,border-color .18s; }
.shop-item:hover { background:#17262c; border-color:#26343a; }
.si-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:.45rem; }
.si-name { font-size:.72rem; font-weight:600; letter-spacing:.5px; }
.si-badge { font-size:.55rem; padding:.15rem .45rem; border-radius:10px; background:#19313a; border:1px solid #25414b; letter-spacing:.5px; }
.si-badge.cargo { background:#2d2444; border-color:#40345e; }
.si-badge.perk { background:#20382b; border-color:#2d5940; }
.si-foot { display:flex; justify-content:space-between; align-items:center; margin-top:.25rem; }
.si-price { font-size:.7rem; font-weight:600; color:#ffc65a; }
.btn.tiny { font-size:.55rem; padding:.3rem .55rem; }
.shop-empty { font-size:.7rem; opacity:.65; }
.shop-modal { position:fixed; inset:0; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; z-index:150; }
.shop-modal-box { width: min(360px,90%); background:#101a1e; border:1px solid #1f2b30; border-radius:14px; padding:1rem 1rem 1.1rem; }
.shop-modal-box h4 { margin:0 0 .4rem; font-size:.85rem; letter-spacing:.5px; }
.sm-actions { margin-top:.6rem; display:flex; gap:.6rem; }
.shop-guest { margin:.4rem 0 1rem; }

/* Estilos mínimos do painel */
#painel .admin-block { background:#10171b; border:1px solid #1e272c; padding:1rem 1rem 1.1rem; border-radius:14px; margin-bottom:1.3rem; }
#painel .admin-block h3 { margin:.1rem 0 1rem; font-size:.9rem; letter-spacing:.6px; }
.admin-form { display:flex; flex-direction:column; gap:.75rem; font-size:.7rem; }
.admin-form label { display:flex; flex-direction:column; gap:.35rem; font-size:.65rem; text-transform:uppercase; letter-spacing:.6px; }
.admin-form input, .admin-form textarea, .admin-form select {
  background:#0e1519; border:1px solid #233036; color:#d7e3e8; padding:.55rem .65rem; border-radius:8px; font:inherit; font-size:.75rem;
}
.admin-form textarea { resize:vertical; }
.admin-status { font-size:.65rem; margin-left:.6rem; opacity:.8; }
.af-row { display:flex; flex-wrap:wrap; gap:.75rem; align-items:flex-end; }
.admin-rotation-list { display:grid; gap:.7rem; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); }
.admin-rotation-list .ar-item { background:#121d22; border:1px solid #1e2a30; padding:.55rem .6rem .65rem; border-radius:10px; display:flex; flex-direction:column; gap:.4rem; position:relative; }
.admin-rotation-list .ar-item h4 { margin:0; font-size:.72rem; letter-spacing:.5px; display:flex; justify-content:space-between; gap:.4rem; }
.admin-rotation-list .ar-item p { margin:0; font-size:.6rem; line-height:1.3; opacity:.75; }
.admin-rotation-list .ar-item button { position:absolute; top:.45rem; right:.45rem; font-size:.55rem; padding:.25rem .5rem; }
.badge-list { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.4rem; }
.badge-list .b { background:#16252b; border:1px solid #223037; padding:.25rem .55rem; border-radius:20px; font-size:.6rem; display:inline-flex; gap:.35rem; align-items:center; cursor:default; }
.badge-list .b button { all:unset; cursor:pointer; font-size:.65rem; padding:0 .15rem; color:#ff6b6b; }
.badge-list .b button:hover { color:#ff3d3d; }

.admin-tabs { display:flex; gap:.5rem; margin:0 0 1.1rem; flex-wrap:wrap; }
.admin-tabs .at-btn {
  all:unset; cursor:pointer; font-size:.6rem; letter-spacing:1px;
  padding:.5rem .8rem .55rem; border:1px solid #223036;
  background:#0f181c; border-radius:9px; font-weight:700;
  transition:.25s; text-transform:uppercase;
}
.admin-tabs .at-btn.active, .admin-tabs .at-btn:hover {
  background:#14242a; border-color:#2d3d44;
}
.admin-tab { display:none; }
.admin-tab.active { display:block; }

.upload-zone {
  border:1px dashed #25414b; border-radius:10px; padding:.8rem;
  text-align:center; font-size:.6rem; letter-spacing:.7px;
  background:#132227; cursor:pointer; color:#9ec0cc;
  transition:.25s;
}
.upload-zone.drag { background:#173037; border-color:#2f5e6b; color:#dff7ff; }

.user-info-box {
  margin-top:.8rem; background:#111c20; border:1px solid #1e2b30;
  padding:.7rem .8rem; border-radius:10px; font-size:.63rem;
  line-height:1.35; display:grid; gap:.25rem;
}

.stats-grid { display:grid; gap:.8rem; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); margin-top:.4rem; }
.stats-grid .st {
  background:#111c20; border:1px solid #1f2b30; padding:.55rem .6rem .65rem;
  border-radius:10px; display:flex; flex-direction:column; gap:.25rem;
}
.stats-grid .st span { font-size:.55rem; letter-spacing:.6px; opacity:.7; }
.stats-grid .st strong { font-size:.95rem; font-weight:700; letter-spacing:.5px; color:#fff; }

.admin-suggestions { margin:.2rem 0 0; padding-left:1.1rem; font-size:.6rem; line-height:1.4; opacity:.85; }
.admin-suggestions li { margin:.2rem 0; }

/* Estado edição item (realça) */
.admin-rotation-list .ar-item.editing {
  border-color:#2c5865;
  background:#173038;
}

/* Badge blocked (inline) */
.user-info-box .flag-blocked {
  color:#ff6b6b;
  font-weight:700;
  letter-spacing:.5px;
}

/* === FIX CORES CARGOS CIVIS ===
   Garante que hover seja azul e estado normal neutro, evitando herdar estilos vermelhos. */
.roles-grid .role.faction-civil {
  --civil-border: #1f4155;
  --civil-bg: linear-gradient(145deg,#0f171b,#0d1316);
  border:1px solid var(--civil-border);
  background: var(--civil-bg);
  transition: border-color .25s, box-shadow .25s, transform .25s;
}
.roles-grid .role.faction-civil:hover {
  border-color:#2d7cb8;
  box-shadow:0 0 0 1px #2d7cb84d, 0 4px 14px -4px #2d7cb899;
  transform:translateY(-2px);
}
.roles-grid .role.faction-civil:active {
  transform:translateY(0);
}

/* Remove qualquer resíduo de cor vermelha aplicada genericamente a .role:hover */
.roles-grid .role.faction-civil:hover .role-name {
  color:#cfe9f8;
}
.roles-grid .role.faction-civil .role-name {
  color:#e5f4fb;
}

/* Prioridade para sobrescrever regra global genérica se existir */
.roles-grid .role.faction-civil:hover,
.roles-grid .role.faction-civil { background-clip: padding-box; }

.rarity-badge {
  display:inline-block;
  padding:.18rem .5rem .22rem;
  font-size:.50rem;
  font-weight:600;
  letter-spacing:.6px;
  border:1px solid var(--rb-color,#666);
  background:linear-gradient(145deg,var(--rb-color,#666),rgba(0,0,0,.15));
  color:#fff;
  border-radius:14px;
  box-shadow:0 0 0 1px #000 inset;
  position:relative;
}
.rarity-badge.r-mitico   { --rb-color:#d04dff; }
.rarity-badge.r-lendario { --rb-color:#ff9a32; }
.rarity-badge.r-raro     { --rb-color:#3d9bff; }
.rarity-badge.r-normal   { --rb-color:#6b7880; }
.rarity-badge::after {
  content:attr(title);
  position:absolute;
  left:50%; top:0;
  transform:translate(-50%,-120%);
  background:#0e161a;
  border:1px solid #253238;
  padding:.25rem .45rem;
  font-size:.5rem;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  border-radius:6px;
  transition:.18s;
}
.rarity-badge:hover::after { opacity:1; }

/* Corrige flicker vermelho em cargos CIVIL (estado normal fora do hover) */
.role.faction-civil:before {
  background: radial-gradient(circle at 65% 30%, rgba(0,183,255,0.14), transparent 70%);
}
/* (Opcional) reforça vermelho só para máfia (sem necessidade se já satisfaz) */
.role.faction-mafia:before {
  background: radial-gradient(circle at 65% 30%, rgba(255,45,45,0.18), transparent 70%);
}

/* Filtros de cargos (novo) */
.roles-filters {
  display:flex; flex-wrap:wrap; gap:.6rem 1rem;
  margin:.4rem 0 1rem;
  align-items:flex-end;
}
.roles-filters .rf-group {
  display:flex; flex-wrap:wrap; gap:.4rem; align-items:center;
}
.roles-filters .rf-label {
  font-size:.62rem; letter-spacing:.8px; text-transform:uppercase; opacity:.75; font-weight:700;
  margin-right:.2rem;
}
.roles-filters .rf-btn {
  all:unset;
  cursor:pointer;
  font-size:.62rem;
  letter-spacing:.8px;
  padding:.42rem .65rem .46rem;
  border:1px solid #223036;
  background:#10171b;
  color:#d5e7ef;
  border-radius:9px;
  font-weight:700;
  transition:.2s;
}
.roles-filters .rf-btn:hover {
  background:#152127; border-color:#2a3b42;
}
.roles-filters .rf-btn.active {
  background:#14242a; border-color:#2d3d44; color:#ffffff;
}
/* Esconde grupo (título+grid) se vazio após filtro */
.faction-group.hidden { display:none; }

/* Login captcha + disabled button visuals */
.login-panel .captcha-block { display:flex; justify-content:center; }
.login-panel .captcha-status { font-size:.78rem; opacity:.9; margin-top:.25rem; }
.btn.disabled[aria-disabled="true"] { pointer-events:none; opacity:.6; }