Hey Craig,
Here's a screengrab from my end. Referencing the body tag in the upper left corner, its showing the break point accurately. I closed the window just to the point where you're second media query kicks in (768px) and this is the result I got. I'm using Chrome on a Mac.
I'm hesitant to use fixed width grid overlays for responsive designs since the layout is always changing based on window size. But that's just me. I definitely use a grid when designing Photoshop comps though.
I'm assuming the book you're referring to is Responsive Web Design (yellow cover) published by A Book Apart. Great read. All of the ones they publish are invaluable.
