.page-content[data-v-192579dd]{background:var(--color-bg-primary,#fff);min-height:100vh;padding:100px 2rem 2rem;position:relative}.blog-container[data-v-192579dd]{margin:0 auto;max-width:1200px;position:relative;z-index:1}.blog-layout[data-v-192579dd]{align-items:start;display:grid;gap:2rem;grid-template-columns:280px 1fr;margin-top:2rem}.sidebar[data-v-192579dd]{backdrop-filter:blur(10px);background:hsla(0,0%,100%,.95);border:1px solid hsla(0,0%,100%,.2);border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,.1);padding:1.5rem;position:sticky;top:120px;transition:all .3s ease}.sidebar[data-v-192579dd]:hover{box-shadow:0 8px 25px rgba(0,0,0,.12);transform:translateY(-1px)}.search-box[data-v-192579dd]{margin-bottom:2rem}.search-input[data-v-192579dd]{backdrop-filter:blur(5px);background:rgba(248,249,250,.8);border:2px solid transparent;border-radius:12px;font-size:.9rem;padding:.75rem;transition:all .3s ease;width:calc(100% - 1.5rem)}.search-input[data-v-192579dd]:focus{background:hsla(0,0%,100%,.9);border-color:#2c3e50;box-shadow:0 2px 8px rgba(44,62,80,.15);outline:none;transform:scale(1.01)}.search-input[data-v-192579dd]::-moz-placeholder{color:rgba(44,62,80,.6)}.search-input[data-v-192579dd]::placeholder{color:rgba(44,62,80,.6)}.filter-section[data-v-192579dd]{margin-bottom:2rem}.filter-section h3[data-v-192579dd]{border-bottom:2px solid var(--color-brand,#2c3e50);color:var(--color-brand,#2c3e50);font-size:1.1rem;font-weight:600;margin-bottom:1rem;padding-bottom:.5rem}.category-list[data-v-192579dd]{display:flex;flex-direction:column;gap:.2rem;transform:translateX(-8px)}.filter-item[data-v-192579dd]{align-items:center;border-radius:8px;cursor:pointer;display:flex;gap:.5rem;overflow:hidden;padding:.5rem .5rem .5rem 2rem;position:relative;transition:all .3s ease}.filter-item[data-v-192579dd]:before{background:linear-gradient(90deg,transparent,rgba(227,242,253,.8),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%;z-index:0}.filter-item[data-v-192579dd]:hover{background:rgba(227,242,253,.8);transform:translateX(2px)}.filter-item[data-v-192579dd]:hover:before{left:100%}.filter-item input[type=checkbox][data-v-192579dd]{cursor:pointer;height:0;left:0;opacity:0;position:absolute;top:0;width:0}.filter-item[data-v-192579dd]:after{background:#fff;border:2px solid #2c3e50;border-radius:4px;box-shadow:0 2px 4px rgba(44,62,80,.1);content:"";height:16px;left:.5rem;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s cubic-bezier(.175,.885,.32,1.275);width:16px;z-index:1}.filter-item input[type=checkbox]:checked+span[data-v-192579dd]:before{animation:checkmark-192579dd .5s cubic-bezier(.175,.885,.32,1.275);color:#fff;content:"";font-size:12px;font-weight:700;left:-1.2rem;position:absolute;top:50%;transform:translateY(-50%);z-index:3}.filter-item input[type=checkbox][data-v-192579dd]:checked~*{position:relative}.filter-item[data-v-192579dd]:hover:after{border-color:#34495e;box-shadow:0 3px 6px rgba(44,62,80,.15);transform:translateY(-50%) scale(1.02)}.filter-item[data-v-192579dd]:has(input[type=checkbox]:checked):after{animation:checkboxBounce-192579dd .5s cubic-bezier(.175,.885,.32,1.275);background:#2c3e50;border-color:#2c3e50;box-shadow:0 4px 8px rgba(44,62,80,.2);transform:translateY(-50%) scale(1.05)}.filter-item[data-v-192579dd]:has(input[type=checkbox]:checked):hover:after{box-shadow:0 5px 10px rgba(44,62,80,.25);transform:translateY(-50%) scale(1.08)}@keyframes checkmark-192579dd{0%{opacity:0;transform:translateY(-50%) scale(0) rotate(-45deg)}50%{opacity:1;transform:translateY(-50%) scale(1.3) rotate(0deg)}to{opacity:1;transform:translateY(-50%) scale(1) rotate(0deg)}}@keyframes checkboxBounce-192579dd{0%{transform:translateY(-50%) scale(1)}50%{transform:translateY(-50%) scale(1.15)}to{transform:translateY(-50%) scale(1.05)}}.filter-item span[data-v-192579dd]:first-of-type{color:#333;flex:1;font-size:.9rem}.filter-item .count[data-v-192579dd]{color:#999;flex:none;font-size:.8rem;margin-left:auto}.tag-list[data-v-192579dd]{display:flex;flex-wrap:wrap;gap:.5rem}.tag-item[data-v-192579dd]{align-items:center;background:hsla(0,0%,100%,.8);border:1px solid rgba(44,62,80,.3);border-radius:20px;cursor:pointer;display:flex;font-size:.8rem;gap:.3rem;margin:.05rem 0;overflow:hidden;padding:.3rem .6rem .3rem 1.8rem;position:relative;transition:all .3s ease}.tag-item[data-v-192579dd]:before{background:#2c3e50;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease;z-index:0}.tag-item[data-v-192579dd]:hover{box-shadow:0 2px 8px rgba(44,62,80,.2);transform:translateY(-1px) scale(1.02)}.tag-item[data-v-192579dd]:hover:before{opacity:.1}.tag-item input[type=checkbox][data-v-192579dd]{cursor:pointer;height:0;left:0;opacity:0;position:absolute;top:0;width:0}.tag-item[data-v-192579dd]:after{background:#fff;border:2px solid #2c3e50;border-radius:50%;box-shadow:0 2px 4px rgba(44,62,80,.1);content:"";height:14px;left:.5rem;position:absolute;top:50%;transform:translateY(-50%);transition:all .4s cubic-bezier(.175,.885,.32,1.275);width:14px;z-index:1}.tag-item input[type=checkbox]:checked+.tag-name[data-v-192579dd]:before{animation:checkmark-small-192579dd .5s cubic-bezier(.175,.885,.32,1.275);color:#fff;content:"✓";font-size:10px;font-weight:700;left:-1.35rem;position:absolute;top:50%;transform:translateY(-50%);z-index:3}.tag-item[data-v-192579dd]:hover:after{border-color:#34495e;box-shadow:0 3px 6px rgba(44,62,80,.15);transform:translateY(-50%) scale(1.02)}.tag-item[data-v-192579dd]:has(input[type=checkbox]:checked):after{animation:checkboxBounceSmall-192579dd .5s cubic-bezier(.175,.885,.32,1.275);background:#2c3e50;border-color:#2c3e50;box-shadow:0 4px 8px rgba(44,62,80,.118);transform:translateY(-50%) scale(1.05)}.tag-item[data-v-192579dd]:has(input[type=checkbox]:checked):hover:after{box-shadow:0 5px 10px rgba(44,62,80,.06);transform:translateY(-50%) scale(1.08)}@keyframes checkmark-small-192579dd{0%{opacity:0;transform:translateY(-50%) scale(0) rotate(-45deg)}50%{opacity:1;transform:translateY(-50%) scale(1.3) rotate(0deg)}to{opacity:1;transform:translateY(-50%) scale(1) rotate(0deg)}}@keyframes checkboxBounceSmall-192579dd{0%{transform:translateY(-50%) scale(1)}50%{transform:translateY(-50%) scale(1.15)}to{transform:translateY(-50%) scale(1.05)}}.tag-name[data-v-192579dd]{color:#555}.sort-options[data-v-192579dd]{display:flex;flex-direction:column}.sort-select[data-v-192579dd]{-webkit-appearance:none;-moz-appearance:none;appearance:none;backdrop-filter:blur(5px);background:rgba(248,249,250,.8);background-image:url('data:image/svg+xml;charset=US-ASCII,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"%3E%3Cpath fill="%232C3E50" d="M2 0L0 2h4zm0 5L0 3h4z"/%3E%3C/svg%3E');background-position:right .75rem center;background-repeat:no-repeat;background-size:12px;border:2px solid transparent;border-radius:12px;color:#2c3e50;cursor:pointer;font-size:.9rem;padding:.75rem 2.5rem .75rem .75rem;transition:all .3s ease;width:100%}.sort-select[data-v-192579dd]:focus{background:hsla(0,0%,100%,.9);border-color:#2c3e50;box-shadow:0 2px 8px rgba(44,62,80,.15);outline:none;transform:scale(1.01)}.sort-select[data-v-192579dd]:hover{background:hsla(0,0%,100%,.9);box-shadow:0 2px 8px rgba(44,62,80,.1);transform:translateY(-1px)}.sort-select option[data-v-192579dd]{background:#fff;color:#2c3e50;padding:.5rem}.main-content[data-v-192579dd]{border-radius:16px;transition:all .3s ease}.main-content[data-v-192579dd]:hover{transform:translateY(-1px)}.loading[data-v-192579dd],.no-articles[data-v-192579dd]{color:#666;font-size:1.1rem;padding:3rem;text-align:center}.loading[data-v-192579dd]{position:relative}.loading[data-v-192579dd]:after{animation:spin-192579dd 1s linear infinite;border:2px solid #2c3e50;border-radius:50%;border-top-color:transparent;content:"";height:20px;left:50%;margin:-10px 0 0 -10px;position:absolute;top:50%;width:20px}@keyframes spin-192579dd{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.article-list[data-v-192579dd]{display:flex;flex-direction:column;gap:2rem}.article-link[data-v-192579dd]{color:inherit;display:block;text-decoration:none;transition:all .3s ease}.article-item[data-v-192579dd]{background:#fff;border:1px solid rgba(227,242,253,.8);border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.1);cursor:pointer;overflow:hidden;padding:.5rem 1.5rem;position:relative;transition:all .4s cubic-bezier(.4,0,.2,1)}.article-link:hover .article-item[data-v-192579dd]{border-color:#2c3e50;box-shadow:0 4px 15px rgba(44,62,80,.15);transform:translateY(-2px) scale(1.01)}.article-link:hover .article-item[data-v-192579dd]:before{left:100%}.article-header[data-v-192579dd]{margin-bottom:1rem}.article-title[data-v-192579dd]{color:#2c3e50;font-size:1.4rem;font-weight:600;line-height:1.4;margin-bottom:.5rem;transition:color .3s ease}.article-link:hover .article-title[data-v-192579dd]{color:#2c3e50}.article-meta[data-v-192579dd]{align-items:center;color:#666;display:flex;font-size:.85rem;gap:1rem}.category[data-v-192579dd]{background:#2c3e50;border-radius:15px;box-shadow:0 2px 8px rgba(44,62,80,.3);color:#fff;font-weight:500;padding:.3rem .8rem;transition:all .3s ease}.article-link:hover .category[data-v-192579dd]{box-shadow:0 2px 8px rgba(44,62,80,.3);transform:scale(1.02)}.topped[data-v-192579dd]{animation:pulse-192579dd 2s infinite;background:linear-gradient(135deg,#ff6b6b,#ee5a24);border-radius:15px;box-shadow:0 2px 8px rgba(238,90,36,.3);color:#fff;font-weight:500;padding:.3rem .8rem}@keyframes pulse-192579dd{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes fadeInUp-192579dd{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft-192579dd{0%{opacity:0;transform:translateX(-50px)}to{opacity:1;transform:translateX(0)}}@keyframes slideInRight-192579dd{0%{opacity:0;transform:translateX(50px)}to{opacity:1;transform:translateX(0)}}.article-summary[data-v-192579dd]{color:#666;display:-webkit-box;line-height:1.6;margin-bottom:1rem;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.article-tags[data-v-192579dd]{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:15px}.article-tag[data-v-192579dd]{background:rgba(227,242,253,.8);border:1px solid rgba(44,62,80,.3);border-radius:15px;color:#555;font-size:.8rem;font-weight:500;padding:.3rem .6rem;transition:all .3s ease}.article-link:hover .article-tag[data-v-192579dd]{background:#e3f2fd;box-shadow:0 1px 3px rgba(44,62,80,.15);transform:translateY(-.5px)}.pagination[data-v-192579dd]{align-items:center;border-top:1px solid #eee;display:flex;gap:1rem;justify-content:center;margin-top:2rem;padding-top:2rem}.page-btn[data-v-192579dd]{background:#2c3e50;border:2px solid transparent;border-radius:25px;color:#fff;cursor:pointer;font-weight:500;overflow:hidden;padding:.75rem 1.5rem;position:relative;transition:all .3s ease}.page-btn[data-v-192579dd]:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s ease;width:100%}.page-btn[data-v-192579dd]:hover:not(:disabled){background:#34495e;box-shadow:0 3px 12px rgba(44,62,80,.3);transform:translateY(-1px)}.page-btn[data-v-192579dd]:hover:not(:disabled):before{left:100%}.page-btn[data-v-192579dd]:disabled{background:#ccc;cursor:not-allowed;opacity:.5}.page-info[data-v-192579dd]{color:#666;font-size:.9rem}@media (max-width:768px){.blog-layout[data-v-192579dd]{gap:1rem;grid-template-columns:1fr}.sidebar[data-v-192579dd]{order:2;position:static}.main-content[data-v-192579dd]{order:1}.page-content[data-v-192579dd]{padding:100px 1rem 2rem}.blog-title[data-v-192579dd]{font-size:2rem}.blog-subtitle[data-v-192579dd]{font-size:1rem}.article-meta[data-v-192579dd]{flex-direction:column;gap:.5rem}.article-item[data-v-192579dd]{padding:1rem}.article-title[data-v-192579dd]{font-size:1.2rem}.tag-list[data-v-192579dd]{justify-content:center}.pagination[data-v-192579dd]{flex-direction:column;gap:.5rem}.page-btn[data-v-192579dd]{font-size:.9rem;padding:.5rem 1rem}}html.dark .blog-page .sidebar{background:var(--color-bg-secondary);border-color:var(--color-border);box-shadow:0 8px 32px var(--color-shadow)}html.dark .blog-page .search-input,html.dark .blog-page .sort-select{background:var(--color-bg-input);border-color:var(--color-border);color:var(--color-text-primary)}html.dark .blog-page .search-input:focus,html.dark .blog-page .sort-select:focus{background:var(--color-bg-secondary);border-color:var(--color-brand);box-shadow:0 2px 8px var(--color-shadow-brand)}html.dark .blog-page .search-input::-moz-placeholder{color:var(--color-text-muted)}html.dark .blog-page .search-input::placeholder{color:var(--color-text-muted)}html.dark .blog-page .filter-item,html.dark .blog-page .loading,html.dark .blog-page .no-articles,html.dark .blog-page .page-info,html.dark .blog-page .tag-item{color:var(--color-text-secondary)}html.dark .blog-page .filter-item:hover,html.dark .blog-page .tag-item:hover{background:var(--color-bg-hover)}html.dark .blog-page .filter-item span:first-of-type,html.dark .blog-page .tag-name{color:var(--color-text-primary)}html.dark .blog-page .filter-item .count{color:var(--color-text-muted)}html.dark .blog-page .filter-item:after,html.dark .blog-page .tag-item:after{background:var(--color-bg-card);border-color:var(--color-brand)}html.dark .blog-page .filter-item:has(input[type=checkbox]:checked):after,html.dark .blog-page .tag-item:has(input[type=checkbox]:checked):after{background:var(--color-brand);border-color:var(--color-brand)}html.dark .blog-page .article-item{background:var(--color-bg-card);border-color:var(--color-border-light);box-shadow:0 2px 8px var(--color-shadow)}html.dark .blog-page .article-link:hover .article-title,html.dark .blog-page .article-title{color:var(--color-brand)}html.dark .blog-page .article-meta,html.dark .blog-page .article-summary{color:var(--color-text-secondary)}html.dark .blog-page .article-tag{background:var(--color-tag-bg);border-color:var(--color-border);color:var(--color-tag-text)}html.dark .blog-page .pagination{border-top-color:var(--color-border)}html.dark .blog-page .page-btn{background:var(--color-brand);color:var(--color-text-inverse)}html.dark .blog-page .page-btn:hover:not(:disabled){background:var(--color-brand-light)}html.dark .blog-page .page-btn:disabled{background:var(--color-border);color:var(--color-text-muted)}