/* Shared page chrome and blog navigation. */
body:not(:has(.reference-slice)) .site-footer{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:var(--space-2xl);padding-block:var(--space-3xl);align-items:start}
body:not(:has(.reference-slice)) .site-footer nav{display:flex;flex-direction:column;gap:var(--space-md);font-size:14px}
body:not(:has(.reference-slice)) .footer-brand p{font-size:14px;margin-block:var(--space-lg)}
body:not(:has(.reference-slice)) .footer-brand span{font-size:12px;color:var(--color-muted)}
body:not(:has(.reference-slice)) .menu-toggle{display:none}
.journal-head h1{font-size:clamp(56px,7vw,100px)}
.blog-filters{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:40px}
.blog-filters a,.blog-pagination a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;border:1px solid var(--color-line);border-radius:var(--radius);font-size:14px}
.blog-filters a[aria-current],.blog-pagination a[aria-current]{background:var(--color-accent);color:var(--color-paper);border-color:var(--color-accent)}
.blog-pagination{display:flex;justify-content:center;gap:12px;margin-top:48px}
.post-topic{display:inline-block;margin-top:16px;font-size:13px;color:var(--color-muted);text-decoration:underline;text-underline-offset:4px}
@media(max-width:700px){
 body:not(:has(.reference-slice)) .site-footer{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px;padding-block:40px}
 body:not(:has(.reference-slice)) .footer-brand{grid-column:1/-1}
 body:not(:has(.reference-slice)) .site-footer nav a{padding-block:6px}
 body:not(:has(.reference-slice)) .mast{height:72px;min-height:72px;flex-wrap:nowrap;gap:18px;padding-block:12px;position:relative;z-index:30}
 body:not(:has(.reference-slice)) .mast>a:first-child{margin-right:auto}
 body:not(:has(.reference-slice)) .mast .launch{display:none}
 body:not(:has(.reference-slice)) .menu-toggle{display:flex;order:2;flex-direction:column;justify-content:center;gap:6px;width:40px;height:44px;padding:8px;border:0;background:none;color:var(--color-ink)}
 body:not(:has(.reference-slice)) .menu-toggle span{display:block;height:1px;width:24px;background:currentColor}
 body:not(:has(.reference-slice)) .mast nav{display:none;position:absolute;left:0;right:0;top:100%;padding:16px 24px 24px;background:var(--color-paper);border-bottom:1px solid var(--color-line);width:100%;font-size:18px}
 body:not(:has(.reference-slice)) .mast.menu-open nav{display:flex;flex-direction:column;gap:0}
 body:not(:has(.reference-slice)) .mast nav a{padding-block:14px}
 .journal-head h1{font-size:56px}.blog-filters{gap:8px;margin-bottom:32px}.blog-filters a{padding:8px 14px;font-size:13px}
}

.article-back{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:14px}
.article-back span{font-size:28px}
.reading header .article-meta{gap:0}
.reading header .article-meta>*+*{border-left:1px solid var(--color-muted);margin-left:16px;padding-left:16px}
.article-end{gap:32px;align-items:flex-start;flex-wrap:wrap}
.article-end>.primary{flex-shrink:0;min-height:48px}
.article-sharing p{font-size:14px;margin-bottom:12px}
.article-sharing nav{display:flex;flex-wrap:wrap;gap:8px}
.article-sharing nav a,.article-sharing button,.post-topic{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 14px;border:1px solid var(--color-line);border-radius:var(--radius);font-size:13px;background:none;color:var(--color-ink);text-decoration:none}
.post-topic{min-height:32px;color:var(--color-muted)}
.share-status{display:block;font-size:13px;overflow-wrap:anywhere;margin-top:8px}
.prose [class~=my-12],.prose [class~=my-8]{margin-block:32px}
.prose .text-center{text-align:center}.prose .text-sm{font-size:14px}.prose .text-gray-500{color:var(--color-muted)}
.prose iframe,.prose video{max-width:100%;aspect-ratio:16/9;height:auto}
.prose .article-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
@media(min-width:1000px){.prose [class~="md:flex-row"]{display:flex;gap:24px;align-items:start}.prose [class~="md:flex-row"]>div{flex:1;min-width:0}}
@media(max-width:700px){.reading header .article-meta{row-gap:10px}.reading header .article-meta>span:first-child{flex-basis:100%}.reading header .article-meta>time{border:0;margin:0;padding:0}.prose .article-split{grid-template-columns:minmax(0,1fr)}}

:root{--article-glow:rgba(230,126,38,.24);--article-social:rgba(255,255,255,.06)}
.article-back{gap:8px;line-height:1.4}
.article-back svg{display:block;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.reading header .article-meta{gap:10px 0;align-items:center}
.reading header .article-meta>*+*{border:0;margin:0;padding:0}
.reading header .article-meta>*+*::before{content:'•';display:inline-block;margin-inline:12px;color:var(--color-muted)}
.article-sharing nav a,.article-sharing button{width:42px;height:42px;min-height:42px;padding:0;border:1px solid var(--color-line);border-radius:var(--radius);background:var(--article-social);font-size:16px}
.article-sharing nav a:hover,.article-sharing button:hover{color:var(--color-accent);border-color:var(--color-accent)}
.article-sharing button[hidden]{display:none}
.article-end>.primary{box-shadow:0 8px 32px var(--article-glow);padding-inline:28px;transition:box-shadow var(--duration),background-color var(--duration)}
.article-end>.primary:hover{box-shadow:0 8px 44px var(--article-glow)}
@media(max-width:700px){.reading header .article-meta>span:first-child{flex-basis:100%}.reading header .article-meta>time::before{content:none}}

.article-back svg{width:16px;height:16px;transform:translateY(1px)}

/* Editorial pagination: quiet page numbers, explicit directional navigation. */
.blog-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--color-line);padding-top:24px;margin-top:56px}
.blog-pagination a{border:0;border-radius:0;background:none;color:var(--color-muted);padding:8px;min-width:40px;min-height:44px;line-height:1.25}
.blog-pagination a[aria-current]{background:none;color:var(--color-ink);border:0;box-shadow:inset 0 -2px var(--color-accent);font-weight:700}
.blog-pagination a:hover{color:var(--color-ink);background:none}
.pagination-numbers{display:flex;gap:4px}
.pagination-direction>a,.pagination-direction>span{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;font-size:14px}
.pagination-direction>[aria-disabled]{color:var(--color-muted);opacity:.4;padding:8px}
.blog-pagination a:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px;border-radius:4px}
@media(max-width:359px){.blog-pagination{gap:4px}.pagination-direction>a,.pagination-direction>span{font-size:13px;gap:4px}.blog-pagination a{min-width:32px;padding:6px}.pagination-direction>[aria-disabled]{padding:6px}}

/* Shared header action matches the rectangular Kaasi CTAs. */
.mast .launch{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 20px;border:0;border-radius:var(--radius);background:var(--color-accent);color:var(--color-paper);font-weight:700;line-height:1.25;white-space:nowrap;transition:background-color var(--duration)}
.mast .launch:hover{background:var(--color-accent-hover);color:var(--color-paper)}
@media(max-width:700px){.mast .launch{display:none}}

/* Let article and listing headings fill their available line naturally. */
.journal h1,.journal .article-grid h2,.reading h1,.reading .prose h2,.reading .prose h3,.related h2,.related h3{text-wrap:wrap}

/* Article headers use the full content width; body text keeps its reading measure. */
.reading>header,.reading>header h1,.reading>header .deck{max-width:none}
.reading>header .deck{text-wrap:wrap}
.reading .prose h2,.reading .prose h3{max-width:none}

/* Avoid isolated final words without balancing the whole heading. */
.reading>header h1,.reading>header .deck{text-wrap:pretty}

.reading>header h1,.reading>header .deck{overflow-wrap:anywhere}


/* Selected product details within the v7 article. */
.prose .article-visual{margin:32px 0 36px}
.prose .article-visual img{display:block;width:100%;height:auto;margin:0;border:1px solid var(--color-line);border-radius:8px}
.prose .article-visual figcaption{margin-top:10px;color:var(--color-muted);font-size:13px;line-height:1.5}
.prose .article-visual-side{float:right;width:min(45%,348px);margin:4px 0 24px 28px}
.prose .article-visual-clear{clear:both}
@media(max-width:700px){.prose .article-visual-side{float:none;width:min(100%,348px);margin:24px auto 32px}.prose .article-visual{margin-block:24px 32px}}

/* Keep screenshots at or below their captured size for sharper text. */
.prose .article-visual-side{width:min(40%,260px)}
.prose .article-visual-upcoming{width:min(45%,300px)}
@media(max-width:700px){.prose .article-visual-side{width:min(100%,260px)}.prose .article-visual-upcoming{width:min(100%,300px)}}