/* Blocks in a post (blocks.js): the same markup in the streaming reader's columns (.flow .blk-item) and in the page
   view (.post-body). Colours come from the theme tokens, so every look and both modes work. */
:root{--ch1:#2a78d6;--ch2:#eb6834;--ch3:#1baf7a;--ch4:#eda100;--ch5:#e87ba4;--ch6:#4a3aa7}
[data-mode=dark]{--ch1:#3987e5;--ch2:#d95926;--ch3:#199e70;--ch4:#c98500;--ch5:#d55181;--ch6:#9085e9}

/* inline marks on streamed words */
.mk-b{font-weight:650}
.mk-i{font-style:italic}
.mk-code{font-family:var(--mono,ui-monospace,monospace);font-size:.88em}
.mk-a{color:var(--ui-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
.mk-fn{font-size:.62em;vertical-align:super;line-height:0;margin-left:.08em;font-family:var(--sans)}

/* a block in the reader: one item, kept whole on its page, never taller than the page */
.flow .blk-item{display:block;white-space:normal;text-align:left;hyphens:manual;-webkit-hyphens:manual;font-variant-numeric:normal;break-inside:avoid;page-break-inside:avoid;max-height:calc(var(--ph,100vh) - 6px);overflow:hidden;margin:0 0 1em;width:100%}
.flow .blk-item > *{margin-top:.2em}
.flow .blk-item img{max-height:calc(var(--ph,100vh) - 4.5em)}
.flow .blk-item .em-box[style*="--r:0.56"]{width:min(100%,calc((var(--ph,100vh) - 4.5em) * var(--r)));margin-inline:auto}
.flow .blk-item .em-box[style*="--h:"]{height:min(var(--h),calc(var(--ph,100vh) - 4.5em))!important}
.flow .blk-item .blk-table{overflow:hidden}

/* shared block styles */
.blk-divider{border:0;height:1px;background:var(--ui-line-2);margin:2em auto;width:40%}
.blk-scene{text-align:center;letter-spacing:.6em;color:var(--ui-ink-3);margin:1.6em 0}
.blk-quote{margin:1.2em 0;padding:.1em 0 .1em 1.1em;border-left:3px solid var(--ui-line-2);color:var(--ui-ink-2);font-style:italic}
.blk-quote p{margin:.4em 0;text-indent:0}
.blk-pull{margin:1.4em 0;padding:.6em 0;border-top:2px solid var(--ui-accent);border-bottom:1px solid var(--ui-line-2)}
.blk-pull blockquote{margin:0;font-size:1.32em;line-height:1.35;font-weight:500;letter-spacing:-.01em;color:var(--ui-ink);text-align:left}
.blk-callout{margin:1.2em 0;padding:.8em 1em;border-radius:10px;background:var(--ui-surface-2);border:1px solid var(--ui-line);border-left:4px solid var(--ui-accent);font-size:.94em}
.blk-callout .co-title{font-family:var(--sans);font-weight:650;font-size:.82em;letter-spacing:.06em;text-transform:uppercase;color:var(--ui-accent);margin-bottom:.3em}
.blk-callout[data-kind=warning],.blk-callout[data-kind=caution]{border-left-color:#c2410c}.blk-callout[data-kind=warning] .co-title,.blk-callout[data-kind=caution] .co-title{color:#c2410c}
.blk-callout[data-kind=tip],.blk-callout[data-kind=success]{border-left-color:#15803d}.blk-callout[data-kind=tip] .co-title,.blk-callout[data-kind=success] .co-title{color:#15803d}
[data-mode=dark] .blk-callout[data-kind=warning] .co-title,[data-mode=dark] .blk-callout[data-kind=caution] .co-title{color:#fb923c}
[data-mode=dark] .blk-callout[data-kind=tip] .co-title,[data-mode=dark] .blk-callout[data-kind=success] .co-title{color:#4ade80}
.blk-callout p{margin:.35em 0;text-indent:0}
.blk-list{margin:.8em 0;padding-left:1.4em}
.blk-list li{margin:.25em 0;text-indent:0}
.blk-list li.task{list-style:none;margin-left:-1.3em}
.blk-code{margin:1em 0;padding:.9em 1em;border-radius:10px;background:var(--ui-surface-2);border:1px solid var(--ui-line);overflow:auto;font-family:var(--mono,ui-monospace,monospace);font-size:.78em;line-height:1.55;white-space:pre;tab-size:2}
.flow .blk-code{white-space:pre-wrap;word-break:break-word}
.blk-table{margin:1em 0;overflow-x:auto;font-family:var(--sans);font-size:.8em}
.blk-table table{border-collapse:collapse;width:100%}
.blk-table th,.blk-table td{padding:.45em .7em;border-bottom:1px solid var(--ui-line);text-align:left;vertical-align:top}
.blk-table th{font-weight:650;border-bottom-color:var(--ui-line-2)}
.blk-image,.blk-gallery,.blk-embed,.blk-stock,.blk-chartwrap{margin:1.2em 0}
.blk-image img{display:block;max-width:100%;height:auto;margin:0 auto;border-radius:8px}
figcaption,.blk-gallery small{display:block;font-family:var(--sans);font-size:.74em;line-height:1.45;color:var(--ui-ink-3);margin-top:.55em;text-align:center}
.blk-gallery .gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.blk-gallery[data-n="3"] .gal{grid-template-columns:repeat(3,minmax(0,1fr))}
.blk-gallery .gi img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px}
.flow .blk-gallery .gi img{max-height:calc((var(--ph,100vh) - 5em) / 2)}
.em-box,.sk-box{position:relative;width:100%;border-radius:10px;overflow:hidden;background:var(--ui-surface-2);border:1px solid var(--ui-line)}
.em-box iframe,.sk-box iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.blk-embed[data-provider=tiktok] .em-box,.blk-embed[data-provider=youtube] .em-box[style*="--r:0.56"]{max-width:340px;margin-inline:auto}
.blk-embed[data-provider=instagram] .em-box,.blk-embed[data-provider=x] .em-box{max-width:540px;margin-inline:auto}
.sk-box{height:220px}
.em-wait{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--sans);font-size:.8em;color:var(--ui-ink-3)}
.em-link,.sk-attr{display:block;font-family:var(--sans);font-size:.72em;color:var(--ui-ink-3);margin-top:.45em;text-align:center}
.em-link:hover,.sk-attr a{color:var(--ui-accent)}
.blk-button{margin:1.4em 0;text-align:center;text-indent:0}
.btn-cta{display:inline-block;font-family:var(--sans);font-size:.85em;font-weight:600;padding:.75em 1.4em;border-radius:999px;background:var(--ui-accent);color:var(--ui-on-accent,#fff)!important;text-decoration:none!important}
.blk-toc{margin:1.2em 0;padding:.8em 1em;border:1px solid var(--ui-line);border-radius:10px;font-family:var(--sans);font-size:.85em}
.blk-toc .toc-title{font-weight:650;font-size:.8em;letter-spacing:.08em;text-transform:uppercase;color:var(--ui-ink-3);margin-bottom:.4em}
.blk-toc ol{margin:0;padding-left:1.2em}.blk-toc li{margin:.2em 0}.blk-toc li.l3{margin-left:1em;list-style:circle}
.blk-toc a{color:var(--ui-ink);text-decoration:none}.blk-toc a:hover{color:var(--ui-accent)}
.blk-footnotes{margin-top:2em;padding-top:.8em;border-top:1px solid var(--ui-line);font-size:.8em;color:var(--ui-ink-2)}
.blk-footnotes ol{padding-left:1.3em;margin:0}.blk-footnotes li{margin:.3em 0}
.fnref{font-size:.7em;line-height:0}.fnref a,.fnback{color:var(--ui-accent);text-decoration:none}
.blk-error{font-family:var(--sans);font-size:.8em;color:var(--ui-ink-3);border:1px dashed var(--ui-line-2);border-radius:8px;padding:.6em .8em}

/* charts: inline SVG, drawn when reached */
.blk-chart{margin:0;font-family:var(--sans)}
.blk-chart .ch-title{font-weight:650;font-size:.82em;margin-bottom:.4em;color:var(--ui-ink)}
.blk-chart svg{display:block;width:100%;height:auto;overflow:visible}
.flow .blk-chart svg{max-height:calc(var(--ph,100vh) - 6em)}
.ch-grid{stroke:var(--ui-line);stroke-width:1}.ch-grid.zero{stroke:var(--ui-line-2)}
.ch-tick{fill:var(--ui-ink-3);font-size:12px;font-family:var(--sans)}
.ch-line{fill:none;stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.ch-area{opacity:.16}
.ch-dot{stroke:var(--ui-bg,#fff);stroke-width:2}
.ch-bar,.ch-slice{transform-box:fill-box}
.ch-bar{transform-origin:50% 100%}
.ch-slice{stroke:var(--ui-bg,#fff);stroke-width:2;transform-origin:center}
.c1{fill:var(--ch1);stroke:var(--ch1)}.c2{fill:var(--ch2);stroke:var(--ch2)}.c3{fill:var(--ch3);stroke:var(--ch3)}.c4{fill:var(--ch4);stroke:var(--ch4)}.c5{fill:var(--ch5);stroke:var(--ch5)}.c6{fill:var(--ch6);stroke:var(--ch6)}
.ch-line.c1,.ch-line.c2,.ch-line.c3,.ch-line.c4,.ch-line.c5,.ch-line.c6{fill:none}
.ch-area{stroke:none}.ch-bar,.ch-slice.c1,.ch-slice.c2,.ch-slice.c3,.ch-slice.c4,.ch-slice.c5,.ch-slice.c6{stroke:var(--ui-bg,#fff)}
.ch-bar{stroke:none}
.ch-legend{display:flex;flex-wrap:wrap;gap:.4em 1em;justify-content:center;font-size:.72em;color:var(--ui-ink-2);margin-top:.5em}
.ch-legend i{display:inline-block;width:.75em;height:.75em;border-radius:3px;margin-right:.35em;vertical-align:-.05em;background:currentColor}
.ch-legend i.c1{background:var(--ch1)}.ch-legend i.c2{background:var(--ch2)}.ch-legend i.c3{background:var(--ch3)}.ch-legend i.c4{background:var(--ch4)}.ch-legend i.c5{background:var(--ch5)}.ch-legend i.c6{background:var(--ch6)}
.ch-table{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@keyframes ch-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes ch-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes ch-pop{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes ch-fade{from{opacity:0}to{opacity:1}}
.blk-item.on .ch-line,.blk-chart.drawn .ch-line{animation:ch-draw 1.2s cubic-bezier(.4,.1,.2,1) both}
.blk-item.on .ch-area,.blk-chart.drawn .ch-area{animation:ch-fade .6s .7s both}
.blk-item.on .ch-dot,.blk-chart.drawn .ch-dot{animation:ch-fade .3s 1s both}
.blk-item.on .ch-bar,.blk-chart.drawn .ch-bar{animation:ch-grow .7s calc(var(--i) * 60ms) cubic-bezier(.3,.7,.2,1) both}
.blk-item.on .ch-slice,.blk-chart.drawn .ch-slice{animation:ch-pop .5s calc(var(--i) * 120ms) cubic-bezier(.3,.7,.2,1) both}
.blk-chart.pre .ch-line{stroke-dashoffset:1}.blk-chart.pre .ch-bar{transform:scaleY(0)}.blk-chart.pre .ch-slice,.blk-chart.pre .ch-dot,.blk-chart.pre .ch-area{opacity:0}
[data-effects=off] .blk-item .ch-line,[data-effects=off] .blk-item .ch-bar,[data-effects=off] .blk-item .ch-slice,[data-effects=off] .blk-item .ch-dot,[data-effects=off] .blk-item .ch-area{animation:none!important}
@media (prefers-reduced-motion:reduce){.blk-item .ch-line,.blk-item .ch-bar,.blk-item .ch-slice,.blk-item .ch-dot,.blk-item .ch-area,.blk-chart .ch-line,.blk-chart .ch-bar{animation:none!important}}