.page-container{max-width:1280px;margin:0 auto;padding:2rem;font-family:sans-serif}.top-bar{justify-content:space-between;margin-bottom:1.5rem}.top-bar,.user-block{display:flex;align-items:center}.user-block{gap:1rem}.user-name{font-weight:700;font-size:1rem}.user-avatar{width:40px;height:40px;background:#00a8cc;color:#fff;border-radius:50%;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:pointer}.topic-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 2rem}.topic-tag{padding:.5rem 1rem;border-radius:20px;background:rgba(0,168,204,.2784313725);color:#333;font-size:.95rem;cursor:pointer;transition:.2s}.topic-tag.active,.topic-tag:hover{background:#00a8cc;color:#fff}.article-list{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:1.5rem;gap:1.5rem}@media screen and (max-width:900px){.article-list{grid-template-columns:repeat(1,1fr)}}.article-card{border:1px solid #ddd;border-radius:8px;transition:.2s}.article-card:hover{box-shadow:0 2px 10px rgba(0,0,0,.1)}.article-card img{width:100%;height:275px;object-fit:cover}.article-card span{padding:.75rem;display:block;font-size:.95rem;color:#333}.avatar-dropdown{position:relative}.avatar-dropdown .user-avatar{width:40px;height:40px;background:#00a8cc;color:#fff;border-radius:50%;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:pointer}.avatar-dropdown .dropdown-menu{position:absolute;top:48px;right:0;background:#fff;border:1px solid #ccc;border-radius:6px;box-shadow:0 2px 6px rgba(0,0,0,.1);width:210px;z-index:10}.avatar-dropdown .dropdown-menu div{padding:.75rem 1rem;cursor:pointer;font-size:.95rem;color:#333}.avatar-dropdown .dropdown-menu div:hover{background-color:#f2f2f2}.load-more-wrapper{text-align:center;margin-top:2rem}.load-more-button{padding:.75rem 1.5rem;background:#0077c2;color:#fff;font-weight:700;border:none;border-radius:6px;cursor:pointer}.no-articles{margin-top:2rem;color:#b71c1c;font-weight:500}.article-card{background:#fff;border-radius:10px;height:450px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.07);transition:box-shadow .3s;cursor:pointer;display:flex;flex-direction:column}.article-card:hover{box-shadow:0 6px 18px rgba(0,0,0,.12)}@media screen and (max-width:900px){.article-card{height:auto}}.article-image{width:100%;height:180px;object-fit:cover}.article-content{padding:1rem}.article-title{font-size:16px;font-weight:700;color:#111;line-height:1.4}