/* ─────────────────────────────────────────────────────────────
   "Objects at the Command Line" — Rouge syntax theme
   Makes Jekyll's Smalltalk code blocks match the series cards.

   USAGE (Jekyll):
     1. Ensure _config.yml has:   markdown: kramdown
                                  highlighter: rouge
     2. Drop this file into assets/css/ and @import or link it.
     3. Write fenced blocks as:   ```smalltalk
     4. Do NOT also load a rouge theme via `rougify style` — this replaces it.

   Token classes below are the ones Rouge ACTUALLY emits for GNU Smalltalk
   (verified by lexing our real after.st, not guessed).
   ───────────────────────────────────────────────────────────── */

/* container — matches the card panels */
div.highlight,
div.highlighter-rouge {
  background: #0d1117;
  border: 1px solid #21262d;
  border-radius: 12px;
  overflow-x: auto;
  margin: 1.6rem 0;
}

div.highlighter-rouge div.highlight {
  margin: 0;
  border: none;
  background: none;
  border-radius: 0;
}

.highlight pre,
.highlight code {
  background: none;
  border: 0;
  font-family: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas,
               "Liberation Mono", monospace;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #e6edf3;
}

.highlight pre {
  margin: 0;
  padding: 1.15rem 1.35rem;
}

/* ── tokens ───────────────────────────────────────────────── */
.highlight .c  { color: #6e7681; font-style: italic; }  /* "comments"          */
.highlight .s  { color: #7ee787; }                      /* 'strings'           */
.highlight .m  { color: #f0a868; }                      /* 3  5  15            */
.highlight .nf { color: #4aa3ff; }                      /* on:  say:  select:  */
.highlight .nc { color: #e6edf3; font-weight: 600; }    /* Object  Rule        */
.highlight .nb { color: #79c0ff; }                      /* Transcript          */
.highlight .bp { color: #d2a8ff; }                      /* self super true nil */
.highlight .nv { color: #e6edf3; }                      /* n  divisor  word    */
.highlight .o  { color: #e6edf3; }                      /* ^  :=  =  \\        */
.highlight .p  { color: #8b949e; }                      /* [ ] { } . ;         */

/* `inline code` inside prose */
code.highlighter-rouge,
p > code {
  background: rgba(74, 163, 255, 0.10);
  border: 1px solid rgba(74, 163, 255, 0.22);
  border-radius: 6px;
  padding: 0.1em 0.4em;
  font-size: 0.9em;
  color: #4aa3ff;
}

/* If your site is light-themed and you'd rather the code block follow it,
   delete the .highlight background/border above and set `color: #1f2328`
   plus darker token colors — the .nf blue is the one to keep. */
