/* Skin: "sketchbook" — graph-paper, hand-drawn, black ink on white. */
.skin-sketchbook { background: #e9e9e4; }
.skin-sketchbook .viewport {
  background: #fffef9;
  background-image: linear-gradient(#dCE4f0 1px, transparent 1px), linear-gradient(90deg, #dCE4f0 1px, transparent 1px);
  background-size: 22px 22px;
}
.skin-sketchbook .site { max-width: 800px; margin: 0 auto; font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif; color: #1a1a1a; }
.skin-sketchbook .masthead { text-align: center; padding: 34px 20px 18px; background: none; }
.skin-sketchbook .brand { margin: 0; display: inline-block; font: 700 44px "Caveat", "Bradley Hand", "Segoe Script", cursive; color: #111; border-bottom: 3px solid #111; padding-bottom: 4px; }
.skin-sketchbook .tag { margin: 14px 0 0; color: #555; font-size: 17px; }
.skin-sketchbook .content { padding: 24px 34px 30px; }
.skin-sketchbook .content p { font-size: 16.5px; line-height: 1.75; color: #222; margin: 0 0 1em; }
.skin-sketchbook .content h2 { font: 700 22px "Caveat", cursive; color: #111; margin: 1.3em 0 .3em; }
.skin-sketchbook .content a, .skin-sketchbook .period-links a { color: #111; text-decoration: underline; text-decoration-style: wavy; }
.skin-sketchbook .period-links { font-size: 16px; margin: 0 0 16px; }
.skin-sketchbook .inline img, .skin-sketchbook .tile img { max-width: 100%; height: auto; display: block; border: 2px solid #111; background: #fff; }
.skin-sketchbook .inline figcaption, .skin-sketchbook .tile figcaption { font: 15px "Caveat", cursive; color: #444; margin-top: 4px; text-align: center; }
.skin-sketchbook .period-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 16px; margin-top: 20px; }
.skin-sketchbook .tile { margin: 0; }
.skin-sketchbook .period-foot { background: none; border-top: 2px dashed #999; color: #555; font-size: 14px; padding: 16px 34px; text-align: center; }