/* ======================================================
   VOID REAPERS – STYLE.CSS COMPLETO
   HOME pegado ARRIBA DEL TODO (sin espacio)
   Twitch grande CENTRADO + Resultados ARRIBA DERECHA
   ====================================================== */

:root{
  --primary:#ff7a00;
  --primary-dark:#b34700;
  --primary-glow:#ffae42;

  --bg-dark:#07070b;
  --bg-mid:#0f0f15;
  --bg-card:#16161d;
  --bg-soft:#1c1c25;

  --text:#ffffff;
  --text-soft:#bdbdbd;
  --border:#262630;
}

*{ margin:0; padding:0; box-sizing:border-box; }

body{
  font-family:'Roboto',sans-serif;
  background:linear-gradient(180deg,var(--bg-dark),var(--bg-mid));
  color:var(--text);
  min-height:100vh;
  font-size:16px;
}

a{ text-decoration:none; color:inherit; }

/* =========================
   HEADER
========================= */
header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 40px;
  background:#0d0d12;
  border-bottom:2px solid var(--primary-dark);
  position:sticky;
  top:0;
  z-index:999;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.team-logo{ height:65px; width:auto; }

.team-name{
  font-family:'Teko',sans-serif;
  font-size:2.3rem;
  letter-spacing:2px;
  color:var(--primary);
  text-shadow:0 0 10px rgba(255,122,0,.35);
}

/* =========================
   NAV
========================= */
nav{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

nav a{
  padding:9px 14px;
  border-radius:8px;
  font-weight:800;
  transition:.2s;
  font-size:1rem;
}

nav a:hover{
  background:var(--primary);
  color:#000;
}

/* =========================
   SECTION HEADER (SIN MARGEN ARRIBA)
========================= */
.section-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 12px 0; /* 🔥 0 arriba */
  padding:0;         /* 🔥 0 */
}

.section-header h2{
  font-family:'Teko',sans-serif;
  font-size:2.35rem;
  letter-spacing:1px;
  color:var(--primary);
  text-shadow:0 0 10px rgba(255,122,0,.35);
  margin:0; /* 🔥 importantísimo */
}

.badge{
  background:var(--primary);
  color:#000;
  padding:4px 10px;
  font-weight:900;
  border-radius:8px;
}

/* ======================================================
   HOME LAYOUT – PEGADO ARRIBA DEL TODO
====================================================== */

.hero-section{
  /* 🔥 CERO arriba. Esto lo pega justo debajo del borde del header */
  padding:0 40px 40px;
  margin:0;

  display:grid;
  grid-template-columns: 1fr 520px;
  column-gap:60px;

  align-items:start;
  justify-content:space-between;
}

/* Anula cualquier margen superior de los primeros bloques */
.hero-section > *{
  margin-top:0 !important;
}

/* ======================================================
   TWITCH – CUADRADO GRANDE Y CENTRADO
====================================================== */

.spotlight{
  margin-top:0 !important;
  padding-top:0 !important;

  display:flex;
  flex-direction:column;
  align-items:center;
}

/* header del twitch sin espacio arriba */
.spotlight .section-header{
  width:100%;
  max-width:640px;
  justify-content:flex-start;
  margin-top:0 !important;
  padding-top:0 !important;
}

/* player */
.spotlight-content{
  width:100%;
  max-width:640px;
  aspect-ratio:1/1;
  border-radius:16px;
  overflow:hidden;
  border:2px solid var(--primary-dark);
  box-shadow:0 0 26px rgba(255,122,0,.18);

  margin-top:0 !important;
}

#twitch-embed,
#twitch-embed iframe{
  width:100% !important;
  height:100% !important;
  display:block;
}

/* ======================================================
   RESULTADOS – ARRIBA DERECHA (PEGADOS ARRIBA)
====================================================== */

.matches-container{
  width:min(1100px, calc(100% - 32px));
  margin:16px auto 0;

  background:rgba(22,22,29,.88);
  border:1px solid rgba(255,122,0,.35);
  border-radius:18px;
  padding:18px;

  box-shadow:
    0 0 28px rgba(0,0,0,.45),
    0 0 18px rgba(255,122,0,.12);
}

.matches-container .section-header{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* lista */
#match-list{
  display:flex;
  flex-direction:column;
  gap:14px;

  /* Para que se vea arriba sin ocupar toda la pantalla */
  max-height:420px;
  overflow:auto;
  padding-right:6px;
}

.match-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(0,0,0,0.12));
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px 18px;
  transition:.2s;
  font-size:1.02rem;
}

.match-meta{
  display:flex;
  justify-content:space-between;
  font-size:.95rem;
  color:var(--text-soft);
  margin-bottom:8px;
}

.match-teams{
  font-weight:900;
  font-size:1.12rem;
  margin-bottom:6px;
}

.match-result{
  font-weight:900;
  color:var(--primary);
}

/* ======================================================
   ROSTER – PRO (LIMPIO + NEÓN NARANJA)
====================================================== */
.roster-page{
  padding:42px 40px 70px;
}

.squad-section{
  max-width:1100px;
  margin:0 auto 22px;
}

.section-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  padding:10px 2px 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
  margin-bottom:18px;
}

.section-header h2{
  font-family:'Teko',sans-serif;
  font-size:2.05rem;
  letter-spacing:1px;
  line-height:1;
}

.section-header .badge{
  font-size:.78rem;
  letter-spacing:1.2px;
  text-transform:uppercase;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,122,0,.28);
  background:rgba(255,122,0,.08);
  box-shadow:0 0 18px rgba(255,122,0,.10);
  color:rgba(255,255,255,.92);
}

.roster-list{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}

.player-profile-container{
  border-radius:18px;
}

.player-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.035), rgba(0,0,0,0.14));
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  padding:16px 16px;
  display:flex;
  flex-direction:column;
  gap:12px;
  overflow:hidden;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.player-profile-container.orange-neon .player-card{
  border-color:rgba(255,122,0,.22);
  box-shadow:0 0 26px rgba(255,122,0,.12);
}

.player-card:hover{
  transform:translateY(-2px);
  box-shadow:0 0 32px rgba(255,122,0,.16);
}

.player-left{
  display:flex;
  align-items:center;
  gap:12px;
}

.player-avatar{
  width:46px;
  height:46px;
  border-radius:14px;
  display:grid;
  place-items:center;
  font-family:'Teko',sans-serif;
  font-size:1.8rem;
  line-height:1;
  color:#fff;
  background:radial-gradient(circle at 20% 20%, rgba(255,122,0,.35), rgba(255,122,0,.06) 55%, rgba(0,0,0,.2));
  border:1px solid rgba(255,122,0,.25);
  box-shadow:0 0 18px rgba(255,122,0,.14);
  flex:0 0 auto;
}

.player-meta{ flex:1; min-width:0; }

.player-nick-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.player-nick{
  font-family:'Teko',sans-serif;
  font-size:2.0rem;
  line-height:1;
  color:var(--primary);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.player-role{
  margin-top:6px;
  font-size:.95rem;
  color:rgba(255,255,255,.70);
  text-transform:uppercase;
  letter-spacing:.8px;
}

.player-socials{
  margin-top:10px;
  display:flex;
  gap:10px;
}

.social-link{
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);
  transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease;
  font-size:1.05rem;
}

.social-link:hover{
  transform:translateY(-1px);
  border-color:rgba(255,122,0,.35);
  box-shadow:0 0 16px rgba(255,122,0,.16);
}

.social-link.twitch i{ color:#b9a1ff; }
.social-link.tiktok i{ color:#ffffff; }

.player-right{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.tech-item{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
}

.tech-label{
  font-size:.72rem;
  color:rgba(255,255,255,.62);
  text-transform:uppercase;
  letter-spacing:1px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.tech-value{
  font-weight:800;
  font-size:1.03rem;
  overflow-wrap:anywhere;
}

/* Toggle ajustes */
.settings-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,122,0,.22);
  background:rgba(255,122,0,.08);
  color:#fff;
  cursor:pointer;
  font-weight:800;
  letter-spacing:.6px;
  text-transform:uppercase;
  font-size:.78rem;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
  white-space:nowrap;
}

.settings-toggle .chevron{
  transition:transform .18s ease;
  opacity:.9;
}

.settings-toggle:hover{
  transform:translateY(-1px);
  border-color:rgba(255,122,0,.35);
  box-shadow:0 0 18px rgba(255,122,0,.16);
}

.settings-toggle.open .chevron{
  transform:rotate(180deg);
}

/* Panel acordeón */
.settings-panel{
  overflow:hidden;
  max-height:0;
  border-radius:16px;
  border:1px solid rgba(255,122,0,.14);
  background:rgba(0,0,0,.18);
  box-shadow:0 0 22px rgba(255,122,0,.10);
  transition:max-height .22s ease;
  margin-top:12px;
}

.settings-panel.open{
  /* max-height lo setea JS */
}

.settings-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  padding:12px;
}

.settings-block{
  border-radius:14px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
  padding:12px;
}

.settings-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:900;
  letter-spacing:.7px;
  text-transform:uppercase;
  font-size:.82rem;
  margin-bottom:8px;
  color:rgba(255,255,255,.92);
}

.settings-title i{
  color:rgba(255,122,0,.95);
}

.settings-text{
  color:rgba(255,255,255,.78);
  line-height:1.35;
  font-size:.95rem;
  overflow-wrap:anywhere;
}

/* Responsive */
@media (max-width: 940px){
  .roster-list{ grid-template-columns:1fr; }
  .player-right{ grid-template-columns:1fr; }
}

@media (max-width: 520px){
  .roster-page{ padding:34px 16px 60px; }
  .player-avatar{ width:42px; height:42px; border-radius:12px; }
  .player-nick{ font-size:1.85rem; }
  .settings-toggle span{ display:none; }
}

/* ======================================================
   CALENDARIO
====================================================== */
.google-calendar-container{
  display:flex;
  justify-content:center;
  padding:30px 40px;
}

.google-calendar-container iframe{
  width:100%;
  max-width:1050px;
  border-radius:16px;
  border:2px solid var(--primary-dark);
}

/* ======================================================
   FOOTER
====================================================== */
footer{
  margin-top:60px;
  padding:25px;
  text-align:center;
  border-top:1px solid var(--primary-dark);
  color:var(--text-soft);
}

/* ======================================================
   SCROLLBAR
====================================================== */
::-webkit-scrollbar{ width:8px; }
::-webkit-scrollbar-thumb{ background:var(--primary); border-radius:10px; }

/* ======================================================
   RESPONSIVE
====================================================== */
@media (max-width:1250px){
  .hero-section{
    padding:0 30px 35px; /* 🔥 0 arriba también */
    grid-template-columns: 1fr 460px;
    column-gap:40px;
  }
  .matches-container{
  width:min(1100px, calc(100% - 32px));
  margin:16px auto 0;

  background:rgba(22,22,29,.88);
  border:1px solid rgba(255,122,0,.35);
  border-radius:18px;
  padding:18px;

  box-shadow:
    0 0 28px rgba(0,0,0,.45),
    0 0 18px rgba(255,122,0,.12);
}
  .spotlight .section-header,
  .spotlight-content{ max-width:600px; }
}

@media (max-width:1050px){
  .hero-section{
    grid-template-columns:1fr;
    row-gap:28px;
    padding:0 18px 30px; /* 🔥 0 arriba */
  }

  .matches-container{
  width:min(1100px, calc(100% - 32px));
  margin:16px auto 0;

  background:rgba(22,22,29,.88);
  border:1px solid rgba(255,122,0,.35);
  border-radius:18px;
  padding:18px;

  box-shadow:
    0 0 28px rgba(0,0,0,.45),
    0 0 18px rgba(255,122,0,.12);
}

  .spotlight .section-header,
  .spotlight-content{
    max-width:560px;
  }

  .spotlight-content{ margin:0 auto; }

  .player-card{
    grid-template-columns:1fr;
    align-items:start;
  }

  .tech-item{ grid-template-columns: 120px 1fr; }
}

@media (max-width:768px){
  header{
    flex-direction:column;
    gap:12px;
    padding:14px 18px;
  }

  .team-logo{ height:50px; }
  .section-header h2{ font-size:2rem; }

  .spotlight .section-header,
  .spotlight-content{ max-width:420px; }
}


/* ======================================================
   EXTRAS HOME (más contenido + look más pro)
====================================================== */

nav a.active{
  background:rgba(255,122,0,.14);
  border:1px solid rgba(255,122,0,.35);
}

.btn-discord, .btn-unirse{
  border-radius:10px;
  padding:9px 14px;
  font-weight:900;
}

.btn-discord{
  background:rgba(145,70,255,.16);
  border:1px solid rgba(145,70,255,.35);
}

.btn-discord:hover{ background:rgba(145,70,255,.26); }

.btn-unirse{
  background:rgba(255,122,0,.14);
  border:1px solid rgba(255,122,0,.35);
}

.btn-unirse:hover{ background:rgba(255,122,0,.24); }

.announce-bar{
  position:sticky;
  top:102px; /* justo debajo del header */
  z-index:998;
  background:rgba(10,10,14,.92);
  border-bottom:1px solid rgba(255,122,0,.25);
  backdrop-filter: blur(8px);
}

.announce-content{
  padding:10px 40px;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  color:rgba(255,255,255,.88);
}

.pulse-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--primary);
  box-shadow:0 0 14px rgba(255,122,0,.8);
  animation:pulse 1.6s infinite;
}

@keyframes pulse{
  0%{ transform:scale(1); opacity:1; }
  70%{ transform:scale(1.6); opacity:.35; }
  100%{ transform:scale(1); opacity:1; }
}

.sep{ opacity:.35; margin:0 2px; }

.announce-link{
  color:var(--primary);
  font-weight:900;
  text-shadow:0 0 10px rgba(255,122,0,.25);
}

.hero-actions{
  width:100%;
  max-width:640px;
  display:flex;
  gap:12px;
  justify-content:center;
  margin-top:14px;
}

.btn-primary, .btn-ghost, .btn-outline{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:11px 14px;
  border-radius:12px;
  font-weight:900;
  transition:.18s;
  user-select:none;
}

.btn-primary{
  background:var(--primary);
  color:#000;
  box-shadow:0 0 18px rgba(255,122,0,.18);
}

.btn-primary:hover{ transform:translateY(-1px); filter:saturate(1.08); }

.btn-ghost{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  color:rgba(255,255,255,.92);
}

.btn-ghost:hover{ background:rgba(255,255,255,.09); }

.btn-outline{
  background:transparent;
  border:1px solid rgba(255,122,0,.45);
  color:rgba(255,255,255,.92);
}

.btn-outline:hover{ background:rgba(255,122,0,.10); }

.home-extras{
  padding:10px 40px 60px;
  display:grid;
  grid-template-columns: 1.35fr 1fr;
  gap:18px;
  max-width:1240px;
  margin:0 auto;
}

.home-card{
  background:linear-gradient(180deg, rgba(255,255,255,0.035), rgba(0,0,0,0.14));
  border:1px solid rgba(255,122,0,.22);
  border-radius:18px;
  padding:18px 18px 16px;
  box-shadow:0 0 26px rgba(0,0,0,.45);
}

.home-card h3{
  font-family:'Teko',sans-serif;
  letter-spacing:1px;
  font-size:1.85rem;
  color:var(--primary);
  margin-bottom:8px;
  text-shadow:0 0 12px rgba(255,122,0,.22);
}

.home-card p{ color:rgba(255,255,255,.82); line-height:1.45; }
.muted{ color:rgba(255,255,255,.62); }

.mini-stats{
  margin-top:14px;
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
}

.mini-stat{
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}

.mini-stat .k{
  display:block;
  font-size:.78rem;
  opacity:.72;
  text-transform:uppercase;
  letter-spacing:.9px;
}

.mini-stat .v{
  display:block;
  margin-top:2px;
  font-weight:900;
}

.cta-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:12px;
}

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

.quick-link{
  padding:12px 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  transition:.18s;
}

.quick-link:hover{
  transform:translateY(-1px);
  border-color:rgba(255,122,0,.35);
  box-shadow:0 0 18px rgba(255,122,0,.10);
}

.ql-title{ display:block; font-weight:900; }
.ql-desc{ display:block; margin-top:3px; opacity:.7; font-size:.92rem; }

.highlights{
  margin-top:8px;
  padding-left:18px;
  display:grid;
  gap:6px;
  color:rgba(255,255,255,.84);
}

.divider{
  height:1px;
  background:rgba(255,255,255,.10);
  margin:12px 0;
}

/* ======================================================
   ROSTER – MÁS LIMPIO + NEÓN NARANJA
====================================================== */

.squad-section{ margin-bottom:24px; }

.player-profile-container{
  border-radius:18px;
  overflow:hidden;
}

.player-card{
  border:1px solid rgba(255,122,0,.22);
}

.player-card:hover{
  border-color:rgba(255,122,0,.45);
  box-shadow:0 0 28px rgba(255,122,0,.12);
}

.player-card.clickable{ cursor:pointer; }

.settings-panel{
  display:none;
  padding:14px 18px 16px;
  background:rgba(8,8,12,.92);
  border-top:1px solid rgba(255,122,0,.22);
}

.settings-panel h3{
  font-family:'Teko',sans-serif;
  letter-spacing:1px;
  font-size:1.5rem;
  color:var(--primary);
  margin:8px 0 4px;
}

.settings-panel p{
  color:rgba(255,255,255,.82);
  line-height:1.4;
}

/* Clases neón (naranjas por defecto) */
.orange-neon{
  border:1px solid rgba(255,122,0,.22);
  box-shadow: 0 0 18px rgba(255,122,0,.14);
}

.primary-neon{ /* alias, por si había cosas antiguas */
  border:1px solid rgba(255,122,0,.22);
  box-shadow: 0 0 18px rgba(255,122,0,.14);
}

.blue-neon{
  border:1px solid rgba(255,122,0,.22); /* forzamos look naranja */
  box-shadow: 0 0 18px rgba(255,122,0,.14);
}

.red-neon{
  border:1px solid rgba(255,122,0,.22); /* forzamos look naranja */
  box-shadow: 0 0 18px rgba(255,122,0,.14);
}

/* Responsive extras */
@media (max-width:1050px){
  .announce-content{ padding:10px 18px; }
  .home-extras{
    grid-template-columns:1fr;
    padding:10px 18px 55px;
  }
  .quick-links{ grid-template-columns:1fr; }
  .mini-stats{ grid-template-columns:1fr; }
}

@media (max-width:768px){
  .announce-bar{ top:122px; }
  .hero-actions{ flex-direction:column; }
}



/* --- HOME HERO: panel principal (sobre el club + twitch) --- */
.hero-grid{
  display:grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 18px;
  align-items: stretch;
  margin-top: 14px;
}
.hero-panel{
  background: linear-gradient(180deg, rgba(255,140,0,0.06), rgba(0,0,0,0.35));
  border: 1px solid rgba(255,140,0,0.28);
  box-shadow: 0 0 18px rgba(255,140,0,0.18);
  border-radius: 18px;
  padding: 18px;
  position: relative;
  overflow: hidden;
}
.hero-panel:before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(80% 55% at 20% 0%, rgba(255,140,0,0.18), transparent 60%);
  pointer-events:none;
}
.hero-kicker{
  display:inline-flex;
  gap:8px;
  align-items:center;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.78rem;
  opacity:.9;
  margin-bottom: 8px;
}
.hero-title{
  margin: 0 0 6px 0;
  font-size: clamp(1.8rem, 2.8vw, 2.4rem);
  letter-spacing: .04em;
}
.hero-lead{
  margin: 0 0 14px 0;
  opacity: .92;
  line-height: 1.45;
}
.hero-cta{
  margin-top: 10px;
}
.hero-subtitle{
  margin: 12px 0 6px 0;
  font-size: 1.15rem;
}
.hero-sublead{
  margin: 0 0 12px 0;
  opacity: .9;
}
.section-header.compact h2{
  font-size: 1.05rem;
}
.quick-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
}
.quick-btn{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,140,0,0.22);
  background: rgba(0,0,0,0.28);
  text-decoration:none;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.quick-btn:hover{
  transform: translateY(-2px);
  border-color: rgba(255,140,0,0.45);
  box-shadow: 0 0 14px rgba(255,140,0,0.22);
}
.q-title{
  font-weight: 800;
  letter-spacing: .04em;
}
.q-sub{
  opacity: .85;
  font-size: .92rem;
}

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



/* --- FIX: panel de ajustes (evita que un CSS viejo lo ponga display:none) --- */
.player-profile-container .settings-panel{
  display:block;
}
.player-profile-container .settings-panel.open{
  display:block;
}



/* --- HOME TOP LAYOUT: resultados a la derecha --- */
.home-top{
  display:grid;
  grid-template-columns: 1fr 420px;
  gap: 18px;
  align-items: start;
  margin-top: 14px;
}
.home-top-right{
  position: sticky;
  top: 86px; /* debajo del header */
}
.home-top-right .matches-container{
  margin-top: 0;
}
.home-top-right .matches-container #match-list{
  display:flex;
  flex-direction:column;
  gap: 10px;
}
.home-top-right .match-item{
  padding: 12px 14px;
  border-radius: 14px;
}
.home-top-right .match-item .match-team{
  font-size: .95rem;
}
.home-top-right .match-item .match-score{
  font-size: .92rem;
}

/* Para que el panel de resultados no sea gigante */
.matches-container{
  width: 100%;
}

/* Responsive */
@media (max-width: 1100px){
  .home-top{
    grid-template-columns: 1fr;
  }
  .home-top-right{
    position: static;
  }
}



/* --- HOME LAYOUT FIX: alinear secciones y lista resultados a la derecha --- */
.page{
  width:min(1180px, calc(100% - 32px));
  margin: 0 auto;
}

/* Reutilizamos el mismo ancho para todas las secciones del home */
.matches-container,
.hero-section,
.home-extras{
  width:100%;
  margin-left:0;
  margin-right:0;
}

/* Matches: columna izquierda info + lista a la derecha */
.matches-container{
  margin-top: 16px;
  padding: 18px;
}
.matches-grid{
  display:grid;
  grid-template-columns: 320px 1fr;
  gap: 18px;
  align-items:start;
}
.matches-sub{
  margin: 10px 0 12px 0;
  opacity:.85;
  line-height:1.35;
}
.matches-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* La lista se pega a la derecha y no queda "vacía" */
.matches-right{
  display:flex;
  justify-content:flex-end;
}
#match-list.match-list{
  width: min(560px, 100%);
  margin-left:auto;
}

/* Hero: que no tenga el grid viejo */
.hero-section{
  padding: 0;
  margin-top: 16px;
  display:block;
}

/* Responsive */
@media (max-width: 980px){
  .matches-grid{ grid-template-columns: 1fr; }
  .matches-right{ justify-content:stretch; }
  #match-list.match-list{ width:100%; }
}



/* --- ROSTER: nick en naranja neón con brillo --- */
.player-nick{
  color: var(--primary);
  text-shadow:
    0 0 6px rgba(255,122,0,.55),
    0 0 14px rgba(255,122,0,.35),
    0 0 26px rgba(255,122,0,.22);
}



/* --- ROSTER: hover neón en el nombre --- */
.player-profile-container:hover .player-nick,
.player-nick:hover{
  text-shadow:
    0 0 8px rgba(255,122,0,.70),
    0 0 18px rgba(255,122,0,.45),
    0 0 34px rgba(255,122,0,.28),
    0 0 52px rgba(255,122,0,.18);
  filter: saturate(1.12);
  transform: translateY(-1px);
}

.player-nick{
  transition: text-shadow .18s ease, transform .18s ease, filter .18s ease;
}