/* Mesa em miniatura usada nos anúncios da TI Soluções App */
.mini-mesa {
  --mm-mesa: #2c6f8c;
  --mm-marca: #f4b324;
  position: relative;
  width: 100%;
  aspect-ratio: 1.45;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.07) 0 2px, transparent 3px) 0 0 / 14px 14px,
    radial-gradient(ellipse at center, color-mix(in srgb, var(--mm-mesa) 78%, white), var(--mm-mesa) 75%);
  border: 4px solid color-mix(in srgb, var(--mm-mesa) 50%, black);
  box-shadow: inset 0 0 18px rgba(0,0,0,.35), 0 3px 0 rgba(0,0,0,.3);
}
.mm-pintura {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; transform: rotate(-6deg); padding: 0 12%; gap: 1px;
}
.mm-emoji { font-size: 1rem; line-height: 1; }
.mm-pintura b {
  font-family: inherit; font-weight: 900; text-transform: uppercase; line-height: 1;
  font-size: .62rem; letter-spacing: .02em; color: var(--mm-marca);
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}
.mm-pintura i { font-style: italic; font-weight: 700; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.7); }
.mm-mao { position: absolute; width: 26%; }
.mm-mao .mao { width: 100%; height: auto; display: block; }
.mm-mao-0 { left: -8%; top: 22%; transform: rotate(-70deg); }
.mm-mao-1 { right: -8%; top: 18%; transform: rotate(70deg); }
.mm-mao-2 { left: 37%; bottom: -26%; }

.mini-mesa.grande { border-width: 7px; }
.mini-mesa.grande .mm-emoji { font-size: 2.2rem; }
.mini-mesa.grande .mm-pintura b { font-size: clamp(1rem, 5vw, 1.6rem); }
.mini-mesa.grande .mm-pintura i { font-size: .85rem; margin-top: 2px; }
.mini-mesa.grande .mm-mao { width: 22%; }