*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#1a1a1a;background-color:#f0f9ff;min-height:100vh;font-family:Segoe UI,system-ui,sans-serif}img{max-width:100%;display:block}button{cursor:pointer;background:0 0;border:none;font-family:inherit}a{color:inherit;text-decoration:none}ul{list-style:none}.navbar{z-index:100;background-color:#fff;border-bottom:1px solid #e0e0e0;justify-content:space-between;align-items:center;height:56px;padding:0 1rem;display:flex;position:sticky;top:0}.navbar__logo{color:#4052d6;font-size:clamp(1.1rem,2.5vw,1.4rem);font-weight:700}.navbar__links{align-items:center;gap:clamp(.5rem,2vw,1.5rem);display:flex}.navbar__links a{color:#555;border-radius:20px;padding:6px 12px;font-size:clamp(.85rem,1.5vw,1rem);font-weight:500;transition:color .2s}.navbar__username{color:#1a1a1a;font-size:clamp(.85rem,1.5vw,1rem);font-weight:600}.navbar__logout{color:#e53935;border:1px solid #e53935;border-radius:20px;padding:6px 12px;font-size:clamp(.8rem,1.5vw,.95rem);font-weight:500;transition:all .2s}.navbar__logout:hover{color:#fff;background-color:#e53935}.navbar__links a:hover{color:#00d1d1;background-color:#e8f4f8}.page{max-width:720px;margin:0 auto;padding:clamp(1rem,3vw,2rem) 1rem}.feed{flex-direction:column;gap:1rem;display:flex}.form-post{background:#fff;border-radius:12px;flex-direction:column;gap:.75rem;padding:clamp(1rem,3vw,1.5rem);display:flex;box-shadow:0 1px 4px #00000014}.form-post textarea{resize:none;border:1px solid #e0e0e0;border-radius:8px;outline:none;width:100%;min-height:80px;padding:.75rem;font-family:inherit;font-size:clamp(.9rem,1.5vw,1rem);transition:border-color .2s}.form-post textarea:focus{border-color:#4052d6}.form-post__error{color:#e53935;font-size:.8rem}.form-post__btn{color:#fff;background-color:#4052d6;border-radius:20px;align-self:flex-end;padding:8px 20px;font-size:clamp(.85rem,1.5vw,.95rem);font-weight:600;transition:background-color .2s}.form-post__btn:hover{background-color:#3444c4}.form-post__btn:disabled{opacity:.6;cursor:not-allowed}.post-card{background:#fff;border-radius:12px;transition:box-shadow .2s;overflow:hidden;box-shadow:0 1px 4px #00000014}.post-card__header{align-items:center;gap:.75rem;padding:clamp(.75rem,2vw,1rem);display:flex}.post-card__avatar{color:#fff;background-color:#4052d6;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:1rem;font-weight:700;display:flex}.post-card__author{color:#1a1a1a;font-size:clamp(.9rem,1.5vw,1rem);font-weight:600}.post-card__date{color:#888;font-size:clamp(.75rem,1.2vw,.85rem)}.post-card__image{object-fit:cover;width:100%;max-height:400px}.post-card__content{color:#333;padding:clamp(.75rem,2vw,1rem);font-size:clamp(.9rem,1.5vw,1rem);line-height:1.6}.post-card__footer{border-top:1px solid #f0f0f0;align-items:center;gap:.5rem;padding:.5rem clamp(.75rem,2vw,1rem);display:flex}.post-card__like-btn,.post-card__comment-btn{color:#555;border-radius:20px;align-items:center;gap:6px;padding:6px 10px;font-size:clamp(.85rem,1.5vw,.95rem);transition:all .2s;display:flex}.post-card__comment-btn:hover,.post-card__comment-btn--open{color:#4052d6;background-color:#e8f4f8}.post-card__comments{border-top:1px solid #f5f5f5;flex-direction:column;gap:.5rem;padding:0 clamp(.75rem,2vw,1rem);display:flex}.post-card__comment{color:#333;border-bottom:1px solid #f5f5f5;padding:.5rem 0;font-size:clamp(.85rem,1.5vw,.95rem)}.post-card__comment:last-child{border-bottom:none}.post-card__comment strong{color:#1a1a1a;margin-right:6px}.post-card__comment-input{border-top:1px solid #f0f0f0;gap:.5rem;padding:clamp(.75rem,2vw,1rem);display:flex}.post-card__comment-input input{border:1px solid #e0e0e0;border-radius:20px;outline:none;flex:1;padding:8px 12px;font-family:inherit;font-size:clamp(.85rem,1.5vw,.95rem);transition:border-color .2s}.post-card__comment-input input:focus{border-color:#4052d6}.post-card__comment-input button{color:#fff;background-color:#4052d6;border-radius:20px;padding:8px 16px;font-size:clamp(.8rem,1.5vw,.9rem);font-weight:600;transition:background-color .2s}.post-card__comment-input button:hover{background-color:#3444c4}.post-card__comment-author{color:#1a1a1a;margin-bottom:2px;display:block}.post-card__comment-content{color:#333;font-size:clamp(.85rem,1.5vw,.95rem)}.post-card:hover{box-shadow:0 4px 12px #6c63ff26}.post-card__like-btn:hover{color:#4052d6;background-color:#e8f4f8}.post-card__like-btn--liked{color:#e53935}.profile{flex-direction:column;gap:1rem;display:flex}.profile__header{text-align:center;background:#fff;border-radius:12px;flex-direction:column;align-items:center;gap:.75rem;padding:clamp(1.25rem,3vw,2rem);display:flex;box-shadow:0 1px 4px #00000014}.profile__avatar{object-fit:cover;border-radius:50%;width:80px;height:80px}.profile__avatar-placeholder{color:#fff;background-color:#4052d6;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;font-size:2rem;font-weight:700;display:flex}.profile__username{font-size:clamp(1.1rem,2.5vw,1.4rem);font-weight:700}.profile__stats{gap:2rem;display:flex}.profile__stat{flex-direction:column;align-items:center;gap:2px;display:flex}.profile__stat-number{color:#00d1d1;font-size:clamp(1rem,2vw,1.2rem);font-weight:700}.profile__stat-label{color:#888;font-size:clamp(.75rem,1.2vw,.85rem)}.profile__empty{text-align:center;color:#888;padding:2rem;font-size:clamp(.9rem,1.5vw,1rem)}.auth-page{justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.auth-form{background:#fff;border-radius:12px;flex-direction:column;gap:1rem;width:100%;max-width:400px;padding:clamp(1.5rem,4vw,2.5rem);display:flex;box-shadow:0 2px 12px #0000001a}.auth-form__title{color:#4052d6;text-align:center;margin-bottom:.5rem;font-size:clamp(1.3rem,3vw,1.8rem);font-weight:700}.auth-form__field{flex-direction:column;gap:4px;display:flex}.auth-form__field label{color:#555;font-size:clamp(.85rem,1.5vw,.95rem);font-weight:500}.auth-form__field input{border:1px solid #e0e0e0;border-radius:8px;outline:none;width:100%;padding:10px 12px;font-family:inherit;font-size:clamp(.9rem,1.5vw,1rem);transition:border-color .2s}.auth-form__field input:focus{border-color:#4052d6}.auth-form__error{color:#e53935;font-size:.8rem}.auth-form__btn{color:#fff;background-color:#4052d6;border-radius:8px;margin-top:.5rem;padding:12px;font-size:clamp(.9rem,1.5vw,1rem);font-weight:600;transition:background-color .2s}.auth-form__btn:hover{background-color:#3444c4}.auth-form__btn:disabled{opacity:.6;cursor:not-allowed}.auth-form__link{text-align:center;color:#888;font-size:clamp(.85rem,1.5vw,.95rem)}.auth-form__link a{color:#4052d6;font-weight:600}@media (width>=768px){.navbar{height:60px;padding:0 2rem}.page{padding:2rem 1.5rem}.profile__header{text-align:left;flex-direction:row;align-items:flex-start}.profile__stats{gap:3rem}}@media (width>=1024px){.navbar{padding:0 3rem}.page{max-width:680px;padding:2rem 0}}
