.portfolio-filters{padding:var(--space-8)0;background:var(--bg-secondary);border-bottom:1px solid var(--border-color)}.filter-buttons{display:flex;justify-content:center;gap:var(--space-4);flex-wrap:wrap}.filter-btn{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3)var(--space-6);border:2px solid var(--border-color);background:var(--bg-primary);color:var(--text-secondary);border-radius:var(--radius-lg);font-weight:600;cursor:pointer;transition:all var(--transition-fast)}.filter-btn:hover,.filter-btn.active{border-color:var(--accent-primary);background:var(--accent-primary);color:#fff}.portfolio-grid{padding:var(--space-16)0}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-8)}.project-item{background:var(--bg-secondary);border-radius:var(--radius-xl);overflow:hidden;border:1px solid var(--border-color);transition:all var(--transition-normal)}.project-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl);border-color:var(--accent-primary)}.project-image{position:relative;overflow:hidden;display:flex;justify-content:center;height:230px;background:var(--bg-tertiary);padding:10px}.project-image img{width:100%;object-fit:contain;transition:transform var(--transition-slow)}.project-item:hover .project-image img{transform:scale(1.05)}.project-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.8);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity var(--transition-normal)}.project-item:hover .project-overlay{opacity:1}.project-actions{display:flex;gap:var(--space-3)}.project-info{padding:var(--space-3)}.project-meta-info{display:flex;gap:var(--space-2);margin-bottom:var(--space-3);flex-wrap:wrap}.project-category-badge,.project-date-badge{display:flex;align-items:center;gap:var(--space-1);font-size:.75rem;font-weight:500;padding:var(--space-1)var(--space-2);border-radius:var(--radius-sm);border:1px solid var(--border-color)}.project-category-badge{color:var(--text-muted)}.project-date-badge{color:var(--text-muted)}.project-info h3{font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-3)}.project-info p{color:var(--text-secondary);margin-bottom:var(--space-4);line-height:1.6}.project-tags{display:flex;flex-wrap:wrap;gap:var(--space-2)}.tag{background:var(--bg-tertiary);color:var(--text-secondary);padding:var(--space-1)var(--space-3);border-radius:var(--radius-md);font-size:.75rem;font-weight:500;border:1px solid var(--border-color)}.portfolio-detail{padding:var(--space-16)0}.project-hero{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-6);align-items:center;margin-bottom:var(--space-20);background:var(--bg-secondary);border-radius:var(--radius-2xl);padding:var(--space-8);border:1px solid var(--border-color)}.project-meta{display:flex;gap:var(--space-4);margin-bottom:var(--space-6);flex-wrap:wrap}.project-category,.project-duration,.project-status{display:flex;align-items:center;gap:var(--space-1);font-size:.875rem;color:var(--text-muted);background:var(--bg-primary);padding:var(--space-2)var(--space-3);border-radius:var(--radius-md);border:1px solid var(--border-color)}.project-status.active{color:var(--accent-secondary)}.project-status.disable{color:var(--accent-danger)}.project-title{font-size:3rem;font-weight:800;color:var(--text-primary);margin-bottom:var(--space-4);line-height:1.1}.project-subtitle{font-size:1.25rem;color:var(--text-secondary);line-height:1.5;margin-bottom:var(--space-8)}.project-hero-image{position:relative;display:flex;justify-content:center;max-height:300px;padding:10px;border-radius:var(--radius-xl);background:var(--bg-tertiary)}.project-hero-image img{width:100%;object-fit:contain}.project-content{max-width:1000px;margin:0 auto}.project-hero-footer{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;padding-top:var(--space-8);border-top:1px solid var(--border-color);flex-wrap:wrap;gap:var(--space-4)}.project-hero-footer a,.project-hero-footer span{display:inline-flex;align-items:center;gap:var(--space-2);color:var(--text-secondary);font-weight:500;text-decoration:none;transition:color var(--transition-fast)}.project-hero-footer a:hover{color:var(--accent-primary)}.project-overview{margin-bottom:var(--space-16)}.overview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-8)}.overview-item{background:var(--bg-secondary);padding:var(--space-6);border-radius:var(--radius-xl);border:1px solid var(--border-color)}.overview-item h3{display:flex;align-items:center;gap:var(--space-2);font-size:1.25rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-3)}.overview-item p{color:var(--text-secondary);line-height:1.6;margin-bottom:var(--space-6)}.project-challenge{margin-bottom:var(--space-16)}.challenge-content{background:var(--bg-secondary);padding:var(--space-8);border-radius:var(--radius-xl);border:1px solid var(--border-color)}.challenge-content p{color:var(--text-secondary);line-height:1.7;margin-bottom:var(--space-6);font-size:1.125rem}.challenge-list{list-style:none;display:grid;gap:var(--space-4)}.challenge-list li{display:flex;align-items:flex-start;gap:var(--space-3);color:var(--text-secondary);line-height:1.6}.challenge-list li i{color:var(--accent-warning);margin-top:var(--space-1);flex-shrink:0}.project-solution{margin-bottom:var(--space-16)}.solution-content{background:var(--bg-secondary);padding:var(--space-8);border-radius:var(--radius-xl);border:1px solid var(--border-color)}.solution-content>p{color:var(--text-secondary);line-height:1.7;margin-bottom:var(--space-8);font-size:1.125rem}.solution-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-6)}.feature-card{background:var(--bg-primary);padding:var(--space-6);border-radius:var(--radius-lg);border:1px solid var(--border-color);transition:all var(--transition-normal)}.feature-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--accent-primary)}.feature-icon{width:48px;height:48px;background:var(--accent-primary);color:#fff;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-size:1.25rem;margin-bottom:var(--space-4)}.feature-card h3{font-size:1.125rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-2)}.feature-card p{color:var(--text-secondary);line-height:1.6;font-size:.875rem}.project-tech-stack{margin-bottom:var(--space-16)}.tech-stack-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-8)}.tech-category{background:var(--bg-secondary);padding:var(--space-6);border-radius:var(--radius-xl);border:1px solid var(--border-color)}.tech-category h3{display:flex;align-items:center;gap:var(--space-2);font-size:1.125rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-4)}.tech-list{display:flex;flex-wrap:wrap;gap:var(--space-3)}.tech-item{display:flex;align-items:center;gap:var(--space-3);background:var(--bg-primary);padding:var(--space-3);border-radius:var(--radius-md);border:1px solid var(--border-color);transition:all var(--transition-fast)}.tech-item:hover{background:var(--hover-bg);border-color:var(--accent-primary)}.tech-item i{color:var(--accent-primary);font-size:1.125rem;width:20px;text-align:center}.tech-item span{color:var(--text-secondary);font-weight:500}.project-gallery{margin-bottom:var(--space-16)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-6)}.gallery-item{position:relative;border-radius:var(--radius-xl);overflow:hidden;border:1px solid var(--border-color);transition:all var(--transition-normal)}.gallery-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.gallery-item img{width:100%;object-fit:cover;transition:transform var(--transition-slow)}.gallery-item:hover img{transform:scale(1.05)}.gallery-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.9));padding:var(--space-6);color:#fff;transform:translateY(100%);transition:transform var(--transition-normal);pointer-events:none}.gallery-item:hover .gallery-overlay{transform:translateY(0)}.gallery-overlay h4{font-size:1.125rem;font-weight:700;margin-bottom:var(--space-2)}.gallery-overlay p{font-size:.875rem;opacity:.9}.project-results{margin-bottom:var(--space-16)}.results-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-6)}.result-card{background:var(--bg-secondary);padding:var(--space-6);border-radius:var(--radius-xl);text-align:center;border:1px solid var(--border-color);transition:all var(--transition-normal)}.result-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--accent-primary)}.result-number{font-size:2.5rem;font-weight:800;color:var(--accent-primary);line-height:1;margin-bottom:var(--space-2)}.result-label{font-size:1.125rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-3)}.result-card p{color:var(--text-secondary);font-size:.875rem;line-height:1.5}.project-lessons{margin-bottom:var(--space-16)}.lessons-content{display:grid;gap:var(--space-6);grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.lesson-item{background:var(--bg-secondary);padding:var(--space-6);border-radius:var(--radius-xl);border:1px solid var(--border-color)}.lesson-item h3{display:flex;align-items:center;gap:var(--space-2);font-size:1.125rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-3)}.lesson-item h3 i{color:var(--accent-secondary)}.lesson-item p{color:var(--text-secondary);line-height:1.6}.project-testimonial{margin-bottom:var(--space-16)}.testimonial-card{background:var(--bg-secondary);padding:var(--space-8);border-radius:var(--radius-xl);border:1px solid var(--border-color);margin-bottom:var(--space-2)}.testimonial-content{margin-bottom:var(--space-6)}.testimonial-content p{font-size:1.25rem;color:var(--text-secondary);line-height:1.6;font-style:italic}.testimonial-author{display:flex;justify-content:space-between;align-items:center}.author-info h4{font-size:1.125rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-1)}.author-info p{color:var(--text-muted);font-size:.875rem}.testimonial-rating{display:flex;gap:var(--space-1)}.testimonial-rating i{color:var(--accent-warning)}.project-navigation{display:flex;justify-content:space-between;align-items:center;padding:var(--space-8)0;border-top:2px solid var(--border-color)}.related-projects{margin-bottom:var(--space-16)}.related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-8)}.related-project{background:var(--bg-secondary);border-radius:var(--radius-xl);overflow:hidden;border:1px solid var(--border-color);transition:all var(--transition-normal)}.related-project:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--accent-primary)}.related-project img{width:100%;height:150px;object-fit:cover}.related-content{padding:var(--space-6)}.related-content h3{font-size:1.125rem;font-weight:700;color:var(--text-primary);margin-bottom:var(--space-2)}.related-content p{color:var(--text-secondary);font-size:.875rem;line-height:1.5;margin-bottom:var(--space-4)}.related-tags{display:flex;gap:var(--space-2)}.project-changelog{margin-bottom:var(--space-16)}.changelog-list-wrapper{max-height:300px;overflow-y:auto;margin-right:calc(-1 * var(--space-4))}.changelog-list-wrapper::-webkit-scrollbar{width:8px}.changelog-list-wrapper::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:var(--radius-lg)}.changelog-list-wrapper::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:var(--radius-lg);border:2px solid var(--bg-secondary)}.changelog-list-wrapper::-webkit-scrollbar-thumb:hover{background-color:var(--text-muted)}.release-section{background-color:var(--bg-secondary);padding:var(--space-6);border-radius:var(--radius-md);margin-bottom:var(--space-8);box-shadow:var(--shadow-md);border:1px solid var(--border-color)}.changelog-list-wrapper .release-section:last-child{margin-bottom:0}.release-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4);padding-bottom:var(--space-4);border-bottom:1px solid var(--border-color)}.version{font-size:1.5rem;font-weight:700;color:var(--accent-primary)}.date{color:var(--text-muted);font-size:.9rem}.change-list{list-style:none;padding:0;margin:0}.change-item{display:flex;align-items:flex-start;margin-bottom:var(--space-4);line-height:1.6}.change-item:last-child{margin-bottom:0}.description{color:var(--text-secondary)}@media(max-width:768px){.filter-buttons{justify-content:center}.results-tabs{flex-wrap:wrap}.project-hero{grid-template-columns:1fr;gap:var(--space-8)}.project-title{font-size:2rem}.overview-grid{grid-template-columns:1fr}.tech-stack-grid{grid-template-columns:1fr}.solution-features{grid-template-columns:1fr}.gallery-grid{grid-template-columns:repeat(2,1fr)}.results-grid{grid-template-columns:repeat(2,1fr)}.related-grid{grid-template-columns:1fr}.project-navigation{flex-direction:column;gap:var(--space-6)}.testimonial-author{flex-direction:column;gap:var(--space-4);align-items:flex-start}}@media(max-width:480px){.project-title{font-size:1.75rem}.project-meta{flex-wrap:wrap;gap:var(--space-2)}.project-category-badge,.project-date-badge{font-size:.7rem;padding:var(--space-1)var(--space-2)}.results-grid{grid-template-columns:1fr}}.tag{font-size:.75rem;font-weight:600;padding:.2rem var(--space-2);border-radius:var(--radius-md);margin-right:var(--space-4);white-space:nowrap;text-transform:uppercase}.tag-new{background-color:var(--accent-primary);color:var(--text-primary)}.tag-fix{background-color:var(--accent-danger);color:var(--text-primary)}.tag-update{background-color:var(--accent-warning);color:var(--text-primary)}.tag-imp{background-color:var(--accent-secondary);color:var(--text-primary)}.share-buttons-container{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}.share-label{font-weight:600;color:var(--text-secondary)}.share-buttons{display:flex;gap:var(--space-3)}.share-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background-color:var(--bg-primary);color:var(--text-secondary);border:1px solid var(--border-color);font-size:1.2rem;transition:all var(--transition-fast)}.share-btn:hover{color:var(--accent-primary);background-color:var(--hover-bg);transform:translateY(-2px);border-color:var(--accent-primary)}.share-btn.telegram:hover{color:#24a1de;border-color:#24a1de}.share-buttons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:var(--space-4);padding:var(--space-4)}.share-grid-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4);background-color:var(--bg-primary);color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--radius-lg);text-decoration:none;font-weight:500;transition:all var(--transition-fast)}.share-grid-item:hover{background-color:var(--hover-bg);color:var(--accent-primary);transform:translateY(-2px)}.share-grid-item i{font-size:1.5rem}.share-offcanvas-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);opacity:0;visibility:hidden;transition:opacity var(--transition-normal);z-index:1040}.share-offcanvas-backdrop.show{opacity:1;visibility:visible}.share-offcanvas{position:fixed;bottom:0;left:0;width:100%;max-height:80vh;background-color:var(--bg-secondary);color:var(--text-primary);border-top:1px solid var(--border-color);border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl);box-shadow:var(--shadow-xl);z-index:1050;transform:translateY(100%);transition:transform var(--transition-normal);will-change:transform;display:flex;flex-direction:column}.share-offcanvas.show{transform:translateY(0)}.share-offcanvas-header{display:flex;justify-content:space-between;align-items:center;padding:var(--space-6);border-bottom:1px solid var(--border-color)}.share-offcanvas-title{font-size:var(--space-5);font-weight:700;color:var(--text-primary)}.share-offcanvas-close-btn{background:0 0;border:none;color:var(--text-muted);font-size:var(--space-6);cursor:pointer;transition:color var(--transition-fast)}.share-offcanvas-close-btn:hover{color:var(--text-primary)}.share-offcanvas-body{flex-grow:1;overflow-y:auto;-webkit-overflow-scrolling:touch}@media(min-width:768px){.share-offcanvas{top:50%;left:50%;bottom:auto;width:90%;max-width:500px;border-radius:var(--radius-xl);transform:translate(-50%,-50%)scale(.95);display:none}.share-offcanvas.show{transform:translate(-50%,-50%)scale(1);display:block}}