It varies. Unless you're designing for print, it's always wise to check your designs on the actual screens people will be using. This means iOS device screens with default settings (e.g. night shift). While I was primarily doing non-mobile screen designs, I used to do it on a mid-range Dell monitor (factory calibration), purely because I wanted to have the visual experience of a regular user who might not have a $1500 monitor. Night shift should not mess with contrasts objectively, subjectively it might impact certain perceptions, but it's usually something which users don't notice until they turn it off at night, which doesn't happen often.

Basically, you can design with True Tone or Night Shift turned off, but make sure to check it with the settings turned on (or on any other screen it might show up). This goes for low contrast designs, particularly for very nuanced pastel gradients and such.

I can see that your rant is fairly focused on the visual aspects of the changes, we have yet to hear the reasoning behind the decisions, so I can't really assume to know all the research involved in the changes.

That said, note that the search result tabs/filters change depending on what you've searched. So now, when you look for, say, flights, the flights tab will be available for filtering, and with an airplane icon, it's immediately obvious to any user that they can click on that and view flights, whereas before they would have had to read the tab. This alone gives merit to icons.

I do, however, agree that the icons for images/videos/maps/news all have the same basic shape and on that size are not super easily identifiable from one another. The news icon seems the most lazy, and the maps icon slightly baffles me in terms of level of detail on such a small scale.

What I do know is that Google is not a vanity design culture, and the changes were definitely informed and rolled out as a result of testing.

It has responsiveness for the variety of Desktop VS Desktop HD viewports, but not for tablet/mobile. I assume they detect and deliver device-centric versions of the UI to the devices themselves, thus avoiding the overhead of maintaining a bunch of awkward breakpoint transitions which are always limiting when doing a responsive design.

You absolutely can – here's a Sketch file to see how it's done: https://www.dropbox.com/s/8umvsz4lsk1wcw3/Speech%20Bubble%20Symbol.sketch?dl=0

(I've also dropped in a small bubble triangle to show you how you can fix things in place)

Ah. That explains it. I was wondering what was going on, but attributed it to messing up something along the way.

IE support is sketchy, up to 11. Of course, you can choose to ignore that, considering thats not a significant part of the market nowadays.

If you're avoiding flexbox for whatever reason, one option is to create a dot (e.g. border-bottom or top) div and then put it behind the title/price. Set relative position accordingly to center the dots. Layer things with z-index. Put background color on the title/price div to match the background color of choice.

It's a hack, and it won't really work if you have variable background colors or a background image behind it, but it's the best method unless you're using flex.