/* Code highlighting: GitHub light / GitHub dark (generated with `hugo gen chromastyles`),
   scoped to the theme's light and dark modes. The theme keeps its own block background. */
body:not(.dark) .bg { background-color:#f7f7f7; }
body:not(.dark) .chroma { background-color:#f7f7f7;-webkit-text-size-adjust:none; }
body:not(.dark) .chroma .err { color:#f6f8fa;background-color:#82071e }
body:not(.dark) .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
body:not(.dark) .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
body:not(.dark) .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
body:not(.dark) .chroma .hl { background-color:#dedede }
body:not(.dark) .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f }
body:not(.dark) .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#7f7f7f }
body:not(.dark) .chroma .line { display:flex; }
body:not(.dark) .chroma .k { color:#cf222e }
body:not(.dark) .chroma .kc { color:#cf222e }
body:not(.dark) .chroma .kd { color:#cf222e }
body:not(.dark) .chroma .kn { color:#cf222e }
body:not(.dark) .chroma .kp { color:#cf222e }
body:not(.dark) .chroma .kr { color:#cf222e }
body:not(.dark) .chroma .kt { color:#cf222e }
body:not(.dark) .chroma .na { color:#1f2328 }
body:not(.dark) .chroma .nc { color:#1f2328 }
body:not(.dark) .chroma .no { color:#0550ae }
body:not(.dark) .chroma .nd { color:#0550ae }
body:not(.dark) .chroma .ni { color:#6639ba }
body:not(.dark) .chroma .nl { color:#900;font-weight:bold }
body:not(.dark) .chroma .nn { color:#24292e }
body:not(.dark) .chroma .nx { color:#1f2328 }
body:not(.dark) .chroma .nt { color:#0550ae }
body:not(.dark) .chroma .nb { color:#6639ba }
body:not(.dark) .chroma .bp { color:#6a737d }
body:not(.dark) .chroma .nv { color:#953800 }
body:not(.dark) .chroma .vc { color:#953800 }
body:not(.dark) .chroma .vg { color:#953800 }
body:not(.dark) .chroma .vi { color:#953800 }
body:not(.dark) .chroma .vm { color:#953800 }
body:not(.dark) .chroma .nf { color:#6639ba }
body:not(.dark) .chroma .fm { color:#6639ba }
body:not(.dark) .chroma .s { color:#0a3069 }
body:not(.dark) .chroma .sa { color:#0a3069 }
body:not(.dark) .chroma .sb { color:#0a3069 }
body:not(.dark) .chroma .sc { color:#0a3069 }
body:not(.dark) .chroma .dl { color:#0a3069 }
body:not(.dark) .chroma .sd { color:#0a3069 }
body:not(.dark) .chroma .s2 { color:#0a3069 }
body:not(.dark) .chroma .se { color:#0a3069 }
body:not(.dark) .chroma .sh { color:#0a3069 }
body:not(.dark) .chroma .si { color:#0a3069 }
body:not(.dark) .chroma .sx { color:#0a3069 }
body:not(.dark) .chroma .sr { color:#0a3069 }
body:not(.dark) .chroma .s1 { color:#0a3069 }
body:not(.dark) .chroma .ss { color:#032f62 }
body:not(.dark) .chroma .m { color:#0550ae }
body:not(.dark) .chroma .mb { color:#0550ae }
body:not(.dark) .chroma .mf { color:#0550ae }
body:not(.dark) .chroma .mh { color:#0550ae }
body:not(.dark) .chroma .mi { color:#0550ae }
body:not(.dark) .chroma .il { color:#0550ae }
body:not(.dark) .chroma .mo { color:#0550ae }
body:not(.dark) .chroma .o { color:#0550ae }
body:not(.dark) .chroma .ow { color:#0550ae }
body:not(.dark) .chroma .or { color:#0550ae }
body:not(.dark) .chroma .p { color:#1f2328 }
body:not(.dark) .chroma .c { color:#57606a }
body:not(.dark) .chroma .ch { color:#57606a }
body:not(.dark) .chroma .cm { color:#57606a }
body:not(.dark) .chroma .c1 { color:#57606a }
body:not(.dark) .chroma .cs { color:#57606a }
body:not(.dark) .chroma .cp { color:#57606a }
body:not(.dark) .chroma .cpf { color:#57606a }
body:not(.dark) .chroma .gd { color:#82071e;background-color:#ffebe9 }
body:not(.dark) .chroma .ge { color:#1f2328 }
body:not(.dark) .chroma .gi { color:#116329;background-color:#dafbe1 }
body:not(.dark) .chroma .go { color:#1f2328 }
body:not(.dark) .chroma .gl { text-decoration:underline }
body:not(.dark) .chroma .w { color:#fff }
body.dark .bg { color:#e6edf3;background-color:#0d1117; }
body.dark .chroma { color:#e6edf3;background-color:#0d1117;-webkit-text-size-adjust:none; }
body.dark .chroma .err { color:#f85149 }
body.dark .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
body.dark .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
body.dark .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
body.dark .chroma .hl { background-color:#6e7681 }
body.dark .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#737679 }
body.dark .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#6e7681 }
body.dark .chroma .line { display:flex; }
body.dark .chroma .k { color:#ff7b72 }
body.dark .chroma .kc { color:#79c0ff }
body.dark .chroma .kd { color:#ff7b72 }
body.dark .chroma .kn { color:#ff7b72 }
body.dark .chroma .kp { color:#79c0ff }
body.dark .chroma .kr { color:#ff7b72 }
body.dark .chroma .kt { color:#ff7b72 }
body.dark .chroma .nc { color:#f0883e;font-weight:bold }
body.dark .chroma .no { color:#79c0ff;font-weight:bold }
body.dark .chroma .nd { color:#d2a8ff;font-weight:bold }
body.dark .chroma .ni { color:#ffa657 }
body.dark .chroma .ne { color:#f0883e;font-weight:bold }
body.dark .chroma .nl { color:#79c0ff;font-weight:bold }
body.dark .chroma .nn { color:#ff7b72 }
body.dark .chroma .nx { color:#e6edf3 }
body.dark .chroma .py { color:#79c0ff }
body.dark .chroma .nt { color:#7ee787 }
body.dark .chroma .nv { color:#79c0ff }
body.dark .chroma .vc { color:#79c0ff }
body.dark .chroma .vg { color:#79c0ff }
body.dark .chroma .vi { color:#79c0ff }
body.dark .chroma .vm { color:#79c0ff }
body.dark .chroma .nf { color:#d2a8ff;font-weight:bold }
body.dark .chroma .fm { color:#d2a8ff;font-weight:bold }
body.dark .chroma .l { color:#a5d6ff }
body.dark .chroma .ld { color:#79c0ff }
body.dark .chroma .s { color:#a5d6ff }
body.dark .chroma .sa { color:#79c0ff }
body.dark .chroma .sb { color:#a5d6ff }
body.dark .chroma .sc { color:#a5d6ff }
body.dark .chroma .dl { color:#79c0ff }
body.dark .chroma .sd { color:#a5d6ff }
body.dark .chroma .s2 { color:#a5d6ff }
body.dark .chroma .se { color:#79c0ff }
body.dark .chroma .sh { color:#79c0ff }
body.dark .chroma .si { color:#a5d6ff }
body.dark .chroma .sx { color:#a5d6ff }
body.dark .chroma .sr { color:#79c0ff }
body.dark .chroma .s1 { color:#a5d6ff }
body.dark .chroma .ss { color:#a5d6ff }
body.dark .chroma .m { color:#a5d6ff }
body.dark .chroma .mb { color:#a5d6ff }
body.dark .chroma .mf { color:#a5d6ff }
body.dark .chroma .mh { color:#a5d6ff }
body.dark .chroma .mi { color:#a5d6ff }
body.dark .chroma .il { color:#a5d6ff }
body.dark .chroma .mo { color:#a5d6ff }
body.dark .chroma .o { color:#ff7b72;font-weight:bold }
body.dark .chroma .ow { color:#ff7b72;font-weight:bold }
body.dark .chroma .or { color:#ff7b72;font-weight:bold }
body.dark .chroma .c { color:#8b949e;font-style:italic }
body.dark .chroma .ch { color:#8b949e;font-style:italic }
body.dark .chroma .cm { color:#8b949e;font-style:italic }
body.dark .chroma .c1 { color:#8b949e;font-style:italic }
body.dark .chroma .cs { color:#8b949e;font-weight:bold;font-style:italic }
body.dark .chroma .cp { color:#8b949e;font-weight:bold;font-style:italic }
body.dark .chroma .cpf { color:#8b949e;font-weight:bold;font-style:italic }
body.dark .chroma .gd { color:#ffa198;background-color:#490202 }
body.dark .chroma .ge { font-style:italic }
body.dark .chroma .gr { color:#ffa198 }
body.dark .chroma .gh { color:#79c0ff;font-weight:bold }
body.dark .chroma .gi { color:#56d364;background-color:#0f5323 }
body.dark .chroma .go { color:#8b949e }
body.dark .chroma .gp { color:#8b949e }
body.dark .chroma .gs { font-weight:bold }
body.dark .chroma .gu { color:#79c0ff }
body.dark .chroma .gt { color:#ff7b72 }
body.dark .chroma .gl { text-decoration:underline }
body.dark .chroma .w { color:#6e7681 }

/* Readable code blocks on small screens: scroll sideways instead of cutting, less padding */
#single .page-content pre { overflow-x: auto; -webkit-overflow-scrolling: touch; }
#single .page-content pre code { white-space: pre; }
@media (max-width: 576px) {
  #single .page-content pre { padding: 1em; margin: 0 0 1.5em 0; font-size: 0.8rem; }
}
/* Tables: Markdown tables come wrapped by layouts/_default/_markup/render-table.html.
   A plain grid: a rule around every cell, striped rows, sans-serif text, bold header.
   The table fits the column width (long words hyphenate); sideways scroll is only a fallback. */
#single .page-content .table-wrap {
  --tb-rule: #d5dbe3; --tb-row: #ffffff; --tb-stripe: #eef1f5;
  margin: 1.75rem 0; overflow-x: auto; -webkit-overflow-scrolling: touch;
}
body.dark #single .page-content .table-wrap { --tb-rule: #2a3a5c; --tb-row: #111a2e; --tb-stripe: #0b1220; }
body.dark #single .page-content .table-wrap th { color: #e2e8f0 !important; }
#single .page-content .table-wrap table {
  display: table; width: 100%; max-width: none; margin: 0; padding: 0;
  border-collapse: collapse; border-radius: 0; opacity: 1;
  font: 400 0.9em/1.5 system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
#single .page-content .table-wrap th,
#single .page-content .table-wrap td {
  padding: 0.65rem 0.8rem !important; border: 1px solid var(--tb-rule); opacity: 1;
  text-align: left; overflow-wrap: break-word;
}
#single .page-content .table-wrap th {
  background-color: var(--tb-row) !important; color: #1e293b !important;
  font-weight: 700 !important; vertical-align: bottom;
}
#single .page-content .table-wrap td { background-color: var(--tb-row) !important; vertical-align: top; }
#single .page-content .table-wrap tbody tr:nth-child(even) td { background-color: var(--tb-stripe) !important; }
@media (max-width: 576px) {
  #single .page-content .table-wrap table { font-size: 0.75em; }
  #single .page-content .table-wrap th,
  #single .page-content .table-wrap td {
    /* a floor width per column keeps short words whole; only long words hyphenate */
    padding: 0.4rem 0.35rem !important; min-width: 4.5em; hyphens: auto; -webkit-hyphens: auto;
    hyphenate-limit-chars: 10 4 4; -webkit-hyphenate-limit-before: 4; -webkit-hyphenate-limit-after: 4;
  }
  /* long code values (URNs, parameter names) may break anywhere; plain words keep the rules above */
  #single .page-content .table-wrap td code,
  #single .page-content .table-wrap th code { overflow-wrap: anywhere; }
}


/* Diagrams: inline SVG from the "diagram" shortcode. The SVG files carry light-theme colours
   as attributes (so they also work as plain images); these classes override them per theme. */
figure.diagram { margin: 2rem 0; }
figure.diagram .diagram-scroll { overflow-x: auto; }
figure.diagram svg { display: block; width: 100%; min-width: 460px; max-width: 600px; height: auto; margin: 0 auto; color: #1e293b; }
figure.diagram figcaption { margin-top: 0.6rem; text-align: center; font-size: 0.9rem; color: #64748b; }
.dg-card { fill: #ffffff; stroke: #e2e8f0; }
.dg-box { fill: #f8fafc; stroke: #94a3b8; }
.dg-agent, .dg-focus { fill: #eff6ff; stroke: #1d4ed8; }
.dg-note { fill: #f1f5f9; stroke: #e2e8f0; }
.dg-num { fill: #ffffff; stroke: #64748b; }
.dg-rule { stroke: #e2e8f0; }
.dg-muted { fill: #64748b; }
.dg-on-accent { fill: #ffffff; }
.dg-line { stroke: #64748b; }
.dg-line-fill { fill: #64748b; }
.dg-l1 { stroke: #1d4ed8; }
.dg-l1-fill { fill: #1d4ed8; }
.dg-l2 { stroke: #b45309; }
.dg-l2-fill { fill: #b45309; }
body.dark figure.diagram svg { color: #e2e8f0; }
body.dark figure.diagram figcaption { color: #94a3b8; }
body.dark .dg-card { fill: #111a2e; stroke: #22304d; }
body.dark .dg-box { fill: #0b1220; stroke: #475569; }
body.dark .dg-agent, body.dark .dg-focus { fill: #172554; stroke: #60a5fa; }
body.dark .dg-note { fill: #0b1220; stroke: #22304d; }
body.dark .dg-num { fill: #111a2e; stroke: #94a3b8; }
body.dark .dg-rule { stroke: #22304d; }
body.dark .dg-muted { fill: #94a3b8; }
body.dark .dg-on-accent { fill: #0b1220; }
body.dark .dg-line { stroke: #94a3b8; }
body.dark .dg-line-fill { fill: #94a3b8; }
body.dark .dg-l1 { stroke: #60a5fa; }
body.dark .dg-l1-fill { fill: #60a5fa; }
body.dark .dg-l2 { stroke: #fbbf24; }
body.dark .dg-l2-fill { fill: #fbbf24; }

/* Narrow version of a diagram ("mobile" param of the shortcode), shown instead of the wide one on phones */
figure.diagram .diagram-mobile { display: none; }
figure.diagram .diagram-mobile svg { min-width: 0; max-width: 420px; }
@media (max-width: 576px) {
  figure.diagram.has-mobile .diagram-scroll { display: none; }
  figure.diagram.has-mobile .diagram-mobile { display: block; }
}

/* Links in posts: the theme makes them inline-block (for its hover underline), so a long link cannot
   wrap and jumps to its own line (a bullet left alone above it, a ")" left alone after it).
   Keep links inline and draw the same hover underline with a background instead. */
#single .page-content a {
  display: inline;
  background-image: linear-gradient(var(--primary-color), var(--primary-color));
  background-size: 0 2px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
}
#single .page-content a:hover, #single .page-content a:focus, #single .page-content a:active { background-size: 100% 2px; }
#single .page-content a::after { display: none; }

/* Lists: the theme puts bullets and numbers inside the text box, so a wrapped line starts under the
   bullet. Outside markers keep every line of an item aligned with its text. */
#single .page-content ol, #single .page-content ul { list-style-position: outside; padding-left: 1.6em; }

/* Code blocks: the theme inherits the body line height (1.7), too loose for code */
#single .page-content pre { line-height: 1.5; }

/* Table of contents: taller box on desktop; on smaller screens the sidebar sits after the article, so hide it */
@media (min-width: 992px) {
  #single aside.toc { max-height: 75vh; overflow-y: auto; overflow-x: hidden; }
}
@media (max-width: 991.98px) {
  #single aside.toc { display: none; }
}