.view-toggle-container{position:relative;z-index:10;margin-bottom:2rem}.glass-card{background:rgba(255,255,255,.1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 32px rgba(0,0,0,.1),inset 0 1px rgba(255,255,255,.2)}.dark .glass-card{background:rgba(17,24,39,.3);border:1px solid rgba(75,85,99,.3);box-shadow:0 8px 32px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.1)}.view-toggle-buttons{display:flex;align-items:center;background:rgba(255,255,255,.1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);border-radius:.75rem;padding:.25rem;gap:.25rem;box-shadow:0 8px 32px rgba(0,0,0,.1),inset 0 1px rgba(255,255,255,.2)}.dark .view-toggle-buttons{background:rgba(17,24,39,.3);border:1px solid rgba(75,85,99,.3);box-shadow:0 8px 32px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.1)}.view-toggle-btn{display:flex;align-items:center;justify-content:center;padding:.5rem 1rem;border-radius:.5rem;border:none;background:0 0;color:#6b7280;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);min-width:2.5rem;height:2.5rem;position:relative;overflow:hidden;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.view-toggle-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient( 90deg,transparent,rgba(255,255,255,.2),transparent );transition:left .5s ease}.view-toggle-btn:hover::before{left:100%}.view-toggle-btn:hover{background:rgba(255,255,255,.15);color:#374151;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.15)}.dark .view-toggle-btn:hover{background:rgba(255,255,255,.1);color:#d1d5db}.view-toggle-btn.active,.view-toggle-btn:focus{background:rgba(59,130,246,.8);color:#fff;box-shadow:0 4px 20px rgba(59,130,246,.3),0 0 0 1px rgba(59,130,246,.5);outline:none;transform:translateY(-1px)}.view-toggle-btn:focus{outline:2px solid rgba(59,130,246,.5);outline-offset:2px}.posts-container{transition:all .5s cubic-bezier(.4,0,.2,1)}.posts-container.view-card{display:grid;grid-template-columns:1fr;gap:1.5rem}@media(min-width:768px){.posts-container.view-card{grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:2rem}}.posts-container.view-list{display:flex;flex-direction:column;gap:1rem}.posts-container.view-list .glass-card{border-radius:.75rem;padding:1rem;margin-bottom:0}.posts-container.view-list .glass-card:hover{background:rgba(255,255,255,.15);border-color:rgba(59,130,246,.3);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.15),0 0 0 1px rgba(59,130,246,.1),inset 0 1px rgba(255,255,255,.3)}.dark .posts-container.view-list .glass-card:hover{background:rgba(17,24,39,.4);border-color:rgba(59,130,246,.4);box-shadow:0 12px 40px rgba(0,0,0,.4),0 0 0 1px rgba(59,130,246,.2),inset 0 1px rgba(255,255,255,.15)}.glass-card::after{content:'';position:absolute;top:50%;left:50%;width:0;height:0;background:radial-gradient( circle,rgba(59,130,246,.1) 0%,rgba(59,130,246,5%) 50%,transparent 100% );border-radius:50%;transform:translate(-50%,-50%);transition:all .6s cubic-bezier(.4,0,.2,1);pointer-events:none;opacity:0}.glass-card:hover::after{width:200%;height:200%;opacity:1}.articles-grid.grid-view article{display:flex;flex-direction:column;background:rgba(255,255,255,.1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);border-radius:1rem;box-shadow:0 8px 32px rgba(0,0,0,.1),inset 0 1px rgba(255,255,255,.2);overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.articles-grid.grid-view article:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1);transform:translateY(-2px)}.articles-grid.grid-view .article-image{width:100%;height:12rem;object-fit:cover}.articles-grid.grid-view .article-content{padding:1.5rem;flex:1;display:flex;flex-direction:column}.articles-grid.grid-view .article-meta{margin-bottom:.75rem}.articles-grid.grid-view .article-title{font-size:1.25rem;font-weight:600;line-height:1.4;margin-bottom:.75rem;color:#111827}.articles-grid.grid-view .article-excerpt{color:#6b7280;line-height:1.6;flex:1;margin-bottom:1rem}.articles-grid.grid-view .article-footer{display:flex;align-items:center;justify-content:space-between;margin-top:auto}.articles-grid.list-view{gap:1.5rem !important}.articles-grid.list-view article{display:flex;flex-direction:row;background:#fff;border-radius:.5rem;box-shadow:0 1px 3px rgba(0,0,0,.1);overflow:hidden;transition:all .3s ease;min-height:10rem}.articles-grid.list-view article:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1);transform:translateX(4px)}.articles-grid.list-view .article-image{width:16rem;height:10rem;object-fit:cover;flex-shrink:0}.articles-grid.list-view .article-content{padding:1.5rem;flex:1;display:flex;flex-direction:column;justify-content:space-between}.articles-grid.list-view .article-header{flex:1}.articles-grid.list-view .article-meta{margin-bottom:.5rem}.articles-grid.list-view .article-title{font-size:1.5rem;font-weight:600;line-height:1.3;margin-bottom:.75rem;color:#111827}.articles-grid.list-view .article-excerpt{color:#6b7280;line-height:1.6;margin-bottom:1rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.articles-grid.list-view .article-footer{display:flex;align-items:center;justify-content:space-between}@media(max-width:768px){.view-toggle-container{justify-content:center;margin-bottom:1rem}.articles-grid.list-view article{flex-direction:column}.articles-grid.list-view .article-image{width:100%;height:12rem}.articles-grid.list-view .article-title{font-size:1.25rem}}.articles-grid{transition:all .3s ease}.articles-grid article{transition:all .3s ease}.view-toggle-loading .view-toggle-btn{opacity:.5;pointer-events:none}.view-toggle-btn:focus-visible{outline:2px solid #2563eb;outline-offset:2px}