/* Shared journal presentation: static content stays readable without scripts. */
html { scroll-padding-top: 100px; }
body.journal-index, body.journal-article { background: #f7f9fd; color: #20273c; }
.journal-index .hero, .journal-index .card, .journal-article .hero, .journal-article .card { animation: none; }
.journal-article .article-body > p, .journal-article .article-body > section > p { color: #414d66; }
.editorial-shell { width: min(1180px, calc(100% - 64px)); }
.editorial-nav { position: sticky; top: 0; z-index: 20; min-height: 76px; padding: 18px max(24px, calc((100vw - 1180px)/2)); display: flex; justify-content: space-between; align-items: center; gap: 24px; border-bottom: 1px solid #e2e6f0; background: rgba(247,249,253,.97); }
.editorial-nav a { text-decoration: none; color: #3c4561; font-size: 13px; }
.editorial-nav > div { display: flex; gap: 26px; align-items: center; }
.editorial-nav .editorial-brand { display: inline-flex; align-items: center; gap: 9px; font-size: 17px; font-weight: 700; }
.editorial-brand > span:first-child { background: #5144e9; color: white; border-radius: 9px; padding: 4px 10px; }
.journal-label { color: #798197; font-weight: 400; font-size: 13px; }
.editorial-editor { border: 1px solid #d8ddef; border-radius: 8px; padding: 9px 14px; }
.skip-editorial { position: fixed; left: 20px; top: -100px; z-index: 100; padding: 12px; background: white; }
.skip-editorial:focus { top: 10px; }
.journal-index .hero, .journal-article .hero { background: none; box-shadow: none; border: 0; border-radius: 0; padding: 72px 0 48px; }
.journal-index .hero h1 { max-width: 900px; font-size: clamp(38px,5.5vw,68px); line-height: 1.08; letter-spacing: -.05em; }
.journal-index .hero .lede { max-width: 680px; font-size: 17px; }
.eyebrow { color: #6557d9; letter-spacing: .13em; font-size: 10px; font-weight: 600; }
.journal-stats { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 30px; font-size: 11px; color: #737d91; }
.journal-stats span::before { content: '✓'; color: #5e67a5; margin-right: 7px; }
.library-toolbar { display: flex; justify-content: space-between; align-items: end; gap: 24px; padding-top: 36px; border-top: 1px solid #dce1ed; }
.library-toolbar h2 { margin: 6px 0 0; font-size: 26px; letter-spacing: -.03em; }
.article-search { display: grid; gap: 5px; font-size: 11px; color: #67728a; width: min(100%,320px); }
.article-search input { width: 100%; padding: 13px 16px; border-radius: 10px; border: 1px solid #d9dfed; background: white; font: inherit; font-size: 13px; color: #20273c; }
.category-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0 12px; }
.category-filters button { border: 1px solid #dce1ed; background: transparent; color: #647089; padding: 9px 15px; border-radius: 24px; font: inherit; font-size: 11px; cursor: pointer; }
.category-filters button[aria-pressed=true] { color: white; background: #5144cf; border-color: #5144cf; }
.search-status { font-size: 11px; color: #778096; }
.blog-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.blog-card { padding: 0; overflow: hidden; box-shadow: none; border-radius: 15px; border-color: #e0e5ef; min-height: 0; position: relative; }
.blog-card[hidden] { display: none; }
.card-art { height: 145px; background: #eeeffa; padding: 27px; position: relative; overflow: hidden; }
.blog-card:nth-child(3n+2) .card-art { background: #edf3f6; }
.blog-card:nth-child(3n) .card-art { background: #f4efe7; }
.card-art span { font: 24px ui-monospace, monospace; color: #7075a5; letter-spacing: .15em; }
.card-art i { display: block; height: 5px; border-radius: 5px; width: 64%; margin-top: 12px; background: #cbd0e5; }
.card-art i:last-child { width: 40%; }
.blog-card-content { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.blog-card h2 { font-size: 17px; line-height: 1.5; margin: 12px 0; letter-spacing: -.025em; }
.blog-card p { font-size: 12px; line-height: 1.8; }
.blog-card-topic { font-size: 9px; text-transform: uppercase; letter-spacing: .12em; color: #6a5bc9; }
.blog-card .blog-card-meta { display: flex; justify-content: space-between; border-top: 1px solid #edf0f6; margin-top: 22px; font-size: 10px; }
.reference-banner { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 36px; margin: 56px 0; background: #eeeff9; border: 1px solid #e1e3f1; border-radius: 18px; }
.reference-banner h2 { font-size: 24px; letter-spacing: -.03em; }
.reference-banner p { font-size: 13px; color: #69728c; }
.journal-article .hero { max-width: 850px; margin-left: 250px; padding-bottom: 28px; }
.journal-article .hero h1 { font-size: clamp(30px,4vw,49px); line-height: 1.16; letter-spacing: -.045em; }
.journal-article .hero .lede { font-size: 16px; line-height: 1.8; }
.journal-article .editorial-main { max-width: none; display: grid; grid-template-columns: 210px minmax(0,780px); gap: 40px; margin-top: 20px; align-items: start; }
.reading-sidebar { position: sticky; top: 106px; padding-top: 22px; }
.reading-sidebar nav { display: grid; gap: 0; border-left: 1px solid #dce1ed; margin-top: 18px; }
.reading-sidebar nav a { font-size: 11px; text-decoration: none; color: #68738b; padding: 9px 15px; line-height: 1.65; }
.reading-sidebar nav a:hover { color: #5144cf; background: #efeffb; }
.sidebar-back { display: block; margin-top: 25px; font-size: 11px; text-decoration: none; }
.journal-article .article-body { border: 0; border-radius: 0; background: transparent; box-shadow: none; padding: 0 0 40px; font-family: 'Segoe UI',sans-serif; font-size: 17px; line-height: 1.9; }
.article-body h2 { scroll-margin-top: 100px; font-family: 'Sora','Segoe UI',sans-serif; font-size: 24px; margin-top: 2.3em; }
.article-body pre { max-width: 100%; overflow-x: auto; border: 1px solid #dfe4ef; background: #eff2f9; color: #354363; border-radius: 12px; padding: 22px; font-size: 13px; }
.copy-example { display: block; margin: 16px 0 -10px auto; background: white; border: 1px solid #dce1ed; border-radius: 7px; padding: 6px 10px; color: #64708c; cursor: pointer; }
.workflow-figure { margin: 10px 0 35px; padding: 25px; background: white; border: 1px solid #e0e4ee; border-radius: 14px; }
.workflow-figure figcaption { font: 10px 'Sora',sans-serif; color: #737c93; text-transform: uppercase; letter-spacing: .12em; }
.workflow-figure ol { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; list-style: none; padding: 0; margin: 22px 0; }
.workflow-figure li { display: grid; gap: 8px; margin: 0!important; padding: 12px; background: #f4f5fb; border-radius: 9px; }
.workflow-figure li span { font: 11px ui-monospace,monospace; color: #867bc9; }
.workflow-figure strong { font-size: 12px; line-height: 1.5; }
.workflow-figure p { color: #788197; font-size: 12px; }
.quiet-tool-link { border-top: 1px solid #dce1ed; padding-top: 20px; font-size: 13px; color: #727b90; }
.journal-article .breadcrumbs { margin-left: 250px; }
.journal-index .footer { display: flex; flex-wrap: wrap; gap: 24px; font-size: 11px; padding: 28px 0; }
@media(max-width:1000px) { .blog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .journal-article .hero,.journal-article .breadcrumbs { margin-left: 0; } .journal-article .editorial-main { grid-template-columns: 170px minmax(0,1fr); gap: 25px; } }
@media(max-width:680px) { .editorial-shell { width: calc(100% - 32px); } .editorial-nav { padding: 14px 16px; gap: 10px; flex-wrap: wrap; } .editorial-nav > div { gap: 15px; } .editorial-nav a { font-size: 11px; } .journal-label { display: none; } .journal-index .hero,.journal-article .hero { padding: 42px 0 25px; } .library-toolbar { align-items: stretch; flex-direction: column; } .article-search { width: 100%; } .blog-grid { grid-template-columns: minmax(0,1fr); } .card-art { height: 125px; } .reference-banner { padding: 24px; align-items: start; flex-direction: column; } .journal-article .editorial-main { display: block; } .reading-sidebar { position: static; padding: 18px; background: #eff1f8; border-radius: 12px; margin-bottom: 30px; } .reading-sidebar nav { max-height: none; } .workflow-figure { padding: 18px; } .workflow-figure ol { grid-template-columns: minmax(0,1fr); } .workflow-figure li { grid-template-columns: 28px 1fr; align-items: center; } }