/* Editorial reading, using the same Sora, violet and theme tokens as the app. */
.blog{max-width:1120px;padding-top:40px;padding-bottom:48px}
.blog h1,.blog h2{letter-spacing:-.04em;line-height:1.22}
.blog-index-head{max-width:760px;margin-bottom:30px}
.blog-index-head h1{font-size:clamp(28px,4vw,44px);margin:0 0 12px}
.blog-index-head p{color:var(--ink-2);font-size:17px;line-height:1.7;margin:0;max-width:64ch}
.blog-image-link{display:block;border-radius:var(--r);overflow:hidden;outline-offset:5px}
.blog-cover{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;border-radius:var(--r);border:1px solid var(--rule)}
.blog-lead{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:32px;padding-bottom:32px;border-bottom:1px solid var(--rule)}
.blog-lead h2{font-size:clamp(25px,3vw,33px);margin:12px 0 16px}
.blog h2 a{text-decoration:none}
.blog-lead p:not(.blog-meta),.blog-card>p:not(.blog-meta){color:var(--ink-2);line-height:1.7}
.blog-meta{display:flex;gap:6px 16px;flex-wrap:wrap;font-size:12px;color:var(--ink-2);line-height:1.7;margin:14px 0 10px}
.blog-meta span:first-child{color:var(--violet);font-weight:650}
.blog-read{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-weight:650;color:var(--violet);text-underline-offset:4px}
.blog-more{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;padding-top:32px}
.blog-card h2{font-size:23px;margin:8px 0 10px}
.blog-card p{margin-top:10px}
.blog-card .blog-image-link{transition:transform .18s ease}
.blog a:focus-visible,.blog summary:focus-visible{outline:2px solid var(--violet);outline-offset:4px}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.blog-image-link:hover{transform:translateY(-3px)}.blog h2 a:hover{color:var(--violet)}}
.blog-help{margin-top:40px;padding:24px 0;border-top:1px solid var(--rule)}
.blog-help h2{font-size:20px;margin:0 0 8px}.blog-help p{color:var(--ink-2);margin:0;line-height:1.7}.blog-help a{color:var(--violet);text-underline-offset:3px}
.blog-post{max-width:1040px}.blog-crumb{display:flex;align-items:center;gap:12px;color:var(--ink-2);font-size:13px;margin-bottom:24px}.blog-crumb a{min-height:44px;display:inline-flex;align-items:center;text-underline-offset:3px}
.blog-post-head{max-width:840px;margin-bottom:28px}.blog-post-head h1{font-size:clamp(28px,3.8vw,39px);margin:14px 0 18px}.blog-deck{font-size:18px;line-height:1.7;color:var(--ink-2);max-width:70ch}.blog-byline{font-size:13px;color:var(--ink-2)}
.blog-reading{display:grid;grid-template-columns:minmax(0,720px) minmax(0,210px);gap:44px;margin-top:32px}.blog-body{grid-column:1;grid-row:1;font-size:16px;line-height:1.85;min-width:0}.blog-body>p{margin:0 0 24px}.blog-body h2{font-size:25px;margin:38px 0 18px;scroll-margin-top:calc(var(--mast-h) + 24px)}.blog-body h2:first-child{margin-top:0}.blog-body a{color:var(--violet);text-underline-offset:4px;overflow-wrap:anywhere}.blog-body strong{font-weight:650}.blog-body li{margin-bottom:12px}.blog-body ul,.blog-body ol{padding-left:25px;margin:24px 0 30px}
.blog-toc{grid-column:2;grid-row:1;align-self:start;width:100%;position:sticky;top:calc(var(--mast-h) + 24px);border:1px solid var(--rule);border-radius:var(--r);padding:0 16px;background:var(--pane)}.blog-toc summary{cursor:pointer;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:650;font-size:13px;list-style:none}.blog-toc summary::after{content:'+';font-size:18px;color:var(--violet)}.blog-toc details[open] summary::after{content:'−'}.blog-toc a{display:block;padding:10px 0;color:var(--ink-2);font-size:12px;line-height:1.65;text-decoration:none;border-top:1px solid var(--rule)}
.blog-figure{margin:32px 0}.blog-figure img{display:block;width:100%;height:auto;border:1px solid var(--rule);border-radius:var(--r)}.blog-figure a{display:block}.blog-figure figcaption{font-size:12px;color:var(--ink-2);line-height:1.7;margin-top:12px}
.blog-table{overflow-x:auto;margin:26px 0}.blog-table table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.7}.blog-table th,.blog-table td{text-align:left;vertical-align:top;padding:14px;border-bottom:1px solid var(--rule)}.blog-table th{background:var(--pane-2);font-weight:650}.blog-table td:first-child{font-weight:600;width:36%}
.blog-related{margin-top:40px;padding-top:28px;border-top:1px solid var(--rule)}.blog-related>h2{font-size:24px;margin:0 0 24px}.blog-related>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.blog-related .blog-card h2{font-size:20px}.blog-independent{margin:32px 0 0;color:var(--ink-2);font-size:12px;line-height:1.7}
.blog-header-account{min-height:44px;display:inline-flex;align-items:center;font-size:13px;text-decoration:none;font-weight:600}
@media (max-width:767px){.blog{padding-top:26px}.blog-index-head p{font-size:16px}.blog-lead,.blog-more,.blog-related>div{grid-template-columns:1fr;gap:24px}.blog-lead{gap:12px}.blog-lead h2{font-size:27px}.blog-card h2{font-size:24px}.blog-reading{display:flex;flex-direction:column;gap:24px;margin-top:24px}.blog-toc{position:static;order:0}.blog-body{order:1}.blog-post-head h1{font-size:30px;line-height:1.25}.blog-deck{font-size:16px}.blog-body h2{font-size:23px}.blog-crumb{margin-bottom:12px}.blog-table th,.blog-table td{padding:10px;font-size:13px}.blog-meta{gap:4px 12px}.blog-header-account{font-size:12px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.blog-image-link{transition:none!important;transform:none!important}}