.recommended-articles{max-width:700px;margin:2rem auto;padding:20px}.recommended-articles h3{font-size:1.5rem;margin-bottom:1rem;border-bottom:2px solid #ccc;padding-bottom:.5rem}.articles-grid{display:flex;flex-direction:column;gap:1rem}.article-card{display:flex;flex-direction:row;background:#f9f9f9;border-radius:.5rem;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 2px 6px rgba(0,0,0,.1);transition:transform .2s,box-shadow .2s}.article-card:hover{transform:translateY(-4px);box-shadow:0 4px 12px rgba(0,0,0,.15)}.article-cover{width:120px;height:120px;object-fit:cover;flex-shrink:0}.article-info{padding:.5rem 1rem;display:flex;flex-direction:column;justify-content:center;flex:1 1}.article-title{font-size:1rem;margin:.2rem 0}.article-date{font-size:.85rem;color:#666;margin-bottom:.5rem}.article-tags{display:flex;flex-wrap:wrap;gap:.3rem}.article-tag{font-size:.75rem;background:#eee;padding:.15rem .5rem;border-radius:.25rem;color:#333}.toc-toggle{display:none}.toc-toggle:checked+.table-of-contents{right:0;z-index:1}.table-of-contents{padding:15px 25px;max-width:300px;background-color:hsla(0,0%,100%,.884);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:900;position:fixed;height:80vh;top:70px;right:-300px;box-sizing:border-box;overflow-y:auto;border-radius:10px;box-shadow:-2px 0 12px rgba(0,0,0,.1);transition:right .3s ease,background-color .3s ease}.table-of-contents ul{list-style:none;padding:0}.table-of-contents li{margin-bottom:20px}.table-of-contents a{padding:3px;font-size:14px;text-decoration:none;color:#181818;display:inline-block;transition:background-color .2s ease,transform .2s ease}.table-of-contents a:hover{background-color:hsla(0,0%,100%,.4);border-radius:5px;transform:scale(1.05)}