body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.navbar{background-color:var(--color-white);box-shadow:var(--shadow-sm);height:60px;left:0;padding:0;position:fixed;right:0;top:0;transition:all var(--transition-base) ease;z-index:var(--z-fixed)}.navbar.scrolled{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#fffffffa;box-shadow:var(--shadow-lg)}.navbar .container{align-items:center;display:flex;height:100%;justify-content:space-between;position:relative}.navbar-brand{align-items:center;color:var(--color-primary);display:flex;flex-shrink:0;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);gap:var(--spacing-sm);text-decoration:none;transition:opacity var(--transition-fast) ease}.navbar-brand:hover{opacity:.85}.brand-icon{font-size:var(--font-size-2xl)}.brand-text{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,var(--color-primary) 0,#42b72a 100%);-webkit-background-clip:text;background-clip:text}.nav-link,.navbar-menu{align-items:center;display:flex;gap:var(--spacing-xs)}.nav-link{background:none;border:none;border-radius:var(--radius-md);color:var(--color-gray-700);cursor:pointer;font-family:inherit;font-size:inherit;font-weight:var(--font-weight-medium);padding:var(--spacing-sm) var(--spacing-md);position:relative;text-decoration:none;transition:all var(--transition-fast) ease;white-space:nowrap}.nav-link:hover{background-color:var(--color-gray-50);color:var(--color-primary)}.nav-link.active{background-color:var(--color-primary-light);color:var(--color-primary)}.nav-icon{flex-shrink:0;font-size:var(--font-size-lg)}.nav-text{font-size:var(--font-size-sm)}.admin-link{position:relative}.admin-link-badge{background:linear-gradient(135deg,#f0a500,#e67e22);border-radius:var(--radius-sm);box-shadow:0 2px 4px #f0a5004d;color:var(--color-white);font-size:8px;font-weight:var(--font-weight-bold);letter-spacing:.5px;padding:2px 5px;position:absolute;right:-2px;top:-2px}.notification-btn,.notifications-wrapper{position:relative}.notification-badge{align-items:center;background-color:var(--color-danger);border:2px solid var(--color-white);border-radius:var(--radius-full);color:var(--color-white);display:flex;font-size:10px;font-weight:var(--font-weight-bold);height:18px;justify-content:center;min-width:18px;padding:0 4px;position:absolute;right:4px;top:2px}.notifications-dropdown{animation:dropdownSlide .2s ease;background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);max-height:480px;overflow:hidden;position:absolute;right:0;top:100%;width:360px;z-index:var(--z-dropdown)}@keyframes dropdownSlide{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.notifications-header{border-bottom:1px solid var(--color-gray-100);padding:var(--spacing-lg)}.notifications-header h4{font-size:var(--font-size-lg);margin:0}.notifications-list{max-height:400px;overflow-y:auto}.notifications-empty{color:var(--color-gray-500);padding:var(--spacing-2xl);text-align:center}.dropdown-backdrop{bottom:0;left:0;position:fixed;right:0;top:0;z-index:-1}.mobile-menu-toggle{background:none;border:none;cursor:pointer;display:none;padding:var(--spacing-sm);z-index:1001}.hamburger{display:flex;flex-direction:column;height:18px;justify-content:space-between;width:24px}.hamburger span{background-color:var(--color-gray-700);border-radius:var(--radius-sm);display:block;height:2px;transition:all var(--transition-base) ease;width:100%}.hamburger.active span:first-child{transform:translateY(8px) rotate(45deg)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:last-child{transform:translateY(-8px) rotate(-45deg)}.logout-btn{border-color:var(--color-gray-200)!important;margin-left:var(--spacing-sm)}.logout-btn:hover{background-color:var(--color-danger-light)!important;border-color:var(--color-danger)!important;color:var(--color-danger)!important}.user-info-desktop{align-items:center;background-color:var(--color-gray-50);border-radius:var(--radius-full);display:flex;gap:var(--spacing-sm);margin-left:var(--spacing-lg);padding:var(--spacing-xs) var(--spacing-sm);text-decoration:none;transition:all var(--transition-fast) ease}.user-info-desktop:hover{background-color:var(--color-gray-100)}.user-avatar-mini{height:32px;width:32px}.avatar-placeholder.mini{background-color:var(--color-primary-light);color:var(--color-primary);font-size:var(--font-size-sm);height:32px;width:32px}.user-info-text{align-items:center;display:flex;gap:var(--spacing-xs)}.user-name-desktop{color:var(--color-gray-800);font-weight:var(--font-weight-medium);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-badge-desktop,.user-name-desktop{font-size:var(--font-size-sm)}.user-info-mobile{border-bottom:1px solid var(--color-gray-100);border-top:1px solid var(--color-gray-100);display:none;margin:var(--spacing-md) 0;padding:var(--spacing-md) 0}.mobile-user-link{align-items:center;color:inherit;display:flex;gap:var(--spacing-md);text-decoration:none}.user-avatar-small{border-radius:50%;height:48px;width:48px}.user-avatar-small .avatar-placeholder{align-items:center;background-color:var(--color-primary-light);color:var(--color-primary);display:flex;font-size:var(--font-size-lg);height:48px;justify-content:center;width:48px}.user-details{display:flex;flex-direction:column;gap:var(--spacing-xs)}.user-details .user-name{color:var(--color-gray-900);font-weight:var(--font-weight-semibold)}.user-details .user-email{color:var(--color-gray-500);font-size:var(--font-size-xs)}.admin-badge{box-shadow:0 2px 4px #f0a5004d;color:var(--color-white);letter-spacing:.5px;padding:2px var(--spacing-xs);text-transform:uppercase}.register-btn{align-items:center;display:flex;gap:var(--spacing-xs);margin-left:var(--spacing-sm)}@media (max-width:1024px){.nav-text{display:none}.nav-link{padding:var(--spacing-sm)}.nav-icon{font-size:var(--font-size-xl)}.user-name-desktop{display:none}.user-info-desktop{margin-left:var(--spacing-sm);padding:var(--spacing-xs)}}@media (max-width:768px){.mobile-menu-toggle{display:block}.navbar-menu{align-items:stretch;background-color:var(--color-white);bottom:0;flex-direction:column;left:0;overflow-y:auto;padding:var(--spacing-xl);position:fixed;right:0;top:60px;transform:translateX(100%);transition:transform var(--transition-base) ease;z-index:1000}.navbar-menu.mobile-open{transform:translateX(0)}.nav-link{font-size:var(--font-size-lg);justify-content:flex-start;padding:var(--spacing-lg)}.nav-text{display:inline;font-size:var(--font-size-base)}.user-info-desktop{display:none}.user-info-mobile{display:block}.logout-btn{justify-content:center;margin-left:0;margin-top:var(--spacing-md);padding:var(--spacing-md)!important;width:100%}.notifications-wrapper{width:100%}.notification-btn{justify-content:flex-start;padding:var(--spacing-lg);width:100%}.notifications-dropdown{border:1px solid var(--color-gray-100);box-shadow:none;margin-top:var(--spacing-sm);position:static;width:100%}}@media (max-width:480px){.brand-text{display:none}.brand-icon{font-size:var(--font-size-3xl)}.navbar{height:56px}.navbar-menu{top:56px}}@keyframes slideIn{0%{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.navbar-menu.mobile-open .nav-link{animation:slideIn .3s ease forwards;opacity:0}.navbar-menu.mobile-open .nav-link:first-child{animation-delay:.05s}.navbar-menu.mobile-open .nav-link:nth-child(2){animation-delay:.1s}.navbar-menu.mobile-open .nav-link:nth-child(3){animation-delay:.15s}.navbar-menu.mobile-open .nav-link:nth-child(4){animation-delay:.2s}.navbar-menu.mobile-open .nav-link:nth-child(5){animation-delay:.25s}.btn:focus-visible,.mobile-menu-toggle:focus-visible,.nav-link:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.create-post{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:var(--spacing-xl);padding:var(--spacing-lg)}.create-post-header{align-items:center;display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.avatar-small{border-radius:var(--radius-full);flex-shrink:0;height:40px;overflow:hidden;width:40px}.avatar-small img{height:100%;object-fit:cover;width:100%}.create-post-label{color:var(--color-gray-600);font-size:var(--font-size-lg)}.create-post-textarea{border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);font-size:var(--font-size-base);min-height:100px;padding:var(--spacing-md);resize:vertical;transition:border-color var(--transition-fast) ease;width:100%}.create-post-textarea:focus{border-color:var(--color-primary);outline:none}.create-post-footer{align-items:center;display:flex;justify-content:space-between;margin-top:var(--spacing-md)}.char-count{color:var(--color-gray-600);font-size:var(--font-size-sm)}.char-count.warning{color:var(--color-warning)}.error-message{background-color:var(--color-danger-light);border-radius:var(--radius-sm);margin-top:var(--spacing-sm);padding:var(--spacing-sm)}.image-preview-container{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.image-preview{border-radius:var(--radius-md);height:100px;overflow:hidden;position:relative;width:100px}.image-preview img{height:100%;object-fit:cover;width:100%}.remove-image{align-items:center;background-color:#0009;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:14px;height:24px;justify-content:center;position:absolute;right:4px;top:4px;transition:background-color var(--transition-fast) ease;width:24px}.remove-image:hover{background-color:#000c}.post-actions-left{display:flex;gap:var(--spacing-sm)}.add-image-btn{background:none;border:1px solid var(--color-gray-200);border-radius:var(--radius-md);color:var(--color-gray-700);cursor:pointer;font-size:var(--font-size-sm);padding:var(--spacing-sm) var(--spacing-md);transition:all var(--transition-fast) ease}.add-image-btn:hover:not(:disabled){background-color:var(--color-gray-50);border-color:var(--color-primary);color:var(--color-primary)}.add-image-btn:disabled{cursor:not-allowed;opacity:.5}.post-actions-right{align-items:center;display:flex;gap:var(--spacing-md)}.uploading-indicator{align-items:center;color:var(--color-gray-600);display:flex;font-size:var(--font-size-sm);gap:var(--spacing-sm);margin-top:var(--spacing-md)}.spinner-small{animation:spin .8s linear infinite;border:2px solid var(--color-gray-200);border-radius:50%;border-top-color:var(--color-primary);height:16px;width:16px}.post-card{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:var(--spacing-lg);padding:var(--spacing-lg);transition:box-shadow var(--transition-base) ease}.post-card:hover{box-shadow:var(--shadow-md)}.post-header{justify-content:space-between;margin-bottom:var(--spacing-md)}.post-author,.post-header{align-items:center;display:flex}.post-author{color:inherit;flex:1 1;gap:var(--spacing-md);text-decoration:none}.avatar{background-color:var(--color-gray-100);border-radius:var(--radius-full);flex-shrink:0;height:48px;overflow:hidden;width:48px}.avatar img{height:100%;object-fit:cover;width:100%}.avatar-placeholder{align-items:center;background-color:var(--color-gray-100);color:var(--color-gray-600);display:flex;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);height:100%;justify-content:center;width:100%}.avatar-placeholder.small{font-size:var(--font-size-base);height:32px;width:32px}.avatar-placeholder.tiny{font-size:var(--font-size-sm);height:28px;width:28px}.author-info{flex:1 1}.author-name{color:var(--color-gray-900);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-xs)}.author-username{color:var(--color-gray-600);font-size:var(--font-size-sm)}.post-header-right{align-items:center;display:flex;gap:var(--spacing-md)}.post-date{color:var(--color-gray-500);font-size:var(--font-size-xs);white-space:nowrap}.delete-post-btn{background:none;border:none;cursor:pointer;font-size:var(--font-size-base);opacity:.6;padding:var(--spacing-xs);transition:opacity var(--transition-fast) ease}.delete-post-btn:hover{color:var(--color-danger);opacity:1}.post-content{margin-bottom:var(--spacing-lg)}.post-text{line-height:1.6;margin-bottom:var(--spacing-md);white-space:pre-wrap;word-break:break-word}.post-images-grid{border-radius:var(--radius-lg);margin-top:var(--spacing-md);overflow:hidden}.images-count-1{display:block}.images-count-1 .image-wrapper{max-height:500px}.images-count-1 .post-image{max-height:500px;object-fit:cover;width:100%}.images-count-2{grid-gap:2px;display:grid;gap:2px;grid-template-columns:1fr 1fr}.images-count-2 .image-wrapper{aspect-ratio:1/1}.images-count-3{grid-gap:2px;display:grid;gap:2px;grid-template-columns:1fr 1fr}.images-count-3 .image-wrapper:first-child{aspect-ratio:16/9;grid-column:1/-1}.images-count-3 .image-wrapper:not(:first-child){aspect-ratio:1/1}.images-count-4{grid-gap:2px;display:grid;gap:2px;grid-template-columns:1fr 1fr}.image-wrapper{background-color:var(--color-gray-900);cursor:pointer;overflow:hidden;position:relative}.post-image{height:100%;object-fit:cover;transition:transform var(--transition-base) ease;width:100%}.image-wrapper:hover .post-image{transform:scale(1.03)}.more-images-overlay{align-items:center;background-color:#0009;bottom:0;color:var(--color-white);cursor:pointer;display:flex;flex-direction:column;justify-content:center;left:0;position:absolute;right:0;top:0;transition:background-color var(--transition-fast) ease}.more-images-overlay:hover{background-color:#000000b3}.more-images-count{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold)}.more-images-text{font-size:var(--font-size-sm);margin-top:var(--spacing-xs)}.all-images-container{display:flex;flex-direction:column;gap:var(--spacing-sm)}.all-image-wrapper{border-radius:var(--radius-md);cursor:pointer;overflow:hidden}.post-image-full{background-color:var(--color-gray-900);max-height:600px;object-fit:contain;width:100%}.collapse-images-btn{background-color:var(--color-gray-100);border:none;border-radius:var(--radius-md);color:var(--color-gray-700);cursor:pointer;font-size:var(--font-size-sm);padding:var(--spacing-sm);transition:background-color var(--transition-fast) ease}.collapse-images-btn:hover{background-color:var(--color-gray-200)}.post-actions{border-top:1px solid var(--color-gray-100);display:flex;gap:var(--spacing-sm);padding-top:var(--spacing-md)}.action-btn{border:none;border-radius:var(--radius-md);color:var(--color-gray-600);font-size:var(--font-size-sm);gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg)}.like-btn.liked{color:var(--color-danger)}.like-btn.liked .icon{animation:heartBeat .3s ease}@keyframes heartBeat{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.action-btn .icon{font-size:var(--font-size-xl)}.action-btn .count{font-weight:var(--font-weight-medium)}.comments-section{border-top:1px solid var(--color-gray-100);margin-top:var(--spacing-lg);padding-top:var(--spacing-lg)}.comment-form{display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.comment-avatar{border-radius:var(--radius-full);flex-shrink:0;height:32px;overflow:hidden;width:32px}.comment-avatar img{height:100%;object-fit:cover;width:100%}.comment-input-wrapper{display:flex;flex:1 1;gap:var(--spacing-sm)}.comment-input{border:1px solid var(--color-gray-200);border-radius:var(--radius-full);flex:1 1;font-size:var(--font-size-sm);padding:var(--spacing-sm) var(--spacing-md);transition:border-color var(--transition-fast) ease}.comment-input:focus{border-color:var(--color-primary);outline:none}.comment-submit{background-color:var(--color-primary);border:none;border-radius:var(--radius-full);color:var(--color-white);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--spacing-sm) var(--spacing-lg);transition:background-color var(--transition-fast) ease;white-space:nowrap}.comment-submit:hover:not(:disabled){background-color:var(--color-primary-dark)}.comment-submit:disabled{cursor:not-allowed;opacity:.6}.comments-list{display:flex;flex-direction:column;gap:var(--spacing-md);max-height:400px;overflow-y:auto}.comment{background-color:var(--color-gray-50);border-radius:var(--radius-md);padding:var(--spacing-md)}.comment-author{align-items:center;color:inherit;display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm);text-decoration:none}.comment-avatar-small{border-radius:var(--radius-full);flex-shrink:0;height:28px;overflow:hidden;width:28px}.comment-avatar-small img{height:100%;object-fit:cover;width:100%}.comment-author-info{align-items:center;display:flex;flex-wrap:wrap;gap:var(--spacing-xs)}.comment-username{color:var(--color-gray-600);font-size:var(--font-size-sm)}.comment-text{font-size:var(--font-size-sm);line-height:1.5;margin-bottom:var(--spacing-sm);word-break:break-word}.comment-meta{align-items:center;color:var(--color-gray-500);display:flex;font-size:var(--font-size-xs);justify-content:space-between}.delete-comment{background:none;border:none;cursor:pointer;font-size:var(--font-size-sm);opacity:.6;padding:var(--spacing-xs);transition:opacity var(--transition-fast) ease}.delete-comment:hover{color:var(--color-danger);opacity:1}.no-comments{color:var(--color-gray-500);font-size:var(--font-size-sm);padding:var(--spacing-xl);text-align:center}@media (max-width:768px){.post-card{padding:var(--spacing-md)}.avatar{height:40px;width:40px}.action-btn{padding:var(--spacing-sm)}.comment-input-wrapper{flex-direction:column}.comment-submit{width:100%}}.home-page{padding:var(--spacing-xl) 0}.home-layout{grid-gap:var(--spacing-xl);display:grid;gap:var(--spacing-xl);grid-template-columns:1fr 300px}.home-main{min-width:0}.feed{display:flex;flex-direction:column}.retry-btn{background-color:var(--color-primary);border:none;border-radius:var(--radius-sm);color:var(--color-white);cursor:pointer;font-size:var(--font-size-sm);margin-left:var(--spacing-md);padding:var(--spacing-xs) var(--spacing-md)}.retry-btn:hover{background-color:var(--color-primary-dark)}.home-sidebar{height:-webkit-fit-content;height:fit-content;position:-webkit-sticky;position:sticky;top:80px}.sidebar-card{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:var(--spacing-lg);padding:var(--spacing-lg)}.sidebar-card h3{color:var(--color-primary);margin-bottom:var(--spacing-md)}.user-greeting{color:var(--color-gray-800);font-size:var(--font-size-lg)}.tech-stack{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.badge{background-color:var(--color-gray-100);border-radius:var(--radius-sm);color:var(--color-gray-700)}@media (max-width:768px){.home-layout{grid-template-columns:1fr}.home-sidebar{display:none}}.auth-container{background-color:var(--color-white);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);max-width:400px;padding:var(--spacing-3xl);width:100%}.auth-title{color:var(--color-primary);margin-bottom:var(--spacing-xl)}.auth-form{gap:var(--spacing-lg)}.auth-footer{margin-top:var(--spacing-xl)}.auth-link{font-weight:var(--font-weight-medium)}.avatar-picker{display:inline-block;position:relative}.current-avatar{border:3px solid var(--color-primary);border-radius:50%;cursor:pointer;height:120px;overflow:hidden;position:relative;width:120px}.current-avatar img{height:100%;object-fit:cover;width:100%}.avatar-overlay{background:#0009;bottom:0;color:#fff;font-size:12px;left:0;opacity:0;padding:4px;position:absolute;right:0;text-align:center;transition:opacity .3s}.current-avatar:hover .avatar-overlay{opacity:1}.avatar-picker-modal{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);left:140px;max-height:500px;overflow:hidden;position:absolute;top:0;width:400px;z-index:1000}.picker-header{align-items:center;border-bottom:1px solid var(--color-gray-100);display:flex;justify-content:space-between;padding:16px}.picker-header h3{margin:0}.close-btn{background:none;border:none;color:var(--color-gray-600);cursor:pointer;font-size:20px}.picker-tabs{border-bottom:1px solid var(--color-gray-100);display:flex}.tab{color:var(--color-gray-600);flex:1 1;padding:12px;text-align:center;transition:all .2s}.tab.active{border-bottom:2px solid var(--color-primary);color:var(--color-primary)}.emoji-grid{grid-gap:8px;display:grid;gap:8px;grid-template-columns:repeat(4,1fr);max-height:300px;overflow-y:auto;padding:16px}.emoji-item{align-items:center;border-radius:var(--radius-md);cursor:pointer;display:flex;flex-direction:column;padding:12px 8px;transition:transform .2s,box-shadow .2s}.emoji-item:hover{box-shadow:var(--shadow-md);transform:scale(1.1)}.emoji{font-size:36px;margin-bottom:4px}.emoji-name{color:var(--color-gray-600);font-size:11px;text-align:center}.picker-footer{border-top:1px solid var(--color-gray-100);padding:16px;text-align:center}.picker-backdrop{bottom:0;left:0;position:fixed;right:0;top:0;z-index:999}@media (max-width:768px){.avatar-picker-modal{left:50%;max-width:400px;position:fixed;top:50%;transform:translate(-50%,-50%);width:90%}}.phone-input{margin-bottom:0}.code-step,.phone-step{display:flex;flex-direction:column;gap:var(--spacing-sm)}.code-step label,.phone-step label{color:var(--color-gray-700);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.code-input-group,.phone-input-group{display:flex;gap:var(--spacing-sm)}.code-input-group .form-control,.phone-input-group .form-control{flex:1 1}.code-input-group .btn,.phone-input-group .btn{flex-shrink:0;white-space:nowrap}.code-input{font-family:Courier New,monospace;font-size:var(--font-size-xl)!important;font-weight:var(--font-weight-bold);letter-spacing:8px;text-align:center}.code-input::placeholder{font-weight:400;letter-spacing:8px}.code-sent-to{align-items:center;color:var(--color-gray-600);display:flex;flex-wrap:wrap;font-size:var(--font-size-sm);gap:var(--spacing-xs);margin:0}.code-sent-to strong{color:var(--color-gray-900)}.link-btn{background:none;border:none;color:var(--color-primary);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:0}.link-btn:hover{text-decoration:underline}.link-btn:disabled{color:var(--color-gray-400);cursor:not-allowed;text-decoration:none}.code-actions{align-items:center;display:flex;gap:var(--spacing-md)}.timer{color:var(--color-gray-500)}.error-message,.timer{font-size:var(--font-size-sm)}.error-message{animation:shake .3s ease;color:var(--color-danger);padding:var(--spacing-xs) 0}.auth-page{align-items:center;background:linear-gradient(135deg,#f0f2f5,#e8f0fe 50%,#f0f2f5);display:flex;justify-content:center;min-height:calc(100vh - 60px);padding:var(--spacing-xl)}.register-container{animation:slideUp .5s ease;background-color:var(--color-white);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);max-width:460px;padding:var(--spacing-4xl) var(--spacing-3xl);width:100%}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.auth-title{color:var(--color-gray-900);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-3xl);position:relative;text-align:center}.auth-title:after{background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-full);content:"";display:block;height:3px;margin:var(--spacing-md) auto 0;width:50px}.avatar-section{margin-bottom:var(--spacing-2xl);text-align:center}.avatar-section label{color:var(--color-gray-700);display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);letter-spacing:.5px;margin-bottom:var(--spacing-lg);text-transform:uppercase}.avatar-section .avatar-picker{display:flex;justify-content:center}.alert{animation:shake .3s ease;font-size:var(--font-size-sm);margin-bottom:var(--spacing-xl);padding:var(--spacing-md) var(--spacing-lg)}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}.alert-error{align-items:center;border:1px solid #f5c6cb;display:flex;gap:var(--spacing-sm)}.alert-error:before{content:"⚠️";font-size:var(--font-size-lg)}.auth-form{display:flex;flex-direction:column;gap:var(--spacing-xl)}.form-group label{align-items:center;color:var(--color-gray-700);display:flex;font-size:var(--font-size-sm);gap:var(--spacing-xs)}.form-group label:after{color:var(--color-danger);content:"*";font-size:var(--font-size-sm)}.form-control{background-color:var(--color-gray-50);border:2px solid var(--color-gray-200);border-radius:var(--radius-lg);padding:var(--spacing-md) var(--spacing-lg);transition:all var(--transition-base) ease}.form-control:hover{border-color:var(--color-gray-400)}.form-control:focus{background-color:var(--color-white);box-shadow:0 0 0 4px #1877f21a}.form-control::placeholder{color:var(--color-gray-400);font-size:var(--font-size-sm)}.form-control:disabled{cursor:not-allowed;opacity:.6}.btn-block{border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin-top:var(--spacing-sm);overflow:hidden;padding:var(--spacing-md) var(--spacing-xl);position:relative;transition:all var(--transition-base) ease}.btn-block:not(:disabled):hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.btn-block:not(:disabled):active{transform:translateY(0)}.btn-block:disabled{cursor:not-allowed;opacity:.7}.auth-footer{color:var(--color-gray-600);font-size:var(--font-size-sm);margin-top:var(--spacing-2xl);text-align:center}.auth-link{color:var(--color-primary);font-weight:var(--font-weight-semibold);text-decoration:none;transition:color var(--transition-fast) ease}.auth-link:hover{color:var(--color-primary-dark);text-decoration:underline}.btn-block.loading{color:#0000}.btn-block.loading:after{animation:spin .6s linear infinite;border:2px solid #ffffff4d;border-radius:50%;border-top-color:#fff;content:"";height:20px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:20px}.form-control.error{background-color:#fff5f5;border-color:var(--color-danger)}.form-control.success{background-color:#f0fff4;border-color:var(--color-success)}.input-with-icon{position:relative}.input-with-icon .form-control{padding-left:var(--spacing-4xl)}.input-with-icon .input-icon{color:var(--color-gray-400);font-size:var(--font-size-lg);left:var(--spacing-lg);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.password-strength{margin-top:var(--spacing-xs)}.strength-bar{background-color:var(--color-gray-200);height:4px;margin-bottom:var(--spacing-xs);overflow:hidden}.strength-bar,.strength-fill{border-radius:var(--radius-full)}.strength-fill{height:100%;transition:width var(--transition-base) ease,background-color var(--transition-base) ease}.strength-fill.weak{background-color:var(--color-danger);width:33%}.strength-fill.medium{background-color:var(--color-warning);width:66%}.strength-fill.strong{background-color:var(--color-success);width:100%}.strength-text{color:var(--color-gray-600);font-size:var(--font-size-xs)}@media (max-width:480px){.auth-page{align-items:flex-start;padding:var(--spacing-md)}.register-container{border-radius:var(--radius-lg);box-shadow:none;padding:var(--spacing-2xl) var(--spacing-xl)}.auth-title{font-size:var(--font-size-xl)}.form-control{font-size:var(--font-size-base);padding:var(--spacing-md)}}.form-group{animation:fadeInUp .5s ease forwards;opacity:0}.form-group:first-child{animation-delay:.1s}.form-group:nth-child(2){animation-delay:.2s}.form-group:nth-child(3){animation-delay:.3s}.form-group:nth-child(4){animation-delay:.4s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.register-benefits{background-color:var(--color-gray-50);border-radius:var(--radius-lg);flex-direction:column;margin-bottom:var(--spacing-2xl);padding:var(--spacing-lg)}.benefit-item,.register-benefits{display:flex;gap:var(--spacing-md)}.benefit-item{align-items:center;color:var(--color-gray-600);font-size:var(--font-size-sm)}.benefit-icon{flex-shrink:0;font-size:var(--font-size-lg)}.auth-divider{align-items:center;color:var(--color-gray-400);display:flex;font-size:var(--font-size-sm);gap:var(--spacing-md);margin:var(--spacing-xl) 0}.auth-divider:after,.auth-divider:before{background-color:var(--color-gray-200);content:"";flex:1 1;height:1px}.social-buttons{flex-direction:column}.social-btn,.social-buttons{display:flex;gap:var(--spacing-md)}.social-btn{align-items:center;background-color:var(--color-white);border:2px solid var(--color-gray-200);border-radius:var(--radius-lg);color:var(--color-gray-700);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);justify-content:center;padding:var(--spacing-md);transition:all var(--transition-fast) ease}.social-btn:hover{background-color:var(--color-primary-light);border-color:var(--color-primary)}.social-icon{font-size:var(--font-size-xl)}.steps-indicator{gap:0;margin-bottom:var(--spacing-xl)}.step-dot,.steps-indicator{align-items:center;display:flex;justify-content:center}.step-dot{background-color:var(--color-gray-200);border-radius:50%;color:var(--color-gray-500);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);height:32px;transition:all var(--transition-base) ease;width:32px}.step-dot.active{background:linear-gradient(135deg,var(--color-primary),#42b72a);color:#fff}.step-line{background-color:var(--color-gray-200);height:2px;width:60px}.step-dot.active+.step-line{background-color:var(--color-primary)}.form-actions-row{display:flex;gap:var(--spacing-md);justify-content:space-between;margin-top:var(--spacing-xl)}.form-actions-row .btn{flex:1 1}.text-success{color:var(--color-success);font-weight:var(--font-weight-medium)}.spinner-small.white{animation:spin .6s linear infinite;border:2px solid #ffffff4d;border-radius:50%;border-top-color:#fff;display:inline-block;height:16px;margin-right:var(--spacing-xs);vertical-align:middle;width:16px}.required{color:var(--color-danger);font-weight:var(--font-weight-bold)}.field-hint{color:var(--color-gray-500);display:block;font-size:var(--font-size-xs);margin-top:var(--spacing-xs)}.alert-icon{margin-right:var(--spacing-sm)}.profile-page{animation:fadeIn var(--transition-base) ease;padding:var(--spacing-xl) 0}.error-container,.loading-container{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:400px;padding:var(--spacing-4xl)}.error-container .btn{margin-top:var(--spacing-xl)}.profile-header{align-items:flex-start;background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;gap:var(--spacing-3xl);margin-bottom:var(--spacing-xl);padding:var(--spacing-3xl)}.profile-avatar-section{flex-shrink:0}.profile-avatar{border:4px solid var(--color-primary-light);border-radius:50%;box-shadow:var(--shadow-md);height:150px;overflow:hidden;width:150px}.profile-avatar img{height:100%;object-fit:cover;width:100%}.avatar-placeholder.large{font-size:var(--font-size-3xl);height:150px;width:150px}.profile-info{flex:1 1}.profile-name-row{align-items:center;display:flex;gap:var(--spacing-md);margin-bottom:var(--spacing-xs)}.profile-name{color:var(--color-gray-900);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.profile-username{color:var(--color-gray-600)}.profile-bio,.profile-username{font-size:var(--font-size-base);margin-bottom:var(--spacing-md)}.profile-bio{color:var(--color-gray-800);line-height:1.6;white-space:pre-wrap}.profile-email,.profile-joined{color:var(--color-gray-500);font-size:var(--font-size-sm);margin-bottom:var(--spacing-xs)}.calendar-icon,.email-icon{margin-right:var(--spacing-xs)}.edit-profile-form{display:flex;flex-direction:column;gap:var(--spacing-lg);max-width:500px}.edit-profile-form textarea{min-height:100px;resize:vertical}.char-count{color:var(--color-gray-500);font-size:var(--font-size-xs);text-align:right}.form-actions{display:flex;gap:var(--spacing-md)}.profile-actions{flex-shrink:0}.follow-btn{min-width:160px}.profile-stats{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;justify-content:space-around;margin-bottom:var(--spacing-xl);padding:var(--spacing-xl)}.stat{border-radius:var(--radius-md);cursor:pointer;padding:var(--spacing-md) var(--spacing-xl);text-align:center;transition:all var(--transition-base) ease}.stat:hover{background-color:var(--color-gray-50)}.stat.active{background-color:var(--color-primary-light)}.stat-value{color:var(--color-primary);display:block;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.stat-label{color:var(--color-gray-600);font-size:var(--font-size-sm);margin-top:var(--spacing-xs)}.profile-content{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--spacing-xl)}.section-title{color:var(--color-gray-900);font-size:var(--font-size-xl);margin-bottom:var(--spacing-xl)}.posts-list{display:flex;flex-direction:column;gap:var(--spacing-lg)}.users-grid{grid-gap:var(--spacing-md);display:grid;gap:var(--spacing-md);grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.user-card-small{align-items:center;background-color:var(--color-gray-50);border-radius:var(--radius-md);cursor:pointer;display:flex;gap:var(--spacing-md);padding:var(--spacing-md);transition:all var(--transition-fast) ease}.user-card-small:hover{background-color:var(--color-gray-100);box-shadow:var(--shadow-sm);transform:translateY(-2px)}.user-avatar-mini{border-radius:50%;flex-shrink:0;height:48px;overflow:hidden;width:48px}.user-avatar-mini img{height:100%;object-fit:cover;width:100%}.avatar-placeholder.tiny{font-size:var(--font-size-lg);height:48px;width:48px}.user-info-mini{flex:1 1}.user-info-mini strong{display:block;font-size:var(--font-size-base);margin-bottom:2px}.user-info-mini span{color:var(--color-gray-600);font-size:var(--font-size-sm)}@media (max-width:768px){.profile-header{align-items:center;flex-direction:column;gap:var(--spacing-xl);padding:var(--spacing-xl);text-align:center}.profile-avatar{height:120px;width:120px}.avatar-placeholder.large{font-size:var(--font-size-2xl);height:120px;width:120px}.profile-name-row{flex-wrap:wrap;justify-content:center}.profile-info{text-align:center}.edit-profile-form{margin:0 auto}.form-actions{justify-content:center}.profile-actions{text-align:center;width:100%}.profile-stats{padding:var(--spacing-md)}.stat{padding:var(--spacing-sm)}.stat-value{font-size:var(--font-size-xl)}.users-grid{grid-template-columns:1fr}}@media (max-width:480px){.profile-stats{flex-direction:column;gap:var(--spacing-md)}.stat{align-items:center;display:flex;justify-content:space-between;padding:var(--spacing-md)}}.edit-avatar-section{margin-bottom:20px;text-align:center}.search-page{padding:var(--spacing-xl) 0}.search-container{margin:0 auto;max-width:600px}.search-title{margin-bottom:var(--spacing-xl);text-align:center}.search-box{margin-bottom:var(--spacing-3xl)}.search-input{border-radius:var(--radius-full);box-shadow:var(--shadow-sm);padding:var(--spacing-md) var(--spacing-xl)}.search-input:focus{box-shadow:var(--shadow-md)}.search-results{display:flex;flex-direction:column;gap:var(--spacing-md)}.user-card{align-items:center;background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;gap:var(--spacing-lg);padding:var(--spacing-lg);transition:all var(--transition-base) ease}.user-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.user-card .user-avatar{border-radius:var(--radius-full);flex-shrink:0;height:60px;overflow:hidden;width:60px}.user-card .user-avatar img{height:100%;object-fit:cover;width:100%}.user-card .avatar-placeholder{font-size:var(--font-size-xl);height:60px;width:60px}.user-info{flex:1 1}.user-name{margin-bottom:var(--spacing-xs)}.user-username{color:var(--color-gray-600)}.user-bio,.user-username{font-size:var(--font-size-sm)}.user-bio{color:var(--color-gray-700);margin-top:var(--spacing-xs)}.groups-page{padding:var(--spacing-xl) 0}.groups-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:var(--spacing-xl)}.create-group-form{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:var(--spacing-xl);padding:var(--spacing-xl)}.groups-tabs{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-xl)}.tab{border-radius:var(--radius-md);font-weight:500;padding:var(--spacing-sm) var(--spacing-xl)}.groups-grid{grid-gap:var(--spacing-xl);display:grid;gap:var(--spacing-xl);grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.group-card{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;transition:all var(--transition-base) ease}.group-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.group-cover{height:120px;position:relative}.group-avatar{background:#fff;border:3px solid #fff;border-radius:var(--radius-md);bottom:-30px;height:60px;left:20px;overflow:hidden;position:absolute;width:60px}.group-avatar img{height:100%;object-fit:cover;width:100%}.group-info{padding:var(--spacing-4xl) var(--spacing-lg) var(--spacing-lg)}.group-name{color:var(--color-gray-900);font-size:var(--font-size-lg);margin-bottom:var(--spacing-sm)}.group-description{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;margin-bottom:var(--spacing-md);overflow:hidden}.group-meta{color:var(--color-gray-500);font-size:var(--font-size-xs);gap:var(--spacing-md)}.private-badge{color:var(--color-warning)}.group-actions{border-top:1px solid var(--color-gray-100);display:flex;gap:var(--spacing-sm);padding:var(--spacing-lg)}@media (max-width:768px){.groups-grid{grid-template-columns:1fr}}.group-detail-page{padding:var(--spacing-xl) 0;padding-bottom:100px}.group-detail-header{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:var(--spacing-xl);padding:var(--spacing-xl)}.back-btn{align-items:center;background:none;border:none;color:var(--color-primary);cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);gap:var(--spacing-xs);margin-bottom:var(--spacing-lg);padding:var(--spacing-sm) 0;transition:all var(--transition-fast) ease}.back-btn:hover{color:var(--color-primary-dark)}.group-detail-info{align-items:center;display:flex;flex-wrap:wrap;gap:var(--spacing-xl)}.group-detail-avatar{border-radius:var(--radius-lg);box-shadow:var(--shadow-md);flex-shrink:0;height:80px;overflow:hidden;width:80px}.group-detail-avatar img{height:100%;object-fit:cover;width:100%}.avatar-placeholder.large{align-items:center;background:linear-gradient(135deg,var(--color-primary-light),#e3f2fd);border-radius:var(--radius-lg);color:var(--color-primary);display:flex;font-size:var(--font-size-2xl);height:80px;justify-content:center;width:80px}.group-detail-text{flex:1 1;min-width:200px}.group-detail-text h1{color:var(--color-gray-900);font-size:var(--font-size-xl);margin-bottom:var(--spacing-sm)}.group-meta{display:flex;flex-wrap:wrap;gap:var(--spacing-lg)}.group-description,.group-meta{color:var(--color-gray-600);font-size:var(--font-size-sm)}.group-description{line-height:1.5;margin-top:var(--spacing-sm)}.group-detail-actions{flex-shrink:0}.group-tabs{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-xl)}.tab{background:#fff;border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--spacing-md) var(--spacing-xl);transition:all var(--transition-fast) ease}.tab:hover{background:var(--color-gray-50)}.tab.active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.messages-list{background:#fff;margin-bottom:var(--spacing-lg);max-height:calc(100vh - 350px);min-height:300px;overflow-y:auto;padding:var(--spacing-lg)}.message-item,.messages-list{border-radius:var(--radius-lg)}.message-item{display:flex;gap:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);scroll-margin-top:100px;transition:background-color var(--transition-fast) ease}.message-item:hover{background-color:var(--color-gray-50)}.message-item.highlighted{animation:fadeHighlight 3s ease;background-color:#fff9c4}@keyframes fadeHighlight{0%{background-color:#fff9c4}to{background-color:initial}}.message-avatar{border-radius:50%;flex-shrink:0;height:40px;margin-top:4px;overflow:hidden;width:40px}.message-avatar img{height:100%;object-fit:cover;width:100%}.avatar-placeholder.small{align-items:center;background:linear-gradient(135deg,var(--color-primary-light),#e3f2fd);border-radius:50%;color:var(--color-primary);display:flex;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);height:40px;justify-content:center;width:40px}.message-body{flex:1 1;min-width:0}.message-header{align-items:baseline;display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-bottom:var(--spacing-xs)}.message-author{color:var(--color-gray-900);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);text-decoration:none}.message-author:hover{color:var(--color-primary);text-decoration:underline}.message-time{color:var(--color-gray-400);font-size:11px}.message-content{color:var(--color-gray-800);font-size:var(--font-size-sm);line-height:1.5;margin-bottom:var(--spacing-xs);word-break:break-word}.message-content p{margin:0}.quoted-message{background-color:#f0f7ff;border-left:3px solid var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;margin:var(--spacing-xs) 0;padding:var(--spacing-xs) var(--spacing-md);transition:all var(--transition-fast) ease}.quoted-message:hover{background-color:#e3f0fd;border-left-color:var(--color-primary-dark)}.quoted-header{align-items:center;display:flex;gap:var(--spacing-xs);margin-bottom:1px}.quoted-icon{color:var(--color-primary);font-size:12px}.quoted-author-name{color:var(--color-primary);font-size:11px;font-weight:var(--font-weight-semibold)}.quoted-text{color:var(--color-gray-600);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-actions{display:flex;gap:2px;height:28px;margin-top:2px;opacity:0;transition:opacity .2s ease,visibility .2s ease;visibility:hidden}.message-item:hover .message-actions{opacity:1;visibility:visible}.action-btn{border:1px solid #0000;border-radius:var(--radius-full);color:var(--color-gray-400);display:inline-flex;font-size:11px;gap:3px;padding:3px 10px;transition:all .15s ease}.action-btn:hover{background-color:var(--color-gray-100);border-color:var(--color-gray-200);color:var(--color-gray-700)}.action-btn.reply-btn{color:var(--color-gray-400)}.action-btn.reply-btn:hover{background-color:var(--color-primary-light);border-color:var(--color-primary-light);color:var(--color-primary)}.action-btn.like-btn.liked{color:var(--color-danger);opacity:1;visibility:visible}.action-btn.delete-btn:hover,.action-btn.like-btn:hover{background-color:var(--color-danger-light);border-color:var(--color-danger-light);color:var(--color-danger)}.message-input-area{background:#fff;border-top:1px solid var(--color-gray-200);bottom:0;box-shadow:0 -4px 20px #0000000f;left:0;padding:var(--spacing-md);position:fixed;right:0;z-index:100}.reply-preview{align-items:center;background-color:var(--color-primary-light);border:1px solid #1877f226;border-radius:var(--radius-lg);display:flex;justify-content:space-between;margin-bottom:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md)}.reply-preview-content{flex:1 1;min-width:0}.reply-preview-header{align-items:center;display:flex;gap:var(--spacing-xs);margin-bottom:2px}.reply-preview-icon{color:var(--color-primary);font-size:13px}.reply-preview-header strong{color:var(--color-primary);font-size:12px}.reply-preview-text{color:var(--color-gray-500);font-size:11px;overflow:hidden;padding-left:18px;text-overflow:ellipsis;white-space:nowrap}.reply-preview-close{background:none;border:none;border-radius:var(--radius-full);color:var(--color-gray-400);cursor:pointer;flex-shrink:0;font-size:18px;line-height:1;padding:4px 8px;transition:all var(--transition-fast) ease}.reply-preview-close:hover{background-color:#e41e3f1a;color:var(--color-danger)}.message-form{align-items:center;display:flex;gap:var(--spacing-md);margin:0 auto;max-width:800px}.message-input{background-color:var(--color-gray-50);border:2px solid var(--color-gray-200);border-radius:var(--radius-full);flex:1 1;font-size:var(--font-size-sm);outline:none;padding:12px 20px;transition:all var(--transition-fast) ease}.message-input:focus{background-color:#fff;border-color:var(--color-primary);box-shadow:0 0 0 3px #1877f21a}.message-input::placeholder{color:var(--color-gray-400)}.send-btn{align-items:center;background:linear-gradient(135deg,var(--color-primary) 0,#42b72a 100%);border:none;border-radius:50%;box-shadow:0 2px 8px #1877f24d;color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:44px;justify-content:center;transition:all .2s ease;width:44px}.send-btn:hover:not(:disabled){box-shadow:0 4px 14px #1877f266;transform:scale(1.08)}.send-btn:active:not(:disabled){transform:scale(.95)}.send-btn:disabled{box-shadow:none;cursor:not-allowed;opacity:.4}.send-btn .spinner-small{animation:spin .6s linear infinite;border:2px solid #ffffff4d;border-radius:50%;border-top-color:#fff;height:18px;width:18px}.group-members{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--spacing-xl)}.members-grid{grid-gap:var(--spacing-md);display:grid;gap:var(--spacing-md);grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.member-card{align-items:center;background:var(--color-gray-50);border-radius:var(--radius-lg);color:inherit;display:flex;gap:var(--spacing-md);padding:var(--spacing-md);text-decoration:none;transition:all var(--transition-fast) ease}.member-card:hover{background:var(--color-gray-100);box-shadow:var(--shadow-sm);transform:translateY(-2px)}.member-avatar{border-radius:50%;flex-shrink:0;height:48px;overflow:hidden;width:48px}.member-avatar img{height:100%;object-fit:cover;width:100%}.member-info{flex:1 1;min-width:0}.member-info strong{display:block;font-size:var(--font-size-sm);margin-bottom:2px}.member-info span{color:var(--color-gray-500);font-size:var(--font-size-xs)}.member-role-icon{flex-shrink:0;font-size:var(--font-size-xl)}.admin-badge{background:linear-gradient(135deg,#f0a500,#e67e22);border-radius:var(--radius-sm);color:#fff;display:inline-block;font-size:10px;font-weight:var(--font-weight-bold);margin-left:var(--spacing-xs);padding:2px 6px}.empty-state{color:var(--color-gray-500);padding:var(--spacing-4xl) var(--spacing-xl)}.empty-state h3{color:var(--color-gray-700);font-size:var(--font-size-lg)}.empty-state p{color:var(--color-gray-500);font-size:var(--font-size-sm)}@media (max-width:768px){.group-detail-page{padding-bottom:100px}.group-detail-info{flex-direction:column;text-align:center}.group-detail-actions,.group-detail-actions .btn{width:100%}.group-meta{justify-content:center}.message-input-area{padding:var(--spacing-sm)}.message-form{gap:var(--spacing-sm)}.message-input{padding:10px 16px}.members-grid{grid-template-columns:1fr}.messages-list{max-height:calc(100vh - 300px)}}@media (min-width:769px){.message-input-area{padding-left:calc(50% - 400px + var(--spacing-md));padding-right:calc(50% - 400px + var(--spacing-md))}}.admin-sidebar{background:linear-gradient(180deg,var(--color-gray-900) 0,#2d3748 100%);bottom:0;color:var(--color-white);left:0;position:fixed;top:0;transition:width var(--transition-base) ease;width:260px;z-index:var(--z-fixed)}.admin-sidebar.collapsed{width:80px}.sidebar-header{border-bottom:1px solid #ffffff1a;padding:var(--spacing-xl) var(--spacing-lg)}.sidebar-title{color:var(--color-white);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);overflow:hidden;white-space:nowrap}.sidebar-nav{padding:var(--spacing-lg) 0}.sidebar-link{align-items:center;color:#ffffffb3;display:flex;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);transition:all var(--transition-fast) ease;white-space:nowrap}.sidebar-link:hover{background-color:#ffffff1a;color:var(--color-white)}.sidebar-link.active{background-color:var(--color-primary);color:var(--color-white)}.sidebar-icon{font-size:var(--font-size-xl);text-align:center;width:24px}.sidebar-label{font-size:var(--font-size-base);font-weight:var(--font-weight-medium)}@media (max-width:768px){.admin-sidebar{transform:translateX(-100%)}.admin-sidebar.collapsed{transform:translateX(0);width:260px}}.sidebar-link .sidebar-icon{flex-shrink:0}.admin-sidebar.collapsed .sidebar-link{justify-content:center;padding:var(--spacing-md)}.admin-sidebar.collapsed .sidebar-header{padding:var(--spacing-xl) var(--spacing-sm);text-align:center}.admin-header{background-color:var(--color-white);box-shadow:var(--shadow-sm);justify-content:space-between;padding:var(--spacing-lg) var(--spacing-xl)}.admin-header,.header-left{align-items:center;display:flex}.header-left{gap:var(--spacing-lg)}.menu-toggle{background:none;border:none;color:var(--color-gray-700);cursor:pointer;padding:var(--spacing-sm)}.menu-toggle,.page-title{font-size:var(--font-size-xl)}.header-right{gap:var(--spacing-xl)}.header-right,.user-info{align-items:center;display:flex}.user-info{gap:var(--spacing-md)}.admin-badge,.user-name{font-weight:var(--font-weight-medium)}.admin-badge{background-color:var(--color-primary-light);border-radius:var(--radius-full);color:var(--color-primary);font-size:var(--font-size-xs);padding:var(--spacing-xs) var(--spacing-sm)}.stats-card{align-items:center;background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);display:flex;gap:var(--spacing-lg);padding:var(--spacing-xl);transition:all var(--transition-base) ease}.stats-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.stats-icon{align-items:center;background-color:#1877f21a;border-radius:var(--radius-lg);display:flex;font-size:48px;height:60px;justify-content:center;width:60px}.stats-content{flex:1 1}.stats-value{color:var(--color-gray-900);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-xs)}.stats-title{color:var(--color-gray-600);font-size:var(--font-size-sm)}.stats-card-blue .stats-icon{background-color:#1877f21a}.stats-card-green .stats-icon{background-color:#42b72a1a}.stats-card-purple .stats-icon{background-color:#8b5cf61a}.stats-card-orange .stats-icon{background-color:#f973161a}.stats-card-red .stats-icon{background-color:#e41e3f1a}.stats-card-teal .stats-icon{background-color:#14b8a61a}.stats-page{animation:fadeIn var(--transition-base) ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.stats-grid{grid-gap:var(--spacing-xl);display:grid;gap:var(--spacing-xl);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-top:var(--spacing-xl)}.user-table-wrapper{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow-x:auto}.user-table{border-collapse:collapse;width:100%}.user-table th{border-bottom:2px solid var(--color-gray-100);color:var(--color-gray-700);font-weight:var(--font-weight-semibold);padding:var(--spacing-lg);text-align:left;white-space:nowrap}.user-table td{border-bottom:1px solid var(--color-gray-100);padding:var(--spacing-lg)}.user-cell{align-items:center;display:flex;gap:var(--spacing-md)}.user-avatar-small{border-radius:var(--radius-full);flex-shrink:0;height:40px;overflow:hidden;width:40px}.user-avatar-small img{height:100%;object-fit:cover;width:100%}.user-avatar-small .avatar-placeholder{font-size:var(--font-size-base);height:40px;width:40px}.role-badge,.status-badge{border-radius:var(--radius-full);display:inline-block;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);padding:var(--spacing-xs) var(--spacing-sm)}.status-badge.active{background-color:#e8f5e9;color:#2e7d32}.status-badge.blocked{background-color:#ffebee;color:#c62828}.role-badge.admin{background-color:#e3f2fd;color:#1565c0}.role-badge.user{background-color:var(--color-gray-100);color:var(--color-gray-700)}.action-buttons{display:flex;gap:var(--spacing-xs)}.action-btn{align-items:center;background:none;border:1px solid var(--color-gray-200);border-radius:var(--radius-sm);cursor:pointer;display:flex;font-size:var(--font-size-base);height:32px;justify-content:center;transition:all var(--transition-fast) ease;width:32px}.action-btn:hover{background-color:var(--color-gray-50)}.action-btn.edit:hover{border-color:var(--color-primary);color:var(--color-primary)}.action-btn.delete:hover{border-color:var(--color-danger);color:var(--color-danger)}.action-btn.save:hover{border-color:var(--color-success);color:var(--color-success)}.action-btn.cancel:hover{border-color:var(--color-gray-600);color:var(--color-gray-600)}.toggle-switch{display:inline-block;height:24px;position:relative;width:44px}.toggle-switch input{height:0;opacity:0;width:0}.toggle-slider{background-color:var(--color-gray-300);border-radius:var(--radius-full);bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:background-color var(--transition-fast) ease}.toggle-slider:before{background-color:var(--color-white);border-radius:50%;bottom:2px;content:"";height:20px;left:2px;position:absolute;transition:transform var(--transition-fast) ease;width:20px}input:checked+.toggle-slider{background-color:var(--color-primary)}input:checked+.toggle-slider:before{transform:translateX(20px)}.users-manager{animation:fadeIn var(--transition-base) ease}.manager-header{align-items:center;display:flex;flex-wrap:wrap;gap:var(--spacing-lg);justify-content:space-between;margin-bottom:var(--spacing-xl)}.search-box{min-width:300px}.search-input{border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);font-size:var(--font-size-base);padding:var(--spacing-md) var(--spacing-lg);transition:all var(--transition-base) ease;width:100%}.search-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #1877f21a;outline:none}.pagination{align-items:center;display:flex;gap:var(--spacing-lg);justify-content:center;margin-top:var(--spacing-xl);padding:var(--spacing-lg)}.pagination-btn{background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-md);color:var(--color-gray-700);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--spacing-sm) var(--spacing-lg);transition:all var(--transition-fast) ease}.pagination-btn:hover:not(:disabled){background-color:var(--color-gray-50);border-color:var(--color-gray-300)}.pagination-btn:disabled{cursor:not-allowed;opacity:.5}.pagination-info{color:var(--color-gray-600);font-size:var(--font-size-sm)}@media (max-width:768px){.manager-header{align-items:stretch;flex-direction:column}.search-box{min-width:auto}}.post-table-wrapper{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow-x:auto}.post-table{border-collapse:collapse;width:100%}.post-table th{border-bottom:2px solid var(--color-gray-100);color:var(--color-gray-700);font-weight:var(--font-weight-semibold);padding:var(--spacing-lg);text-align:left;white-space:nowrap}.post-table td{border-bottom:1px solid var(--color-gray-100);padding:var(--spacing-lg)}.post-content-preview{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.post-author-cell{align-items:center;display:flex;gap:var(--spacing-md)}.post-stats{display:flex;gap:var(--spacing-lg)}.stat-item{align-items:center;color:var(--color-gray-600);display:flex;font-size:var(--font-size-sm);gap:var(--spacing-xs)}.stat-icon{font-size:var(--font-size-base)}.post-image-thumb{border-radius:var(--radius-sm);height:50px;object-fit:cover;width:50px}.badge{border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);padding:var(--spacing-xs) var(--spacing-sm)}.badge-image{background-color:#e3f2fd;color:#1565c0}.posts-manager{animation:fadeIn var(--transition-base) ease}.posts-filters{display:flex;flex-wrap:wrap;gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}.filter-select{background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-sm);padding:var(--spacing-sm) var(--spacing-lg)}.filter-select:focus{border-color:var(--color-primary);outline:none}.admin-layout{background-color:var(--color-gray-50);display:flex;min-height:100vh}.admin-main{flex:1 1;margin-left:260px;transition:margin-left var(--transition-base) ease}.admin-main.expanded{margin-left:80px}.admin-content{padding:var(--spacing-xl)}@media (max-width:768px){.admin-main{margin-left:0}}:root{--color-primary:#1877f2;--color-primary-dark:#166fe5;--color-primary-light:#e7f3ff;--color-secondary:#42b72a;--color-secondary-dark:#36a420;--color-danger:#e41e3f;--color-danger-light:#fee;--color-warning:#f0a500;--color-success:#00a400;--color-white:#fff;--color-black:#1a1a1a;--color-gray-50:#f0f2f5;--color-gray-100:#e4e6eb;--color-gray-200:#ddd;--color-gray-300:#ccc;--color-gray-400:#b0b3b8;--color-gray-500:#8a8d91;--color-gray-600:#666;--color-gray-700:#444;--color-gray-800:#333;--color-gray-900:#1a1a1a;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 2px 4px #0000001a;--shadow-lg:0 4px 12px #0000001a;--shadow-xl:0 8px 24px #00000026;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:12px;--spacing-lg:16px;--spacing-xl:20px;--spacing-2xl:24px;--spacing-3xl:32px;--spacing-4xl:40px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-full:9999px;--font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,sans-serif;--font-size-xs:12px;--font-size-sm:14px;--font-size-base:16px;--font-size-lg:18px;--font-size-xl:20px;--font-size-2xl:24px;--font-size-3xl:28px;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--z-dropdown:1000;--z-sticky:1020;--z-fixed:1030;--z-modal:1040;--z-popover:1050;--z-tooltip:1060;--transition-fast:150ms;--transition-base:200ms;--transition-slow:300ms;--container-max-width:1200px;--container-padding:20px;--breakpoint-mobile:480px;--breakpoint-tablet:768px;--breakpoint-desktop:1024px;--breakpoint-wide:1200px}*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{background-color:var(--color-gray-50);color:var(--color-gray-900);font-family:var(--font-family);font-size:var(--font-size-base);line-height:1.5}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-semibold);line-height:1.2}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}h3{font-size:var(--font-size-xl)}h4{font-size:var(--font-size-lg)}h5,h6{font-size:var(--font-size-base)}p{margin-bottom:var(--spacing-md)}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:inherit}img{display:block;height:auto;max-width:100%}input,select,textarea{font-family:inherit;font-size:inherit}ol,ul{list-style:none}.container{margin:0 auto;max-width:var(--container-max-width);padding:0 var(--container-padding);width:100%}.btn{align-items:center;border:none;border-radius:var(--radius-md);cursor:pointer;display:inline-flex;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);justify-content:center;line-height:1.5;padding:var(--spacing-sm) var(--spacing-lg);text-decoration:none;transition:all var(--transition-fast) ease;-webkit-user-select:none;user-select:none;white-space:nowrap}.btn:disabled{cursor:not-allowed;opacity:.6}.btn-primary{background-color:var(--color-primary);color:var(--color-white)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-dark)}.btn-secondary{background-color:var(--color-secondary);color:var(--color-white)}.btn-secondary:hover:not(:disabled){background-color:var(--color-secondary-dark)}.btn-outline{background-color:initial;border:1px solid var(--color-gray-200);color:var(--color-gray-900)}.btn-outline:hover:not(:disabled){background-color:var(--color-gray-50)}.btn-danger{background-color:var(--color-danger);color:var(--color-white)}.btn-block{width:100%}.form-group{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.form-group label{color:var(--color-gray-800);font-weight:var(--font-weight-medium)}.form-control{border:1px solid var(--color-gray-200);border-radius:var(--radius-md);font-size:var(--font-size-base);padding:var(--spacing-sm) var(--spacing-md);transition:border-color var(--transition-fast) ease}.form-control:focus{border-color:var(--color-primary);outline:none}.form-control::placeholder{color:var(--color-gray-500)}.alert{border-radius:var(--radius-md);margin-bottom:var(--spacing-lg);padding:var(--spacing-md)}.alert-error{background-color:var(--color-danger-light);border:1px solid var(--color-danger);color:var(--color-danger)}.alert-success{background-color:#e8f5e9;border:1px solid var(--color-success);color:var(--color-success)}.loading{align-items:center;color:var(--color-gray-600);display:flex;flex-direction:column;justify-content:center;padding:var(--spacing-4xl)}.spinner{animation:spin 1s linear infinite;border:4px solid var(--color-gray-100);border-radius:50%;border-top-color:var(--color-primary);height:40px;margin-bottom:var(--spacing-md);width:40px}@keyframes spin{to{transform:rotate(1turn)}}.empty-state{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);color:var(--color-gray-600);padding:var(--spacing-4xl);text-align:center}.empty-icon{font-size:48px;margin-bottom:var(--spacing-lg)}.empty-state h3{color:var(--color-gray-900);margin-bottom:var(--spacing-sm)}.text-center{text-align:center}.text-muted{color:var(--color-gray-600)}.mt-1{margin-top:var(--spacing-xs)}.mt-2{margin-top:var(--spacing-sm)}.mt-3{margin-top:var(--spacing-md)}.mt-4{margin-top:var(--spacing-lg)}.mb-1{margin-bottom:var(--spacing-xs)}.mb-2{margin-bottom:var(--spacing-sm)}.mb-3{margin-bottom:var(--spacing-md)}.mb-4{margin-bottom:var(--spacing-lg)}.App{background-color:var(--color-gray-50);display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1 1;padding-top:60px}.loading-container{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:60vh;padding:var(--spacing-4xl)}.loading-container p{color:var(--color-gray-600);font-size:var(--font-size-lg);margin-top:var(--spacing-lg)}.error-page{align-items:center;display:flex;justify-content:center;min-height:calc(100vh - 60px);padding:var(--spacing-4xl)}.error-content{max-width:500px;text-align:center}.error-content h1{color:var(--color-primary);font-size:120px;font-weight:var(--font-weight-bold);line-height:1;margin-bottom:var(--spacing-xl);text-shadow:4px 4px 0 var(--color-gray-100)}.error-content h2{color:var(--color-gray-900);font-size:var(--font-size-2xl);margin-bottom:var(--spacing-lg)}.error-content p{color:var(--color-gray-600);font-size:var(--font-size-lg);line-height:1.6;margin-bottom:var(--spacing-2xl)}.error-content .btn{font-size:var(--font-size-base);padding:var(--spacing-md) var(--spacing-2xl)}.main-content{animation:pageFadeIn .3s ease}@keyframes pageFadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.page-title{color:var(--color-gray-900);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-xl)}.page-subtitle{color:var(--color-gray-600);font-size:var(--font-size-lg);margin-bottom:var(--spacing-2xl)}.card{background-color:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--spacing-xl);transition:all var(--transition-base) ease}.card:hover{box-shadow:var(--shadow-md)}@media (max-width:768px){.main-content{padding-top:56px}.error-content h1{font-size:80px}.error-content h2{font-size:var(--font-size-xl)}}@media (max-width:480px){.error-content h1{font-size:60px}}
/*# sourceMappingURL=main.46d0f2bd.css.map*/