/* Blog — layered on /community/wolf.css */
body.blog{background:#161a21}
/* The shared .hero::before scrim is absolutely positioned; anchor it to the hero so it can't darken the posts below. */
.blog .hero{position:relative;isolation:isolate}
.blog main{padding-top:24px;padding-bottom:48px;max-width:46rem}
.blog .hero{padding-top:32px;padding-bottom:16px}
.blist{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.bcard{position:relative;padding:18px;border-radius:16px;background:#20242d;border:1px solid rgba(230,232,236,0.2);transition:border-color .2s,background .2s,transform .2s,box-shadow .2s}
.bcard:hover,.bcard:focus-within{border-color:rgba(79,70,229,0.6);background:#20242d;transform:translateY(-2px);box-shadow: 0 10px 30px rgba(0,0,0,0.35)}
.bcard h2{margin:0 0 6px;font-size:19px;line-height:1.3}.bcard h2 a{color:#e6e8ec;font-weight:700;text-decoration:none}.bcard h2 a::after{content:"";position:absolute;inset:0;border-radius:16px}.bcard h2 a:hover{color:var(--v300)}
.bcard p{margin:0;color:#e6e8ec;line-height:1.55}
.bcard .meta,.meta{font-size:13px;color:#a8acb5;margin-top:10px}
.crumbs{font-size:14px;margin:8px 0 12px}.crumbs a{color:#9a97e8}
.blog h1,.post h1{color:#e6e8ec;font-weight:800;font-size:30px;line-height:1.2;margin:0;letter-spacing:-.02em}@media(min-width:640px){.blog h1,.post h1{color:#e6e8ec;font-weight:800;font-size:38px}}
.post h2{color:#e6e8ec;font-weight:700;font-size:21px;margin:28px 0 8px}
.post p,.post li{font-size:16.5px;line-height:1.7;color:#e6e8ec}
.blog .lede{color:#e6e8ec}
.post a:not(.pill){color:#9a97e8;text-underline-offset:2px}
.post ul,.post ol{padding-left:1.3em}.post li{margin:4px 0}
.post code{font-size:.9em;background:rgba(230,232,236,0.08);padding:1px 6px;border-radius:6px}
.post .pill{display:inline-flex;align-items:center;min-height:44px;margin:6px 8px 0 0;text-decoration:none}
.more{margin-top:40px;padding-top:20px;border-top:1px solid rgba(230,232,236,0.1)}.more h2{font-size:17px}.more a{color:#9a97e8}.more li{margin:6px 0}