Add 90s web whimsy: clipart decorations across all pages

- Add img/ folder with 224 transparent PNG clipart illustrations
- Add CSS classes for clipart placement (.clipart, .clipart-left,
  .clipart-right, .clipart-section, .clipart-divider, .clipart-wide,
  .clipart-inline) with hover rotation effect and responsive rules
- Decorate all 7 content pages + index + about with themed clipart:
  section headers, floating side images, wide section dividers,
  fact-box icons, and home page card icons
- Add AGENTS.md with project conventions and constraints

css/style.css

@@ -567,6 +567,97 @@ p {
   .toc {
     columns: 1;
   }
+  
+  .clipart-left, .clipart-right {
+    float: none;
+    margin: 8px auto;
+    max-width: 80px;
+  }
+  
+  .clipart-section {
+    max-width: 100px;
+  }
+  
+  .clipart-wide {
+    max-width: 120px;
+  }
+}
+
+/* --- Clipart Decorations --- */
+.clipart {
+  display: block;
+  margin: 0 auto;
+  max-width: 120px;
+  opacity: 0.85;
+  image-rendering: auto;
+  transition: opacity 0.3s, transform 0.3s;
+}
+
+.clipart-left {
+  float: left;
+  margin: 6px 20px 10px 0;
+  max-width: 100px;
+  opacity: 0.85;
+  image-rendering: auto;
+  filter: drop-shadow(1px 2px 3px rgba(0,0,0,0.15));
+  transition: opacity 0.3s, transform 0.3s;
+}
+
+.clipart-right {
+  float: right;
+  margin: 6px 0 10px 20px;
+  max-width: 100px;
+  opacity: 0.85;
+  image-rendering: auto;
+  filter: drop-shadow(1px 2px 3px rgba(0,0,0,0.15));
+  transition: opacity 0.3s, transform 0.3s;
+}
+
+.clipart-inline {
+  display: inline;
+  vertical-align: baseline;
+  max-height: 1.4em;
+  margin: 0 0.15em;
+  image-rendering: auto;
+}
+
+.clipart-section {
+  display: block;
+  margin: 30px auto 0;
+  max-width: 140px;
+  opacity: 0.8;
+  image-rendering: auto;
+  filter: drop-shadow(1px 2px 3px rgba(0,0,0,0.15));
+  transition: opacity 0.3s, transform 0.3s;
+}
+
+.clipart-divider {
+  display: block;
+  margin: 10px auto;
+  max-width: 100px;
+  opacity: 0.6;
+  image-rendering: auto;
+  transition: opacity 0.3s, transform 0.3s;
+}
+
+.clipart-wide {
+  display: block;
+  margin: 10px auto;
+  max-width: 180px;
+  opacity: 0.8;
+  image-rendering: auto;
+  filter: drop-shadow(1px 2px 3px rgba(0,0,0,0.15));
+  transition: opacity 0.3s, transform 0.3s;
+}
+
+.clipart-left:hover,
+.clipart-right:hover,
+.clipart:hover,
+.clipart-section:hover,
+.clipart-divider:hover,
+.clipart-wide:hover {
+  opacity: 1;
+  transform: rotate(-3deg);
 }
 
 /* --- Utility --- */