/* ——— CSS base moderno + deportivo ——— */
:root{
  color-scheme: dark;
  --bg:#0b0e13;
  --bg-2:#0f141c;
  --card:#121826;
  --text:#e6ebf2;
  --muted:#9aafc7;
  --accent:#00df82;
  --accent-2:#11a8fd;
  --line:#1b2535;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --header-bg:rgba(11,14,19,.7);
  --nav-link-hover-bg:rgba(255,255,255,.05);
}

[data-theme="dark"]{
  color-scheme: dark;
  --bg:#0b0e13;
  --bg-2:#0f141c;
  --card:#121826;
  --text:#e6ebf2;
  --muted:#9aafc7;
  --accent:#00df82;
  --accent-2:#11a8fd;
  --line:#1b2535;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --header-bg:rgba(11,14,19,.7);
  --nav-link-hover-bg:rgba(255,255,255,.05);
}

[data-theme="light"]{
  color-scheme: light;
  --bg:#f5f9ff;
  --bg-2:#ffffff;
  --card:#ffffff;
  --text:#202933;
  --muted:#5c6675;
  --accent:#00df82;
  --accent-2:#11a8fd;
  --line:#d0d8e6;
  --shadow: 0 10px 30px rgba(32,41,51,.12);
  --header-bg:rgba(255,255,255,.85);
  --nav-link-hover-bg:rgba(15,23,42,.08);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  line-height:1.6;
  color:var(--text);
  background: radial-gradient(1200px 600px at 80% -20%, rgba(17,168,253,.15), transparent),
              radial-gradient(1000px 500px at 10% -10%, rgba(0,223,130,.12), transparent),
              var(--bg);
}

/* helpers */
.container{max-width:1120px;margin:0 auto;padding:0 20px}
.section{padding:72px 0}
.section.section-compact{padding:16px 0 12px}
.section-alt{background:linear-gradient(180deg, var(--bg-2), var(--bg));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head h2{font-family:"Chakra Petch", system-ui, sans-serif; font-size: clamp(24px, 2.6vw, 36px); margin:0 0 6px}
.section-head p{color:var(--muted);margin:0 0 24px}
.muted{color:var(--muted)}
.small{font-size:12px}
.badge{display:inline-block;padding:4px 10px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:12px}

.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;border:1px solid var(--line);text-decoration:none;color:var(--text);box-shadow:var(--shadow);background:rgba(255,255,255,.02);backdrop-filter: blur(4px)}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(90deg, var(--accent), var(--accent-2));color:#08110d;border-color:transparent;font-weight:700}
.btn-small{padding:8px 12px;font-size:14px}
.btn-ghost{background:transparent}

.kpis{display:flex;gap:24px;flex-wrap:wrap;margin-top:24px;padding:0}
.kpis li{list-style:none;border:1px solid var(--line);border-radius:16px;padding:14px 16px;background:rgba(255,255,255,.02)}
.kpis strong{font-family:"Chakra Petch";font-size:24px}

/* A11y */
.skip{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip:focus{left:10px;top:10px;width:auto;height:auto;padding:8px 10px;background:#fff;color:#000;border-radius:8px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:var(--header-bg);backdrop-filter: blur(12px);border-bottom:1px solid var(--line)}
.site-header .nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800}
.brand img{height:28px;width:auto}
.wordmark{font-family:"Chakra Petch";letter-spacing:.3px}
.links{display:flex;gap:14px;align-items:center}
.links a{color:var(--text);text-decoration:none;padding:8px 10px;border-radius:10px}
.links a:hover{background:var(--nav-link-hover-bg)}
.menu-toggle{display:none;flex-direction:column;gap:4px;border:0;background:transparent}
.menu-toggle span{display:block;width:24px;height:2px;background:var(--text);border-radius:2px}

/* Hero */
.hero{position:relative;min-height:68vh;display:grid;place-items:center;border-bottom:1px solid var(--line);overflow:hidden}
.hero-inner{position:relative;padding:40px 0;text-align:center;z-index:3}
.hero h1{font-family:"Chakra Petch";font-weight:800;letter-spacing:.4px;margin:0 0 10px;
  font-size:clamp(28px, 6vw, 60px);line-height:1.08}
.accent{background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero p{color:var(--muted);margin:0 auto 24px;max-width:720px}
.hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

#netFX{position:absolute;inset:0;width:100%;height:100%;opacity:.35;z-index:2;pointer-events:none}

.hero-gallery-layer{
  position:absolute;
  inset:0;
  background-position:center;
  background-size:cover;
  opacity:0;
  transform:scale(1.08);
  transition:opacity 1.2s ease, transform 1.2s ease;
  z-index:1;
}
.hero-gallery-layer.is-active{opacity:1;transform:scale(1)}
.hero-gallery::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(11,14,19,.25) 0%, rgba(11,14,19,.86) 85%);
  z-index:2;
  pointer-events:none;
}
.hero-logos .hero-inner{padding:clamp(36px,8vw,72px) 0;display:flex;flex-direction:column;align-items:stretch;gap:32px;text-align:left;width:100%;max-width:min(1120px,100vw)}
.hero-carousel{display:grid;gap:28px;padding:32px 36px;border-radius:28px;background:rgba(8,13,20,.78);border:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow);backdrop-filter:blur(16px)}
.hero-carousel-intro{display:flex;flex-direction:column;gap:12px}
.hero-carousel .hero-cta{justify-content:flex-start}
.hero-carousel-body{display:grid;gap:24px}
.hero-carousel-track{position:relative;height:520px;overflow:hidden;touch-action:manipulation}
.hero-slide{position:absolute;top:0;left:0;right:0;height:520px;display:flex;flex-direction:column;gap:12px;justify-content:flex-start;opacity:0;transition:opacity 0.3s ease;pointer-events:none;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.3) transparent}
.hero-slide::-webkit-scrollbar{width:6px}
.hero-slide::-webkit-scrollbar-track{background:transparent}
.hero-slide::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.3);border-radius:3px}
.hero-slide::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.5)}
.hero-slide.is-active{opacity:1;pointer-events:auto}
.hero-slide-head{display:flex;flex-direction:column;gap:6px}
.hero-slide-head h2{margin:0;font-size:clamp(24px,4vw,34px)}
.hero-slide-meta{margin:0;color:var(--muted)}
.hero-score{display:flex;flex-direction:column;gap:12px}
.hero-score-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;border-radius:18px;background:rgba(4,8,12,.55);border:1px solid rgba(255,255,255,.06);backdrop-filter:blur(12px)}
.hero-score-row.is-winner{border-color:rgba(17,168,253,.55);background:rgba(17,168,253,.16)}
.hero-score-team{flex:1;display:flex;flex-direction:column;gap:4px;line-height:1.25}
.hero-score-name{font-weight:600;font-size:1.05rem}
.hero-score-label{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.6);font-weight:600}
.hero-score-row.is-winner .hero-score-label{color:var(--accent-2)}
.hero-score-sets{display:grid;grid-auto-flow:column;gap:12px;font-family:"Chakra Petch",sans-serif;font-size:1.1rem;min-width:max-content}
.hero-score-sets span{display:inline-flex;align-items:center;justify-content:center;min-width:28px}
.hero-slide-note{margin:0;color:var(--muted);font-size:.95rem}
.hero-ranking{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;flex:1}
@media (max-width: 640px) {
  .hero-ranking{grid-template-columns:1fr;gap:8px}
}
.hero-ranking-item{display:flex;align-items:center;gap:16px;padding:12px 16px;border-radius:18px;background:rgba(4,8,12,.55);border:1px solid rgba(255,255,255,.06);backdrop-filter:blur(12px)}
.hero-ranking-pos{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-family:"Chakra Petch",sans-serif;font-size:1rem;background:rgba(17,168,253,.18);border:1px solid rgba(17,168,253,.45)}
.hero-ranking-item:nth-child(1) .hero-ranking-pos{background:linear-gradient(135deg, #ffd700, #ffed4a);color:#8a5a00;border-color:#d4af00}
.hero-ranking-item:nth-child(2) .hero-ranking-pos{background:linear-gradient(135deg, #c0c0c0, #e5e5e5);color:#4a4a4a;border-color:#999999}
.hero-ranking-item:nth-child(3) .hero-ranking-pos{background:linear-gradient(135deg, #cd7f32, #daa03d);color:#5c3a17;border-color:#b8860b}
.hero-ranking-copy{display:flex;flex-direction:column;gap:4px}
.hero-ranking-name{font-weight:600}
.hero-ranking-extra{color:var(--muted);font-size:.82rem}
.hero-ranking-points{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 8px;
  border-radius:12px;
  background:linear-gradient(135deg, rgba(17,168,253,.15), rgba(17,168,253,.25));
  border:1px solid rgba(17,168,253,.3);
  color:var(--accent-2);
  font-size:.85rem;
  font-weight:600;
  font-family:"Chakra Petch",sans-serif;
  backdrop-filter:blur(8px);
  transition:all .2s ease;
}
.hero-ranking-points:hover{
  background:linear-gradient(135deg, rgba(17,168,253,.25), rgba(17,168,253,.35));
  transform:translateY(-1px);
}
.ranking-points{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 8px;
  border-radius:12px;
  background:linear-gradient(135deg, rgba(17,168,253,.15), rgba(17,168,253,.25));
  border:1px solid rgba(17,168,253,.3);
  color:var(--accent-2);
  font-size:.85rem;
  font-weight:600;
  font-family:"Chakra Petch",sans-serif;
  backdrop-filter:blur(8px);
  transition:all .2s ease;
}
.ranking-points:hover{
  background:linear-gradient(135deg, rgba(17,168,253,.25), rgba(17,168,253,.35));
  transform:translateY(-1px);
}
.hero-ranking-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;border:1px solid var(--line);box-shadow:var(--shadow)}
.hero-ranking-avatar--placeholder{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid var(--line);font-size:16px;font-weight:600;color:var(--text)}
.hero-empty{margin:0;color:var(--muted);font-size:.95rem}
.hero-carousel-controls{display:flex;align-items:center;justify-content:space-between;gap:18px}
.hero-carousel-btn{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(12,18,26,.6);color:var(--text);display:grid;place-items:center;font-size:24px;cursor:pointer;transition:transform .25s ease, background .25s ease, border .25s ease}
.hero-carousel-btn:hover{transform:translateY(-2px);background:rgba(17,168,253,.18);border-color:rgba(17,168,253,.55)}
.hero-carousel-btn:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px}
.hero-carousel-dots{display:flex;gap:10px}
.hero-carousel-dot{width:12px;height:12px;border-radius:999px;border:1px solid rgba(255,255,255,.45);background:transparent;cursor:pointer;transition:background .25s ease, transform .25s ease, border .25s ease}
.hero-carousel-dot.is-active,.hero-carousel-dot[aria-selected="true"]{background:var(--accent-2);border-color:var(--accent-2);transform:scale(1.1)}
.hero-carousel-dot:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:rgba(17,168,253,.16);border:1px solid rgba(17,168,253,.35);color:var(--accent-2);font-size:12px;letter-spacing:.18em;text-transform:uppercase;font-weight:600}
.hero-logos .hero-lede{max-width:700px;margin:0 auto;color:var(--muted)}
.clubs-logos{
  margin:0;
  padding:34px;
  list-style:none;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:26px;
  width:100%;
  max-width:980px;
  background:rgba(8,13,20,.78);
  border:1px solid rgba(255,255,255,.08);
  border-radius:28px;
  box-shadow:var(--shadow);
  backdrop-filter:blur(16px);
}
.clubs-logo{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:14px;
  border-radius:18px;
  transition:transform .25s ease, background .25s ease;
}
.clubs-logo img{max-width:100%;max-height:70px;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(0,0,0,.45))}
.clubs-logo:hover{transform:translateY(-4px);background:rgba(17,168,253,.08)}

@media (max-width: 920px){
  .hero-carousel{padding:28px 30px}
  .hero-carousel .hero-cta{flex-wrap:wrap}
  .hero-carousel-track{height:500px}
  .hero-slide{height:500px}
}
@media (max-width: 640px){
  .hero-logos .hero-inner{gap:28px}
  .hero-carousel{padding:24px 22px;text-align:center}
  .hero-carousel-intro{align-items:center;text-align:center}
  .hero-carousel .hero-cta{justify-content:center}
  .hero-carousel-track{height:480px}
  .hero-slide{align-items:center;text-align:center;height:480px}
  .hero-score-row{flex-direction:column;align-items:center;text-align:center}
  .hero-score-team{width:100%}
  .hero-score-sets{gap:8px}
  .hero-slide-note{max-width:480px}
  .hero-carousel-controls{justify-content:center}
  .hero-carousel-btn{display:none}
}
@media (max-width: 520px){
  .clubs-logos{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:18px;padding:28px}
  .clubs-logo{padding:10px}
  .clubs-logo img{max-height:60px}
}

/* Destacados con foto */
.highlight-grid{
  display:grid;
  gap:24px;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.highlight-card{
  position:relative;
  border-radius:26px;
  overflow:hidden;
  min-height:320px;
  border:1px solid rgba(255,255,255,.08);
  background:var(--card);
  box-shadow:var(--shadow);
  isolation:isolate;
  transition:transform .35s ease, box-shadow .35s ease;
}
.highlight-card::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--feature-image);
  background-size:cover;
  background-position:center;
  transform:scale(1.08);
  transition:transform .6s ease;
  z-index:-1;
  filter:saturate(1.1);
}
.highlight-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(8,13,20,.15) 0%, rgba(8,13,20,.88) 85%);
  z-index:0;
}
.highlight-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(0,0,0,.45)}
.highlight-card:hover::before{transform:scale(1.12)}
.highlight-body{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:32px;
  height:100%;
}
.highlight-body h3{margin:0;font-family:"Chakra Petch", system-ui, sans-serif;font-size:clamp(22px,2.6vw,28px)}
.highlight-body p{margin:0;color:var(--muted)}
.highlight-body .btn{align-self:flex-start}

@media (max-width:720px){
  .highlight-body{padding:26px}
}

/* Slider de galería */
.media-slider{position:relative;margin-top:32px}
.media-viewport{
  overflow:hidden;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(8,13,20,.45);
}
.media-track{
  display:flex;
  gap:18px;
  padding:18px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-padding:18px;
  scrollbar-width:none;
}
.media-track::-webkit-scrollbar{display:none}
.media-slide{
  flex:0 0 clamp(240px, 26vw, 320px);
  border-radius:22px;
  overflow:hidden;
  background:rgba(11,14,19,.86);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:var(--shadow);
  scroll-snap-align:start;
  display:flex;
  flex-direction:column;
}
.media-slide img{width:100%;height:clamp(180px,22vw,240px);object-fit:cover}
.media-slide figcaption{margin:0;padding:16px 18px 20px;font-size:.95rem;color:var(--muted)}
.slider-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px;
  height:44px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(11,14,19,.82);
  color:var(--text);
  display:grid;
  place-items:center;
  cursor:pointer;
  box-shadow:var(--shadow);
  transition:transform .25s ease, background .25s ease, opacity .25s ease;
  z-index:3;
}
.slider-btn[data-dir="prev"]{left:6px}
.slider-btn[data-dir="next"]{right:6px}
.slider-btn:hover{transform:translateY(-50%) scale(1.05);background:rgba(17,168,253,.22)}
.slider-btn:disabled{opacity:.35;cursor:not-allowed;transform:translateY(-50%)}

@media (max-width:720px){
  .slider-btn{display:none}
  .media-track{padding:18px 12px}
}

/* CTA con imagen */
.cta-card{
  position:relative;
  border-radius:28px;
  padding:42px 48px;
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden;
  background:rgba(8,13,20,.85);
  box-shadow:var(--shadow);
}
.cta-card::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--cta-image);
  background-size:cover;
  background-position:center;
  opacity:.45;
  filter:saturate(1.15);
}
.cta-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(8,13,20,.92), rgba(8,13,20,.6));
}
.cta-card > *{position:relative;z-index:1}
.cta-card p{margin:0;color:var(--muted)}
.cta-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px}

@media (max-width:640px){
  .cta-card{padding:32px}
}

/* —— Página de reglamento —— */
.page-hero{
  position:relative;
  padding:clamp(90px, 20vw, 140px) 0;
  border-bottom:1px solid var(--line);
  overflow:hidden;
}
.page-hero > *{position:relative;z-index:1;}
.page-hero .narrow{max-width:760px;margin:0 auto;text-align:center}
.page-hero h1{
  font-family:"Chakra Petch", system-ui, sans-serif;
  font-weight:800;
  letter-spacing:.3px;
  font-size:clamp(32px, 6vw, 58px);
  margin:12px 0 14px;
}
.page-hero p{color:var(--muted);margin:0 auto 26px;max-width:640px;font-size:1.05rem}
.page-hero .badge{letter-spacing:.22em;text-transform:uppercase;font-size:12px;display:inline-flex;align-items:center;gap:6px;margin-bottom:12px}
.badge-soft{background:rgba(17,168,253,.16);border:1px solid rgba(17,168,253,.35);color:var(--accent-2);box-shadow:none}
.hero-meta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.meta-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  color:var(--muted);
  font-size:14px;
  letter-spacing:.02em;
  box-shadow:var(--shadow);
}
.reglamento-hero{
  background:
    radial-gradient(780px 480px at 80% 12%, rgba(17,168,253,.22), transparent),
    radial-gradient(520px 360px at 18% 0%, rgba(0,223,130,.18), transparent),
    var(--bg);
}
.reglamento-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(11,14,19,0) 0%, rgba(11,14,19,.75) 90%);
  pointer-events:none;
}

.reglamento-overview{padding-top:48px}
.reglamento-layout{
  display:grid;
  grid-template-columns:minmax(0,320px) minmax(0,1fr);
  gap:32px;
  align-items:start;
}
.reglamento-side{display:flex;flex-direction:column;gap:24px;position:sticky;top:96px}
.summary-card,.reglamento-nav{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:22px;
  padding:22px 24px;
  box-shadow:var(--shadow);
  backdrop-filter:blur(12px);
}
.summary-card h3,.summary-card h4,.reglamento-nav h4{margin:0 0 10px;font-family:"Chakra Petch";letter-spacing:.2px}
.summary-card p{margin:0;color:var(--muted)}
.summary-card.highlight{
  background:linear-gradient(135deg, rgba(17,168,253,.2), rgba(0,223,130,.2));
  border-color:transparent;
}
.summary-card.highlight p{color:var(--text)}
.summary-list{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.summary-list li{color:var(--muted);line-height:1.6}
.summary-list li strong{color:var(--text)}

.reglamento-nav h4{margin-bottom:14px}
.reglamento-nav ol{margin:0;padding:0;list-style:none;display:grid;gap:6px;counter-reset:reglamento}
.reglamento-nav li{counter-increment:reglamento}
.reglamento-nav a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 12px;
  border-radius:12px;
  text-decoration:none;
  color:var(--muted);
  border:1px solid transparent;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.reglamento-nav a::before{
  content:counter(reglamento, decimal-leading-zero);
  font-family:"Chakra Petch";
  font-size:12px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent);
  background:rgba(17,168,253,.12);
  border-radius:999px;
  padding:4px 8px;
}
.reglamento-nav a:hover,.reglamento-nav a:focus-visible{background:rgba(255,255,255,.06);color:var(--text);border-color:rgba(255,255,255,.14)}

.reglamento-content{
  background:rgba(15,20,28,.9);
  border:1px solid rgba(255,255,255,.05);
  border-radius:28px;
  padding:42px 44px;
  box-shadow:var(--shadow);
  backdrop-filter:blur(14px);
}
.regla{padding:10px 0 28px;border-bottom:1px solid rgba(255,255,255,.05);scroll-margin-top:120px}
.regla:last-child{border-bottom:none;padding-bottom:0}
.regla-head{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.regla-num{
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:14px;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  color:#021310;
  font-family:"Chakra Petch";
  font-weight:700;
  font-size:1.1rem;
  box-shadow:0 10px 30px rgba(0,0,0,.45);
}
.regla-head h2{margin:0;font-size:clamp(20px, 2.6vw, 30px)}
.regla-body{font-size:1rem;line-height:1.8;color:var(--text)}
.regla-body p{margin:0 0 16px}
.regla-body > *:last-child{margin-bottom:0}
.regla-body h3{font-family:"Chakra Petch";font-size:clamp(18px, 2.2vw, 24px);margin:26px 0 12px;color:var(--accent);letter-spacing:.3px}

.rule-list{margin:18px 0;padding:0;list-style:none;display:grid;gap:12px}
.rule-list li{position:relative;padding-left:26px;color:var(--muted)}
.rule-list > li::before{
  content:"";
  position:absolute;
  left:0;
  top:0.75em;
  width:10px;
  height:10px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  box-shadow:0 6px 18px rgba(0,0,0,.35);
}
.rule-list ul{margin:10px 0 0;padding-left:20px;display:grid;gap:8px}
.rule-list ul li{padding-left:18px;color:var(--muted)}
.rule-list ul li::before{
  content:"";
  position:absolute;
  left:0;
  top:.8em;
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--accent-2);
  opacity:.8;
}
.rule-list--compact{gap:8px}
.rule-list--compact > li{padding-left:22px}
.rule-list--compact > li::before{width:8px;height:8px}

.tag-list{margin:18px 0 20px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.tag-list li{
  padding:8px 14px;
  border-radius:999px;
  background:rgba(17,168,253,.16);
  border:1px solid rgba(17,168,253,.35);
  color:var(--accent-2);
  font-weight:600;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:12px;
}

.points-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin:18px 0 24px}
.points-card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px 16px;
  text-align:center;
  box-shadow:var(--shadow);
}
.points-title{font-size:12px;text-transform:uppercase;letter-spacing:.22em;color:var(--muted)}
.points-card strong{display:block;font-family:"Chakra Petch";font-size:32px;margin:6px 0;color:var(--accent)}
.points-note{font-size:12px;color:var(--muted)}

.callout{
  --callout-accent:var(--accent);
  position:relative;
  margin:20px 0;
  padding:16px 18px 16px 26px;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  color:var(--text);
  line-height:1.7;
}
.callout::before{
  content:"";
  position:absolute;
  left:14px;
  top:14px;
  bottom:14px;
  width:4px;
  border-radius:999px;
  background:var(--callout-accent);
}
.callout strong{color:var(--text)}
.callout.success{--callout-accent:var(--accent);background:rgba(0,223,130,.12);border-color:rgba(0,223,130,.35)}
.callout.warning{--callout-accent:#f59e0b;background:rgba(245,158,11,.15);border-color:rgba(245,158,11,.32)}
.callout.info{--callout-accent:#38bdf8;background:rgba(56,189,248,.14);border-color:rgba(56,189,248,.32)}
.callout.note{--callout-accent:#94a3b8;background:rgba(148,163,184,.22);border-color:rgba(148,163,184,.38);color:#e2e8f0}
.callout em{color:inherit}
.callout p{margin:0}

.example-card{
  margin-top:12px;
  padding:14px 16px;
  border-radius:12px;
  background:rgba(17,168,253,.18);
  border:1px solid rgba(17,168,253,.32);
  color:#e7f5ff;
}
.example-card strong{display:block;margin-bottom:8px;font-family:"Chakra Petch";letter-spacing:.2px;color:#fff}
.example-list{margin:0 0 8px;padding-left:18px;display:grid;gap:4px;color:#d9ecff}
.example-list li::marker{color:var(--accent-2)}
.example-card p{margin:0;color:#f0f7ff}

@media (max-width: 1080px){
  .reglamento-layout{grid-template-columns:minmax(0,280px) minmax(0,1fr)}
  .reglamento-side{top:88px}
}
@media (max-width: 900px){
  .reglamento-layout{grid-template-columns:1fr;gap:28px}
  .reglamento-side{position:static}
}
@media (max-width: 720px){
  .page-hero{padding:80px 0 88px}
  .reglamento-content{padding:34px 28px}
  .regla-head{align-items:flex-start}
  .regla-num{width:34px;height:34px;font-size:.95rem}
}
@media (max-width: 520px){
  .reglamento-content{padding:28px 22px}
  .summary-card,.reglamento-nav{padding:18px 20px}
}

/* Cards */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.cards-grid.insc-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:22px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px}
.card-head{display:flex;align-items:center;justify-content:space-between}
.card-actions{display:flex;gap:8px;margin-top:auto;padding-top:10px;flex-wrap:wrap}
.card-actions .btn{flex:1;justify-content:center}

.insc-card{gap:16px}
.insc-card p{margin:0}
.insc-card .insc-form{display:grid;gap:12px}
.insc-card .field{display:flex;flex-direction:column;gap:6px}
.insc-card .insc-form label{font-size:13px;font-weight:600;color:var(--muted)}
.insc-card .insc-form input,
.insc-card .insc-form select,
.insc-card .insc-filters input{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);font:inherit;transition:border-color .15s ease,box-shadow .15s ease}
.insc-card .insc-form select{appearance:none;background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"%3E%3Cpath fill="%23e6ebf2" d="M1.41 0L6 4.58 10.59 0 12 1.41 6 7.41 0 1.41z"/%3E%3C/svg%3E');background-repeat:no-repeat;background-position:right 12px center;background-size:12px 8px;padding-right:34px}
.insc-card .insc-form input:focus,
.insc-card .insc-form select:focus,
.insc-card .insc-filters input:focus{outline:none;border-color:rgba(17,168,253,.6);box-shadow:0 0 0 2px rgba(17,168,253,.25)}
.insc-card .insc-form input::placeholder,
.insc-card .insc-filters input::placeholder{color:rgba(230,235,242,.55)}
.insc-card .form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.insc-card .insc-toggle{margin-top:10px;align-self:flex-start}
.insc-card .insc-toggle.btn{box-shadow:none}
.insc-card [data-inscripcion-spinner]{margin-top:0}
.insc-card [data-inscripcion-msg]{margin:0;color:var(--muted)}
.insc-card [data-inscripcion-msg][hidden]{display:none!important}
.insc-card [data-inscripcion-msg][data-state="success"]{color:var(--accent)}
.insc-card [data-inscripcion-msg][data-state="error"]{color:#ff8b8b}
.insc-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-top:4px}
.insc-panel{display:grid;gap:12px;margin-top:12px}
.insc-panel[hidden]{display:none}
.insc-panel .insc-filters{margin-top:0}
.insc-table{margin-top:16px}
.insc-panel .insc-table{margin-top:0}
.insc-table .muted{margin:12px}

/* Results */
.results{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:10px 0 22px}
.result{display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px}

/* Table */
.table-scroll{overflow:auto;border:1px solid var(--line);border-radius:16px;background:var(--card)}
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th,.table td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left}
.table thead th{position:sticky;top:0;background:linear-gradient(180deg, #0d1421, #0b0e13)}

/* Calendario */
.calendario-hero{
  background:
    radial-gradient(780px 480px at 80% 10%, rgba(17,168,253,.22), transparent),
    radial-gradient(520px 360px at 20% 0%, rgba(0,223,130,.18), transparent),
    var(--bg);
  text-align:center;
}
.calendario-hero .narrow{display:flex;flex-direction:column;align-items:center;gap:16px}
.calendario-hero .badge{margin-bottom:0}
.calendario-hero h1{margin-bottom:6px}
.calendario-hero p{margin:0;max-width:640px;color:var(--muted)}
.calendar-meta{justify-content:center}
.calendar-layout{display:grid;gap:28px}
.calendar-toolbar{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap}
.calendar-copy h2{margin:0 0 8px;font-family:"Chakra Petch",system-ui,sans-serif}
.calendar-copy p{margin:0 0 12px;color:var(--muted);max-width:620px}
.calendar-next{margin:12px 0 0;font-weight:600;color:var(--text)}
.calendar-next span{color:var(--muted);font-weight:400}
.calendar-legend{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.calendar-card{background:rgba(8,13,20,.78);border:1px solid rgba(255,255,255,.08);border-radius:26px;padding:26px;box-shadow:var(--shadow);backdrop-filter:blur(14px);display:grid;gap:18px}
.calendar-card .table-scroll{border-color:rgba(255,255,255,.08);background:rgba(8,13,20,.55)}
.calendar-table{font-size:15px}
.calendar-table thead th{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:linear-gradient(180deg, rgba(13,20,33,.92), rgba(11,14,19,.92))}
.calendar-table tbody tr{transition:background .2s ease,transform .2s ease;border-left:3px solid transparent}
.calendar-table tbody tr:hover{background:rgba(255,255,255,.04);transform:translateX(4px)}
.calendar-table tbody tr.is-upcoming{background:rgba(0,223,130,.12);border-left-color:rgba(0,223,130,.7)}
.calendar-table tbody tr.is-soon{background:rgba(17,168,253,.14);border-left-color:rgba(17,168,253,.7)}
.calendar-table tbody tr.is-past{opacity:.78}
.calendar-table tbody tr.is-past:hover{opacity:1}
.calendar-table td{vertical-align:top}
.calendar-cell{display:flex;flex-direction:column;gap:6px}
.calendar-table td:first-child{font-family:"Chakra Petch",system-ui,sans-serif;font-weight:700;letter-spacing:.3px}
.calendar-date{display:block;font-weight:600}
.calendar-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:11px;text-transform:uppercase;letter-spacing:.14em;margin-top:8px;border:1px solid transparent}
.calendar-pill--upcoming{background:rgba(0,223,130,.22);border-color:rgba(0,223,130,.55);color:var(--text)}
.calendar-pill--soon{background:rgba(17,168,253,.22);border-color:rgba(17,168,253,.55);color:var(--text)}
.calendar-pill--past{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.08);color:var(--muted)}
.calendar-legend .calendar-pill{margin-top:0}
.calendar-note{margin:0;color:var(--muted)}

@media (max-width: 860px){
  .calendar-toolbar{flex-direction:column;align-items:flex-start}
  .calendar-legend{justify-content:flex-start}
}

@media (max-width: 680px){
  .calendar-card{padding:22px}
  .calendar-card .table-scroll{overflow:visible}
  .calendar-table thead{display:none}
  .calendar-table tbody{display:grid;gap:12px}
  .calendar-table tr{display:grid;gap:10px;padding:16px;border:1px solid rgba(255,255,255,.08);border-radius:18px;transform:none!important}
  .calendar-table tbody tr:hover{transform:none}
  .calendar-table td{padding:0;border:0;display:flex;flex-direction:column;gap:8px}
  .calendar-table td::before{content:attr(data-label);font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:4px}
  .calendar-table td:first-child::before{color:var(--text)}
  .calendar-cell{width:100%}
  .calendar-date{font-size:1rem}
}

/* Sponsors */
.sponsor-strip{display:flex;gap:24px;align-items:center;justify-content:center;flex-wrap:wrap;opacity:.9}
.sponsor-strip img{max-height:60px;filter:drop-shadow(0 8px 20px rgba(0,0,0,.4))}

/* Chat asistente */
.schedule-chat{display:grid;gap:18px;max-width:720px;margin:0 auto}
.chat-window{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:22px 24px;display:flex;flex-direction:column;gap:14px;max-height:360px;overflow-y:auto;scrollbar-width:thin}
.chat-window::-webkit-scrollbar{width:8px}
.chat-window::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:999px}
.chat-bubble{display:flex}
.chat-bubble p{margin:0;padding:12px 16px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.05);max-width:86%;font-size:15px;line-height:1.5}
.chat-bubble.is-user{justify-content:flex-end}
.chat-bubble.is-user p{background:linear-gradient(90deg,var(--accent),var(--accent-2));color:#04130b;border-color:transparent;font-weight:600}
.chat-bubble strong{font-weight:700}
.chat-form{display:flex;flex-direction:column;gap:10px}
.chat-input{display:flex;gap:10px;align-items:center}
.chat-input input{flex:1;padding:12px 16px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);font:inherit}
.chat-input input::placeholder{color:rgba(230,235,242,.6)}
.chat-input input:focus{outline:none;border-color:rgba(17,168,253,.6);box-shadow:0 0 0 2px rgba(17,168,253,.25)}
.chat-form .btn{box-shadow:none}

@media (max-width: 640px){
  .schedule-chat{max-width:none}
  .chat-window{padding:18px 20px}
  .chat-bubble p{max-width:92%}
  .chat-input{flex-direction:column;align-items:stretch}
  .chat-input input{width:100%}
  .chat-form .btn{width:100%;justify-content:center}
}

/* Footer */
.site-footer{border-top:1px solid var(--line);padding:36px 0;background:var(--bg-2)}
.footer-grid{
  display:flex;
  flex-direction:column;
  gap:16px;
  align-items:center;
  text-align:center;
}
.brandline{font-family:"Chakra Petch"}

/* Responsive */
@media (max-width: 900px){
  .cards-grid{grid-template-columns:1fr 1fr}
  .results:not(.cards){grid-template-columns:1fr 1fr}
  .results.cards{grid-template-columns:repeat(2,1fr) !important}
}
@media (max-width: 640px){
  .links{display:none;position:absolute;right:20px;top:64px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;width:calc(100% - 40px);box-shadow:var(--shadow);z-index:999}
  .links.open{display:flex;flex-direction:column;gap:6px}
  .links a{padding:12px 14px;border-radius:8px;color:var(--text);text-decoration:none}
  .links a:hover{background:var(--nav-link-hover-bg)}
  .links a[aria-current="page"]{background:rgba(0,223,130,.1);color:var(--accent)}
  .menu-toggle{display:flex;cursor:pointer;padding:8px}
  .menu-toggle:hover{background:var(--nav-link-hover-bg);border-radius:8px}
  .cards-grid{grid-template-columns:1fr}
  .results:not(.cards){grid-template-columns:1fr}
  .results.cards{grid-template-columns:1fr !important}
  .results.cards .result{min-height:auto;padding:14px}
}

/* —— Microinteracciones ————————————————— */
.sponsor-strip img{transition: transform .2s ease, opacity .2s ease}
.sponsor-strip img:hover{transform: translateY(-3px) scale(1.03); opacity:1}

/* —— Paleta tematizable ————————————————— */
/* Para ajustar marca, cambiá --accent y --accent-2 de :root */


/* —— Avatares de jugadores —— */
.avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;border:1px solid var(--line);box-shadow:var(--shadow)}
.avatar-cell{display:flex;align-items:center;gap:10px}


/* —— Página Jugadores —— */
.players-head{
  position:relative;
  padding:26px;
  margin-bottom:28px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(140deg, rgba(17,168,253,.18), rgba(0,223,130,.12));
  box-shadow:var(--shadow);
  overflow:hidden;
}
.players-head::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(600px 420px at 85% -15%, rgba(255,255,255,.12), transparent);
  opacity:.55;
  pointer-events:none;
}
.players-head > *{position:relative;z-index:1;}
.players-head .badge{box-shadow:none;}
.players-stats{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin-top:18px;
}
.players-stat{
  min-width:160px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(8,13,20,.55);
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.players-stat strong{
  font-family:"Chakra Petch",system-ui,sans-serif;
  font-size:28px;
  letter-spacing:.01em;
}
.players-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:18px;
  margin-bottom:18px;
}
.players-filters{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
}
.players-filters .field{
  min-width:220px;
}
.players-filters .field input,
.players-filters .field select{
  width:100%;
}
.field-label{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
}
.players-count{
  display:flex;
  align-items:center;
  gap:6px;
  padding:12px 16px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.05);
  box-shadow:var(--shadow);
}
.players-count strong{
  font-family:"Chakra Petch",system-ui,sans-serif;
  font-size:20px;
  color:var(--text);
}
.players-table{font-size:15px;}
.players-table thead th{
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
}
.players-table tbody tr{
  transition:background .2s ease,transform .2s ease,border-left-color .2s ease;
  border-left:3px solid transparent;
}
.players-table tbody tr:hover{
  background:rgba(17,168,253,.08);
  border-left-color:rgba(17,168,253,.6);
  transform:translateX(4px);
}
.players-table td{vertical-align:middle;}
.players-table .avatar-cell{display:flex;align-items:center;gap:12px;font-weight:600;}
.players-table .avatar{
  width:40px;
  height:40px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 8px 18px rgba(0,0,0,.35);
}
.avatar.avatar--placeholder{
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(140deg, rgba(17,168,253,.22), rgba(0,223,130,.22));
  color:var(--text);
  font-weight:700;
  text-transform:uppercase;
}
.cat-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  font-size:13px;
  font-weight:500;
  letter-spacing:.02em;
}
.players-table tr.empty td{
  padding:32px;
  text-align:center;
  color:var(--muted);
  font-style:italic;
}
@media (max-width: 720px){
  .players-head{padding:22px;margin-bottom:24px;}
  .players-toolbar{align-items:stretch;}
  .players-count{width:100%;justify-content:center;}
  .players-filters .field{min-width:0;flex:1 1 200px;}
}


/* —— Drawer de detalle jugador —— */
.detail-drawer{position:fixed;right:0;top:0;height:100%;width:min(520px, 100%);background:var(--card);
  border-left:1px solid var(--line);box-shadow:var(--shadow);transform:translateX(100%);transition:transform .25s ease;
  z-index:9999;padding:18px 18px 24px;overflow:auto}
.detail-drawer.open{transform:none}
.detail-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.detail-title{display:flex;align-items:center;gap:12px}
.detail-title img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:1px solid var(--line)}
.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin:6px 0 12px}
.detail-grid .card{padding:12px}
.detail-table{width:100%;border-collapse:collapse;font-size:14px}
.detail-table th,.detail-table td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left}
.close-btn{border:1px solid var(--line);background:transparent;color:var(--text);border-radius:10px;padding:6px 10px;cursor:pointer}
.close-btn:hover{background:rgba(255,255,255,.05)}


/* —— Mejoras visuales en tabla ranking —— */
.table.ranking tbody tr{cursor:pointer;transition:background .2s}
.table.ranking tbody tr:hover{}
.table.ranking th.sortable{cursor:pointer;position:relative}
.table.ranking th.sortable::after{content:"⇅";font-size:0.7em;position:absolute;right:6px;opacity:0.5}
.table.ranking th.sortable.active::after{content:attr(data-dir)=="asc"?"↑":"↓";opacity:1}


/* —— Filas clickeables + hover —— */
.table tr[data-i]{cursor:pointer; position:relative; overflow:hidden}
.table tr[data-i]:hover{background:rgba(255,255,255,.03)}

/* —— Ripple suave al click —— */
.table tr[data-i].ripple::after{
  content:""; position:absolute; left:var(--rx,50%); top:var(--ry,50%);
  width:6px; height:6px; border-radius:50%;
  transform:translate(-50%,-50%); opacity:.25; background:var(--accent);
  animation:ripple .45s ease-out forwards;
}
@keyframes ripple{
  0%{opacity:.25; transform:translate(-50%,-50%) scale(1)}
  100%{opacity:0; transform:translate(-50%,-50%) scale(40)}
}

/* —— Encabezados ordenables —— */
.table th.sortable{user-select:none; cursor:pointer; position:relative; padding-right:22px}
.table th.sortable::after{
  content:""; position:absolute; right:8px; top:50%; width:0; height:0; transform:translateY(-50%);
  border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid var(--muted);
  opacity:.6;
}
.table th.sortable[aria-sort="ascending"]::after{
  border-top:6px solid var(--accent);
}
.table th.sortable[aria-sort="descending"]::after{
  border-top:none; border-bottom:6px solid var(--accent);
}


/* —— Resultados avanzados —— */
.table-wrap{overflow:auto}
.tabla-res{width:100%; border-collapse: collapse;}
.tabla-res th, .tabla-res td{padding:.6rem .7rem; border-bottom:1px solid var(--line,#e5e7eb); vertical-align: middle;}
.tabla-res thead th{font-weight:600; text-align:left}
.col-parejas .vs{font-size:.8rem; opacity:.6; margin:.2rem 0}
.set-chip{display:inline-block; padding:.2rem .45rem; border-radius:.4rem; background:var(--chip,#f3f4f6); font-variant-numeric: tabular-nums; margin-right:.25rem}
.tb-wrap{display:inline-flex; gap:.25rem; margin-left:.35rem}
.tb-badge{display:inline-block; font-size:.75rem; padding:.1rem .35rem; border-radius:.35rem; border:1px dashed var(--line,#e5e7eb); opacity:.8}

.filters{gap:.75rem; margin-bottom:1rem}
.filters label{display:flex; flex-direction:column; gap:.35rem; min-width:0}
.filters select,
.filters input[type="search"],
.filters input[type="text"]{
  padding:.55rem .75rem;
  border-radius:.6rem;
  border:1px solid var(--line,#e5e7eb);
  background:rgba(255,255,255,.06) !important;
  color:var(--text) !important;
  font:inherit;
  width:100%;
}

/* Forzar estilos para select en todos los navegadores */
.filters select,
select{
  background-color:rgba(255,255,255,.06) !important;
  color:var(--text,#e6ebf2) !important;
  border:1px solid var(--line,rgba(255,255,255,.1)) !important;
  background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"%3E%3Cpath fill="%23e6ebf2" d="M1.41 0L6 4.58 10.59 0 12 1.41 6 7.41 0 1.41z"/%3E%3C/svg%3E') !important;
  background-repeat:no-repeat !important;
  background-position:right 12px center !important;
  background-size:12px 8px !important;
  padding-right:34px !important;
}

/* Estilos para options */
.filters select option,
select option{
  background-color:var(--bg,#0a0f1a) !important;
  color:var(--text,#e6ebf2) !important;
}

/* Webkit específico (Chrome, Safari, Edge) */
.filters select::-webkit-appearance,
select::-webkit-appearance{
  -webkit-appearance:none !important;
  background-color:rgba(255,255,255,.06) !important;
}

/* Firefox específico */
.filters select,
select{
  -moz-appearance:none !important;
}

/* Internet Explorer / Edge legacy */
.filters select::-ms-expand,
select::-ms-expand{
  display:none;
}
.filters select:focus,
.filters input[type="search"]:focus,
.filters input[type="text"]:focus{
  outline:none;
  border-color:rgba(17,168,253,.6);
  box-shadow:0 0 0 2px rgba(17,168,253,.25);
}
.filters.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:.75rem;
  align-items:end;
  max-width:100%;
  overflow:hidden;
}
.filters.bracket-filters{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  gap:1rem;
  margin:1rem 0 1.5rem;
}
.filters.bracket-filters label{min-width:200px}
.filters .grow{grid-column: span 2 / span 2}
.filters .actions{display:flex; justify-content:flex-end}
.filters .btn{padding:.55rem .9rem; border-radius:.6rem; border:1px solid var(--line,#e5e7eb); background:var(--chip,#f3f4f6)}
@media (max-width: 768px){
  .filters.grid{grid-template-columns:1fr 1fr;gap:0.5rem}
}
@media (max-width: 520px){
  .container{max-width:100%;padding:0 16px;overflow-x:hidden}
  .section{padding:40px 0}
  .filters.grid{grid-template-columns:1fr;gap:1rem}
  .filters .grow{grid-column:auto}
  .filters .actions{justify-content:stretch}
  .filters .actions .btn{width:100%}
  .filters.bracket-filters{flex-direction:column;gap:1rem}
  .filters.bracket-filters label{min-width:auto;width:100%}
  .filters select,
  .filters input{max-width:100%;min-width:0}
  .block{padding:1rem 1rem;max-width:100%;box-sizing:border-box}
  .table-scroll{overflow-x:auto;max-width:100%}
  .table{min-width:100%;width:auto}
  .subhead{text-align:left}
  .subhead h3{font-size:1.25rem}

  /* Espaciado uniforme entre todos los bloques en móvil */
  .block{margin-bottom:0.75rem}
  .view-filters + .block{margin-top:0.75rem}
  #main .block:first-of-type{margin-top:0.25rem}

  /* Secciones sin header con mismo espaciado */
  .block[data-view-section]{padding-top:0.25rem;margin-top:0.75rem}
  .block[data-view-section] .filters{margin-top:0}

  /* Selectores más compactos en móvil */
  .filters{gap:0.5rem;margin-bottom:0.5rem}
  .filters.grid{gap:0.5rem}
  .filters.view-filters{margin-bottom:0}
  .filters label{gap:0.25rem}

  /* Homologar espacios entre selectores que estaban en grid vs bloques separados */
  .filters.grid label{margin-bottom:0.25rem}
  .filters.grid label:last-child{margin-bottom:0}

  /* Asegurar que todos los selectores tengan el mismo espacio vertical */
  .subhead{margin-bottom:0.5rem}
  .subhead h3{margin-bottom:0.25rem}
}
.col-fecha .dia{font-size:.75rem; opacity:.6}
.col-cat .etapa{font-size:.75rem; opacity:.7}
.col-yt a{text-decoration:none}


/* —— Resultados por FECHA —— */
.tabs.chips{display:flex; flex-wrap:wrap; gap:.5rem; margin:.5rem 0 1rem}
.tabs .chip{padding:.4rem .7rem; border:1px solid var(--line); background:var(--card); color:var(--text); border-radius:999px; cursor:pointer; transition:all 0.2s ease}
.tabs .chip:hover{background:var(--accent-2); color:#fff; border-color:var(--accent-2)}
.tabs .chip.active{background:var(--accent); color:#fff; border-color:var(--accent)}

/* Reducir espacio entre selector de vista y secciones de contenido */
.view-filters + .block{margin-top:1rem}
.block{margin-bottom:1.5rem}
.block:last-child{margin-bottom:0}

/* Estilo específico para página de resultados */
#main .section-head{text-align:center}
#main .section-head h2{margin-bottom:12px}
#main .block:first-of-type{margin-top:1rem}

/* Reducir padding para secciones sin header */
.block[data-view-section]{padding-top:0.5rem}
.block[data-view-section] .filters{margin-top:0}

/* Widget de torneos en juego */
.torneos-widget{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  padding:10px 14px;
  margin-bottom:4px;
  box-shadow:var(--shadow);
}

.widget-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:8px;
}

.widget-header h3{
  margin:0;
  font-size:1.2rem;
  color:var(--text);
}

.widget-toggle{
  background:rgba(17,168,253,.16);
  border:1px solid rgba(17,168,253,.35);
  border-radius:8px;
  padding:6px;
  cursor:pointer;
  transition:all 0.2s ease;
}

.widget-toggle:hover{
  background:rgba(17,168,253,.25);
}

.widget-content{margin-bottom:8px}

.widget-message{
  color:var(--muted);
  font-size:0.9rem;
  text-align:center;
  padding:12px;
  background:rgba(255,255,255,.02);
  border-radius:12px;
  border:1px solid rgba(255,255,255,.05);
}

.widget-torneos{
  display:grid;
  gap:12px;
  margin-top:16px;
}

.torneo-card{
  background:rgba(17,168,253,.08);
  border:1px solid rgba(17,168,253,.25);
  border-radius:12px;
  padding:12px 16px;
  cursor:pointer;
  transition:all 0.2s ease;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.torneo-card:hover{
  background:rgba(17,168,253,.15);
  transform:translateY(-1px);
}

.torneo-en-juego{
  background:linear-gradient(135deg, rgba(0,223,130,.12), rgba(17,168,253,.12)) !important;
  border-color:rgba(0,223,130,.4) !important;
  position:relative;
}

.torneo-en-juego::before{
  content:"";
  position:absolute;
  top:8px;
  left:8px;
  width:8px;
  height:8px;
  background:var(--accent);
  border-radius:50%;
  box-shadow:0 0 8px rgba(0,223,130,.6);
  animation:pulse 2s infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.torneo-badge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:rgba(0,223,130,.2);
  border:1px solid rgba(0,223,130,.5);
  color:var(--accent);
  font-size:0.7rem;
  font-weight:600;
  padding:2px 6px;
  border-radius:999px;
  margin-left:8px;
  text-transform:uppercase;
  letter-spacing:0.5px;
}

.torneo-badge-admin{
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:rgba(255,165,0,.2);
  border:1px solid rgba(255,165,0,.5);
  color:#ffa500;
  font-size:0.7rem;
  font-weight:600;
  padding:2px 6px;
  border-radius:999px;
  margin-left:8px;
  text-transform:uppercase;
  letter-spacing:0.5px;
}

.torneo-admin{
  border:2px solid rgba(255,165,0,.3) !important;
}

.torneo-badge-proximo{
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:rgba(33,150,243,.2);
  border:1px solid rgba(33,150,243,.5);
  color:#2196f3;
  font-size:0.7rem;
  font-weight:600;
  padding:2px 6px;
  border-radius:999px;
  margin-left:8px;
  text-transform:uppercase;
  letter-spacing:0.5px;
}

.torneo-proximo{
  border:2px solid rgba(33,150,243,.3) !important;
  background:linear-gradient(135deg, rgba(33,150,243,.05), rgba(63,81,181,.05));
}

.torneo-proximo:hover{
  background:linear-gradient(135deg, rgba(33,150,243,.08), rgba(63,81,181,.08));
  border-color:rgba(33,150,243,.4);
}

.torneo-fechas{
  font-size:0.85rem;
  color:var(--muted);
  margin:4px 0;
  font-weight:500;
}

.torneo-actions{
  margin-top:8px;
  display:flex;
  gap:8px;
}

.torneo-actions .btn{
  font-size:0.8rem;
  padding:6px 12px;
}

.torneo-remove-disabled{
  background:rgba(255,255,255,.05) !important;
  border-color:rgba(255,255,255,.1) !important;
  color:var(--muted) !important;
  cursor:not-allowed !important;
  opacity:0.6;
}

.torneo-remove-disabled:hover{
  background:rgba(255,255,255,.05) !important;
  border-color:rgba(255,255,255,.1) !important;
  color:var(--muted) !important;
  transform:none !important;
}

.torneo-info h4{
  margin:0 0 4px;
  font-size:1rem;
  color:var(--text);
}

.torneo-info p{
  margin:0;
  font-size:0.85rem;
  color:var(--muted);
}

.torneo-remove{
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  border-radius:6px;
  padding:4px 8px;
  color:var(--muted);
  cursor:pointer;
  font-size:0.8rem;
  transition:all 0.2s ease;
}

.torneo-remove:hover{
  background:rgba(255,0,0,.2);
  border-color:rgba(255,0,0,.4);
  color:#ff6b6b;
}

.widget-config{
  border-top:1px solid var(--line);
  padding-top:16px;
  margin-top:16px;
}

.widget-config h4{
  margin:0 0 12px;
  font-size:1rem;
  color:var(--text);
}

.config-form{
  display:grid;
  gap:12px;
}

.config-form label{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.config-form select{
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--card);
  color:var(--text);
}

.config-actions{
  display:flex;
  gap:8px;
  margin-top:8px;
}

@media (max-width: 640px) {
  .section.section-compact{padding:12px 0 12px}
  .torneos-widget{
    padding:10px 12px;
    margin-bottom:6px;
  }

  .config-actions{
    flex-direction:column;
  }

  .config-actions .btn{
    width:100%;
    justify-content:center;
  }
}


/* —— Columnar sets layout —— */
.tabla-res-columnar .col-sets{
  vertical-align: middle;
  font-variant-numeric: tabular-nums;
}
.sets-grid{
  display:grid;
  grid-auto-rows: 1.4em;
  grid-template-rows: 1.4em 1.4em; /* dos filas: pareja1 (arriba), pareja2 (abajo) */
  gap:.15rem .8rem;
  justify-content:end;
  align-items:center;
}
.sets-grid .cell{ text-align:right; min-width:2ch; }
.live-text{
  color: #ef4444;
  font-weight: 600;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-right: 0.5rem;
}
/* mantener fondo consistente */
.tabla-res tbody tr { background: #ffffff; }


/* —— Contraste fijo para tabla de resultados —— */
.tabla-res, .tabla-res th, .tabla-res td { color: #0f172a; } /* slate-900 */
.tabla-res .dia, .tabla-res .etapa, .tabla-res .vs { color: #64748b; opacity: 1; } /* slate-500 */
.tabla-res a { color: inherit; }
.tabla-res tbody tr { background: #ffffff; } /* fondo consistente */
.table-wrap { background: transparent; } /* evitar overlays oscuros */


/* —— Visibilidad botón Limpiar —— */
.filters .btn{
  color:#0f172a;                /* texto visible */
  background:#f3f4f6;           /* gris claro */
  border:1px solid #e5e7eb;
}
.filters .btn:disabled{
  opacity:.85;                  /* que se lea el label */
  color:#334155;                /* slate-700 */
  background:#e5e7eb;
}

/* —— Más espacio vertical entre set superior e inferior —— */
.sets-grid{
  grid-template-rows: 1.9em 1.9em;  /* antes 1.4em */
  row-gap:.35rem;                   /* más separación vertical */
}
.sets-grid .cell{
  line-height:1.9em;                /* alinear vertical */
  font-size:1.05rem;                /* un toque más grande para legibilidad */
}

/* —— Cabeceras de columnas legibles —— */
.tabla-res thead th{
  color:#0f172a !important;
  opacity:1 !important;
}


/* —— Responsive: card view en móvil —— */
.mobile-row{ display:none; }
@media (max-width: 768px){
  .tabla-res thead{ display:none; }
  .tabla-res .desktop-row{ display:none; }
  .tabla-res .mobile-row{ display:table-row; }
  .match-card{
    padding: .75rem 1rem;
    background:#ffffff;
  }
  .match-meta{
    display:flex; flex-wrap:wrap; gap:.35rem .9rem;
    margin-bottom:.5rem;
    font-size:.95rem;
    color:#0f172a;
  }
  .match-meta .meta-etapa{ font-weight:600; }
  .match-body{
    display:grid;
    grid-template-columns: 1fr auto;
    gap:.35rem .9rem;
    align-items:start;
  }
  .match-body .pairs .vs{ opacity:.7; font-size:.85rem; margin:.15rem 0; }
  .match-body .sets{ justify-self:end; }
  /* sets-grid ya definido arriba; aquí respetamos el layout columnar */
}


/* —— Ajustes para vista de tarjetas por fecha —— */
.results.cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin:10px 0 22px;
}

/* —— Tarjetas de resultados (cards) —— */

/* Contenedor de la tarjeta: columna para meta y contenido */
.results.cards .result {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
  min-height: 160px;
}

/* Texto meta (categoría, etapa, cancha, fecha, etc.) */
.results.cards .result .meta {
  font-size: 0.8rem;
  color: var(--muted);
  text-align: left !important;
  margin: 0;
  padding: 0;
  display: block;
  width: 100%;
}

.results.cards .result .meta * {
  text-align: inherit !important;
}

/* Asegurar alineación izquierda en cualquier contexto */
#main .results.cards .result .meta,
.section .results.cards .result .meta,
.block .results.cards .result .meta {
  text-align: left !important;
}

/* Cada fila de pareja (nombre + sets) usa grid de dos columnas: nombre y sets */
.results.cards .pair-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: 12px;
  margin: 0;
  padding: 0;
}

/* El nombre de la pareja se apila verticalmente */
.results.cards .pair-row .pair-name {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  font-size: 0.93rem;
  font-weight: 600;
  line-height: 1.2;
  align-self: start;
  margin: 0;
  padding: 0;
  justify-self: start;
  width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* Forzar limpieza de estilos debug residuales */
[data-debug] {
  border: none !important;
  background: transparent !important;
}

/* Contenedor de sets: grid horizontal con N columnas de 3ch */
.results.cards .pair-row .sets-row {
  display: grid;
  justify-content: end;
  justify-items: end;
  gap: .35rem;
  font-variant-numeric: tabular-nums;
}

/* Celdas de set alineadas a la derecha */
.results.cards .pair-row .sets-row span {
  text-align: right;
}

/* Separador entre la primera y la segunda pareja dentro de la tarjeta */
.results.cards .pair-row + .pair-row {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

/* Destacado para partidos en juego: borde izquierdo y punto verde */
.results.cards .result.playing{
  position: relative;
  background: linear-gradient(135deg,
    rgba(239, 68, 68, 0.1) 0%,
    rgba(220, 38, 38, 0.15) 50%,
    rgba(239, 68, 68, 0.1) 100%);
  border: 2px solid;
  border-image: linear-gradient(45deg, #ef4444, #dc2626, #ef4444) 1;
  animation: liveBorderPulse 3s ease-in-out infinite;
  overflow: hidden;
}

/* Solo span 2 en desktop (3 columnas) */
@media (min-width: 901px) {
  .results.cards .result.playing{
    grid-column: span 2;
  }
}

.results.cards .result.playing::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg,
    transparent,
    rgba(255, 255, 255, 0.1),
    transparent);
  animation: liveShimmer 2s infinite;
}

@keyframes liveBorderPulse {
  0%, 100% {
    border-color: #ef4444;
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.3);
  }
  50% {
    border-color: #dc2626;
    box-shadow: 0 0 20px rgba(239, 68, 68, 0.6);
  }
}

@keyframes liveShimmer {
  0% { left: -100%; }
  100% { left: 100%; }
}
.results.cards .live-badge{
  display: inline-block;
  background: linear-gradient(135deg, #ef4444, #dc2626);
  color: white;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 4px 10px;
  border-radius: 16px;
  margin-left: 8px;
  vertical-align: middle;
  box-shadow: 0 3px 6px rgba(239, 68, 68, 0.4);
  animation: livePulse 2s ease-in-out infinite;
  position: relative;
  z-index: 10;
}

.results.cards .share-btn{
  position: absolute;
  top: 12px;
  right: 12px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: all 0.2s ease;
  z-index: 10;
  display: flex;
  align-items: center;
  gap: 3px;
}

.results.cards .share-btn:hover{
  background: rgba(255, 255, 255, 0.05);
}

/* Íconos de redes sociales */
.results.cards .share-btn .social-icon {
  width: 14px;
  height: 14px;
  opacity: 0.7;
  transition: all 0.2s ease;
}

.results.cards .share-btn .whatsapp-icon {
  fill: #25D366;
}

.results.cards .share-btn .instagram-icon {
  fill: url(#instagram-gradient-cards);
}

.results.cards .share-btn .twitter-icon {
  fill: #1DA1F2;
}

.results.cards .share-btn:hover .social-icon {
  opacity: 1;
  transform: scale(1.1);
}

/* Evitar cambios de estado después del clic */
.results.cards .share-btn:active,
.results.cards .share-btn:focus,
.results.cards .share-btn:visited {
  background: transparent;
  outline: none;
}

.results.cards .share-btn:active .social-icon,
.results.cards .share-btn:focus .social-icon,
.results.cards .share-btn:visited .social-icon {
  opacity: 0.7;
  transform: scale(1);
}

.results.cards .share-btn:focus {
  outline: none;
  box-shadow: none;
}

@keyframes livePulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 2px 4px rgba(239, 68, 68, 0.3);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 3px 8px rgba(239, 68, 68, 0.5);
  }
}

/* —— Cuadros de eliminación —— */
.bracket-wrapper{
  display:flex;
  flex-direction:column;
  gap:24px;
}
.bracket-category{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px 20px;
  box-shadow:var(--shadow);
}
.bracket-category h4{
  margin:0 0 12px;
  font-family:"Chakra Petch", system-ui, sans-serif;
  letter-spacing:.03em;
}
.bracket-container{
  display:flex;
  gap:18px;
  overflow-x:auto;
  padding-bottom:8px;
}
.bracket-round{
  min-width:170px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.bracket-round h5{
  margin:0;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.75rem;
  color:var(--muted);
}
.bracket-match{
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:6px;
  width: 200px;
  min-height: 140px;
}
.bracket-match .match-label{
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
}
.bracket-match .match-pair{
  font-weight:600;
  line-height:1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: break-word;
}
.bracket-match .match-pair-bottom{
  padding-top:6px;
  border-top:1px solid var(--line);
}
.bracket-match .match-vs{
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--muted);
  margin:2px 0;
  text-align:center;
}
.bracket-match .match-meta{
  font-size:.75rem;
  color:var(--muted);
}
.bracket-round-empty{
  font-size:.85rem;
  color:var(--muted);
}
.series-stack{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.series-entry{
  background:rgba(255,255,255,.04);
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 12px;
  font-weight:600;
  line-height:1.35;
}

/* —— Chatbot flotante —— */
.chatbot-widget{
  position:fixed;
  right:24px;
  bottom:24px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:12px;
  z-index:80;
}

.chatbot-widget[hidden],
.chatbot-panel[hidden],
.chatbot-restore[hidden]{
  display:none !important;
}

.chatbot-restore{
  position:fixed;
  right:24px;
  bottom:24px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 18px;
  border-radius:999px;
  border:0;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  color:#041418;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
  box-shadow:var(--shadow);
  transition:transform .2s ease;
  z-index:80;
}

.chatbot-restore:hover{transform:translateY(-1px);}
.chatbot-restore:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px;}

.chatbot-toggle{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 18px;
  border-radius:999px;
  border:0;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  color:#041418;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
  box-shadow:var(--shadow);
  transition:transform .2s ease;
}

.chatbot-toggle:hover{transform:translateY(-1px);}
.chatbot-toggle:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px;}

.chatbot-toggle__icon{
  width:30px;
  height:30px;
  border-radius:999px;
  background:rgba(8,13,20,.16);
  display:grid;
  place-items:center;
  font-size:16px;
}

.chatbot-panel{
  width:min(360px, calc(100vw - 48px));
  max-height:calc(100vh - 140px);
  display:flex;
  flex-direction:column;
  background:rgba(8,13,20,.92);
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  box-shadow:0 18px 40px rgba(0,0,0,.45);
  overflow:hidden;
  backdrop-filter:blur(16px);
}

.chatbot-panel__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 22px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:linear-gradient(135deg, rgba(17,168,253,.18), rgba(0,223,130,.12));
}

.chatbot-panel__title{display:flex;align-items:center;gap:14px;}
.chatbot-panel__eyebrow{margin:0 0 4px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(230,235,242,.7);}
.chatbot-panel__title h2{margin:0;font-size:18px;font-family:"Chakra Petch",system-ui,sans-serif;}

.chatbot-avatar{
  width:42px;
  height:42px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(17,168,253,.32), rgba(0,223,130,.32));
  box-shadow:0 10px 22px rgba(0,0,0,.35);
  font-size:20px;
}

.chatbot-panel__actions{display:flex;align-items:center;gap:10px;}
.chatbot-reset{
  border:0;
  background:rgba(255,255,255,.08);
  color:var(--text);
  font-size:13px;
  font-weight:600;
  padding:6px 12px;
  border-radius:999px;
  cursor:pointer;
}

.chatbot-reset:hover{background:rgba(255,255,255,.16);}
.chatbot-reset:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}

.chatbot-minimize,
.chatbot-close{
  width:32px;
  height:32px;
  border-radius:999px;
  border:0;
  display:grid;
  place-items:center;
  font-size:20px;
  font-weight:600;
  color:var(--text);
  background:rgba(8,13,20,.45);
  cursor:pointer;
  transition:background .2s ease, transform .2s ease;
}

.chatbot-minimize:hover,
.chatbot-close:hover{background:rgba(8,13,20,.7);transform:translateY(-1px);}
.chatbot-minimize:focus-visible,
.chatbot-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.chatbot-minimize{font-size:18px;}

.chatbot-panel__body{
  flex:1;
  display:flex;
  flex-direction:column;
  padding:18px 22px 0;
  min-height:0;
}

.chatbot-log{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:12px;
  overflow-y:auto;
  padding-right:6px;
  min-height:0;
}
.chatbot-quick{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 12px;
}
.chatbot-quick__btn{
  border:1px solid rgba(255,255,255,.18);
  background:rgba(23,43,70,.65);
  color:#f4f7fb;
  border-radius:999px;
  padding:6px 14px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  transition:background .2s ease, transform .2s ease;
}
.chatbot-quick__btn:hover:not(:disabled){
  background:rgba(23,43,70,.85);
  transform:translateY(-1px);
}
.chatbot-quick__btn:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}
.chatbot-quick__btn:disabled{
  opacity:.6;
  cursor:not-allowed;
}

.chatbot-message{
  max-width:88%;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(7,17,28,.88);
  border:1px solid rgba(17,168,253,.3);
  color:var(--text);
  font-size:14px;
  line-height:1.5;
  box-shadow:0 10px 24px rgba(0,0,0,.35);
  white-space:pre-wrap;
}

.chatbot-message--user{
  align-self:flex-end;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  border:0;
  color:#041418;
}

.chatbot-message--assistant{
  align-self:flex-start;
  background:linear-gradient(135deg, rgba(17,168,253,.35), rgba(0,223,130,.25));
  border:1px solid rgba(17,168,253,.45);
  color:#f5fbff;
}
.chatbot-message a{color:var(--accent-2);}
.chatbot-message--user a{color:#021b12;}

.chatbot-message.is-typing{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:10px 12px;
}

.chatbot-message.is-typing span{
  width:6px;
  height:6px;
  border-radius:999px;
  background:rgba(230,235,242,.7);
  animation:chatbotTyping 1s infinite ease-in-out;
}

.chatbot-message.is-typing span:nth-child(2){animation-delay:.15s;}
.chatbot-message.is-typing span:nth-child(3){animation-delay:.3s;}

@keyframes chatbotTyping{
  0%,80%,100%{opacity:.35;transform:translateY(0);}
  40%{opacity:1;transform:translateY(-3px);}
}

.chatbot-form{
  padding:16px 22px 18px;
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(8,13,20,.82);
}

.chatbot-input{display:flex;align-items:flex-start;gap:10px;}
.chatbot-input input{
  flex:1;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(6,10,18,.8);
  color:var(--text);
  font-size:14px;
}

.chatbot-input input::placeholder{color:rgba(230,235,242,.55);}
.chatbot-input input:focus-visible{outline:2px solid var(--accent-2);}

.chatbot-send{
  padding:11px 16px;
  border-radius:14px;
  border:0;
  background:linear-gradient(135deg, var(--accent), var(--accent-2));
  color:#041418;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(0,0,0,.35);
}

.chatbot-send:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;}

.chatbot-status{
  margin:0;
  padding:0 22px 20px;
  font-size:12px;
  color:var(--muted);
}

.chatbot-status.is-warning{color:#f7c97c;}

.chatbot-widget.is-open .chatbot-toggle{box-shadow:none;opacity:.85;}

@media (max-width: 720px){
  .chatbot-widget{right:16px;bottom:16px;}
  .chatbot-panel{width:min(100%, calc(100vw - 32px));}
  .chatbot-restore{right:16px;bottom:16px;}
}

@media (max-width: 520px){
  .chatbot-widget{left:16px;right:16px;}
  .chatbot-toggle{width:fit-content;}
  .chatbot-panel{width:100%;}
  .chatbot-message{max-width:100%;}
  .chatbot-restore{left:16px;right:16px;width:fit-content;}
}

/* —— Theme Toggle —— */
.theme-toggle{
  display:flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border:0;
  border-radius:8px;
  background:var(--bg-2);
  border:1px solid var(--line);
  color:var(--text);
  cursor:pointer;
  transition:all 0.2s ease;
  font-size:14px;
  margin-left:8px;
}

.theme-toggle:hover{
  background:var(--nav-link-hover-bg);
  transform:translateY(-1px);
}

.theme-toggle:active{
  transform:translateY(0);
}

/* Iconos por tema */
[data-theme="dark"] .theme-toggle .theme-icon::before{
  content:"☀️";
}

[data-theme="light"] .theme-toggle .theme-icon::before{
  content:"🌙";
}

.theme-icon{
  display:inline-block;
  transition:transform 0.3s ease;
}

.theme-toggle:hover .theme-icon{
  transform:rotate(20deg);
}

@media (max-width: 768px){
  .theme-toggle{
    width:28px;
    height:28px;
    font-size:12px;
    margin-left:6px;
  }
}

/* —— Mejoras para Modo Claro —— */
[data-theme="light"] .hero-gallery::after{
  background:linear-gradient(180deg, rgba(245,249,255,.85), rgba(255,255,255,.75));
}

[data-theme="light"] .hero-carousel{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 8px 32px rgba(0,0,0,.1);
}

[data-theme="light"] .hero-score-row{
  background:rgba(245,249,255,.8);
  border:1px solid rgba(0,0,0,.06);
}

[data-theme="light"] .hero-score-row.is-winner{
  border-color:rgba(17,168,253,.4);
  background:rgba(17,168,253,.12);
}

[data-theme="light"] .hero-score-label{
  color:rgba(0,0,0,.6);
}

[data-theme="light"] .hero-ranking-item{
  background:rgba(245,249,255,.8);
  border:1px solid rgba(0,0,0,.06);
}

[data-theme="light"] .hero-carousel-btn{
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.15);
  color:var(--text);
}

[data-theme="light"] .hero-carousel-btn:hover{
  background:rgba(17,168,253,.1);
  border-color:rgba(17,168,253,.3);
}

[data-theme="light"] .hero-carousel-dot{
  border:1px solid rgba(0,0,0,.3);
}

[data-theme="light"] .media-slide{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 4px 16px rgba(0,0,0,.08);
}

[data-theme="light"] .slider-btn{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,0,0,.15);
  color:var(--text);
}

[data-theme="light"] .slider-btn:hover{
  background:rgba(17,168,253,.1);
}

/* Mejor contraste para elementos deportivos en modo claro */
[data-theme="light"] .badge-soft{
  background:rgba(17,168,253,.12);
  border:1px solid rgba(17,168,253,.25);
  color:#1a5490;
}

[data-theme="light"] .hero-eyebrow{
  background:rgba(17,168,253,.12);
  border:1px solid rgba(17,168,253,.25);
  color:#1a5490;
}

[data-theme="light"] .clubs-logo{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 4px 16px rgba(0,0,0,.06);
}

[data-theme="light"] .clubs-logo:hover{
  background:rgba(17,168,253,.05);
  border-color:rgba(17,168,253,.15);
  transform:translateY(-4px);
}

/* Widgets y elementos generales en modo claro */
[data-theme="light"] .torneos-widget{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 4px 16px rgba(0,0,0,.08);
}

[data-theme="light"] .widget-message{
  background:rgba(245,249,255,.8);
  border:1px solid rgba(0,0,0,.06);
}

[data-theme="light"] .widget-toggle{
  background:rgba(17,168,253,.12);
  border:1px solid rgba(17,168,253,.25);
}

[data-theme="light"] .widget-toggle:hover{
  background:rgba(17,168,253,.18);
}

[data-theme="light"] .widget-config{
  border-top-color:rgba(0,0,0,.08);
}

/* Cards y tarjetas en modo claro */
[data-theme="light"] .card,
[data-theme="light"] .match-card{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 4px 16px rgba(0,0,0,.08);
}

[data-theme="light"] .alert{
  background:rgba(245,249,255,.9);
  border:1px solid rgba(0,0,0,.1);
}

/* Mejor contraste para botones y controles */
[data-theme="light"] .btn{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,0,0,.15);
  color:var(--text);
}

[data-theme="light"] .btn:hover{
  background:rgba(17,168,253,.1);
  border-color:rgba(17,168,253,.3);
}

[data-theme="light"] .btn-primary{
  background:rgba(17,168,253,.9);
  border:1px solid rgba(17,168,253,.6);
  color:#ffffff;
}

[data-theme="light"] .btn-primary:hover{
  background:rgba(17,168,253,1);
}

/* Tablas en modo claro */
[data-theme="light"] .table{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,0,0,.08);
}

[data-theme="light"] .table thead th{
  background:linear-gradient(180deg, rgba(245,249,255,.95), rgba(255,255,255,.9));
  border-bottom:1px solid rgba(0,0,0,.1);
}

[data-theme="light"] .table tbody tr{
  border-bottom:1px solid rgba(0,0,0,.05);
}

[data-theme="light"] .table tbody tr:hover{
  background:rgba(17,168,253,.05);
}

/* —— Secciones específicas para modo claro basadas en indexViejo.html —— */

/* Sección "Vívila Liga" - section-alt */
[data-theme="light"] .section-alt{
  background:linear-gradient(180deg, #ffffff 0%, #4a90e2 100%);
  border-top:1px solid rgba(74,144,226,.2);
  border-bottom:1px solid rgba(74,144,226,.2);
  color:#333;
}

[data-theme="light"] .section-alt .section-head h2{
  color:#333;
}

[data-theme="light"] .section-alt .section-head p{
  color:rgba(51,51,51,.7);
}

/* Highlight cards en modo claro */
[data-theme="light"] .highlight-card{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(74,144,226,.15);
  box-shadow:0 8px 24px rgba(74,144,226,.15);
}

[data-theme="light"] .highlight-card::after{
  background:linear-gradient(180deg, rgba(255,255,255,.8) 0%, rgba(74,144,226,.95) 85%);
}

[data-theme="light"] .highlight-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 32px rgba(74,144,226,.25);
}

[data-theme="light"] .highlight-card .badge-soft{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(74,144,226,.4);
  color:#0052B4;
  font-weight:600;
  box-shadow:0 2px 8px rgba(0,0,0,.2);
}

[data-theme="light"] .highlight-card .btn-ghost{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(255,255,255,.9);
  color:#333;
  font-weight:600;
  box-shadow:0 3px 12px rgba(0,0,0,.3);
}

[data-theme="light"] .highlight-card .btn-ghost:hover{
  background:rgba(255,255,255,1);
  transform:translateY(-2px);
  box-shadow:0 4px 16px rgba(0,0,0,.4);
}

/* Mejorar contraste de texto en highlight cards para modo claro */
[data-theme="light"] .highlight-card h3{
  color:#ffffff;
  text-shadow:0 2px 8px rgba(0,0,0,.6);
  font-weight:700;
}

[data-theme="light"] .highlight-card p{
  color:rgba(255,255,255,.95);
  text-shadow:0 1px 4px rgba(0,0,0,.5);
}

[data-theme="light"] .highlight-body{
  background:linear-gradient(180deg, transparent 0%, rgba(0,82,180,.15) 100%);
  border-radius:0 0 26px 26px;
}

/* Sección galería "Momentos de la liga" */
[data-theme="light"] .gallery-section{
  background:linear-gradient(180deg, #ffffff 0%, #1E90FF 100%);
  color:#333;
}

[data-theme="light"] .gallery-section .section-head h2{
  color:#333;
}

[data-theme="light"] .media-slide{
  background:rgba(255,255,255,.98);
  border:1px solid rgba(30,144,255,.15);
  box-shadow:0 6px 20px rgba(30,144,255,.15);
}

[data-theme="light"] .slider-btn{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(30,144,255,.3);
  color:#0052B4;
}

[data-theme="light"] .slider-btn:hover{
  background:rgba(30,144,255,.1);
  border-color:rgba(30,144,255,.5);
}

/* Sección "Inscripciones" - cta-card */
[data-theme="light"] .cta-card{
  background:linear-gradient(135deg, rgba(255,255,255,.95), rgba(0,123,255,.85));
  border:1px solid rgba(0,123,255,.2);
  box-shadow:0 12px 32px rgba(0,123,255,.2);
}

[data-theme="light"] .cta-card::after{
  background:linear-gradient(135deg, rgba(255,255,255,.3), rgba(0,123,255,.6));
}

[data-theme="light"] .cta-card .section-head h2{
  color:#ffffff;
  text-shadow:0 2px 4px rgba(0,82,180,.3);
}

[data-theme="light"] .cta-card .section-head p{
  color:rgba(255,255,255,.9);
  text-shadow:0 1px 2px rgba(0,82,180,.2);
}

/* Mejorar contraste general en modo claro */
[data-theme="light"] .section{
  color:#333;
}

[data-theme="light"] .section .section-head h2{
  color:#333;
}

[data-theme="light"] .section .section-head p{
  color:rgba(51,51,51,.7);
}

/* —— Tarjetas de partidos y resultados en modo claro —— */
[data-theme="light"] .card{
  background:rgba(255,255,255,.98);
  border:1px solid rgba(0,82,180,.15);
  box-shadow:0 4px 16px rgba(0,82,180,.08);
}

[data-theme="light"] .card:hover{
  border-color:rgba(0,82,180,.25);
  box-shadow:0 6px 20px rgba(0,82,180,.12);
  transform:translateY(-2px);
}

/* Mejorar estado "JUGANDO" */
[data-theme="light"] .card[style*="border-color: #e74c3c"],
[data-theme="light"] .card[style*="border-color:#e74c3c"]{
  border:2px solid #e74c3c !important;
  background:rgba(231,76,60,.05) !important;
}

/* Títulos y texto en tarjetas */
[data-theme="light"] .card .card-head h3,
[data-theme="light"] .card h3{
  color:#333;
}

[data-theme="light"] .card .card-head p,
[data-theme="light"] .card p{
  color:rgba(51,51,51,.7);
}

/* Badges y etiquetas de estado */
[data-theme="light"] .card .badge{
  background:rgba(0,82,180,.1);
  border:1px solid rgba(0,82,180,.2);
  color:#0052B4;
}

[data-theme="light"] .card .badge.badge-success{
  background:rgba(34,197,94,.1);
  border:1px solid rgba(34,197,94,.3);
  color:#059669;
}

[data-theme="light"] .card .badge.badge-warning{
  background:rgba(245,158,11,.1);
  border:1px solid rgba(245,158,11,.3);
  color:#d97706;
}

[data-theme="light"] .card .badge.badge-danger{
  background:rgba(239,68,68,.1);
  border:1px solid rgba(239,68,68,.3);
  color:#dc2626;
}

/* Botones en tarjetas */
[data-theme="light"] .card .btn{
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,82,180,.2);
  color:#0052B4;
}

[data-theme="light"] .card .btn:hover{
  background:rgba(0,82,180,.1);
  border-color:rgba(0,82,180,.4);
}

[data-theme="light"] .card .btn-primary{
  background:#0052B4;
  border:1px solid #0052B4;
  color:#ffffff;
}

[data-theme="light"] .card .btn-primary:hover{
  background:#003d8a;
  border-color:#003d8a;
}

/* —— Página de inscripciones en modo claro —— */

/* Hero de inscripciones */
[data-theme="light"] .page-hero{
  background:linear-gradient(135deg, #ffffff 0%, #4a90e2 100%);
  color:#333;
}

[data-theme="light"] .page-hero h1{
  color:#333;
  text-shadow:0 2px 4px rgba(255,255,255,.5);
}

[data-theme="light"] .page-hero p{
  color:rgba(51,51,51,.8);
}

[data-theme="light"] .page-hero .badge{
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,82,180,.3);
  color:#0052B4;
}

/* Formularios de inscripción */
[data-theme="light"] .insc-card{
  background:rgba(255,255,255,.98);
  border:1px solid rgba(0,82,180,.15);
  box-shadow:0 6px 20px rgba(0,82,180,.1);
}

[data-theme="light"] .insc-card .insc-form label{
  color:#333;
  font-weight:600;
}

[data-theme="light"] .insc-card .insc-form input,
[data-theme="light"] .insc-card .insc-form select,
[data-theme="light"] .insc-card .insc-filters input{
  background:#ffffff;
  border:2px solid rgba(0,82,180,.3);
  color:#333;
  font-weight:500;
}

[data-theme="light"] .insc-card .insc-form input:focus,
[data-theme="light"] .insc-card .insc-form select:focus,
[data-theme="light"] .insc-card .insc-filters input:focus{
  border-color:rgba(0,82,180,.4);
  box-shadow:0 0 0 3px rgba(0,82,180,.1);
  background:rgba(255,255,255,.95);
}

[data-theme="light"] .insc-card .insc-form select{
  background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"%3E%3Cpath fill="%230052B4" d="M1.41 0L6 4.58 10.59 0 12 1.41 6 7.41 0 1.41z"/%3E%3C/svg%3E');
}

/* Botón de envío */
[data-theme="light"] .insc-card .btn{
  background:#0052B4;
  border:1px solid #0052B4;
  color:#ffffff;
  font-weight:600;
}

[data-theme="light"] .insc-card .btn:hover{
  background:#003d8a;
  border-color:#003d8a;
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,82,180,.3);
}

/* Status y mensajes */
[data-theme="light"] .insc-status{
  background:rgba(245,249,255,.9);
  border:1px solid rgba(0,82,180,.2);
  color:#333;
}

[data-theme="light"] .insc-status.success{
  background:rgba(34,197,94,.1);
  border-color:rgba(34,197,94,.3);
  color:#059669;
}

[data-theme="light"] .insc-status.error{
  background:rgba(239,68,68,.1);
  border-color:rgba(239,68,68,.3);
  color:#dc2626;
}

/* —— Mejoras de contraste para formularios —— */

/* Placeholders más visibles */
[data-theme="light"] .insc-card .insc-form input::placeholder,
[data-theme="light"] .insc-card .insc-filters input::placeholder{
  color:rgba(51,51,51,.6);
  font-weight:400;
}

[data-theme="light"] .insc-card .insc-form input:focus::placeholder,
[data-theme="light"] .insc-card .insc-filters input:focus::placeholder{
  color:rgba(51,51,51,.4);
}

/* Mejorar visibility de tablas */
[data-theme="light"] .table{
  background:#ffffff;
  border:2px solid rgba(0,82,180,.2);
  color:#333;
}

[data-theme="light"] .table th{
  background:rgba(0,82,180,.1);
  color:#333;
  font-weight:600;
  border-bottom:2px solid rgba(0,82,180,.2);
}

[data-theme="light"] .table td{
  color:#333;
  border-bottom:1px solid rgba(0,82,180,.1);
}

[data-theme="light"] .table tbody tr:nth-child(even){
  background:rgba(245,249,255,.5);
}

/* Mejorar contraste general de texto */
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea{
  color:#333 !important;
}

[data-theme="light"] .text-muted,
[data-theme="light"] .muted{
  color:rgba(51,51,51,.7) !important;
}

/* Mejorar contraste en elementos específicos */
[data-theme="light"] .card-head small,
[data-theme="light"] .card small{
  color:rgba(51,51,51,.8);
}

[data-theme="light"] .badge{
  font-weight:600;
}

/* —— Página de reglamento en modo claro —— */

/* Hero específico de reglamento */
[data-theme="light"] .reglamento-hero{
  background:linear-gradient(135deg, #ffffff 0%, #4a90e2 100%);
  color:#333;
}

[data-theme="light"] .reglamento-hero::after{
  background:linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(74,144,226,.3) 90%);
}

[data-theme="light"] .reglamento-hero h1{
  color:#333;
  text-shadow:0 2px 6px rgba(255,255,255,.8);
}

[data-theme="light"] .reglamento-hero p{
  color:rgba(51,51,51,.8);
  text-shadow:0 1px 3px rgba(255,255,255,.6);
}

[data-theme="light"] .reglamento-hero .badge{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,82,180,.4);
  color:#0052B4;
  font-weight:600;
  box-shadow:0 2px 8px rgba(0,82,180,.2);
}

/* Botones en hero de reglamento */
[data-theme="light"] .reglamento-hero .btn,
[data-theme="light"] .page-hero .btn{
  background:rgba(255,255,255,.95);
  border:2px solid rgba(0,82,180,.4);
  color:#0052B4;
  font-weight:600;
  box-shadow:0 4px 16px rgba(0,82,180,.2);
}

[data-theme="light"] .reglamento-hero .btn:hover,
[data-theme="light"] .page-hero .btn:hover{
  background:rgba(255,255,255,1);
  border-color:rgba(0,82,180,.6);
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(0,82,180,.3);
}

[data-theme="light"] .reglamento-hero .meta-chip,
[data-theme="light"] .page-hero .meta-chip{
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,82,180,.3);
  color:#0052B4;
}

/* Contenido de reglamento */
[data-theme="light"] .reglamento-content{
  background:rgba(255,255,255,.98) !important;
  border:1px solid rgba(0,82,180,.15) !important;
  box-shadow:0 8px 24px rgba(0,82,180,.1) !important;
  color:#333 !important;
}

[data-theme="light"] .summary-card,
[data-theme="light"] .reglamento-nav{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,82,180,.15);
  box-shadow:0 4px 16px rgba(0,82,180,.08);
}

[data-theme="light"] .summary-card h3,
[data-theme="light"] .summary-card h4,
[data-theme="light"] .reglamento-nav h4{
  color:#333;
}

[data-theme="light"] .summary-card p{
  color:rgba(51,51,51,.7);
}

[data-theme="light"] .summary-card.highlight{
  background:linear-gradient(135deg, rgba(74,144,226,.1), rgba(30,144,255,.1));
  border-color:rgba(0,82,180,.3);
}

[data-theme="light"] .summary-card.highlight p{
  color:#333;
}

[data-theme="light"] .reglamento-nav a{
  color:rgba(51,51,51,.7);
}

[data-theme="light"] .reglamento-nav a:hover,
[data-theme="light"] .reglamento-nav a:focus-visible{
  background:rgba(0,82,180,.1);
  color:#333;
  border-color:rgba(0,82,180,.2);
}

/* Contenido interno de reglamento */
[data-theme="light"] .regla{
  border-bottom:1px solid rgba(0,82,180,.1);
}

[data-theme="light"] .regla-head h2{
  color:#333;
  font-weight:700;
}

[data-theme="light"] .regla-num{
  background:linear-gradient(135deg, #0052B4, #007FFF);
  color:#ffffff;
  border:2px solid rgba(0,82,180,.3);
  box-shadow:0 4px 12px rgba(0,82,180,.25);
}

[data-theme="light"] .regla-body{
  color:#333 !important;
}

[data-theme="light"] .regla-body p{
  color:#333 !important;
}

[data-theme="light"] .regla-body h3{
  color:#0052B4 !important;
}

[data-theme="light"] .regla-body *{
  color:#333 !important;
}

/* Listas de reglas */
[data-theme="light"] .rule-list li{
  color:rgba(51,51,51,.8);
}

[data-theme="light"] .rule-list li::before{
  background:#00dfaa;
}

[data-theme="light"] .rule-list li strong{
  color:#333;
}

/* Summary lists */
[data-theme="light"] .summary-list li{
  color:rgba(51,51,51,.7);
}

[data-theme="light"] .summary-list li strong{
  color:#333;
}

/* Example cards mejoradas */
[data-theme="light"] .example-card{
  background:rgba(74,144,226,.15);
  border:2px solid rgba(74,144,226,.4);
  color:#333;
}

[data-theme="light"] .example-card strong{
  color:#0052B4;
  font-weight:700;
}

[data-theme="light"] .example-card h4{
  color:#0052B4;
  font-weight:700;
}

[data-theme="light"] .example-card p,
[data-theme="light"] .example-list{
  color:#333;
  font-weight:500;
}

[data-theme="light"] .example-list li::marker{
  color:#0052B4;
}

/* Mejorar contraste general del texto */
[data-theme="light"] .reglamento-content h1,
[data-theme="light"] .reglamento-content h2,
[data-theme="light"] .reglamento-content h3,
[data-theme="light"] .reglamento-content h4,
[data-theme="light"] .reglamento-content h5,
[data-theme="light"] .reglamento-content h6{
  color:#333;
}

[data-theme="light"] .reglamento-content p,
[data-theme="light"] .reglamento-content li,
[data-theme="light"] .reglamento-content span{
  color:#333 !important;
}

/* Mejoras específicas para móvil */
@media (max-width: 768px){
  [data-theme="light"] .reglamento-content{
    background:#ffffff !important;
  }

  [data-theme="light"] .regla-body,
  [data-theme="light"] .regla-body p,
  [data-theme="light"] .regla-body span,
  [data-theme="light"] .regla-body li,
  [data-theme="light"] .regla-body strong,
  [data-theme="light"] .regla-body em{
    color:#333 !important;
    font-weight:500 !important;
  }

  [data-theme="light"] .rule-list li{
    color:#333 !important;
  }

  [data-theme="light"] .example-card p{
    color:#333 !important;
  }
}

/* Asegurar que TODOS los elementos de texto sean visibles */
[data-theme="light"] .reglamento-content *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(.regla-num){
  color:#333 !important;
}

/* Callouts y elementos especiales */
[data-theme="light"] .callout{
  background:rgba(74,144,226,.1) !important;
  border:1px solid rgba(74,144,226,.3) !important;
  color:#333 !important;
}

[data-theme="light"] .callout *{
  color:#333 !important;
}

/* —— FORZAR REGLAMENTO MODO CLARO EN DESKTOP —— */

/* Contenido principal con máxima especificidad */
html[data-theme="light"] body .reglamento-layout .reglamento-content{
  background:#ffffff !important;
  color:#333 !important;
}

html[data-theme="light"] body .reglamento-content .regla{
  background:transparent !important;
  color:#333 !important;
}

html[data-theme="light"] body .reglamento-content .regla *{
  color:#333 !important;
}

html[data-theme="light"] body .reglamento-content .regla-body{
  background:transparent !important;
  color:#333 !important;
}

html[data-theme="light"] body .reglamento-content .regla-body *{
  color:#333 !important;
}

/* Selectores ultra-específicos para desktop */
html[data-theme="light"] .reglamento-overview .reglamento-layout .reglamento-content{
  background:#ffffff !important;
  backdrop-filter:none !important;
}

/* Eliminar cualquier background-image o gradiente */
html[data-theme="light"] .reglamento-content::before,
html[data-theme="light"] .reglamento-content::after{
  display:none !important;
}

/* Forzar texto visible en todo el contenido */
html[data-theme="light"] .reglamento-content,
html[data-theme="light"] .reglamento-content *:not(.regla-num):not(h1):not(h2):not(h3){
  color:#333 !important;
  background:transparent !important;
}

/* —— Selectores y dropdowns en modo claro —— */

/* Selectores generales */
[data-theme="light"] .filters select,
[data-theme="light"] select{
  background:#ffffff !important;
  color:#333 !important;
  border:2px solid rgba(0,82,180,.3) !important;
  background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="16" height="10" viewBox="0 0 16 10"%3E%3Cpath fill="%23003d8a" stroke="%23003d8a" stroke-width="1" d="M2 2L8 8L14 2"/%3E%3C/svg%3E') !important;
  background-repeat:no-repeat !important;
  background-position:right 12px center !important;
  background-size:16px 10px !important;
  padding-right:40px !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
}

[data-theme="light"] .filters select:focus,
[data-theme="light"] select:focus{
  border-color:rgba(0,82,180,.6) !important;
  box-shadow:0 0 0 3px rgba(0,82,180,.1) !important;
}

/* Options en modo claro */
[data-theme="light"] .filters select option,
[data-theme="light"] select option{
  background:#ffffff !important;
  color:#333 !important;
}

/* Filtros específicos */
[data-theme="light"] .filters input[type="search"],
[data-theme="light"] .filters input[type="text"]{
  background:#ffffff !important;
  color:#333 !important;
  border:2px solid rgba(0,82,180,.3) !important;
}

[data-theme="light"] .filters input[type="search"]:focus,
[data-theme="light"] .filters input[type="text"]:focus{
  border-color:rgba(0,82,180,.6) !important;
  box-shadow:0 0 0 3px rgba(0,82,180,.1) !important;
}

/* Labels de filtros */
[data-theme="light"] .filters label{
  color:#333;
  font-weight:600;
}

[data-theme="light"] .filters label span{
  color:#333;
}

/* Placeholder en inputs de filtro */
[data-theme="light"] .filters input::placeholder{
  color:rgba(51,51,51,.6);
}

/* Selectores en configuración */
[data-theme="light"] .config-form select{
  background:#ffffff !important;
  color:#333 !important;
  border:2px solid rgba(0,82,180,.3) !important;
  background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="16" height="10" viewBox="0 0 16 10"%3E%3Cpath fill="%23003d8a" stroke="%23003d8a" stroke-width="1" d="M2 2L8 8L14 2"/%3E%3C/svg%3E') !important;
  background-repeat:no-repeat !important;
  background-position:right 12px center !important;
  background-size:16px 10px !important;
  padding-right:40px !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
}

/* Selectores en jugadores */
[data-theme="light"] .players-filters .field select{
  background:#ffffff !important;
  color:#333 !important;
  border:2px solid rgba(0,82,180,.3) !important;
  background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="16" height="10" viewBox="0 0 16 10"%3E%3Cpath fill="%23003d8a" stroke="%23003d8a" stroke-width="1" d="M2 2L8 8L14 2"/%3E%3C/svg%3E') !important;
  background-repeat:no-repeat !important;
  background-position:right 12px center !important;
  background-size:16px 10px !important;
  padding-right:40px !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
}

/* —— Página de jugadores en modo claro —— */

/* Cards de estadísticas mejoradas */
[data-theme="light"] .players-stats{
  gap:20px;
}

[data-theme="light"] .players-stat{
  background:rgba(255,255,255,.95);
  border:2px solid rgba(0,82,180,.2);
  box-shadow:0 6px 20px rgba(0,82,180,.15);
  color:#333;
}

[data-theme="light"] .players-stat strong{
  color:#0052B4;
  font-weight:800;
}

[data-theme="light"] .players-stat span{
  color:rgba(51,51,51,.8);
  font-weight:600;
}

/* Hero de jugadores */
[data-theme="light"] .players-head{
  background:linear-gradient(140deg, rgba(74,144,226,.2), rgba(30,144,255,.15));
  border:1px solid rgba(0,82,180,.2);
  color:#333;
}

[data-theme="light"] .players-head h1{
  color:#333;
}

[data-theme="light"] .players-head p{
  color:rgba(51,51,51,.8);
}

/* Filters en jugadores */
[data-theme="light"] .players-filters{
  background:rgba(255,255,255,.95);
  border:1px solid rgba(0,82,180,.15);
  box-shadow:0 4px 16px rgba(0,82,180,.08);
}

[data-theme="light"] .players-filters label{
  color:#333;
  font-weight:600;
}

[data-theme="light"] .players-filters .field input{
  background:#ffffff !important;
  color:#333 !important;
  border:2px solid rgba(0,82,180,.3) !important;
}

[data-theme="light"] .players-filters .field input:focus{
  border-color:rgba(0,82,180,.6) !important;
  box-shadow:0 0 0 3px rgba(0,82,180,.1) !important;
}

/* —— Reglamento modo claro - Especificidad máxima —— */
html[data-theme="light"] body.reglamento-page main .reglamento-layout .reglamento-content,
html[data-theme="light"] body main .reglamento-layout .reglamento-content,
html[data-theme="light"] .reglamento-layout .reglamento-content,
html[data-theme="light"] .reglamento-content,
body[data-theme="light"] .reglamento-content,
[data-theme="light"] .reglamento-content {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #333333 !important;
  border: 1px solid rgba(0,82,180,.15) !important;
}

html[data-theme="light"] body .reglamento-content *,
html[data-theme="light"] .reglamento-content *,
[data-theme="light"] .reglamento-content * {
  background-color: transparent !important;
  color: #333333 !important;
}

html[data-theme="light"] body .reglamento-content .regla,
html[data-theme="light"] .reglamento-content .regla,
[data-theme="light"] .reglamento-content .regla {
  background: rgba(255,255,255,.98) !important;
  color: #333333 !important;
  border-color: rgba(0,82,180,.15) !important;
}

html[data-theme="light"] body .reglamento-content .regla-body,
html[data-theme="light"] .reglamento-content .regla-body,
[data-theme="light"] .reglamento-content .regla-body {
  background: transparent !important;
  color: #333333 !important;
}

html[data-theme="light"] body .reglamento-content .regla-num,
html[data-theme="light"] .reglamento-content .regla-num,
[data-theme="light"] .reglamento-content .regla-num {
  background: linear-gradient(135deg, #0052B4, #4A90E2) !important;
  color: #ffffff !important;
}

html[data-theme="light"] body .reglamento-content p,
html[data-theme="light"] .reglamento-content p,
[data-theme="light"] .reglamento-content p {
  color: #333333 !important;
  background: transparent !important;
}

html[data-theme="light"] body .reglamento-content strong,
html[data-theme="light"] .reglamento-content strong,
[data-theme="light"] .reglamento-content strong {
  color: #0052B4 !important;
}

html[data-theme="light"] body .reglamento-content ul,
html[data-theme="light"] body .reglamento-content li,
html[data-theme="light"] .reglamento-content ul,
html[data-theme="light"] .reglamento-content li,
[data-theme="light"] .reglamento-content ul,
[data-theme="light"] .reglamento-content li {
  color: #333333 !important;
  background: transparent !important;
}

@media (min-width: 768px) {
  html[data-theme="light"] body .reglamento-layout .reglamento-content,
  html[data-theme="light"] .reglamento-layout .reglamento-content,
  [data-theme="light"] .reglamento-layout .reglamento-content {
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #333333 !important;
    border: 2px solid rgba(0,82,180,.2) !important;
    box-shadow: 0 4px 20px rgba(0,82,180,.1) !important;
  }

  html[data-theme="light"] body .reglamento-content *:not(.regla-num),
  html[data-theme="light"] .reglamento-content *:not(.regla-num),
  [data-theme="light"] .reglamento-content *:not(.regla-num) {
    color: #333333 !important;
    background-color: transparent !important;
  }
}