:root{
  --tinta:#1d2027;
  --tinta-suave:#3c4150;
  --estraza:#f7f0e2;
  --estraza-honda:#efe3cb;
  --chile:#dc3e3d;
  --chile-hondo:#a92a29;
  --elote:#f9bc01;
  --limon:#ece219;
  --nopal:#009b3a;
  --nopal-hondo:#0b5e2c;
  --rosa-mexicano:#e0457b;
  --cielo:#2a7ab8;
  --pizarra:#1f3a2c;
  --gis:#f3f1e7;
  --sombra:0 3px 0 rgba(29,32,39,.18);
  --ancho:1180px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--estraza);color:var(--tinta);font:400 17px/1.66 "Prompt",system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--chile-hondo);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--nopal-hondo)}
h1,h2,h3{font-family:"Rokkitt",Georgia,serif;line-height:1.12;color:var(--tinta);margin:0 0 .5em}
h1{font-size:clamp(2.1rem,4.4vw,3.3rem);font-weight:800;letter-spacing:-.01em}
h2{font-size:clamp(1.55rem,2.8vw,2.1rem);font-weight:700;margin-top:1.6em}
h3{font-size:1.3rem;font-weight:700;margin-top:1.3em}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--elote);outline-offset:2px}

.toldo{background:var(--tinta);color:#fff;position:sticky;top:0;z-index:30;border-bottom:4px solid var(--elote)}
.toldo-tira{max-width:var(--ancho);margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:22px}
.marquesina{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;flex-shrink:0}
.marquesina img{width:150px;height:auto}
.marquesina small{font:600 .72rem/1.1 "Prompt",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--elote);border-left:1px solid #4b5160;padding-left:10px;max-width:92px}
.cordel{margin-left:auto}
.banderines{list-style:none;margin:0;padding:0;display:flex;gap:4px;flex-wrap:wrap}
.banderin{display:block;padding:7px 11px 9px;color:#f2ece0;text-decoration:none;font-weight:500;font-size:.93rem;border-radius:3px 3px 0 0;position:relative}
.banderin:hover{background:#2c303b;color:#fff}
.banderin[aria-current="page"]{color:var(--tinta);background:var(--elote)}
.banderin[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:8px;background:linear-gradient(135deg,var(--elote) 50%,transparent 50%) 0 0/10px 8px repeat-x,linear-gradient(225deg,var(--elote) 50%,transparent 50%) 0 0/10px 8px repeat-x}
.abrecarpa{display:none;margin-left:auto;background:var(--chile);color:#fff;border:0;border-radius:4px;font:600 .95rem "Prompt",sans-serif;padding:9px 14px;cursor:pointer}
.abrecarpa span{display:inline-block;width:18px;height:2px;background:#fff;box-shadow:0 -6px #fff,0 6px #fff;vertical-align:middle;margin-right:8px}

.picado{height:30px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='30' viewBox='0 0 250 30'%3E%3Cpath d='M0 0h50v22l-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6L0 22z' fill='%23dc3e3d'/%3E%3Cpath d='M50 0h50v22l-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6L50 22z' fill='%23f9bc01'/%3E%3Cpath d='M100 0h50v22l-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6L100 22z' fill='%23009b3a'/%3E%3Cpath d='M150 0h50v22l-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6L150 22z' fill='%23e0457b'/%3E%3Cpath d='M200 0h50v22l-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6-6.25 6-6.25-6L200 22z' fill='%232a7ab8'/%3E%3Ccircle cx='25' cy='9' r='3' fill='%23f7f0e2'/%3E%3Ccircle cx='75' cy='9' r='3' fill='%23f7f0e2'/%3E%3Ccircle cx='125' cy='9' r='3' fill='%23f7f0e2'/%3E%3Ccircle cx='175' cy='9' r='3' fill='%23f7f0e2'/%3E%3Ccircle cx='225' cy='9' r='3' fill='%23f7f0e2'/%3E%3C/svg%3E") 0 0/250px 30px repeat-x}

.recinto{max-width:var(--ancho);margin:0 auto;padding:18px 20px 40px}
.vereda{font-size:.86rem;color:var(--tinta-suave);margin:4px 0 18px}
.vereda ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.vereda li+li::before{content:"✦";color:var(--chile);margin-right:6px;font-size:.7em;vertical-align:2px}
.vereda a{color:var(--tinta-suave)}
.explanada{display:grid;grid-template-columns:minmax(0,820px) 300px;justify-content:space-between;gap:44px;align-items:start}
.relato{min-width:0}
.caseta{position:sticky;top:96px;display:grid;gap:18px}

.pregon{padding:6px 0 18px;border-bottom:3px dotted var(--chile);margin-bottom:24px}
.pregon-voz{font-size:1.12rem;color:var(--tinta-suave)}
.fechador{display:inline-block;font:600 .8rem/1 "Prompt",sans-serif;letter-spacing:.06em;text-transform:uppercase;background:var(--tinta);color:var(--elote);padding:7px 10px;border-radius:2px;margin-bottom:14px}

.tramo{scroll-margin-top:96px}
.🎰{--acento:var(--chile)}
.🎁{--acento:var(--elote)}
.📲{--acento:var(--cielo)}
.📝{--acento:var(--nopal)}
.⚽{--acento:var(--nopal)}
.⭐{--acento:var(--rosa-mexicano)}
.tramo>h2::before{content:"";display:inline-block;width:14px;height:14px;background:var(--acento,var(--chile));transform:rotate(45deg);margin-right:12px;vertical-align:4px}

.boleto{position:relative;background:var(--limon);color:var(--tinta);padding:16px 18px 16px 22px;border-radius:6px;box-shadow:var(--sombra);
  -webkit-mask:radial-gradient(circle 9px at 0 50%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 9px at 100% 50%,transparent 98%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 9px at 0 50%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 9px at 100% 50%,transparent 98%,#000) right/51% 100% no-repeat}
.boleto:nth-child(2){background:#fde3c4}
.boleto:nth-child(3){background:#d9f0d9}
.boleto-folio{font:700 .74rem/1 "Prompt",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--chile-hondo);border-bottom:2px dashed rgba(29,32,39,.35);padding-bottom:8px;margin-bottom:10px}
.boleto .boleto-talon{font-family:"Rokkitt",serif;font-size:1.32rem;font-weight:700;line-height:1.15;margin:0 0 6px}
.boleto p{font-size:.9rem;line-height:1.5;margin:0}

.puestos{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:18px;margin:20px 0 26px}
.puesto{background:#fff;border:2px solid var(--tinta);border-radius:0 0 8px 8px;padding:0 16px 14px;box-shadow:var(--sombra)}
.puesto-lona{height:30px;margin:0 -16px 12px;background:repeating-linear-gradient(90deg,var(--acento,var(--chile)) 0 22px,#fff 22px 44px);position:relative}
.puesto-lona::after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:10px;background:radial-gradient(circle at 11px 0,var(--acento,var(--chile)) 10px,transparent 11px) 0 0/44px 10px repeat-x}
.puesto h3{margin:.4em 0 .3em;font-size:1.22rem}
.puesto p{font-size:.93rem;margin:0}

.pizarron-marco{overflow-x:auto;margin:18px 0 6px;border:8px solid #8a5a2b;border-radius:6px;background:var(--pizarra);box-shadow:inset 0 0 0 2px #6b431d}
.pizarron{width:100%;border-collapse:collapse;color:var(--gis);font-size:.93rem;min-width:520px}
.pizarron th,.pizarron td{padding:10px 12px;text-align:left;vertical-align:top;border-bottom:1px dashed rgba(243,241,231,.28)}
.pizarron th{font-family:"Rokkitt",serif;font-size:1.06rem;color:var(--limon);font-weight:700}
.pizarron tr:last-child td{border-bottom:0}
.tiza{font-size:.82rem;color:var(--tinta-suave);margin:4px 0 22px;font-style:italic}

.letrero{border:3px solid var(--tinta);background:#fff8df;padding:14px 18px;margin:22px 0;border-radius:4px;position:relative}
.letrero::before{content:"";position:absolute;top:-12px;left:22px;width:10px;height:10px;border-radius:50%;background:var(--chile);box-shadow:calc(100% + 0px) 0 0 transparent}
.letrero p:last-child{margin:0}
.escalinata{counter-reset:peldano;list-style:none;padding:0;margin:16px 0 22px}
.escalinata li{counter-increment:peldano;position:relative;padding:4px 0 12px 54px}
.escalinata li::before{content:counter(peldano);position:absolute;left:0;top:2px;width:38px;height:38px;border-radius:50%;background:var(--chile);color:#fff;font:700 1.2rem/38px "Rokkitt",serif;text-align:center;box-shadow:0 0 0 3px var(--elote)}

.resguardo{margin:34px 0 10px;padding:18px 20px;background:var(--tinta);color:#f1ece0;border-radius:6px;border-top:6px solid var(--nopal)}
.resguardo h2,.resguardo h3{color:var(--elote);margin-top:0}
.resguardo a{color:var(--limon)}
.resguardo strong{color:#fff}

.loteria{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:16px 0 24px}
.carta{background:#fff;border:3px solid var(--tinta);border-radius:6px;padding:0;box-shadow:inset 0 0 0 5px #fff,inset 0 0 0 7px var(--chile)}
.carta-grito{cursor:pointer;list-style:none;padding:16px 18px 14px;font-family:"Rokkitt",serif;font-weight:700;font-size:1.14rem;line-height:1.2}
.carta-grito::-webkit-details-marker{display:none}
.carta-grito::after{content:"+";float:right;color:var(--chile);font-size:1.4rem;line-height:1;margin-left:8px}
.carta[open] .carta-grito::after{content:"–"}
.carta-dicho{padding:0 18px 16px;font-size:.94rem}
.carta-dicho p{margin:0}

.voceo{display:inline-flex;align-items:center;gap:10px;background:var(--chile);color:#fff;text-decoration:none;font-weight:600;padding:12px 20px;border-radius:40px;border:2px solid var(--tinta);box-shadow:0 4px 0 var(--tinta);transition:transform .12s,box-shadow .12s}
.voceo:hover{color:#fff;transform:translateY(2px);box-shadow:0 2px 0 var(--tinta)}
.voceo::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--elote);box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.voceo-chico{padding:8px 15px;font-size:.9rem;box-shadow:none;border-color:var(--elote)}
.voceo-chico:hover{transform:none;box-shadow:none;background:var(--chile-hondo)}
.voceo-bloque{margin:24px 0;padding:18px;border:2px dashed var(--chile);border-radius:8px;background:#fff;display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center}
.voceo-letrita{flex:1 1 240px;font-size:.84rem;color:var(--tinta-suave);margin:0}

.farolito{background:var(--tinta);color:#d8d3c6;margin-top:30px;font-size:.92rem}
.farolito-guirnalda{height:26px;background:radial-gradient(circle at 20px 14px,var(--elote) 5px,transparent 6px) 0 0/40px 26px repeat-x,radial-gradient(circle at 40px 14px,var(--chile) 5px,transparent 6px) 0 0/80px 26px repeat-x,linear-gradient(#3c4150,#3c4150) 0 8px/100% 1px no-repeat}
.farolito-bloques{max-width:var(--ancho);margin:0 auto;padding:26px 20px 10px;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px}
.farolito-bloques p{margin:0 0 .7em}
.farolito-bloques b{display:block;font-family:"Rokkitt",serif;font-size:1.15rem;color:#fff;margin-bottom:6px}
.farolito ul{list-style:none;margin:0;padding:0}
.farolito li{margin:0 0 6px}
.farolito a{color:#f2ece0}
.farolito-pie{max-width:var(--ancho);margin:0 auto;padding:14px 20px 26px;border-top:1px solid #3c4150;font-size:.82rem;color:#9ea3b2}
.dieciocho{display:inline-block;background:var(--chile);color:#fff;font-weight:700;border-radius:50%;width:38px;height:38px;line-height:38px;text-align:center;margin-right:8px}

.recogido{text-align:center;max-width:680px;margin:30px auto 10px;padding:30px 20px}
.recogido-grande{margin:0 0 6px;font:800 clamp(5rem,16vw,9rem)/1 "Rokkitt",serif;color:var(--chile);text-shadow:5px 5px 0 var(--elote)}
.recogido ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0 0}
.recogido li a{display:block;padding:9px 16px;border:2px solid var(--tinta);border-radius:30px;background:#fff;text-decoration:none;color:var(--tinta);font-weight:500}

@media (max-width:1060px){
  .explanada{grid-template-columns:1fr}
  .relato{max-width:none}
  .caseta{position:static;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
}
@media (max-width:1020px){
  .abrecarpa{display:inline-block}
  .cordel{position:fixed;inset:0;background:var(--tinta);display:none;flex-direction:column;justify-content:center;align-items:center;padding:80px 24px 40px;z-index:40;margin:0}
  html[data-carpa="abierta"] .cordel{display:flex}
  html[data-carpa="abierta"] body{overflow:hidden}
  html[data-carpa="abierta"] .abrecarpa{position:fixed;top:12px;right:16px;z-index:50}
  .banderines{flex-direction:column;align-items:center;gap:10px}
  .banderin{font-family:"Rokkitt",serif;font-size:1.7rem;padding:6px 16px}
  .cordel .voceo{margin-top:26px}
  .toldo .cordel>.voceo-chico{font-size:1rem;padding:12px 20px}
  .farolito-bloques{grid-template-columns:1fr}
}
@media (min-width:1021px){
  .cordel{display:flex;align-items:center;gap:14px}
}
@media (max-width:520px){
  body{font-size:16px}
  .toldo-tira{padding:9px 16px}
  .marquesina img{width:122px}
  .marquesina small{display:none}
  .recinto{padding:14px 16px 30px}
  .pizarron{min-width:0;font-size:.86rem}
  .pizarron th,.pizarron td{padding:8px}
  .voceo{width:100%;justify-content:center}
}
@media (min-width:1700px){
  :root{--ancho:1280px}
  body{font-size:18px}
}