/* ajustes */
:root{
  --mesa:#201e1b;
  --mesa-2:#2b2824;
  --papel:#f5ecd6;
  --papel-2:#ebdfc2;
  --tinta:#1d1a16;
  --tinta-suave:#4a4339;
  --verde:#00b47a;
  --verde-hondo:#00704d;
  --rojo:#d83535;
  --rojo-hondo:#a8231f;
  --mostaza:#e7a72b;
  --rosa:#d1286f;
  --cielo:#3d8fc4;
  --radio:14px;
  --ancho:1180px;
  --letra-cabeza:"Rozha One",Georgia,"Times New Roman",serif;
  --letra-texto:"Kanit",system-ui,-apple-system,"Segoe UI",sans-serif;
}

@media (min-width:2200px){:root{--ancho:1380px}}

/* generico */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background-color:var(--mesa);
  background-image:
    radial-gradient(circle at 12px 12px,rgba(255,255,255,.035) 2px,transparent 2.5px),
    linear-gradient(180deg,var(--mesa-2),var(--mesa) 420px);
  background-size:28px 28px,100% 100%;
  color:var(--tinta);
  font-family:var(--letra-texto);
  font-weight:300;
  font-size:1.0625rem;
  line-height:1.62;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--verde-hondo);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--rojo-hondo)}
strong,b{font-weight:600}
h1,h2,h3{font-family:var(--letra-cabeza);font-weight:400;line-height:1.15;color:var(--tinta);margin:0 0 .6em}
h1{font-size:clamp(2rem,4.4vw,3.15rem)}
h2{font-size:clamp(1.55rem,2.8vw,2.05rem)}
h3{font-size:1.28rem;margin-top:1.4em}
p{margin:0 0 1em}
ul,ol{padding-left:1.25em;margin:0 0 1.1em}
li{margin-bottom:.35em}

/* objetos */
.o-marco{width:100%;max-width:var(--ancho);margin-inline:auto;padding-inline:20px}
.o-tendido{display:grid;grid-template-columns:minmax(0,1fr);gap:34px;padding-block:34px 56px}
@media (min-width:1080px){
  .o-tendido{grid-template-columns:minmax(0,1fr) 290px;align-items:start}
}
.o-pila>*+*{margin-top:34px}

/* cabecera */
.c-cabecera{background:#151412;border-bottom:4px solid var(--verde);position:relative;z-index:5}
.c-cabecera__fila{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:74px;flex-wrap:wrap}
.c-marca{display:flex;align-items:center;gap:12px;color:var(--papel);text-decoration:none}
.c-marca:hover{color:var(--papel)}
.c-marca__naipe{width:34px;height:46px;border-radius:5px;background:var(--papel);border:2px solid var(--papel);box-shadow:inset 0 0 0 2px var(--tinta);display:grid;place-items:center;font-family:var(--letra-cabeza);color:var(--rojo);font-size:1.1rem;flex:none}
.c-marca__texto{display:flex;flex-direction:column;line-height:1.05}
.c-marca__nombre{font-family:var(--letra-cabeza);font-size:1.45rem;letter-spacing:.01em}
.c-marca__lema{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:#bdb39c}
.c-indice{display:flex;align-items:center;gap:6px}
.c-indice__llave{display:none;font:600 .95rem var(--letra-texto);letter-spacing:.06em;text-transform:uppercase;background:var(--papel);color:var(--tinta);border:2px solid var(--papel);border-radius:999px;padding:7px 18px;cursor:pointer}
.c-indice__llave[aria-expanded="true"]{background:var(--verde);border-color:var(--verde);color:#08130e}
.c-indice__renglones{display:flex;flex-wrap:wrap;gap:2px;margin:0;padding:0;list-style:none}
.c-indice__renglones li{margin:0}
.c-indice__renglones a{display:block;padding:8px 11px;color:#e8dfc8;text-decoration:none;font-size:.95rem;border-radius:8px}
.c-indice__renglones a:hover,.c-indice__renglones a[aria-current="page"]{background:#2c2a26;color:#fff}
.c-indice__renglones a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--rojo)}
.c-indice__salir{margin-left:8px}
@media (max-width:1020px){
  .c-indice__llave{display:inline-block}
  .c-indice{flex-wrap:wrap;justify-content:flex-end}
  .c-indice__renglones{display:none;position:absolute;left:0;right:0;top:100%;background:#151412;border-bottom:4px solid var(--verde);padding:10px 20px 18px;flex-direction:column}
  .c-indice__renglones.is-abierto{display:flex}
  .c-indice__renglones a{padding:12px 6px;border-bottom:1px solid #2f2c27;border-radius:0}
}

/* llamado a la casa */
.c-llamado{display:inline-flex;align-items:center;gap:10px;background:var(--rojo);color:#fff;font:600 1rem/1.2 var(--letra-texto);text-decoration:none;padding:12px 20px;border-radius:10px;border:2px solid var(--tinta);box-shadow:3px 3px 0 var(--tinta);transition:transform .12s,box-shadow .12s}
.c-llamado:hover{color:#fff;transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--tinta)}
.c-llamado::after{content:"";width:9px;height:9px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.c-llamado--verde{background:var(--verde-hondo)}
.c-llamado--chico{padding:8px 14px;font-size:.92rem;box-shadow:none;border-color:var(--verde)}
.c-llamado--chico:hover{box-shadow:none}
.c-llamado__leyenda{display:block;font-size:.82rem;color:var(--tinta-suave);margin-top:10px}

/* la carta */
.c-carta{background:var(--papel);border-radius:var(--radio);padding:14px;box-shadow:0 0 0 2px var(--tinta),0 14px 30px rgba(0,0,0,.35);position:relative;scroll-margin-top:20px}
.c-carta__marco{position:relative;border:3px solid var(--tinta);border-radius:8px;overflow:hidden;display:grid;grid-template-columns:1fr;background:var(--papel-2)}
.c-carta__folio{position:absolute;top:8px;left:8px;z-index:2;font-family:var(--letra-cabeza);font-size:1.35rem;color:var(--tinta);background:var(--papel);border:2px solid var(--tinta);border-radius:6px;padding:0 9px;line-height:1.5}
.c-carta__nombre{display:block;text-align:center;font-family:var(--letra-cabeza);font-size:1.25rem;letter-spacing:.06em;text-transform:uppercase;border-top:3px solid var(--tinta);background:var(--papel);padding:4px 10px}
.c-carta__cuerpo{padding:24px 8px 6px}
@media (min-width:720px){
  .c-carta{padding:16px}
  .c-carta__cuerpo{padding:32px 38px 14px}
}
@media (min-width:880px){
  .c-carta:has(> .c-carta__marco){display:grid;grid-template-columns:200px minmax(0,1fr);gap:0 6px;align-items:start}
  .c-carta:has(> .c-carta__marco) .c-carta__marco{position:sticky;top:18px}
  .c-carta:has(> .c-carta__marco) .c-estampa{height:244px}
  .c-carta:has(> .c-carta__marco) .c-carta__nombre{font-size:1.02rem;letter-spacing:.04em;padding:8px 6px}
  .c-carta:has(> .c-carta__marco) .c-carta__cuerpo{padding:18px 26px 8px 34px}
}

/* estampas: ilustraciones en CSS */
.c-estampa{height:150px;position:relative;overflow:hidden;background:var(--cielo)}
.c-estampa::before,.c-estampa::after{content:"";position:absolute}
@media (min-width:720px){.c-estampa{height:170px}}

.c-estampa--bandera{background:linear-gradient(90deg,var(--verde-hondo) 0 33.3%,#f7f2e4 33.3% 66.6%,var(--rojo) 66.6%)}
.c-estampa--bandera::before{width:70px;height:70px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,var(--mostaza) 0 40%,#7a4b14 41% 48%,transparent 49%)}

.c-estampa--timbre{background:repeating-linear-gradient(45deg,#e9d7b0 0 14px,#e2cda1 14px 28px)}
.c-estampa--timbre::before{width:118px;height:118px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-12deg);border-radius:50%;border:6px double var(--rojo-hondo);background:radial-gradient(circle,transparent 0 44%,var(--rojo-hondo) 45% 47%,transparent 48%)}
.c-estampa--timbre::after{width:56px;height:10px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-12deg);background:var(--rojo-hondo);box-shadow:0 -16px 0 -2px var(--rojo-hondo),0 16px 0 -2px var(--rojo-hondo)}

.c-estampa--regalo{background:radial-gradient(circle at 20% 30%,#f7d27b 0 6px,transparent 7px),radial-gradient(circle at 80% 60%,#f7d27b 0 5px,transparent 6px),var(--rosa)}
.c-estampa--regalo::before{width:110px;height:86px;left:50%;bottom:18px;transform:translateX(-50%);background:linear-gradient(90deg,transparent 44%,var(--mostaza) 44% 56%,transparent 56%),var(--verde);border:3px solid var(--tinta);border-radius:4px}
.c-estampa--regalo::after{width:40px;height:40px;left:calc(50% - 20px);bottom:98px;border:7px solid var(--mostaza);border-radius:50% 50% 0 50%;transform:rotate(45deg)}

.c-estampa--pelota{background:linear-gradient(180deg,#78b84a 0 50%,#5f9c38 50%);background-size:100% 34px}
.c-estampa--pelota::before{width:104px;height:104px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;border:3px solid var(--tinta);background:
  radial-gradient(circle at 50% 50%,var(--tinta) 0 15px,transparent 16px),
  radial-gradient(circle at 18% 30%,var(--tinta) 0 9px,transparent 10px),
  radial-gradient(circle at 82% 30%,var(--tinta) 0 9px,transparent 10px),
  radial-gradient(circle at 30% 86%,var(--tinta) 0 9px,transparent 10px),
  radial-gradient(circle at 70% 86%,var(--tinta) 0 9px,transparent 10px),#fff}
.c-estampa--pelota::after{width:60%;height:4px;left:20%;bottom:16px;background:rgba(255,255,255,.7)}

.c-estampa--diamante{background:radial-gradient(circle at 50% 120%,#6b2fa0,#2a1446 70%)}
.c-estampa--diamante::before{width:84px;height:84px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(45deg);background:linear-gradient(135deg,#d6f6ff 0 30%,#7fd3ef 30% 55%,#3aa7d6 55%);border:3px solid var(--tinta)}
.c-estampa--diamante::after{width:6px;height:6px;left:30%;top:28%;border-radius:50%;background:#fff;box-shadow:160px 20px 0 #fff,40px 90px 0 #ffe9a8,190px 96px 0 #fff}

.c-estampa--celular{background:linear-gradient(160deg,var(--mostaza),#d4831c)}
.c-estampa--celular::before{width:70px;height:124px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-8deg);border-radius:14px;border:4px solid var(--tinta);background:linear-gradient(180deg,var(--verde) 0 22%,#f5ecd6 22% 80%,var(--tinta) 80%)}
.c-estampa--celular::after{width:22px;height:4px;left:50%;top:calc(50% - 50px);transform:translateX(-50%) rotate(-8deg);border-radius:4px;background:var(--tinta)}

.c-estampa--alcancia{background:linear-gradient(180deg,#9fd3c1,#64b39a)}
.c-estampa--alcancia::before{width:70px;height:18px;left:calc(50% - 35px);bottom:22px;border-radius:50%;background:var(--mostaza);border:3px solid var(--tinta);box-shadow:0 -14px 0 -3px var(--mostaza),0 -14px 0 0 var(--tinta),0 -28px 0 -3px var(--mostaza),0 -28px 0 0 var(--tinta),0 -42px 0 -3px var(--mostaza),0 -42px 0 0 var(--tinta)}
.c-estampa--alcancia::after{width:44px;height:44px;left:calc(50% + 34px);top:24px;border-radius:50%;background:radial-gradient(circle,#f4c64f 0 50%,var(--tinta) 52% 58%,#f4c64f 60%);border:3px solid var(--tinta)}

.c-estampa--lupa{background:repeating-linear-gradient(0deg,#f2e6c9 0 18px,#e8d9b5 18px 19px)}
.c-estampa--lupa::before{width:84px;height:84px;left:calc(50% - 52px);top:24px;border-radius:50%;border:8px solid var(--tinta);background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.9) 0 10px,rgba(160,210,235,.55) 11px)}
.c-estampa--lupa::after{width:16px;height:60px;left:calc(50% + 22px);top:92px;border-radius:6px;background:var(--rojo-hondo);transform:rotate(-45deg);border:3px solid var(--tinta)}

.c-estampa--reloj{background:conic-gradient(from 0deg,#e9b6c9,#f1d1a0,#e9b6c9)}
.c-estampa--reloj::before{width:106px;height:106px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;border:5px solid var(--tinta);background:
  linear-gradient(var(--tinta),var(--tinta)) 50% 22%/4px 34% no-repeat,
  linear-gradient(var(--rojo),var(--rojo)) 66% 50%/30% 4px no-repeat,#fffaf0}
.c-estampa--reloj::after{width:12px;height:12px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:var(--tinta)}

.c-estampa--corazon{background:#f3c9c0}
.c-estampa--corazon::before{width:70px;height:70px;left:50%;top:50%;transform:translate(-50%,-38%) rotate(45deg);background:var(--rojo);border:3px solid var(--tinta);border-top:0;border-left:0}
.c-estampa--corazon::after{width:74px;height:46px;left:calc(50% - 37px);top:calc(50% - 46px);background:radial-gradient(circle at 25% 100%,var(--rojo) 0 24px,transparent 25px),radial-gradient(circle at 75% 100%,var(--rojo) 0 24px,transparent 25px)}

.c-estampa--estrella{background:radial-gradient(circle at 50% 50%,#2c3f8f,#141c45)}
.c-estampa--estrella::before{width:110px;height:110px;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--mostaza);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.c-estampa--estrella::after{width:4px;height:4px;left:16%;top:22%;border-radius:50%;background:#fff;box-shadow:40px 70px 0 #fff,250px 10px 0 #fff,300px 90px 0 #cfe0ff,-20px 100px 0 #fff}

.c-estampa--luna{background:#1b2b4a}
.c-estampa--luna::before{width:96px;height:96px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;box-shadow:22px -6px 0 0 #f4e7b5}
.c-estampa--luna::after{width:3px;height:3px;left:22%;top:30%;border-radius:50%;background:#fff;box-shadow:30px 60px 0 #fff,220px -10px 0 #fff,260px 70px 0 #fff}

.c-estampa--campana{background:linear-gradient(180deg,#b9dff0,#88c4dd)}
.c-estampa--campana::before{width:92px;height:96px;left:50%;top:22px;transform:translateX(-50%);background:var(--mostaza);border:3px solid var(--tinta);border-radius:46px 46px 10px 10px}
.c-estampa--campana::after{width:22px;height:22px;left:calc(50% - 11px);top:112px;border-radius:50%;background:var(--tinta)}

.c-estampa--maceta{background:#f2d7a6}
.c-estampa--maceta::before{width:90px;height:62px;left:calc(50% - 45px);bottom:14px;background:#c4612f;border:3px solid var(--tinta);clip-path:polygon(0 0,100% 0,85% 100%,15% 100%)}
.c-estampa--maceta::after{width:12px;height:70px;left:calc(50% - 6px);top:16px;background:var(--verde-hondo);border-radius:6px;box-shadow:-26px 18px 0 -2px var(--verde),26px 10px 0 -2px var(--verde)}


.c-estampa--escalera{background:linear-gradient(180deg,#f4b860,#e58a3a)}
.c-estampa--escalera::before{width:86px;height:150%;left:50%;top:-25%;transform:translateX(-50%) rotate(14deg);border-left:7px solid #5a3317;border-right:7px solid #5a3317;background:repeating-linear-gradient(180deg,transparent 0 20px,#5a3317 20px 27px)}
.c-estampa--escalera::after{width:30px;height:30px;right:14%;top:18px;border-radius:50%;background:#fff3c4;box-shadow:0 0 0 8px rgba(255,243,196,.35)}

.c-estampa--paraguas{background:linear-gradient(180deg,#9bb7d6,#6d8fb5)}
.c-estampa--paraguas::before{width:140px;height:70px;left:50%;top:26px;transform:translateX(-50%);border-radius:70px 70px 0 0;background:repeating-conic-gradient(from -90deg at 50% 100%,var(--rojo) 0 30deg,#f7f2e4 30deg 60deg);border:3px solid var(--tinta)}
.c-estampa--paraguas::after{width:16px;height:62px;left:calc(50% - 13px);top:96px;border-right:5px solid var(--tinta);border-bottom:5px solid var(--tinta);border-left:5px solid transparent;border-radius:0 0 12px 12px;clip-path:inset(0 0 0 50%)}

/* tablilla: tablero de cartas como indice */
.c-tablilla{background:var(--papel);border-radius:var(--radio);box-shadow:0 0 0 2px var(--tinta),0 14px 30px rgba(0,0,0,.35);padding:18px}
.c-tablilla__encabezado{font-family:var(--letra-cabeza);font-size:1.3rem;margin:0 0 4px}
.c-tablilla__pista{font-size:.88rem;color:var(--tinta-suave);margin:0 0 12px}
.c-tablilla__rejilla{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.c-tablilla__rejilla li{margin:0}
.c-tablilla__casilla{display:flex;flex-direction:column;justify-content:space-between;min-height:84px;padding:6px;border:2px solid var(--tinta);border-radius:6px;background:var(--papel-2);color:var(--tinta);text-decoration:none;font-size:.74rem;line-height:1.15}
.c-tablilla__casilla b{font-family:var(--letra-cabeza);font-weight:400;font-size:1.05rem;color:var(--rojo-hondo)}
.c-tablilla__casilla:hover{background:#fff6dc;color:var(--tinta)}
@media (min-width:1080px){
  .c-tablilla--lateral{position:sticky;top:20px}
  .c-tablilla--lateral .c-tablilla__rejilla{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:420px){.c-tablilla__rejilla{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* apertura */
.c-apertura__placa{background:#151412;border-radius:10px;padding:14px 18px;margin:0 0 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.c-apertura__placa img{width:210px;height:auto}
.c-apertura__placa span{color:#cfc4ab;font-size:.82rem;letter-spacing:.05em}
.c-apertura__lead{font-size:1.15rem;font-weight:400}
.c-fecha{font-size:.88rem;color:var(--tinta-suave);margin:-.3em 0 1.1em}
.c-fecha time{font-weight:600;color:var(--tinta)}

/* cuadros de datos */
.c-tabloncillo{margin:0 0 1.3em;overflow-x:auto;-webkit-overflow-scrolling:touch;border:2px solid var(--tinta);border-radius:8px;background:#fffaf0}
.c-tabloncillo table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:460px}
.c-tabloncillo th,.c-tabloncillo td{text-align:left;padding:9px 12px;border-bottom:1px solid #dccfae;vertical-align:top}
.c-tabloncillo th{background:var(--tinta);color:var(--papel);font-weight:600;font-size:.88rem;letter-spacing:.03em}
.c-tabloncillo tr:last-child td{border-bottom:0}
.c-tabloncillo--angosto table{min-width:0}
@media (max-width:480px){
  .c-tabloncillo table{min-width:0;font-size:.88rem}
  .c-tabloncillo th,.c-tabloncillo td{padding:8px 7px;overflow-wrap:anywhere}
}
.c-fuente{font-size:.84rem;color:var(--tinta-suave);margin:-.7em 0 1.4em;padding-left:12px;border-left:3px solid var(--mostaza)}

/* apuntes y advertencias */
.c-apunte{background:#fffaf0;border:2px dashed var(--tinta-suave);border-radius:8px;padding:14px 16px;margin:0 0 1.2em}
.c-apunte p:last-child{margin-bottom:0}
.c-advertencia{background:var(--tinta);color:var(--papel);border-radius:10px;padding:16px 18px;margin:0 0 1.2em;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
.c-advertencia p{margin:0 0 .5em}
.c-advertencia p:last-child{margin:0}
.c-advertencia a{color:#8fe3c3}
.c-advertencia__edad{font-family:var(--letra-cabeza);font-size:1.5rem;background:var(--rojo);color:#fff;border-radius:6px;padding:2px 10px;line-height:1.4}

/* dudas */
.c-dudas{margin:0 0 1em}
.c-dudas__pregunta{border:2px solid var(--tinta);border-radius:8px;background:#fffaf0;margin-bottom:10px}
.c-dudas__pregunta summary{cursor:pointer;padding:12px 44px 12px 14px;font-weight:600;position:relative;list-style:none}
.c-dudas__pregunta summary::-webkit-details-marker{display:none}
.c-dudas__pregunta summary::after{content:"+";position:absolute;right:14px;top:50%;transform:translateY(-50%);font-family:var(--letra-cabeza);font-size:1.4rem;color:var(--rojo-hondo)}
.c-dudas__pregunta[open] summary::after{content:"–"}
.c-dudas__respuesta{padding:0 14px 12px}
.c-dudas__respuesta p:last-child{margin:0}

/* tirada: secuencia numerada */
.c-tirada{counter-reset:tiro;list-style:none;padding:0}
.c-tirada li{counter-increment:tiro;position:relative;padding-left:48px;margin-bottom:12px;min-height:34px}
.c-tirada li::before{content:counter(tiro);position:absolute;left:0;top:0;width:34px;height:34px;border-radius:50%;background:var(--verde-hondo);color:#fff;font-family:var(--letra-cabeza);display:grid;place-items:center;font-size:1.05rem}

/* remate */
.c-remate{background:#151412;color:#d7ccb3;padding:44px 0 30px;border-top:4px solid var(--rojo);font-size:.95rem}
.c-remate a{color:#9fe6c8}
.c-remate__rejilla{display:grid;grid-template-columns:minmax(0,1fr);gap:26px}
@media (min-width:860px){.c-remate__rejilla{grid-template-columns:1.3fr 1fr 1fr}}
.c-remate__letrero{font-family:var(--letra-cabeza);color:var(--papel);font-size:1.25rem;margin:0 0 8px}
.c-remate__renglones{list-style:none;padding:0;margin:0}
.c-remate__renglones li{margin-bottom:6px}
.c-remate__cola{margin-top:28px;padding-top:16px;border-top:1px solid #34302a;font-size:.84rem;color:#a99f88}

/* error */
.c-error{min-height:60vh;display:grid;place-items:center;padding:40px 0}
.c-error__naipe{max-width:460px;margin:0 auto}
.c-carta.c-error__naipe{display:block}
.c-error__naipe .c-carta__marco{position:relative;top:auto}
.c-error__naipe .c-estampa{height:170px}
.c-error__naipe .c-carta__cuerpo{padding:26px 24px 10px}

/* utilidades */
.u-oculto{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.u-centrado{text-align:center}
.u-sin-margen{margin-bottom:0}