/* Shared styles for the archived p5.js sketch pages (/1 … /15). */
:root {
  --paper: #ece7dd;
  --ink: #1b1a18;
  --dim: #7a746a;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
@media (prefers-color-scheme: dark) {
  :root { --paper: #101318; --ink: #dcd6ca; --dim: #7d7a74; }
}
body {
  margin: 0;
  padding: 24px max(20px, env(safe-area-inset-left)) 48px;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--serif);
  text-align: center;
}
header, nav {
  display: flex; justify-content: space-between; gap: 1rem;
  max-width: 900px; margin: 0 auto;
  font: 12.5px/1.6 var(--mono);
}
header a, nav a { color: var(--dim); text-decoration: none; }
header a:hover, nav a:hover { color: var(--ink); }
.no { color: var(--dim); }
h1 { font-weight: 400; font-size: clamp(1.5rem, 4vw, 2.2rem); margin: 2rem 0 1.5rem; }
#canvasHolder { display: flex; justify-content: center; overflow-x: auto; }
#canvasHolder canvas { max-width: 100%; height: auto !important; }
nav { margin-top: 2rem; }