:root{--color-bg: transparent;--color-card-bg: rgba(255, 255, 255, .6);--color-text: #2d3748;--color-code: #b6d0ff;--color-text-light: #4a5568;--color-heading: #1a202c;--color-accent: #5a67d8;--color-accent-dark: #4c51bf;--color-accent-light: #7886d7;--color-border: rgba(226, 232, 240, .8);--color-bg-secondary: rgba(247, 250, 252, .8);--color-code-bg: rgba(237, 242, 247, .9);--color-inline-code: #805ad5;--color-tag: #6b7280;--color-tag-hover: #4a5568;--backdrop-blur: blur(10px);--content-width: 1200px;--content-padding-x: 1rem;--gradient-start: #4f46e5;--gradient-end: #7c3aed;--gradient-hover-start: #4338ca;--gradient-hover-end: #6d28d9;--button-text: #f8fafc;--button-text-hover: #ffffff;--button-shadow: rgba(79, 70, 229, .35)}.blog-container{width:100%;min-height:100vh;padding:var(--spacing-sm) var(--content-padding-x, 1rem);background-color:transparent}.content-wrapper{max-width:var(--content-width, 1200px);margin:0 auto}.page-header{text-align:center;margin-bottom:3rem;padding:2rem;background-color:var(--color-card-bg, rgba(255, 255, 255, .6));backdrop-filter:var(--backdrop-blur, blur(10px));-webkit-backdrop-filter:var(--backdrop-blur, blur(10px));border-radius:1.5rem;box-shadow:0 8px 32px #0000001a}.search-container{margin-top:2rem}.search-box{display:flex;flex-direction:column;gap:1rem;max-width:800px;margin:0 auto}.search-input{width:100%;padding:1rem 1.5rem;font-size:1.125rem;border:1px solid rgba(255,255,255,.2);border-radius:.75rem;background-color:#fffc;backdrop-filter:var(--backdrop-blur, blur(10px));-webkit-backdrop-filter:var(--backdrop-blur, blur(10px));transition:all .2s ease}.search-input:focus{outline:none;border-color:var(--color-accent, #5a67d8);box-shadow:0 0 0 3px #5a67d81a}.tags-filter{display:flex;flex-direction:column;gap:.75rem;align-items:center}.tags-filter-label{font-size:.875rem;color:var(--color-text, #2d3748);margin-bottom:-.25rem}.tags-list{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.tag-filter{padding:.5rem 1rem;border:1px solid rgba(255,255,255,.2);border-radius:2rem;background-color:#fff9;color:var(--color-text, #2d3748);font-size:.875rem;cursor:pointer;transition:all .2s ease}.tag-filter:hover{background-color:#fffc}.tag-filter.active{background-color:var(--color-accent, #5a67d8);color:#fff;border-color:transparent}h1{font-size:clamp(2.5rem,5vw,3.5rem);font-weight:700;color:var(--color-heading, #1a202c);margin-bottom:1rem;letter-spacing:-.025em;line-height:1.2}.subtitle{font-size:clamp(1.125rem,2vw,1.25rem);color:var(--color-text-light, #4a5568);max-width:42rem;margin:0 auto;line-height:1.6}.posts-list{display:flex;flex-direction:column;gap:2rem}.post-item{background-color:var(--color-card-bg, rgba(255, 255, 255, .6));border-radius:1rem;overflow:hidden;transition:all .3s ease;box-shadow:0 4px 6px -1px #0000001a;backdrop-filter:var(--backdrop-blur, blur(10px));-webkit-backdrop-filter:var(--backdrop-blur, blur(10px));border:1px solid rgba(255,255,255,.2)}.post-item:hover{transform:translateY(-4px);box-shadow:0 12px 20px -6px #00000026}.post-link{text-decoration:none;color:inherit;display:block}.post-content{padding:1.5rem}.post-main{display:flex;gap:2rem;align-items:flex-start}.post-header{flex:1}.post-meta{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;font-size:clamp(.75rem,1vw,.875rem);color:var(--color-text-light, #4a5568);flex-wrap:wrap}.tags{display:flex;gap:.5rem;flex-wrap:wrap}.tag{color:var(--color-tag, #6b7280);font-size:clamp(.75rem,1vw,.875rem)}h2{font-size:clamp(1.25rem,1.5vw,1.5rem);font-weight:600;line-height:1.4;margin-bottom:.75rem;color:var(--color-heading, #1a202c)}.post-link:hover h2{color:var(--color-accent, #5a67d8)}.description{color:var(--color-text, #2d3748);font-size:clamp(.875rem,1.1vw,1rem);line-height:1.6;margin:0}.post-image{flex:0 0 200px;aspect-ratio:16 / 9;overflow:hidden;border-radius:.5rem}.post-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.post-item:hover .post-image img{transform:scale(1.05)}@media (max-width: 1024px){.page-header{padding:1.5rem;margin-bottom:2rem}.posts-list,.post-main{gap:1.5rem}.post-image{flex:0 0 180px}}@media (max-width: 768px){.page-header{padding:1.25rem;margin-bottom:1.5rem;border-radius:1rem}.post-main{flex-direction:column-reverse}.post-image{flex:none;width:100%;max-height:150px}.post-content{padding:1.25rem}.search-input{padding:.875rem 1.25rem;font-size:1rem}}@media (max-width: 480px){.page-header,.post-content{padding:1rem}.post-meta{flex-direction:column;align-items:flex-start;gap:.5rem}.search-box{gap:.75rem}.tag-filter{padding:.375rem .75rem;font-size:.813rem}}