body, td, th, input, select, textarea {
  font-family: Verdana, Tahoma, Arial, sans-serif;
  font-size: 14px;
  color: #222222;
}
body {
  background-color: #dde8cc;
  background-image:
    repeating-linear-gradient(0deg, rgba(0,0,0,0.018) 0, rgba(0,0,0,0.018) 1px, transparent 1px, transparent 20px),
    repeating-linear-gradient(90deg, rgba(0,0,0,0.012) 0, rgba(0,0,0,0.012) 1px, transparent 1px, transparent 20px);
  margin: 0;
  padding: 6px 0 20px;
}

.aero-clouds {
  position: fixed;
  inset: 0;
  z-index: 2;
  overflow: hidden;
  pointer-events: none;
}

.cloud {
  position: absolute;
  left: -28vw;
  display: block;
  width: 140px;
  height: 42px;
  background: rgba(255,255,255,0.48);
  border-radius: 999px;
  box-shadow: 0 4px 8px rgba(70,90,60,0.10);
  will-change: transform;
  animation-name: cloud-drift;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

.cloud::before,
.cloud::after {
  content: "";
  position: absolute;
  display: block;
  background: inherit;
  border-radius: 50%;
}

.cloud::before {
  width: 54px;
  height: 54px;
  left: 22px;
  top: -24px;
}

.cloud::after {
  width: 68px;
  height: 48px;
  right: 17px;
  top: -16px;
}

.cloud-a {
  top: 8%;
  width: 150px;
  height: 46px;
  animation-duration: 120s;
  animation-delay: -18s;
}

.cloud-b {
  top: 24%;
  width: 118px;
  height: 36px;
  opacity: 0.45;
  animation-duration: 150s;
  animation-delay: -92s;
}

.cloud-c {
  top: 43%;
  width: 175px;
  height: 52px;
  opacity: 0.38;
  animation-duration: 105s;
  animation-delay: -64s;
}

.cloud-d {
  top: 67%;
  width: 130px;
  height: 40px;
  opacity: 0.46;
  animation-duration: 135s;
  animation-delay: -37s;
}

.topbar,
#wrap {
  position: relative;
  z-index: 4;
}
a { color: #336600; text-decoration: underline; }
a:hover { color: #006600; text-decoration: underline; }
a:visited { color: #663300; }
img { border: 0; }
p { margin: 0 0 6px; }

.topbar {
  display: block;
  background: #2a2a2a;
  color: #7fff00;
  font-family: Verdana, sans-serif;
  font-size: 12px;
  font-weight: bold;
  padding: 3px 0;
  letter-spacing: 1px;
  border-bottom: 2px solid #7fff00;
}

#wrap {
  width: min(1220px, 98%);
  background: #ffffff;
  border: 1px solid #aabb88;
  border-top: none;
  box-shadow: 2px 2px 8px rgba(0,0,0,0.25);
}

#hdr {
  background: linear-gradient(180deg,
    #f0f0f0 0%,
    #d8d8d8 12%,
    #b8b8c0 28%,
    #909098 45%,
    #b0b0b8 58%,
    #d8d8e0 72%,
    #f4f4f4 88%,
    #e8e8ee 100%
  );
  border-bottom: 3px solid #7fff00;
  border-top: 1px solid #ffffff;
}

#site-title {
  font-family: 'Times New Roman', Georgia, serif;
  font-size: 32px;
  font-weight: bold;
  letter-spacing: 2px;
  text-transform: uppercase;
  line-height: 1.1;
  color: #1a2000;
  text-shadow: 0 1px 0 rgba(255,255,255,0.6), 0 -1px 0 rgba(0,0,0,0.2);
}
#site-tagline {
  font-family: Verdana, sans-serif;
  font-size: 11px;
  color: #336600;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-top: 3px;
  font-weight: bold;
}

.flame-gif-cell {
  padding: 0 30px 0 10px;
  white-space: nowrap;
}

.banner-gif {
  display: block;
  width: auto;
  height: 84px;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,0.28));
}

#claude-credit {
  font-family: Verdana, sans-serif;
  font-size: 10px;
  color: #8a5030;
  letter-spacing: 0.5px;
  text-align: center;
  line-height: 1.3;
}

#nav-row {
  background: #1a1a1a;
  border-bottom: 1px solid #444;
  display: flex;
}
.ntab {
  display: block;
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  color: #cccccc;
  padding: 8px 20px;
  border-right: 1px solid #333;
  background: linear-gradient(180deg, #2a2a2a 0%, #181818 50%, #222 100%);
  white-space: nowrap;
}
.ntab:hover, .ntab-active {
  background: linear-gradient(180deg, #336600 0%, #224400 50%, #2a5500 100%);
  color: #ffffff;
  text-decoration: none;
}
.ntab:visited { color: #cccccc; }

#sub-bar {
  background: linear-gradient(180deg, #eef4e8 0%, #ddeacc 100%);
  border-bottom: 1px solid #bbcc99;
  border-top: 1px solid #ddee99;
  padding: 4px 10px;
  font-size: 11px;
  color: #446600;
  font-weight: bold;
  letter-spacing: 1px;
}

#col-l {
  background: #f4f4f0;
  border-right: 1px solid #cccc99;
  vertical-align: top;
}
#col-m {
  background: #ffffff;
  vertical-align: top;
}
#col-r {
  background: #f4f4f0;
  border-left: 1px solid #cccc99;
  vertical-align: top;
}

.sh {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 5px 9px;
  color: #ffffff;
  border-top: 1px solid transparent;
}
.sh-grn {
  background: linear-gradient(90deg, #4a8800 0%, #3a6a00 45%, #2a5000 100%);
  border-bottom: 1px solid #336600;
  border-top-color: #88cc44;
  text-shadow: 0 1px 0 rgba(0,0,0,0.4);
}
.sh-red {
  background: linear-gradient(90deg, #880000 0%, #660000 45%, #440000 100%);
  border-bottom: 1px solid #550000;
  border-top-color: #cc4444;
  text-shadow: 0 1px 0 rgba(0,0,0,0.4);
}
.sh-sil {
  background: linear-gradient(90deg, #606068 0%, #484850 45%, #383840 100%);
  border-bottom: 1px solid #333;
  border-top-color: #9090a0;
  text-shadow: 0 1px 0 rgba(0,0,0,0.5);
}

.sb {
  padding: 6px 9px;
  border-bottom: 1px solid #e0e0d0;
  background: #f8f8f4;
  font-size: 13px;
}

.nlist {
  list-style: none;
  margin: 0;
  padding: 0;
}
.nlist li {
  border-bottom: 1px dotted #ddd;
  padding: 2px 1px;
}
.nlist li a {
  font-size: 13px;
  color: #336600;
  text-decoration: none;
  display: block;
  padding: 1px 2px;
}
.nlist li a:hover {
  color: #003300;
  background: #eef6e0;
  text-decoration: none;
}
.nlist li a:visited { color: #663300; }

.tagpill {
  display: inline-block;
  background: #eef6dd;
  border: 1px solid #aaccaa;
  color: #336600;
  font-size: 11px;
  font-family: Verdana, sans-serif;
  padding: 2px 6px;
  text-decoration: none;
  white-space: nowrap;
  margin: 1px 0;
}
.tagpill:hover {
  background: #ccee99;
  border-color: #336600;
  color: #003300;
  text-decoration: none;
}
.tagpill:visited { color: #663300; }

.dothr {
  border: none;
  border-top: 1px dotted #ccc;
  margin: 5px 0;
}
hr { border: none; border-top: 1px solid #ddd; margin: 8px 0; }

.entry-blk {
  padding: 9px 14px 7px;
  background: #ffffff;
}
.entry-hd {
  margin-bottom: 3px;
}
.entry-title {
  font-size: 16px;
  font-weight: bold;
  font-family: 'Times New Roman', Georgia, serif;
}
.entry-title a { color: #1a2200; text-decoration: none; }
.entry-title a:hover { color: #336600; text-decoration: underline; }
.entry-title a:visited { color: #4a3300; }
.entry-dtstamp {
  font-family: 'Courier New', monospace;
  font-size: 11px;
  color: #aaa;
  margin-left: 8px;
}
.entry-tagrow { margin: 3px 0; }
.entry-body {
  font-size: 13px;
  color: #555;
  line-height: 1.7;
  margin: 5px 0 6px;
}
.entry-foot { }
.readmore {
  font-size: 12px;
  font-weight: bold;
  color: #448800;
  text-decoration: none;
}
.readmore:hover { color: #006600; text-decoration: underline; }
.entry-div {
  height: 1px;
  background: linear-gradient(90deg, #ffffff 0%, #ccdd99 25%, #aabb77 50%, #ccdd99 75%, #ffffff 100%);
}
.single-meta {
  font-size: 12px;
  color: #888;
  background: #f8f8f5;
  border-bottom: 1px dotted #ddd;
  padding: 5px 14px;
}

.prose { font-size: 15px; line-height: 1.8; color: #333; }
.prose h1, .prose h2, .prose h3, .prose h4 {
  font-family: 'Times New Roman', Georgia, serif;
  color: #1a2200;
  margin: 14px 0 5px;
}
.prose h1 { font-size: 24px; border-bottom: 1px solid #ccdd99; padding-bottom: 3px; }
.prose h2 {
  font-size: 18px;
  border-left: 3px solid #448800;
  padding-left: 6px;
  background: #f5fae8;
  color: #224400;
}
.prose h3 { font-size: 16px; color: #880000; }
.prose p { margin-bottom: 10px; }
.prose a { color: #336600; }
.prose a:hover { color: #003300; }
.prose a:visited { color: #663300; }
.prose blockquote {
  border-left: 3px solid #880000;
  padding: 5px 10px;
  margin: 10px 0;
  background: #fff8f8;
  color: #666;
  font-style: italic;
}
.prose code {
  font-family: 'Courier New', monospace;
  font-size: 13px;
  background: #f0f0e8;
  border: 1px solid #cccc99;
  color: #446600;
  padding: 0 3px;
}
.prose pre {
  background: #f4f4ee;
  border: 1px solid #cccc99;
  border-left: 3px solid #448800;
  padding: 10px;
  overflow-x: auto;
  margin: 10px 0;
  font-size: 13px;
}
.prose pre code { background: none; border: none; padding: 0; color: #336600; }
.prose ul, .prose ol { margin: 8px 0 8px 18px; color: #444; }
.prose ul { list-style: none; }
.prose ul li::before { content: '\00BB'; color: #448800; margin-right: 5px; }
.prose ol { list-style: decimal; }
.prose li { margin-bottom: 3px; }
.prose hr { border-top: 1px solid #ccc; }
.prose img { border: 1px solid #ccc; max-width: 100%; margin: 8px 0; }
.prose table { border-collapse: collapse; width: 100%; font-size: 13px; margin: 8px 0; }
.prose th {
  background: linear-gradient(90deg, #4a8800, #336600);
  color: #fff; font-size: 12px; text-transform: uppercase;
  padding: 5px 9px; border: 1px solid #336600; text-align: left;
}
.prose td { padding: 3px 7px; border: 1px solid #ddd; color: #555; }
.prose tr:nth-child(even) td { background: #f8f8f0; }

.btn2k {
  display: inline-block;
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-decoration: none;
  color: #ffffff;
  background: linear-gradient(180deg, #5a9900 0%, #336600 50%, #224400 100%);
  border-top: 1px solid #88cc44;
  border-left: 1px solid #66aa22;
  border-bottom: 1px solid #224400;
  border-right: 1px solid #224400;
  padding: 5px 13px 6px;
  box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}
.btn2k:hover {
  background: linear-gradient(180deg, #66aa00 0%, #448800 50%, #336600 100%);
  color: #ffffff;
  text-decoration: none;
}
.btn2k:visited { color: #ffffff; }

.pager-row {
  padding: 7px 10px;
  background: #f8f8f4;
  border-top: 1px solid #ddd;
  text-align: center;
}

#footer {
  background: linear-gradient(180deg, #e0e8d4 0%, #ccddaa 100%);
  border-top: 2px solid #aabb77;
  padding: 6px 10px;
}

.flower-svg { animation: spin 22s linear infinite; display: block; }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

@keyframes cloud-drift {
  from { transform: translateX(0); }
  to { transform: translateX(140vw); }
}

.mono { font-family: 'Courier New', monospace; }

@media screen and (min-width: 821px) {
  body {
    zoom: 1.5;
  }
}

@media screen and (max-width: 820px) {
  #wrap { width: 100%; }
  #col-l, #col-r { display: none; }
  .flame-gif-cell { display: none; }
}