/* Minimal placeholder stylesheet. Real styling comes later. */
:root {
  --fg: #222;
  --bg: #fafafa;
  --accent: #0b61a4;
  --muted: #666;
  --border: #e0e0e0;
}
* { box-sizing: border-box; }
html { font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif; }
body {
  color: var(--fg);
  background: var(--bg);
  margin: 0;
}
main, .site-header, .site-footer {
  max-width: 48rem;
  margin: 0 auto;
  padding: 1rem 1.25rem;
}
.site-header {
  border-bottom: 1px solid var(--border);
  font-weight: 600;
}
.site-header a { color: var(--accent); text-decoration: none; }
.site-footer {
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 0.875rem;
  margin-top: 3rem;
}
h1 { line-height: 1.2; }
a { color: var(--accent); }
code {
  background: #eee;
  padding: 0.1em 0.3em;
  border-radius: 3px;
  font-size: 0.9em;
}
pre {
  background: #eee;
  padding: 1rem;
  border-radius: 4px;
  overflow-x: auto;
}
pre code { background: transparent; padding: 0; }
.post > header time {
  color: var(--muted);
  font-size: 0.875rem;
}
img, svg { max-width: 100%; height: auto; }

/* ---- Asciidoctor admonition + callout icon mappings --------------------
   Asciidoctor's :icons: font mode emits <i class="fa icon-note"> etc. The
   class prefix 'icon-' is NOT part of vanilla Font Awesome — asciidoctor's
   own stylesheet provides these mappings. We reproduce the minimum subset
   here so admonitions and callouts render with icons on the deployed site.
   Unicode codepoints are Font Awesome 4 glyphs. */
.admonitionblock td.icon [class^="icon-"] {
  font-family: "FontAwesome";
  font-style: normal;
  font-weight: normal;
  font-size: 1.25em;  /* roughly matches the rendered height of a callout conum */
  cursor: default;
}
.admonitionblock td.icon .icon-note::before      { content: "\f05a"; color: #19407c; }
.admonitionblock td.icon .icon-tip::before       { content: "\f0eb"; color: #111; text-shadow: 1px 1px 2px rgba(155,155,0,.8); }
.admonitionblock td.icon .icon-warning::before   { content: "\f071"; color: #bf6900; }
.admonitionblock td.icon .icon-caution::before   { content: "\f06d"; color: #bf3400; }
.admonitionblock td.icon .icon-important::before { content: "\f06a"; color: #bf0000; }

/* Conum (callout numbers) — filled circles with the number inside. */
.conum[data-value] {
  display: inline-block;
  color: #fff !important;
  background: rgba(0,0,0,.8);
  border-radius: 100px;
  text-align: center;
  font-size: .75em;
  width: 1.67em;
  height: 1.67em;
  line-height: 1.67em;
  font-family: "Open Sans","DejaVu Sans",sans-serif;
  font-style: normal;
  font-weight: bold;
}
.conum[data-value]::after { content: attr(data-value); }
.conum[data-value] + b    { display: none; }    /* hide the fallback (N) text */

/* Colist (callout list) — align the conum marker with the first line of a
   multi-line explanation, not centered across the whole item. */
.colist > table > tbody > tr > td,
.colist > table > tr > td {
  vertical-align: top;
  padding-top: 0.2em;   /* nudge the conum down slightly so it sits on the first line */
}
.colist > table > tbody > tr > td:last-child,
.colist > table > tr > td:last-child {
  padding-top: 0;       /* explanation text keeps its natural top alignment */
}