/* blog: list and article pages */
.blog { padding-top: clamp(2rem, 6vw, 3.5rem); padding-bottom: clamp(3rem, 8vw, 5rem); }
.blog-head { max-width: 44rem; margin-bottom: 2rem; }
.blog-head .label { display: flex; align-items: center; gap: .5rem; color: var(--pulse-ink); }
.blog h1 { font-size: clamp(2.4rem, 7vw, 4rem); line-height: 1.02; letter-spacing: -.04em; margin: .5rem 0 .8rem; }
.blog .lead { font-size: clamp(1.1rem, 2.4vw, 1.3rem); color: #33332F; margin: 0 0 1rem; max-width: 38em; }
.post-list { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); max-width: 52rem; }
.post-list li { border-bottom: 1px solid var(--line); }
.post-list a { display: block; padding: 1.25rem .25rem; text-decoration: none; }
.post-list a:hover h2 { color: var(--pulse-ink); }
.post-list time { font: .78rem var(--mono); color: var(--muted); }
.post-list h2 { font-size: clamp(1.3rem, 3vw, 1.7rem); letter-spacing: -.02em; line-height: 1.15; margin: .3rem 0 .4rem; }
.post-list p { margin: 0 0 .6rem; color: #33332F; }
.tags { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; }
.post { max-width: 44rem; margin: 0 auto; }
.post > .label a { color: var(--pulse-ink); }
.post .tags { margin-bottom: 1.75rem; }
.prose { font-size: 1.1rem; line-height: 1.7; color: #23231F; }
.prose h2 { font-size: 1.5rem; letter-spacing: -.02em; margin: 2.2rem 0 .6rem; line-height: 1.2; }
.prose p { margin: 0 0 1.1rem; }
.prose ul { padding-left: 1.2rem; margin: 0 0 1.2rem; }
.prose li { margin: .35rem 0; }
.prose a { color: var(--pulse-ink); }
.prose blockquote { margin: 1.5rem 0; padding: 1rem 1.25rem; border-left: 4px solid var(--pulse); background: #EAF7EF; border-radius: 0 var(--r) var(--r) 0; font-weight: 500; }
.prose blockquote p:last-child { margin: 0; }
.sources { margin: 2rem 0; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .92rem; }
.sources ul { margin: .4rem 0 0; padding-left: 1.1rem; }
.sources a { color: var(--muted); }
.post-cta { margin: 2rem 0; padding: 1.25rem 1.4rem; border: 1.5px solid var(--pulse); border-radius: 12px; background: #F1FAF4; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.post-cta p { margin: 0; max-width: 28em; }




/* embedded X post; before widgets.js loads it shows as a simple link card */
.x-post { margin: 1.5rem 0; }
.x-post .twitter-tweet { margin: 0 auto !important; }
.x-post blockquote.twitter-tweet { max-width: 550px; padding: 1rem 1.25rem; border: 1.5px solid var(--ink); border-radius: 12px; background: #fff; font-size: 1rem; }
.x-post blockquote.twitter-tweet p { margin: 0 0 .5rem; }
.x-post blockquote.twitter-tweet a { font: 500 .9rem var(--mono); color: var(--pulse-ink); }
/* covers */
.post-cover { margin: 0 0 2rem; border-radius: 12px; overflow: hidden; border: 1.5px solid var(--ink); background: #0B0C0B; aspect-ratio: 16 / 9; }
.post-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.post-list a { display: grid; grid-template-columns: 1fr; gap: .9rem; }
.post-list a:has(.pl-img) { grid-template-columns: minmax(0, 15rem) 1fr; align-items: start; }
.pl-img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; border: 1px solid var(--line); background: #0B0C0B; }
@media (max-width: 560px) { .post-list a:has(.pl-img) { grid-template-columns: 1fr; } }
/* download box inside an article */
.post-dl { display: grid; grid-template-columns: 5.5rem 1fr; gap: 1rem; align-items: center; margin: 1.5rem 0; padding: .9rem; border: 1.5px solid var(--ink); border-radius: 14px; background: #fff; box-shadow: 4px 4px 0 var(--pulse); }
.post-dl img { width: 100%; height: auto; border-radius: 3px; box-shadow: 0 6px 16px rgba(0,0,0,.15); rotate: -2deg; }
.post-dl .label { color: var(--pulse-ink); margin: 0; font-size: .72rem; }
.prose .post-dl b { display: block; font-size: 1.1rem; line-height: 1.2; margin: .2rem 0 .3rem; }
.prose .post-dl p { margin: 0 0 .6rem; font-size: .95rem; line-height: 1.45; }
.prose .post-dl .btn { color: #fff; text-decoration: none; }
/* stern warning box */
.prose .warn { margin: 1.5rem 0; padding: 1rem 1.2rem; border: 1.5px solid #D62B3A; border-left-width: 6px; border-radius: 10px; background: #FDF3F4; }
.prose .warn p:last-child { margin: 0; }
.prose .warn b { color: #B3121B; }

/* newsletter */
.nl { margin-top: 2rem; display: grid; gap: .9rem 1.5rem; align-items: center; padding: clamp(1.2rem, 3vw, 1.8rem); border: 1.5px solid var(--ink); border-radius: 16px; background: #fff; box-shadow: 5px 5px 0 var(--pulse); }
@media (min-width: 56rem) { .nl { grid-template-columns: 1fr minmax(0, 26rem); } }
.nl-txt { display: grid; gap: .25rem; }
.nl-txt .label { display: flex; align-items: center; gap: .5rem; color: var(--pulse-ink); margin: 0; }
.nl-txt b { font-size: clamp(1.2rem, 2.6vw, 1.5rem); letter-spacing: -.02em; line-height: 1.15; }
.nl-txt > span { color: #33332F; }
.nl-f { display: flex; gap: .5rem; }
.nl-f input { flex: 1; min-width: 0; min-height: 48px; padding: 0 .9rem; font: 1rem var(--f); border: 1.5px solid var(--line); border-radius: var(--r); background: var(--bg); }
.nl-f input:focus { outline: 3px solid var(--pulse); outline-offset: 1px; }
.nl-note { grid-column: 1 / -1; font: .75rem var(--mono); color: var(--muted); }
@media (max-width: 55.99rem) { .nl-f { flex-direction: column; } .nl-f .btn { width: 100%; } }
.nl { margin-top: 2.5rem; max-width: 52rem; }

/* stat strip, feature list and mini steps inside an article */
.prose .stats { list-style: none; margin: 1.6rem 0; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 40rem) { .prose .stats.s4 { grid-template-columns: repeat(4, 1fr); } .prose .stats.s3 { grid-template-columns: repeat(3, 1fr); } }
.prose .stats li { margin: 0; padding: .95rem .9rem 1rem; border: 1.5px solid var(--ink); border-radius: 14px; background: #fff; box-shadow: 3px 3px 0 var(--pulse); display: grid; gap: .15rem; align-content: start; }
.prose .stats li.dark { background: #161616; color: #fff; border-color: #161616; }
.prose .stats li.red { box-shadow: 3px 3px 0 #D62B3A; }
.prose .stats svg { width: 1.7rem; height: 1.7rem; color: var(--pulse-ink); margin-bottom: .25rem; }
.prose .stats li.dark svg { color: #3BE08F; }
.prose .stats b { font-size: clamp(1.5rem, 5vw, 2rem); line-height: 1; letter-spacing: -.03em; }
.prose .stats span { font: .78rem/1.3 var(--mono); color: var(--muted); }
.prose .stats li.dark span { color: #B9B9B0; }
.prose .feat { list-style: none; margin: 1.2rem 0 1.6rem; padding: 0; display: grid; gap: .6rem; }
.prose .feat li { margin: 0; display: grid; grid-template-columns: 2.6rem 1fr; gap: .8rem; align-items: center; padding: .65rem .8rem .65rem .65rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.prose .feat .ic { width: 2.6rem; height: 2.6rem; border-radius: 10px; background: #161616; color: #3BE08F; display: grid; place-items: center; }
.prose .feat .ic svg { width: 1.45rem; height: 1.45rem; }
.prose .feat b { display: block; line-height: 1.2; }
.prose .feat span { color: #55554F; font-size: .95rem; line-height: 1.35; }
.prose .flow { list-style: none; margin: 1.4rem 0; padding: 0; display: grid; gap: .5rem; }
@media (min-width: 40rem) { .prose .flow { grid-template-columns: repeat(3, 1fr); } .prose .flow li:not(:last-child)::after { content: "→"; position: absolute; right: -.95rem; top: 50%; translate: 0 -50%; font: 700 1.1rem var(--mono); color: var(--pulse-ink); z-index: 2; } }
.prose .flow li { position: relative; margin: 0; padding: 1rem; border-radius: 14px; background: #161616; color: #fff; }
.prose .flow li .n { font: 700 .75rem var(--mono); color: #3BE08F; letter-spacing: .08em; }
.prose .flow li b { display: block; font-size: 1.15rem; margin: .15rem 0 .1rem; }
.prose .flow li span:not(.n) { color: #B9B9B0; font-size: .92rem; line-height: 1.35; }
/* every screenshot is its own figure with its own caption */
.post-shots { margin: 1.5rem 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; align-items: start; }
.post-shots figure { margin: 0; cursor: zoom-in; }
.post-shots img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; border-radius: 12px; border: 1px solid var(--line); background: #111; display: block; transition: transform .25s; }
.post-shots figure:hover img { transform: translateY(-3px); }
.post-shots figcaption { margin-top: .45rem; font: 500 .8rem/1.3 var(--mono); color: var(--ink); }
.post-shots figcaption small { display: block; color: var(--muted); font-weight: 400; margin-top: .1rem; }
/* wide screenshots (usage meters): natural proportions instead of 3:4 tiles */
.post-shots.wide { grid-template-columns: 1fr; }
@media (min-width: 40rem) { .post-shots.wide { grid-template-columns: repeat(3, 1fr); } }
.post-shots.wide img { aspect-ratio: auto; object-fit: contain; height: auto; }
/* simple bar chart */
.bars { margin: 1.6rem 0; padding: 1.1rem 1.2rem; border: 1.5px solid var(--ink); border-radius: 14px; background: #fff; box-shadow: 4px 4px 0 var(--pulse); display: grid; gap: .85rem; }
.bars h4 { margin: 0; font: 500 .78rem var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.hbar { display: grid; grid-template-columns: 7.2rem 1fr; gap: .7rem; align-items: center; font-size: .92rem; }
.hbar .track { height: 1.7rem; background: #EFEFE9; border-radius: 7px; overflow: hidden; position: relative; }
.hbar .fill { display: block; height: 100%; width: var(--w); background: linear-gradient(90deg, #1FAF6F, #22C27B); border-radius: 7px; position: relative; }
.hbar.alt .fill { background: linear-gradient(90deg, #4A4D48, #161616); }
.hbar.pale .fill { background: linear-gradient(90deg, #9AA39E, #6B736E); }
.hbar .fill i { position: absolute; right: .5rem; top: 50%; translate: 0 -50%; font: 700 .8rem var(--mono); color: #fff; font-style: normal; }
.bars small { font: .75rem var(--mono); color: var(--muted); }
@media (max-width: 30rem) { .hbar { grid-template-columns: 5.6rem 1fr; font-size: .85rem; } }
/* more articles */
.more-posts { margin: 3rem 0 0; padding-top: 1.5rem; border-top: 2px solid var(--ink); }
.more-posts h2 { font-size: 1.4rem; letter-spacing: -.02em; margin: 0 0 1rem; display: flex; align-items: center; gap: .6rem; }
.mp-grid { display: grid; gap: .8rem; }
@media (min-width: 48rem) { .mp-grid { grid-template-columns: repeat(3, 1fr); } }
.mp { display: grid; grid-template-columns: 6.4rem 1fr; gap: .8rem; align-items: center; padding: .6rem; border: 1.5px solid var(--ink); border-radius: 12px; background: #fff; text-decoration: none; transition: transform .2s, box-shadow .2s; }
@media (min-width: 48rem) { .mp { grid-template-columns: 1fr; align-items: start; } }
.mp:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--pulse); }
.mp img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; background: #0B0C0B; }
.mp b { display: block; font-size: 1rem; line-height: 1.2; letter-spacing: -.01em; color: var(--ink); }
.mp small { display: block; font: .72rem var(--mono); color: var(--muted); margin-top: .25rem; }
.prose .src { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin: 1rem 0 1.2rem; }
.prose .src .to { font: 700 1.2rem var(--mono); color: var(--pulse-ink); padding: 0 .1rem; }
.prose .src .chip.hub { background: #161616; color: #3BE08F; border-color: #161616; }
.prose h3 { font-size: 1.15rem; letter-spacing: -.01em; margin: 1.6rem 0 .5rem; }
.prose .warn { margin: 1.2rem 0; }
.mp-all { margin: 1rem 0 0; }
/* simple vertical timeline */
.prose .tl { list-style: none; margin: 1.4rem 0; padding: 0 0 0 1.6rem; border-left: 2px solid var(--line); display: grid; gap: .9rem; }
.prose .tl li { position: relative; margin: 0; }
.prose .tl li::before { content: ""; position: absolute; left: -2.15rem; top: .35rem; width: .8rem; height: .8rem; border-radius: 50%; background: var(--pulse); box-shadow: 0 0 0 4px rgba(31,175,111,.2); }
.prose .tl li.end::before { background: #D62B3A; box-shadow: 0 0 0 4px rgba(214,43,58,.2); }
.prose .tl b { display: block; font-size: 1.1rem; letter-spacing: -.01em; }
.prose .tl span { color: #55554F; font-size: .98rem; line-height: 1.4; }

/* blog list: text on top, picture under it; blocks alternate white, black, green instead of divider lines */
.blog h1 .hl { background: linear-gradient(transparent 58%, rgba(31,175,111,.45) 58%); }
.nl-mini { display: flex; gap: .5rem; max-width: 30rem; margin-top: 1.1rem; }
.nl-mini input { flex: 1; min-width: 0; min-height: 48px; padding: 0 .9rem; font: 1rem var(--f); border: 1.5px solid var(--ink); border-radius: var(--r); background: #fff; }
.nl-mini input:focus { outline: 3px solid var(--pulse); outline-offset: 1px; }
@media (max-width: 30rem) { .nl-mini { flex-direction: column; } }
.post-list { max-width: none; border-top: 0; display: grid; gap: 1rem; }
@media (min-width: 48rem) { .post-list { grid-template-columns: repeat(2, 1fr); align-items: stretch; } }
.post-list li { border: 1.5px solid var(--ink); border-radius: 16px; overflow: hidden; background: #fff; color: var(--ink); }
.post-list li:nth-child(3n+2) { background: #161616; color: #F5F5F2; }
.post-list li:nth-child(3n+3) { background: linear-gradient(135deg, #22C27B, #1FAF6F 55%, #179A5F); color: #0B1A12; }
.post-list a { display: flex; flex-direction: column; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.2rem 1.2rem; height: 100%; }
.post-list a:has(.pl-img) { display: flex; grid-template-columns: none; }
.pl-txt { display: grid; gap: .3rem; align-content: start; }
.post-list time { color: inherit; opacity: .75; }
.post-list h2 { color: inherit; font-size: clamp(1.3rem, 3vw, 1.75rem); margin: .1rem 0 .3rem; }
.post-list p { color: inherit; opacity: .88; }
.post-list a:hover h2 { color: inherit; text-decoration: underline; text-decoration-thickness: 2px; }
.post-list .chip { background: rgba(255,255,255,.9); color: #161616; border-color: transparent; }
.pl-img { border: 0; border-radius: 10px; width: 100%; }
/* related articles: same idea */
.mp { grid-template-columns: 1fr !important; align-items: start; gap: .7rem; }
.mp > span { display: grid; gap: .15rem; }
.mp > span small { margin: 0 0 .1rem; order: -1; }
.mp:nth-child(3n+2) { background: #161616; } .mp:nth-child(3n+2) b { color: #fff; } .mp:nth-child(3n+2) small { color: #B9B9B0; }
.mp:nth-child(3n+3) { background: linear-gradient(135deg, #22C27B, #1FAF6F); } .mp:nth-child(3n+3) b, .mp:nth-child(3n+3) small { color: #0B1A12; }
/* chips: green on white and black cards, white on green ones */
.post-list .chip, .post .tags .chip { background: #1FAF6F; color: #0B1A12; border-color: transparent; }
.post-list li:nth-child(3n+3) .chip { background: #fff; color: #0B1A12; }
/* green box: glossary and "what I learned myself" */
.prose .green-box { margin: 2rem 0; padding: 1.1rem 1.2rem 1.2rem; border: 1.5px solid var(--pulse); border-radius: 14px; background: #F1FAF4; }
.prose .green-box h2 { margin-top: .2rem; }
.prose .green-box .feat { margin-bottom: 0; }
.prose .green-box .feat li { background: #fff; }
.prose .green-box ul:not(.feat) { margin: .4rem 0 0; }
.prose .green-box .gb-h { margin: 0 0 .2rem; font: 600 .8rem var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--pulse-ink); }
/* before / after */
.prose .ba { display: grid; gap: .75rem; margin: 1.4rem 0 1rem; }
@media (min-width: 40rem) { .prose .ba { grid-template-columns: 1fr 1fr; } }
.prose .ba-col { padding: 1rem 1.1rem; border-radius: 14px; border: 1.5px solid var(--ink); }
.prose .ba-col.before { box-shadow: 3px 3px 0 #D62B3A; }
.prose .ba-col.after { background: #161616; color: #F5F5F2; border-color: #161616; box-shadow: 3px 3px 0 var(--pulse); }
.prose .ba-col ul { margin: 0; padding-left: 1.1rem; }
.prose .ba-col li { margin: .35rem 0; }
.prose .ba-h { margin: 0 0 .3rem; font: 700 .78rem var(--mono); text-transform: uppercase; letter-spacing: .1em; color: #B3121B; }
.prose .ba-col.after .ba-h { color: #3BE08F; }
/* screenshots: two side by side, or one on its own */
@media (min-width: 40rem) { .post-shots.wide.two { grid-template-columns: 1fr 1fr; } .post-shots.wide.one { grid-template-columns: minmax(0, 26rem); } }
/* official tips: numbered cards */
.prose .tips { list-style: none; counter-reset: tip; margin: 1.2rem 0; padding: 0; display: grid; gap: .55rem; }
.prose .tips li { counter-increment: tip; position: relative; margin: 0; padding: .75rem .9rem .75rem 3.1rem; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.prose .tips li::before { content: counter(tip, decimal-leading-zero); position: absolute; left: .85rem; top: .8rem; font: 700 .85rem var(--mono); color: var(--pulse-ink); }
.prose .finale { margin-top: 1.6rem; font-size: clamp(1.25rem, 3.6vw, 1.55rem); line-height: 1.3; letter-spacing: -.01em; }
.prose a.btn { text-decoration: none; }
.prose a.btn-green { color: #0B1A12; }
.prose a.btn-green:hover { background: #161616; border-color: #161616; color: #fff; }
/* Trackmania-style clan tag: slanted, wide, glowing pale blue + yellow, no dark chip */
.prose .tm-tag { display: inline-block; padding: 0 .15rem; font: 700 1.05em var(--f); letter-spacing: .14em; transform: skewX(-14deg); white-space: nowrap; -webkit-text-stroke: 1.2px #12324F; paint-order: stroke fill; font-size: 1.15em; }
.prose .tm-tag .hwk { color: #A8E4FF; margin-right: .35em; text-shadow: 0 0 6px #7FD4FF, 0 0 14px rgba(90,190,255,.85), 0 0 26px rgba(90,190,255,.55); }
.prose .tm-tag .bn { color: #FFD400; -webkit-text-stroke-color: #4A3700; text-shadow: 0 0 6px rgba(255,212,0,.8), 0 0 16px rgba(255,190,0,.5); }
.post-shots .shot-note { margin: .2rem 0 0; text-align: right; font: italic .82rem/1.3 var(--f); color: var(--muted); }
.prose .later { margin-top: 3.2rem; }
.prose .stats.s3 li:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (min-width: 40rem) { .prose .stats.s3 li:last-child:nth-child(odd) { grid-column: auto; } }
/* YouTube embed (privacy-enhanced domain) */
.prose .yt-embed { margin: 1.5rem 0 .4rem; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #111; border: 1px solid var(--line); }
.prose .yt-embed iframe { display: block; width: 100%; height: 100%; border: 0; }
.prose .yt-cap { margin-top: 0; font: .78rem/1.3 var(--mono); color: var(--muted); }
.prose .stats li.green { background: var(--pulse); border-color: var(--pulse-ink); color: #0B1A12; box-shadow: 3px 3px 0 var(--pulse-ink); }
.prose .stats li.green svg { color: #0B1A12; }
.prose .stats li.green span { color: #10321F; }
.prose .stats .emo { font-size: .8em; vertical-align: .05em; }
/* CS timeline: yellow = at friends', green = at home; Global Offensive is the big one */
.prose .tl-legend { display: flex; gap: 1rem; margin: 1rem 0 -.4rem; font: .78rem var(--mono); color: var(--muted); }
.prose .tl-legend .lg::before { content: ""; display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; margin-right: .4rem; vertical-align: .02em; }
.prose .tl-legend .yel::before { background: #F2C230; } .prose .tl-legend .grn::before { background: var(--pulse); }
.prose .tl li.friends::before { background: #F2C230; box-shadow: 0 0 0 4px rgba(242,194,48,.25); }
.prose .tl li.go { padding: .9rem .9rem 1rem; margin-left: -.6rem; border-radius: 14px; background: #161616; color: #F5F5F2; box-shadow: 0 0 0 1px rgba(31,175,111,.5), 0 0 28px rgba(31,175,111,.35); }
.prose .tl li.go::before { left: -1.55rem; top: 1rem; width: 1.3rem; height: 1.3rem; box-shadow: 0 0 0 6px rgba(31,175,111,.3), 0 0 26px 6px rgba(31,175,111,.7); }
.prose .tl li.go > b { font-size: 1.5rem; color: #3BE08F; text-shadow: 0 0 18px rgba(59,224,143,.6); }
.prose .tl li.go > span, .prose .tl li.go .tl-sub span { color: #C9C9C0; }
.prose .tl li.go a { color: #3BE08F; }
.prose .tl-sub { list-style: none; margin: .8rem 0 0; padding: 0 0 0 1.1rem; border-left: 2px dashed rgba(59,224,143,.45); display: grid; gap: .65rem; }
.prose .tl-sub li::before { left: -1.48rem; top: .4rem; width: .6rem; height: .6rem; }
.prose .tl-sub b { font-size: 1rem; color: #F5F5F2; }
@media (prefers-reduced-motion: no-preference) {
  .prose .tl li.go::before { animation: goPulse 1.6s ease-in-out infinite; }
  .prose .tl li.go { animation: goGlow 2.4s ease-in-out infinite; }
  @keyframes goPulse { 50% { box-shadow: 0 0 0 10px rgba(31,175,111,.15), 0 0 40px 12px rgba(31,175,111,.9); } }
  @keyframes goGlow { 50% { box-shadow: 0 0 0 1px rgba(31,175,111,.8), 0 0 46px rgba(31,175,111,.55); } }
}
.prose h3 { margin: 1.75rem 0 .5rem; font-size: 1.12rem; line-height: 1.3; }
.prose .note { padding: .7rem 1rem; border: 1px dashed var(--line); border-radius: var(--r); font-size: .92rem; color: var(--muted); }
.prose .note b { color: var(--ink); }

/* comparison table (pariz-tri-ai) */
.prose .cmp-wrap { margin: 1.5rem 0; overflow-x: auto; border: 1.5px solid var(--ink); border-radius: 14px; background: #fff; box-shadow: 3px 3px 0 var(--pulse); }
.prose .cmp { width: 100%; border-collapse: collapse; font-size: .9rem; line-height: 1.3; }
.prose .cmp th, .prose .cmp td { padding: .55rem .6rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.prose .cmp thead th { font: 700 .74rem var(--mono); text-transform: uppercase; letter-spacing: .06em; background: #161616; color: #F5F5F2; border-bottom: 0; }
.prose .cmp tbody th { font-weight: 500; }
.prose .cmp tbody tr:last-child th, .prose .cmp tbody tr:last-child td { border-bottom: 0; }
.prose .cmp tr.sum { background: var(--bg-2); }
.prose .cmp td::before { font-weight: 700; margin-right: .3rem; }
.prose .cmp td.y::before { content: "✓"; color: var(--pulse-ink); }
.prose .cmp td.n { color: var(--muted); }
.prose .cmp td.n::before { content: "✗"; color: #D62B3A; }
.prose .cmp td.p::before { content: "~"; color: #B87A00; }
@media (max-width: 30rem) { .prose .cmp { font-size: .78rem; } .prose .cmp th, .prose .cmp td { padding: .5rem .4rem; } .prose .cmp thead th { font-size: .66rem; letter-spacing: .02em; } }
.hbar .track .z { position: absolute; left: .6rem; top: 50%; translate: 0 -50%; font: 700 .8rem var(--mono); font-style: normal; color: var(--ink); }

/* embedded video in a post */
.prose .post-video { margin: 1.5rem 0; }
.prose .post-video video { width: 100%; height: auto; display: block; border-radius: 12px; border: 1px solid var(--line); background: #0B0A09; }
.prose .post-video figcaption { margin-top: .45rem; font: 500 .8rem/1.3 var(--mono); color: var(--ink); }
.prose .post-video figcaption small { display: block; color: var(--muted); font-weight: 400; margin-top: .1rem; }
