.post-page{display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);grid-template-areas:"sidebar content";gap:var(--gap);align-items:start;padding-block:2.5rem}.post-page__sidebar{grid-area:sidebar;position:sticky;top:5rem;max-height:calc(100vh - 6rem);overflow-y:auto;overflow-x:hidden;padding-right:1rem;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.post-page__content{grid-area:content;max-width:var(--content-max-width)}@media(max-width:1023px){.post-page{grid-template-columns:1fr;grid-template-areas:"content"}.post-page__sidebar{display:none}}.prose{color:var(--text-primary);line-height:var(--line-height-body)}.prose>*+*{margin-top:1.25rem}.prose h2,.prose h3,.prose h4{margin-top:2.25rem;margin-bottom:.75rem;scroll-margin-top:5rem}.prose h2{padding-bottom:.4rem;border-bottom:1px solid var(--border)}.prose a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.prose ul,.prose ol{padding-left:1.75rem}.prose li+li{margin-top:.35rem}.prose img{border-radius:8px;border:1px solid var(--border);margin-block:1.5rem}.post-header{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--border)}.post-header__category{margin-bottom:.75rem}.post-header__title{margin-bottom:.75rem;line-height:1.2}.post-header__description{font-size:1.1rem;color:var(--text-secondary);line-height:1.6;margin-bottom:1rem}.post-header__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;font-size:.85rem;color:var(--text-muted)}.post-header__tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.prose pre,pre.astro-code{position:relative;background-color:var(--code-bg)!important;border:1px solid var(--code-border);border-radius:8px;padding:1.25rem;overflow-x:auto;margin-block:1.5rem;font-size:.875rem;line-height:1.65;tab-size:2}pre.astro-code span{color:var(--shiki-dark)!important;font-style:var(--shiki-dark-font-style)!important;font-weight:var(--shiki-dark-font-weight)!important;text-decoration:var(--shiki-dark-text-decoration)!important;transition:color var(--transition)}[data-theme=light] pre.astro-code span{color:var(--shiki-light)!important;font-style:var(--shiki-light-font-style)!important;font-weight:var(--shiki-light-font-weight)!important;text-decoration:var(--shiki-light-text-decoration)!important}.code-block-wrapper{margin-block:1.5rem}.code-block-wrapper pre,.code-block-wrapper pre.astro-code{margin-block:0;border-top-left-radius:0;border-top-right-radius:0}.code-filename{display:inline-block;font-family:var(--font-mono);font-size:.75rem;padding:.3rem .85rem;background-color:var(--code-border);color:var(--text-secondary);border:1px solid var(--code-border);border-bottom:none;border-radius:6px 6px 0 0}.copy-btn{position:absolute;top:.6rem;right:.6rem;font-family:var(--font-mono);font-size:.7rem;font-weight:600;padding:.3rem .65rem;border-radius:5px;border:1px solid var(--code-border);background-color:var(--bg-secondary);color:var(--text-muted);cursor:pointer;opacity:0;transition:opacity var(--transition),color var(--transition),background-color var(--transition);pointer-events:none}pre:hover .copy-btn,.copy-btn:focus-visible{opacity:1;pointer-events:auto}.copy-btn.copied{color:var(--accent);border-color:var(--accent);opacity:1}.post-hero{margin-bottom:2rem;border-radius:10px;overflow:hidden;border:1px solid var(--border);line-height:0}.post-hero__img{width:100%;height:auto;display:block;aspect-ratio:1200 / 630;object-fit:cover;border-radius:10px;border:none;margin:0}.like-icon-wrap{display:inline-flex;align-items:center;gap:.3rem}.like-icon-btn .like-btn__heart{width:1rem;height:1rem;flex-shrink:0;transition:fill var(--transition),stroke var(--transition)}.like-icon-btn:hover{color:#f43f5e;border-color:#f43f5e;background-color:#f43f5e14}.like-icon-btn.liked{color:#f43f5e;border-color:#f43f5e;background-color:#f43f5e1a}.like-icon-btn.liked .like-btn__heart{fill:#f43f5e;stroke:#f43f5e}.like-icon-count{font-size:.75rem;font-weight:600;color:var(--text-secondary);min-width:1ch;line-height:1}@keyframes like-pop{0%{transform:scale(1)}40%{transform:scale(1.35)}70%{transform:scale(.9)}to{transform:scale(1)}}.like-icon-btn.pop .like-btn__heart{animation:like-pop .35s ease forwards}.mermaid-wrapper{margin-block:1.75rem;background-color:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;padding:1.5rem;overflow-x:auto;text-align:center}.mermaid-wrapper svg{max-width:100%;height:auto}
