main{min-height:100vh;width:100%;display:flex;justify-content:center;align-items:center;padding:1rem;box-sizing:border-box}main .form-container{width:100%;max-width:400px;box-sizing:border-box;display:flex;flex-direction:column;gap:1.5rem}main .form-container h1{font-size:clamp(1.4rem,5vw,2rem)}main .form-container form{display:flex;flex-direction:column;gap:1rem}main .form-container form input{border:none;outline:none;padding-inline:1.2rem;padding-block:.9rem;border-radius:1rem;width:100%;box-sizing:border-box;font-size:1rem}main .form-container form button{width:100%;padding-block:.9rem;font-size:1rem}main .form-container p{font-size:.9rem;text-align:center}@media(max-width:480px){main{padding:3rem 1rem 1.5rem;align-items:flex-start}main .form-container{gap:1.2rem}main .form-container form input{padding-inline:1rem;padding-block:.85rem}}.feed-page{display:flex;justify-content:center;align-items:center;flex-direction:column;padding-inline:.5rem;box-sizing:border-box}.feed-page .feed{max-width:380px;width:100%;padding-block:1rem;box-sizing:border-box}.feed-page .feed .posts{width:100%;display:flex;flex-direction:column;gap:1rem}.feed-page .feed .posts .post{width:100%;display:flex;flex-direction:column;gap:0;background:#1a1a1a;border-radius:.8rem;overflow:hidden;border:1px solid rgba(255,255,255,.06)}.feed-page .feed .posts .post .user{display:flex;gap:.6rem;align-items:center;padding-inline:.8rem;padding-block:.7rem}.feed-page .feed .posts .post .user .img-wrapper{border-radius:50%;display:flex;align-items:center;justify-content:center;padding:2px;background:conic-gradient(from 45deg,#f74312e6,#970889,#f74312e6);flex-shrink:0}.feed-page .feed .posts .post .user .img-wrapper img{width:2.2rem;aspect-ratio:1/1;border-radius:50%;border:2px solid #1a1a1a}.feed-page .feed .posts .post .user .username-text{font-size:.88rem;font-weight:600;color:#fff;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.feed-page .feed .posts .post .user .follow-btn{font-size:.72rem;padding-inline:.9rem;padding-block:.35rem;border-radius:.4rem;border:none;cursor:pointer;font-weight:600;transition:all .2s ease-in-out;white-space:nowrap;flex-shrink:0}.feed-page .feed .posts .post .user .follow-btn:active{transform:scale(.95)}.feed-page .feed .posts .post .user .follow-btn.none{background-color:#b50e0e;color:#fff}.feed-page .feed .posts .post .user .follow-btn.pending{background:transparent;color:#ffffff80;border:1px solid rgba(255,255,255,.2)}.feed-page .feed .posts .post .user .follow-btn.following{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3)}.feed-page .feed .posts .post>img{width:100%;aspect-ratio:1/1;object-fit:cover}.feed-page .feed .posts .post .icons{display:flex;justify-content:space-between;align-items:center;padding-inline:.8rem;padding-block:.6rem}.feed-page .feed .posts .post .icons .left{display:flex;gap:.8rem;align-items:center}.feed-page .feed .posts .post .icons svg{width:1.3rem;aspect-ratio:1/1;color:#fff;cursor:pointer;transition:transform .15s ease}.feed-page .feed .posts .post .icons svg:hover{transform:scale(1.15)}.feed-page .feed .posts .post .icons button{background-color:transparent;border:none;outline:none;display:flex;align-items:center;padding:0;cursor:pointer}.feed-page .feed .posts .post .bottom{padding-inline:.8rem;padding-bottom:.8rem}.feed-page .feed .posts .post .bottom .caption{font-size:.85rem;color:#ffffffd9;line-height:1.5}.feed-page .feed .posts .post .comments-section{border-top:1px solid rgba(255,255,255,.08);padding-inline:.8rem;padding-block:.6rem}.feed-page .feed .posts .post .comments-section .comments-list{display:flex;flex-direction:column;gap:.4rem;margin-bottom:.6rem;max-height:150px;overflow-y:auto}.feed-page .feed .posts .post .comments-section .comments-list .no-comments{font-size:.8rem;color:#fff6}.feed-page .feed .posts .post .comments-section .comments-list .comment{display:flex;gap:.4rem;font-size:.82rem;flex-wrap:wrap}.feed-page .feed .posts .post .comments-section .comments-list .comment .comment-user{font-weight:600;color:#fff}.feed-page .feed .posts .post .comments-section .comments-list .comment .comment-text{color:#fffc;word-break:break-word}.feed-page .feed .posts .post .comments-section .comments-list .comment .comment-delete{margin-left:auto;background:transparent;border:none;color:#ffffff4d;cursor:pointer;font-size:.7rem;padding:0}.feed-page .feed .posts .post .comments-section .comments-list .comment .comment-delete:hover{color:#b50e0e}.feed-page .feed .posts .post .comments-section .comment-form{display:flex;gap:.5rem;align-items:center}.feed-page .feed .posts .post .comments-section .comment-form input{flex:1;background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.2);color:#fff;font-size:.82rem;padding-block:.3rem;outline:none;min-width:0}.feed-page .feed .posts .post .comments-section .comment-form input::placeholder{color:#fff6}.feed-page .feed .posts .post .comments-section .comment-form button.comment-submit{background:transparent;border:none;color:#b50e0e;font-size:.82rem;font-weight:600;cursor:pointer;white-space:nowrap;flex-shrink:0}@media(max-width:480px){.feed-page{padding-inline:0}.feed-page .feed{padding-block:.5rem}.feed-page .feed .posts{gap:.8rem}.feed-page .feed .posts .post{border-radius:0;border-left:none;border-right:none}}.nav-bar{display:flex;justify-content:space-between;align-items:center;width:100%;padding-inline:1.5rem;padding-block:.8rem;background-color:#111;border-bottom:1px solid rgba(255,255,255,.06);position:sticky;top:0;z-index:100;box-sizing:border-box}.nav-bar .nav-logo{font-size:1.3rem;font-weight:700;color:#fff;cursor:pointer;letter-spacing:-.03em}.nav-bar .nav-logo span{color:#b50e0e}.nav-bar .nav-actions{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}@media(max-width:480px){.nav-bar{padding-inline:1rem;padding-block:.6rem}.nav-bar .nav-logo{font-size:1.1rem}.nav-bar .nav-actions{gap:.3rem}.nav-bar .nav-actions .button{padding-inline:.8rem;padding-block:.5rem;font-size:.78rem}}.create-post-label{background-color:#e7e3e3;color:#181818;padding-inline:1rem;padding-block:.5rem;border-radius:1rem;cursor:pointer}.image-preview-wrapper{margin-top:.75rem;animation:fadeIn .3s ease}.image-preview-wrapper .image-preview{width:100px;height:100px;object-fit:cover;border-radius:.75rem;border:2px solid #d1d1d1;box-shadow:0 2px 8px #0000001f}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.people-page{display:flex;justify-content:center;align-items:center;flex-direction:column;padding-inline:.5rem;box-sizing:border-box}.people-page .people-container{max-width:320px;width:100%;padding-block:1rem;box-sizing:border-box}.people-page .people-container h1{color:#fff;font-size:1.2rem;font-weight:600;margin-bottom:.8rem;padding-inline:.7rem}.people-page .people-container .users-list{width:100%;display:flex;flex-direction:column;gap:.2rem}.people-page .people-container .users-list .user-row{width:100%;display:flex;align-items:center;justify-content:space-between;background:#4a0000;padding-inline:.7rem;padding-block:.5rem;box-sizing:border-box}.people-page .people-container .users-list .user-row .user-info{display:flex;align-items:center;gap:.5rem;overflow:hidden}.people-page .people-container .users-list .user-row .user-info .avatar-placeholder{width:2.5rem;aspect-ratio:1/1;border-radius:50%;background:#780000;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;font-weight:600;flex-shrink:0}.people-page .people-container .users-list .user-row .user-info p{color:#fff;font-size:.85rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.people-page .people-container .users-list .user-row .follow-btn{font-size:.78rem;padding-inline:.9rem;padding-block:.35rem;border-radius:.4rem;border:none;cursor:pointer;font-weight:600;transition:opacity .15s;white-space:nowrap;flex-shrink:0}.people-page .people-container .users-list .user-row .follow-btn:hover{opacity:.8}.people-page .people-container .users-list .user-row .follow-btn.none{background-color:#0095f6;color:#fff}.people-page .people-container .users-list .user-row .follow-btn.pending{background-color:#ffffff1a;color:#fff9;border:1px solid rgba(255,255,255,.2)}.people-page .people-container .users-list .user-row .follow-btn.following{background-color:transparent;color:#fff;border:1px solid rgba(255,255,255,.3)}@media(max-width:480px){.people-page{padding-inline:0}.people-page .people-container{max-width:100%;padding-inline:0}.people-page .people-container h1,.people-page .people-container .users-list .user-row{padding-inline:1rem}}.requests-page{display:flex;justify-content:center;align-items:center;flex-direction:column;padding-inline:.5rem;box-sizing:border-box}.requests-page .requests-container{max-width:320px;width:100%;padding-block:1rem;box-sizing:border-box}.requests-page .requests-container h1{color:#fff;font-size:1.2rem;font-weight:600;margin-bottom:.8rem;padding-inline:.7rem}.requests-page .requests-container .empty-state{color:#ffffff80;text-align:center;padding-block:2rem;font-size:.9rem}.requests-page .requests-container .requests-list{width:100%;display:flex;flex-direction:column;gap:.2rem}.requests-page .requests-container .requests-list .request-row{width:100%;display:flex;align-items:center;justify-content:space-between;background:#4a0000;padding-inline:.7rem;padding-block:.5rem;box-sizing:border-box}.requests-page .requests-container .requests-list .request-row .user-info{display:flex;align-items:center;gap:.5rem;overflow:hidden}.requests-page .requests-container .requests-list .request-row .user-info .avatar-placeholder{width:2.5rem;aspect-ratio:1/1;border-radius:50%;background:#780000;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.9rem;font-weight:600;flex-shrink:0}.requests-page .requests-container .requests-list .request-row .user-info p{color:#fff;font-size:.85rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.requests-page .requests-container .requests-list .request-row .respond-btns{display:flex;gap:.4rem;flex-shrink:0}.requests-page .requests-container .requests-list .request-row .respond-btns button{font-size:.78rem;padding-inline:.9rem;padding-block:.35rem;border-radius:.4rem;border:none;cursor:pointer;font-weight:600;transition:opacity .15s;white-space:nowrap}.requests-page .requests-container .requests-list .request-row .respond-btns button:hover{opacity:.8}.requests-page .requests-container .requests-list .request-row .respond-btns button.accept{background-color:#2ecc71;color:#fff}.requests-page .requests-container .requests-list .request-row .respond-btns button.reject{background-color:transparent;border:1px solid rgba(231,76,60,.6);color:#e74c3c}@media(max-width:480px){.requests-page{padding-inline:0}.requests-page .requests-container{max-width:100%;padding-inline:0}.requests-page .requests-container h1,.requests-page .requests-container .requests-list .request-row{padding-inline:1rem}.requests-page .requests-container .requests-list .request-row .respond-btns{gap:.3rem}.requests-page .requests-container .requests-list .request-row .respond-btns button{padding-inline:.6rem;font-size:.72rem}}.profile-page{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:1.2rem;padding-block:3rem;min-height:calc(100vh - 60px)}.profile-page .avatar-wrapper{position:relative;cursor:pointer}.profile-page .avatar-wrapper img{width:7rem;aspect-ratio:1/1;border-radius:50%;object-fit:cover;display:block;border:3px solid transparent;background:conic-gradient(from 45deg,#f74312e6,#970889,#f74312e6) border-box}.profile-page .profile-username{color:#fff;font-size:1.2rem;font-weight:700;letter-spacing:-.02em}.profile-page .profile-form{display:flex;flex-direction:column;align-items:center;gap:.8rem;margin-top:.5rem}.profile-page .profile-form label{background-color:#ffffff14;color:#fff;padding-inline:1.2rem;padding-block:.6rem;border-radius:.6rem;cursor:pointer;font-size:.85rem;font-weight:500;border:1px solid rgba(255,255,255,.15);transition:all .2s ease-in-out}.profile-page .profile-form label:hover{background-color:#ffffff1f}.profile-page .profile-form label:active{transform:scale(.95)}.profile-page .profile-form button{background-color:#b50e0e;color:#fff;border:none;padding-inline:2rem;padding-block:.6rem;border-radius:.6rem;cursor:pointer;font-size:.85rem;font-weight:600;transition:all .2s ease-in-out;width:100%}.profile-page .profile-form button:hover{background-color:#c81414}.profile-page .profile-form button:active{transform:scale(.95)}.button{border:none;outline:none;padding-inline:1.5rem;padding-block:.7rem;border-radius:.6rem;cursor:pointer;transition:all .2s ease-in-out;font-size:.85rem;font-weight:600;letter-spacing:.02em}.button.primary-button{background-color:#b50e0e;color:#fff}.button.primary-button:hover{background-color:#c81414}.button.secondary-button{background-color:transparent;color:#fff;border:1px solid rgba(255,255,255,.25)}.button.secondary-button:hover{background-color:#ffffff14}.button.logout-button{background-color:transparent;color:#dc3232;border:1px solid rgba(220,50,50,.4)}.button.logout-button:hover{background-color:#dc32321f;border-color:#dc3232}.button:active{transform:scale(.95)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%}html{background-color:#1d1d1d;color:#faf5f5;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}a{color:#0505d3;cursor:pointer;text-decoration:none}