:root {
      --bg: #0b0b0b;
      --fg: #89acba;
      --muted: #89acba;
      --link: #c9b39f;
      --accent: #b39ac9;
      --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    }
    html, body { background: var(--bg); color: var(--fg); margin: 0; }
    body { font-family: var(--mono); }
    .wrap {
      max-width: 700px;
      padding: 48px 24px 64px;
      margin: 0 auto;
    }
    h1 { font-size: 1.8rem; color: var(--accent); margin: 0 0 8px; font-weight: bold; }
    h2 { font-size: 1.1rem; color: var(--fg); margin: 36px 0 12px; font-weight: bold; }
    p { color: var(--muted); line-height: 1.6; margin-top: 0; }
    a { color: var(--link); text-decoration: none; border-bottom: 1px solid var(--muted); transition: all 0.2s; }
    a:hover { color: var(--accent); border-bottom-color: var(--accent); }
    ul { list-style: none; padding-left: 0; margin-top: 0; }
    li { margin: 8px 0; color: var(--muted); }
    li::before { content: "» "; color: var(--accent); }
    code { background: #1a1a1a; padding: 2px 4px; border: 1px solid #333; }

    .note {
      font-size: 0.9rem;
      color: #7a6a60;
      margin-top: 4px;
    }
    .footer {
      font-size: 0.85rem;
      color: #444;
      margin-top: 64px;
      border-top: 1px solid #222;
      padding-top: 16px;
    }
    .blinkies {
      margin-top: 16px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .blinkies img {
      width: 88px;
      height: 31px;
      image-rendering: pixelated;
      border: 1px solid #222;
    }
    .badges {
      margin-top: 12px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      font-size: 0.8rem;
    }
    .badges span {
      background: #111;
      border: 1px solid #333;
      padding: 2px 6px;
      color: var(--muted);
    }
    .md-render h1 { font-size: 1.6rem; color: var(--accent); margin: 24px 0 12px; }
.md-render h2 { font-size: 1.3rem; color: var(--accent); margin: 24px 0 12px; }
.md-render h3 { font-size: 1.1rem; color: var(--fg); margin: 20px 0 8px; }
.md-render p { margin-bottom: 16px; }
.md-render ul { list-style: initial; padding-left: 20px; margin-bottom: 16px; }
.md-render ul li::before { content: none; }
.md-render ul li { color: var(--muted); margin: 4px 0; }
.md-render ol { padding-left: 20px; margin-bottom: 16px; }
.md-render ol li { color: var(--muted); margin: 4px 0; }
.md-render pre { background: #111; border: 1px solid #222; padding: 12px; overflow-x: auto; margin-bottom: 16px; }
.md-render pre code { background: transparent; border: none; padding: 0; }
.md-render blockquote { border-left: 3px solid var(--accent); margin: 0 0 16px 0; padding-left: 16px; color: #7a6a60; }
.md-render img { max-width: 100%; height: auto; border: 1px solid #222; }