body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}#root{min-height:100vh}*{box-sizing:border-box;margin:0;padding:0}:root{--primary:#6c63ff;--primary-dark:#5a52d5;--bg:#0f0f23;--bg-card:#1a1a2e;--bg-input:#16213e;--text:#e0e0e0;--text-muted:#888;--border:#2a2a4a;--danger:#ff4757;--success:#2ed573}body{background:var(--bg);color:var(--text);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}.container{max-width:1200px;margin:0 auto;padding:20px}.navbar{background:var(--bg-card);border-bottom:1px solid var(--border);z-index:100;padding:15px 0;position:sticky;top:0}.nav-container{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:0 20px;display:flex}.nav-logo{align-items:center;display:flex}.nav-logo-img{object-fit:contain;filter:brightness(1.1);width:auto;height:80px}.logo-accent{color:var(--primary);font-weight:800}.nav-links{align-items:center;gap:15px;display:flex}.nav-link{border-radius:8px;align-items:center;gap:5px;padding:8px 12px;transition:background .3s;display:flex}.nav-link:hover{background:var(--bg-input)}.nav-btn{cursor:pointer;border:none;border-radius:8px;align-items:center;gap:5px;padding:8px 16px;font-size:.9rem;transition:all .3s;display:flex}.nav-btn.register{background:var(--primary);color:#fff}.nav-btn.register:hover{background:var(--primary-dark)}.nav-btn.logout{color:var(--danger);background:0 0}.nav-btn.logout:hover{background:#ff47571a}.hamburger{color:var(--text);cursor:pointer;background:0 0;border:none;display:none}.btn{cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-size:1rem;transition:all .3s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-outline{border:2px solid var(--primary);color:var(--primary);background:0 0}.btn-outline:hover{background:var(--primary);color:#fff}.auth-page{justify-content:center;align-items:center;min-height:80vh;display:flex}.auth-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;width:100%;max-width:400px;padding:40px}.auth-card h2{margin-bottom:5px;font-size:1.8rem}.auth-subtitle{color:var(--text-muted);margin-bottom:25px}.auth-link{text-align:center;color:var(--text-muted);margin-top:20px}.auth-link a{color:var(--primary)}.forgot-link{text-align:center;margin-top:12px}.forgot-btn{color:var(--primary);cursor:pointer;background:0 0;border:none;padding:0;font-size:.9rem}.forgot-btn:hover{text-decoration:underline}.form-group{margin-bottom:15px}.form-group label{align-items:center;gap:5px;margin-bottom:5px;font-size:.9rem;font-weight:500;display:flex}.form-group input,.form-group textarea,.form-group select{border:1px solid var(--border);background:var(--bg-input);width:100%;color:var(--text);border-radius:8px;padding:10px 14px;font-size:1rem;transition:border-color .3s}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--primary);outline:none}.form-group textarea{resize:vertical}.form-row{grid-template-columns:1fr 1fr;gap:15px;display:grid}.form-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;margin-bottom:30px;padding:30px}.form-card h2,.form-card h3{margin-bottom:5px}.form-subtitle{color:var(--text-muted);margin-bottom:25px}.hero{text-align:center;padding:40px 0}.hero h1{color:var(--primary);margin-bottom:10px;font-size:2.5rem}.hero p{color:var(--text-muted);font-size:1.1rem}.search-section{margin-bottom:30px}.search-form{gap:10px;margin-bottom:15px;display:flex}.search-input{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;flex:1;align-items:center;gap:10px;padding:10px 15px;display:flex}.search-input input{color:var(--text);background:0 0;border:none;flex:1;font-size:1rem}.search-input input:focus{outline:none}.category-filter{flex-wrap:wrap;gap:8px;display:flex}.filter-btn{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:20px;padding:6px 16px;transition:all .3s}.filter-btn:hover,.filter-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}.projects-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;display:grid}.project-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;transition:transform .3s,box-shadow .3s;overflow:hidden}.project-card:hover{transform:translateY(-3px);box-shadow:0 8px 30px #6c63ff1a}.card-image img{object-fit:cover;width:100%;height:180px}.card-body{padding:15px}.card-header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.card-category{color:var(--primary);background:#6c63ff26;border-radius:12px;padding:3px 10px;font-size:.8rem}.card-actions{gap:8px;display:flex}.action-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;gap:4px;padding:5px 8px;transition:all .3s;display:flex}.action-btn:hover{background:var(--bg-input)}.action-btn.liked{color:var(--danger)}.action-btn.bookmarked{color:#ffd32a}.action-btn.delete{color:var(--danger)}.card-title{margin-bottom:8px;font-size:1.1rem;transition:color .3s}.card-title:hover{color:var(--primary)}.card-description{color:var(--text-muted);margin-bottom:12px;font-size:.9rem}.card-tech{flex-wrap:wrap;gap:6px;margin-bottom:12px;display:flex}.tech-tag{background:var(--bg-input);color:var(--text-muted);border-radius:6px;padding:3px 10px;font-size:.8rem}.card-footer{border-top:1px solid var(--border);justify-content:space-between;align-items:center;padding-top:10px;display:flex}.card-author{color:var(--text-muted);font-size:.85rem}.card-links{gap:8px;display:flex}.card-link{color:var(--text-muted);transition:color .3s}.card-link:hover{color:var(--primary)}.dashboard-page{max-width:700px;margin:0 auto}.detail-page{max-width:800px;margin:0 auto}.back-btn{background:var(--bg-card);border:1px solid var(--border);color:var(--text);cursor:pointer;border-radius:8px;align-items:center;gap:5px;margin-bottom:20px;padding:8px 16px;transition:background .3s;display:flex}.back-btn:hover{background:var(--bg-input)}.detail-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:30px}.detail-header{justify-content:space-between;align-items:flex-start;margin-bottom:20px;display:flex}.detail-header h1{margin:8px 0 5px;font-size:1.8rem}.detail-author{color:var(--text-muted)}.detail-actions{gap:8px;display:flex}.detail-images{margin-bottom:20px}.detail-images img{border-radius:8px;width:100%;margin-bottom:10px}.detail-section{margin-bottom:20px}.detail-section h3{color:var(--primary);margin-bottom:8px}.detail-links{gap:10px;margin-top:20px;display:flex}.profile-page{max-width:700px;margin:0 auto}.profile-header{text-align:center;padding:30px 0}.profile-avatar{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 15px;font-size:2rem;font-weight:700;display:flex}.profile-header h2{font-size:1.5rem}.profile-header p{color:var(--text-muted)}.profile-username{margin:2px 0;font-size:1rem;color:var(--primary)!important}.my-projects{margin-top:30px}.my-projects h3{margin-bottom:15px}.projects-list{flex-direction:column;gap:10px;display:flex}.my-project-item{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;align-items:center;gap:15px;padding:12px 16px;display:flex}.my-project-item h4{flex:1}.loading,.empty{text-align:center;color:var(--text-muted);padding:40px}.empty h3{margin-bottom:5px}.profile-actions-row{justify-content:center;gap:10px;margin-top:10px;display:flex}.username-display{justify-content:center;align-items:center;gap:6px;display:flex}.username-edit-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:50%;align-items:center;padding:4px;transition:all .3s;display:flex}.username-edit-btn:hover{color:var(--primary);background:var(--bg-input)}.username-edit-inline{justify-content:center;align-items:center;gap:6px;display:flex}.username-edit-inline input{border:1px solid var(--primary);background:var(--bg-input);color:var(--text);text-align:center;border-radius:8px;width:200px;padding:6px 12px;font-size:.9rem}.username-edit-inline input:focus{border-color:var(--primary);outline:none}.username-action-btn{cursor:pointer;background:0 0;border:none;border-radius:50%;align-items:center;padding:5px;transition:all .3s;display:flex}.username-action-btn.save{color:var(--success)}.username-action-btn.save:hover{background:#2ed57326}.username-action-btn.cancel{color:var(--danger)}.username-action-btn.cancel:hover{background:#ff475726}.chat-list-page h2{align-items:center;gap:10px;margin-bottom:20px;display:flex}.conversation-list{flex-direction:column;gap:8px;display:flex}.conversation-item{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;align-items:center;gap:12px;padding:12px 16px;transition:background .3s;display:flex;position:relative}.conversation-item:hover{background:var(--bg-input)}.conv-avatar-wrap{position:relative}.conv-avatar{background:var(--primary);color:#fff;object-fit:cover;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.1rem;font-weight:700;display:flex}.online-dot{background:var(--success);border:2px solid var(--bg-card);border-radius:50%;width:10px;height:10px;position:absolute;bottom:2px;right:2px}.conv-info{flex:1;min-width:0}.conv-header{justify-content:space-between;align-items:center;display:flex}.conv-header h4{font-size:.95rem}.conv-time{color:var(--text-muted);font-size:.75rem}.conv-preview{align-items:center;gap:8px;display:flex}.conv-preview p{color:var(--primary);font-size:.8rem}.conv-last{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;overflow:hidden}.unread-badge{background:var(--primary);color:#fff;text-align:center;border-radius:12px;min-width:20px;padding:2px 7px;font-size:.75rem;font-weight:700}.chat-window-page{flex-direction:column;height:calc(100vh - 120px);display:flex}.chat-header{border-bottom:1px solid var(--border);align-items:center;gap:12px;margin-bottom:10px;padding:12px 0;display:flex}.chat-user-info{cursor:pointer;align-items:center;gap:10px;display:flex}.chat-user-img{object-fit:cover;border-radius:50%;width:40px;height:40px}.chat-user-avatar{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-weight:700;display:flex}.chat-user-info h4{font-size:.95rem}.chat-user-status{color:var(--success);font-size:.8rem}.chat-messages{flex-direction:column;flex:1;gap:8px;padding:10px 0;display:flex;overflow-y:auto}.chat-empty{text-align:center;color:var(--text-muted);padding:40px}.chat-bubble{border-radius:16px;max-width:70%;padding:10px 14px;font-size:.95rem;position:relative}.chat-bubble.sent{background:var(--primary);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}.chat-bubble.received{background:var(--bg-input);border-bottom-left-radius:4px;align-self:flex-start}.chat-time{opacity:.7;text-align:right;margin-top:3px;font-size:.65rem;display:block}.typing-dots span{background:var(--text-muted);border-radius:50%;width:6px;height:6px;margin:0 2px;animation:1.4s ease-in-out infinite typingBounce;display:inline-block}.typing-dots span:first-child{animation-delay:0s}.typing-dots span:nth-child(2){animation-delay:.2s}.typing-dots span:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,80%,to{transform:translateY(0)}40%{transform:translateY(-6px)}}.chat-input{border-top:1px solid var(--border);gap:10px;padding:12px 0;display:flex}.chat-input input{border:1px solid var(--border);background:var(--bg-input);color:var(--text);border-radius:24px;flex:1;padding:10px 16px;font-size:1rem}.chat-input input:focus{border-color:var(--primary);outline:none}.send-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:background .3s;display:flex}.send-btn:hover{background:var(--primary-dark)}.send-btn:disabled{opacity:.5;cursor:not-allowed}@media (width<=768px){.chat-bubble{max-width:85%}.profile-actions-row{flex-direction:column}.profile-actions-row .btn{justify-content:center;width:100%}}.form-hint{color:var(--text-muted);margin-top:4px;font-size:.75rem;display:block}@media (width<=768px){.hamburger{display:block}.nav-links{background:var(--bg-card);border-bottom:1px solid var(--border);flex-direction:column;gap:10px;padding:15px 20px;display:none;position:absolute;top:100%;left:0;right:0}.nav-links.open{display:flex}.nav-link{width:100%;padding:12px 15px}.nav-btn.register,.nav-btn.logout{justify-content:center;width:100%}.form-row,.projects-grid{grid-template-columns:1fr}.search-form{flex-direction:column}.search-form .btn{justify-content:center;width:100%}.detail-header{flex-direction:column;gap:15px}.hero h1{font-size:1.8rem}.hero p{font-size:.95rem}.auth-card{margin:0 10px;padding:25px}.container{padding:10px}.form-card,.detail-card{padding:20px}}.profile-avatar-wrapper{cursor:pointer;width:100px;height:100px;margin:0 auto 15px;position:relative}.profile-avatar-img{object-fit:cover;border:3px solid var(--primary);border-radius:50%;width:100px;height:100px}.avatar-overlay{opacity:0;color:#fff;background:#00000080;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .3s;display:flex;position:absolute;top:0;left:0}.profile-avatar-wrapper:hover .avatar-overlay{opacity:1}.unique-code{background:var(--bg-input);color:var(--primary);cursor:pointer;border-radius:20px;align-items:center;gap:6px;margin-top:8px;padding:6px 14px;font-size:.85rem;transition:background .3s;display:inline-flex}.unique-code:hover{background:var(--border)}.follow-stats{justify-content:center;gap:20px;margin-top:15px;display:flex}.follow-stats span{color:var(--text-muted);font-size:.9rem}.follow-stats strong{color:var(--text)}.profile-bio{color:var(--text-muted);margin:10px 0}.profile-social{justify-content:center;gap:15px;margin-top:10px;display:flex}.profile-social a{color:var(--primary);align-items:center;gap:5px;font-size:.9rem;display:flex}.profile-social a:hover{text-decoration:underline}.profile-tabs{border-bottom:1px solid var(--border);gap:10px;margin:30px 0 20px;padding-bottom:10px;display:flex}.tab-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:8px 8px 0 0;padding:8px 20px;font-size:1rem;transition:all .3s}.tab-btn.active{color:var(--primary);border-bottom:2px solid var(--primary)}.tab-btn:hover{color:var(--text)}.my-media-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;display:grid}.media-thumb{aspect-ratio:1;border:1px solid var(--border);border-radius:8px;overflow:hidden}.media-thumb img,.media-thumb video{object-fit:cover;width:100%;height:100%}.section-title{color:var(--text-muted);margin-bottom:15px}.media-feed-page h2{margin-bottom:20px}.media-card{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;margin-bottom:20px;overflow:hidden}.media-card-header{justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.media-author{align-items:center;gap:10px;display:flex}.media-author-img{object-fit:cover;border-radius:50%;width:40px;height:40px}.media-author-avatar{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-weight:700;display:flex}.media-author h4{font-size:.95rem}.media-author .user-code{color:var(--primary);font-size:.75rem}.media-file img,.media-file video{object-fit:contain;background:#000;width:100%;max-height:500px}.media-caption{padding:10px 16px;font-size:.95rem}.media-actions{border-top:1px solid var(--border);gap:5px;padding:8px 16px;display:flex}.media-actions .action-btn.active{color:var(--danger)}.media-actions .action-btn.active-dislike{color:#ffa502}.media-actions .action-btn.active-save{color:#2ed573}.media-comments{padding:0 16px 10px}.comment-item{margin-bottom:4px;font-size:.85rem}.comment-item strong{margin-right:5px}.comment-form{border-top:1px solid var(--border);gap:8px;padding:10px 16px;display:flex}.comment-form input{border:1px solid var(--border);background:var(--bg-input);color:var(--text);border-radius:20px;flex:1;padding:8px 12px;font-size:.9rem}.comment-form input:focus{border-color:var(--primary);outline:none}.search-page h2{align-items:center;gap:10px;margin-bottom:20px;display:flex}.user-results{margin-top:20px}.user-result-card{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;justify-content:space-between;align-items:center;margin-bottom:10px;padding:12px 16px;display:flex}.user-result-info{flex:1;align-items:center;gap:12px;display:flex}.user-result-avatar{background:var(--primary);color:#fff;object-fit:cover;border-radius:50%;justify-content:center;align-items:center;width:45px;height:45px;font-size:1.2rem;font-weight:700;display:flex}.user-result-info h4{font-size:1rem}.user-code{color:var(--primary);font-size:.8rem}.user-bio-small{color:var(--text-muted);font-size:.8rem}.btn-sm{padding:6px 14px;font-size:.85rem}.upload-page{max-width:600px;margin:0 auto}.upload-area{border:2px dashed var(--border);text-align:center;cursor:pointer;border-radius:12px;margin-bottom:20px;padding:30px;transition:border-color .3s}.upload-area:hover{border-color:var(--primary)}.upload-placeholder{color:var(--text-muted);flex-direction:column;align-items:center;gap:10px;display:flex}.upload-placeholder small{font-size:.75rem}.upload-preview{border-radius:8px;max-width:100%;max-height:300px}@media (width<=768px){.my-media-grid{grid-template-columns:repeat(3,1fr)}.user-result-card{text-align:center;flex-direction:column;gap:10px}.user-result-info{flex-direction:column}}
