.blog-container{max-width:800px;margin:0 auto;padding:4rem 1rem}.blog-title{font-size:2.5rem;font-weight:700;margin-bottom:2rem;color:var(--color-text)}.blog-grid{display:grid;gap:1.5rem}.blog-card{display:block;padding:1.5rem;border:1px solid rgba(var(--color-text-rgb, 0, 0, 0),.1);border-radius:8px;text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s}.blog-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.blog-card h2{font-size:1.5rem;margin-bottom:.5rem}.blog-card p{color:#666;margin-bottom:1rem}.blog-meta{font-size:.875rem;color:#888}.blog-article{max-width:800px;margin:0 auto;padding:calc(var(--header-height, 80px) + .5rem) 1rem 4rem 1rem;line-height:1.8;position:relative;z-index:1}.blog-back-link{text-decoration:none;color:var(--color-text);opacity:.7;margin-bottom:2rem;display:inline-block}.blog-header{margin-bottom:3rem;border-bottom:1px solid rgba(0,0,0,.1);padding-bottom:2rem}.blog-hero-wrapper{margin-bottom:2rem;border-radius:12px;overflow:hidden;box-shadow:0 10px 30px -10px #0003}.blog-hero-image{width:100%;height:auto;display:block;max-height:500px;object-fit:cover}.blog-header h1{margin-top:0;font-size:2.5rem;color:var(--color-text);line-height:1}.blog-content h1,.blog-content h2,.blog-content h3{margin-top:2.5rem;margin-bottom:1rem;color:var(--color-text);scroll-margin-top:100px;line-height:1}.blog-content h1{font-size:2.2rem}.blog-content h2{font-size:1.8rem}.blog-content h3{font-size:1.4rem}.blog-content p{margin-bottom:1.5rem;font-size:1.1rem}.blog-content ul{list-style:disc;padding-left:1.5rem;margin-bottom:1.5rem}.blog-inline-toc{background:rgba(var(--color-bg-rgb, 255, 255, 255),.5);border:1px solid rgba(0,0,0,.1);border-radius:8px;padding:1rem;margin-bottom:2rem;display:block;width:100%}.blog-toc-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}.blog-toc-header:hover{opacity:.8}.blog-toc-icon{display:flex;align-items:center}.blog-inline-toc h3{margin:0;font-size:1rem;text-transform:uppercase;letter-spacing:.05em;font-weight:600}.blog-toc-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.blog-inline-toc.open .blog-toc-content{grid-template-rows:1fr}.blog-toc-inner{overflow:hidden}.blog-inline-toc ul{list-style:none;padding:0;margin:0;opacity:0;transition:opacity .3s ease-out,margin-top .3s ease-out}.blog-inline-toc.open ul{opacity:1;margin:1rem 0 0}.blog-inline-toc li{margin-bottom:.25rem;font-size:.95rem}.blog-inline-toc a{text-decoration:none;color:var(--color-text);opacity:.8;transition:opacity .2s}.blog-inline-toc a:hover{opacity:1;color:var(--color-primary, #007bff);text-decoration:underline}.reading-progress-container{position:fixed;top:0;left:0;width:100%;height:4px;background:transparent;z-index:1000}.reading-progress-bar{height:100%;background:var(--color-primary, #00ff9d);width:0%;transition:width .1s ease-out;box-shadow:0 0 10px var(--color-primary-glow, rgba(0, 255, 157, .5))}
