/* The small pictures of the daily games (decorative, aria-hidden: their numbers scale with the picture, the one
   exception to the 1rem floor for text nobody needs to read) (site/_parts/thumbs/), used on the sales page, the Diário list and the side
   of every game: the Zigue's path with its numbers, the Sudoku's grid, the Eclipse's sun and moon. */
.path-in { position: relative; display: block; container-type: inline-size; }
.path-in svg { display: block; width: 100%; height: auto; aspect-ratio: 1; background: #fbe7cc; border-radius: 8%; }
.path-in path { fill: none; stroke: var(--orange); stroke-width: .42; stroke-linecap: round; stroke-linejoin: round; }
.path-in b { position: absolute; transform: translate(-50%, -50%); width: 20%; aspect-ratio: 1; border-radius: 50%; background: var(--ink); color: #fff;
  display: grid; place-items: center; font: 900 13cqw var(--title); }   /* a picture: the numbers scale with it */
.sud { display: grid; aspect-ratio: 1; container-type: inline-size; grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(6, 1fr); background: #fffaf0; border: 3px solid var(--ink); padding: 0; border-radius: 6%; overflow: hidden; }
.sud i { display: grid; place-items: center; font: 800 11cqw var(--title); font-style: normal; color: var(--ink); border-right: 1px solid #d8cdb8; border-bottom: 1px solid #d8cdb8; }
.sud i:nth-child(3n) { border-right: 2px solid var(--ink); }
.sud i:nth-child(6n) { border-right: 0; }
.sud i:nth-child(n+7):nth-child(-n+12), .sud i:nth-child(n+19):nth-child(-n+24) { border-bottom: 2px solid var(--ink); }
.mini-pair { display: flex; align-items: center; justify-content: center; gap: 4%; }
.mini-pair img { width: 48%; }
.mini-words { display: grid; grid-template-columns: repeat(3, 1fr); aspect-ratio: 1; gap: 6%; container-type: inline-size; }
.mini-words i { display: grid; place-items: center; border-radius: 22%; font: 900 22cqw var(--title); font-style: normal; color: #fff; }
.mini-words .w1 { background: #8e55d0; }
.mini-words .w2 { background: #e2501d; }
.mini-words .w3 { background: #2f8f45; }
.mini-hive { display: flex; align-items: center; justify-content: center; gap: 4%; aspect-ratio: 1; container-type: inline-size; }
.mini-hive i { display: grid; place-items: center; width: 31%; aspect-ratio: 1 / .866; clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); background: #e3d6f8; font: 900 18cqw var(--title); font-style: normal; color: var(--ink); }
.mini-hive i.mid { background: var(--yellow); }
.mini-word { display: flex; align-items: center; justify-content: center; gap: 5%; aspect-ratio: 1; container-type: inline-size; }
.mini-word i { display: grid; place-items: center; width: 30%; aspect-ratio: 1; border-radius: 16%; background: #7d7488; font: 900 19cqw var(--title); font-style: normal; color: #fff; }
.mini-word i.g { background: #2f8f45; }
.mini-word i.y { background: #f2c230; color: var(--ink); }
.mini-bars { display: flex; flex-direction: column; justify-content: center; aspect-ratio: 1; container-type: inline-size; }
.mini-bars i { display: block; height: 18cqw; margin: 5cqw 6cqw; border-radius: 99px; }
.mini-bars i.g { width: 88cqw; background: #2f8f45; }
.mini-bars i.y { width: 60cqw; background: #f2c230; }
.mini-bars i.r { width: 32cqw; background: #e2501d; }