/* Article typography and navigation are copied from River's text-to-SQL post. */
.post-wrap { max-width: var(--body); margin: 0 auto; }
.post-wrap .page-title { max-width: none; font-size: var(--text-h2); line-height: 1.1; color: var(--ink); margin-bottom: 28px; }
.post-wrap .page-title .page-subtitle { display: block; margin-top: 4px; font-weight: 400; font-size: 0.74em; line-height: 1.1; letter-spacing: 0; }
    .post-body > h3 { font-size:var(--text-title); font-weight:500; line-height:1.25; letter-spacing:-0.015em; color:var(--ink); margin:48px 0 24px; }
    .post-body > h4 { font-size:var(--text-h4); font-weight:500; line-height:1.3; letter-spacing:-0.01em; color:var(--ink); margin:36px 0 0; }
    .post-body > h4 + p.mission-copy { margin-top:10px; }
    .post-body h2 { font-size: var(--text-h3); font-weight: 500; line-height: 1.15; letter-spacing: -0.02em; color: var(--ink); text-align: left; margin: 64px 0 24px; }
    .post-body p.mission-copy { font-size: var(--text-prose); line-height: 1.65; color: #1a2340; margin: 24px 0; }
    .post-body ul.mission-list { margin: -12px 0 24px; padding-left: 0; }
    .post-body ul.mission-list li { color: #1a2340; font-size: var(--text-prose); line-height: 1.65; }
    .post-body ul.mission-list li + li { margin-top: 4px; }
    .article-sections { display:none; margin:0 0 28px; color:#61728c; font-size:14px; line-height:1.45; }
    .article-sections summary { cursor:pointer; font-size:12px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; }
    .article-sections ol { list-style:none; margin:12px 0 0; padding:0; border-left:1px solid #ccd5e2; }
    .article-sections li { margin:0; }
    .article-sections a { display:block; padding:8px 12px; margin-left:-1px; border-left:2px solid transparent; color:inherit; text-decoration:none; }
    .article-sections a:hover, .article-sections a[aria-current="location"] { color:#0e2f7e; border-left-color:#0e2f7e; }
    .article-sections a:focus-visible { outline:2px solid #7098c4; outline-offset:2px; }
    @media(min-width:1400px) {
      /* A column the height of the article, in the left margin; the list sticks inside it, so it ends with the article
         and never covers the footer, even in an over-scroll bounce. 50% - 650px of the centred article is the old
         window position, 650px left of centre. */
      .post-wrap { position:relative; }
      .article-sections { display:block; position:absolute; top:0; bottom:0; left:calc(50% - 650px); width:205px; margin:0; }
      .article-sections details { position:sticky; top:150px; max-height:calc(100vh - 180px); overflow-y:auto; }
      .article-sections summary { list-style:none; pointer-events:none; }
      .article-sections summary::-webkit-details-marker { display:none; }
    }

/* Code uses the site's existing mono family and light glass surface tokens. */
.post-code { margin: 28px 0 0; padding: 24px; border-radius: var(--glass-radius-small); background: var(--glass-on-light); box-shadow: var(--glass-on-light-edge); overflow: auto; max-width: 100%; font: 13px/1.8 var(--type-mono); color: var(--ink); tab-size: 4; }
.post-code:focus-visible { outline: 2px solid #7098c4; outline-offset: 3px; }
.post-code code { font: inherit; background: transparent; padding: 0; }
.post-body p code { font-family: var(--type-mono); font-size: .85em; overflow-wrap: anywhere; }
.post-body a { text-decoration: underline; text-underline-offset: 4px; }
.intro-summary strong { font-weight: 500; }
.post-references { margin: 0; padding-left: 22px; color: #1a2340; font-size: var(--text-body); line-height: 1.7; }
.post-references li + li { margin-top: 14px; }
@media (max-width: 640px) { .post-code { padding: 18px 14px; } }

.post-figure { margin: 32px 0; }
.post-figure img { display: block; width: 100%; height: auto; border-radius: 12px; }
.post-figure figcaption { margin-top: 14px; font-size: var(--text-small); line-height: 1.65; color: var(--ink-2); }
.loss-details { margin: 20px 0 0; padding-top: 14px; border-top: 1px solid #dce3e8; color: var(--ink-2); font-size: 13px; line-height: 1.65; }
.loss-details summary { cursor: pointer; color: var(--ink); font-weight: 500; }
.loss-details summary:focus-visible { outline: 2px solid #7098c4; outline-offset: 4px; }
.loss-details p { overflow-wrap: anywhere; }

.pipeline { border-top:1px solid #c4cfdf; border-bottom:1px solid #c4cfdf; padding:27px 0 26px; }
.pipeline ol { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; list-style:none; }
.pipeline li { min-width:0; position:relative; }
.pipeline li:not(:last-child)::after { content:'→'; position:absolute; top:39px; right:-18px; font-size:20px; color:#7e92b7; }
.pipeline svg { display:block; width:100%; max-width:150px; height:98px; margin:0 0 17px; color:var(--ink); }
.step-label { color:#61728c; font-size:11px; letter-spacing:.07em; text-transform:uppercase; }
.step-title { display:block; font-size:18px; font-weight:500; margin:5px 0 7px; }
.step-copy { display:block; color:#526785; font-size:14px; line-height:1.45; }
.formula { margin:26px 0; padding:21px 24px; background:#e3eaf4; border-left:2px solid #7098c4; }
.formula .code-label { display:block; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:#61728c; margin-bottom:12px; }
.formula pre { font:13px/1.8 var(--type-mono); white-space:pre-wrap; overflow-wrap:anywhere; color:#24334f; }
.formula pre code { font:inherit; }
code .syntax-keyword { color:#785098; }
code .syntax-function { color:#255e9b; }
code .syntax-module { color:#2d647d; }
code .syntax-string { color:#306e5b; }
code .syntax-number { color:#9a5b22; }
code .syntax-operator { color:#566983; }
.lowering-example { margin:28px 0 36px; padding:26px; background:#e3eaf4; border-radius:4px; }
.lowering-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px; align-items:start; }
.lowering-example .formula { margin:14px 0 18px; padding:15px 17px; background:#f2f5fa; }
.lowering-example .formula pre { font-size:12px; line-height:1.9; }
.lowering-label { display:block; font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:#526785; margin-bottom:14px; }
.lowering-example p.example-note { font-size:14px; line-height:1.55; color:#526785; margin:14px 0; }
.lowering-graph { display:block; width:100%; max-width:380px; height:auto; }
.tile-schedule { border-top:1px solid #bdcbdf; padding-top:22px; margin-top:24px; }
.schedule-pair { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.schedule-pair h3 { margin:0; font-size:17px; line-height:1.3; font-weight:500; }
.schedule-pair p { font-size:15px; line-height:1.55; color:#1a2340; margin:10px 0 0; }
.lowering-example .backward-note { border-left:2px solid #6da89f; padding-left:14px; margin-top:22px; }
.lowering-example figcaption { font-size:13px; }
.generated-program { margin-top:24px; border-top:1px solid #bdcbdf; border-bottom:1px solid #bdcbdf; scroll-margin-top:96px; }
.generated-program summary { cursor:pointer; padding:18px 0; font-size:17px; line-height:1.5; font-weight:500; }
.generated-program summary::marker { color:#7098c4; }
.program-kind { display:inline-block; margin-left:10px; color:#61728c; font-size:12px; font-weight:400; }
.program-body { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(180px,1fr); gap:24px; padding-bottom:18px; }
.lowering-example .program-body .formula { margin:0; }
.program-notes { padding-top:3px; }
.program-notes h3 { font-size:15px; font-weight:500; line-height:1.5; margin:0 0 8px; }
.program-notes p.example-note { margin:0 0 18px; }
.program-notes .scalar-expression { display:block; font:12px/1.6 var(--type-mono); color:#173d8a; margin:8px 0; }
@media(max-width:760px) {
  .program-body { grid-template-columns:1fr; gap:20px; }
  .program-kind { display:block; margin:3px 0 0 20px; }
}
@media(max-width:760px) {
  .lowering-example { padding:20px; }
  .lowering-pair, .schedule-pair { grid-template-columns:1fr; gap:24px; }
  .lowering-graph { margin:0 auto; }
  .lowering-example .formula { padding:14px; }
}

.pipeline ol { margin:0; padding:0; }
.pipeline-figure { margin:28px 0 36px; }
.pipeline-figure figcaption { font-size:14px; line-height:1.5; color:#61728c; margin-top:15px; }
.lowering-example .formula pre { margin:0; padding:0; }
.lowering-example h3 { letter-spacing:normal; }
@media(max-width:760px) {
  .pipeline ol { grid-template-columns:1fr 1fr; gap:30px 25px; }
  .pipeline li:nth-child(2)::after { content:none; }
  .pipeline svg { height:92px; }
}

.summary-notes h3 { font-size:17px; font-weight:500; line-height:1.4; margin:0 0 14px; }
.summary-notes p, .summary-notes dl { font-size:14px; line-height:1.6; color:#526785; margin:0 0 16px; }
.summary-notes dl { display:grid; grid-template-columns:28px minmax(0,1fr); gap:7px 10px; }
.summary-notes dt { font-weight:500; color:#173d8a; }
.summary-notes dd { margin:0; }
.summary-equation { font-size:14px; line-height:1.7; color:#173d8a; padding:12px 14px; background:#f2f5fa; border-radius:4px; margin:0 0 16px; }
.summary-notes p:last-child { margin-bottom:0; }

.score-centering-formula { margin:26px 0; color:#172339; }
.score-centering-formula .latex-display { overflow-x:auto; padding:8px 0; }
.score-centering-formula .katex-display { margin:0; }
.score-centering-formula .latex-display .katex { font-size:21px; }
.score-centering-formula .equation-narrow { display:none; }
.math-definitions { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:20px 36px; margin:18px 0 22px; }
.math-definitions .katex { font-size:18px; }
.score-centering-formula .formula-note { font-size:14px; line-height:1.75; color:#526785; margin:12px 0; }
.score-centering-formula .formula-note .katex { font-size:1.1em; }
#score-centering-code { margin:28px 0; padding:24px; border:0; background:transparent; color:var(--ink); }
#score-centering-code > summary { font:inherit; cursor:pointer; }
#score-centering-code > .post-code { margin:20px 0 0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
#score-centering-code > p { font-family:var(--type-sans); }
@media(max-width:640px) {
  #score-centering-code { padding:18px 14px; }
  .score-centering-formula .equation-wide { display:none; }
  .score-centering-formula .equation-narrow { display:block; }
  .score-centering-formula .latex-display .katex { font-size:17px; }
  .math-definitions { gap:16px; }
  .math-definitions .katex { font-size:17px; }
}
@media(max-width:360px) {
  .score-centering-formula .latex-display .katex { font-size:16px; }
}

.citation { margin-left:.15em; font-size:.65em; line-height:0; vertical-align:super; }
.post-references li[id] { scroll-margin-top:100px; }
