*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #ffffff;--bg-secondary: #f8f9fa;--bg-tertiary: #e9ecef;--text-primary: #212529;--text-secondary: #6c757d;--border-color: #dee2e6;--accent-color: #007bff;--accent-hover: #0056b3;--success-color: #28a745;--danger-color: #dc3545;--warning-color: #ffc107;--shadow: 0 2px 8px rgba(0, 0, 0, .1);--shadow-lg: 0 4px 16px rgba(0, 0, 0, .15);--sidebar-width: 260px;--sidebar-collapsed: 70px;--header-height: 60px}[data-theme=dark]{--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-tertiary: #0f3460;--text-primary: #e9ecef;--text-secondary: #adb5bd;--border-color: #495057;--shadow: 0 2px 8px rgba(0, 0, 0, .3);--shadow-lg: 0 4px 16px rgba(0, 0, 0, .4)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.5;color:var(--text-primary);background:var(--bg-secondary);transition:background .3s ease,color .3s ease}.btn{padding:.5rem 1rem;border:none;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-decoration:none;display:inline-flex;align-items:center;gap:.5rem}.btn-primary{background:var(--accent-color);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary)}.btn-secondary:hover{background:var(--border-color)}.btn-link{background:transparent;color:var(--accent-color);padding:.25rem .5rem}.btn-link:hover{text-decoration:underline}.btn-icon{padding:.5rem;background:transparent;border:1px solid var(--border-color)}.btn-block{width:100%;justify-content:center}.btn:disabled{opacity:.6;cursor:not-allowed}.advanced-layout{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-width);background:var(--bg-primary);border-right:1px solid var(--border-color);display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;transition:all .3s ease;z-index:1000;box-shadow:var(--shadow)}.sidebar-closed .sidebar{width:var(--sidebar-collapsed)}.sidebar-header{padding:1.25rem;border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;height:var(--header-height)}.sidebar-header h2{font-size:1.25rem;transition:opacity .3s ease}.sidebar-closed .sidebar-header h2{opacity:0;width:0;overflow:hidden}.sidebar-toggle{background:transparent;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-primary)}.sidebar-nav{flex:1;padding:1rem 0;overflow-y:auto}nav.sidebar-nav>a{display:flex;align-items:center;padding:.75rem 1.25rem;color:var(--text-secondary);text-decoration:none;transition:all .2s ease;gap:1rem}nav.sidebar-nav>a:hover{background:var(--bg-secondary);color:var(--text-primary)}nav.sidebar-nav>a.active{background:var(--bg-secondary);color:var(--accent-color);border-right:3px solid var(--accent-color)}.nav-icon{font-size:1.25rem;min-width:1.5rem}.sidebar-closed .nav-label{opacity:0;width:0;overflow:hidden}.sidebar-footer{padding:1rem;border-top:1px solid var(--border-color)}.user-profile{display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem}.user-avatar{width:40px;height:40px;border-radius:50%;background:var(--accent-color);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;flex-shrink:0}.user-info{transition:opacity .3s ease}.sidebar-closed .user-info{opacity:0;width:0;overflow:hidden}.user-name{font-weight:600;font-size:.875rem}.user-email{font-size:.75rem;color:var(--text-secondary)}.logout-btn{width:100%;justify-content:center;gap:.5rem}.main-content{flex:1;margin-left:var(--sidebar-width);display:flex;flex-direction:column;min-height:100vh;transition:margin-left .3s ease}.sidebar-closed .main-content{margin-left:var(--sidebar-collapsed)}.app-header{height:var(--header-height);background:var(--bg-primary);border-bottom:1px solid var(--border-color);padding:0 1.5rem;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow);position:sticky;top:0;z-index:100}.mobile-menu-btn{display:none;background:transparent;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-primary)}.header-actions{display:flex;gap:.5rem}.content-area{flex:1;padding:2rem;overflow-y:auto}.app-footer{padding:1.5rem;text-align:center;border-top:1px solid var(--border-color);background:var(--bg-primary);color:var(--text-secondary);font-size:.875rem}.page-content{max-width:1200px;margin:0 auto}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;gap:1rem;flex-wrap:wrap}.page-header h1{font-size:2rem;font-weight:700}.page-actions{display:flex;gap:.75rem;align-items:center}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:var(--bg-primary);padding:1.5rem;border-radius:8px;box-shadow:var(--shadow);display:flex;align-items:center;gap:1rem}.stat-icon{font-size:2.5rem}.stat-content h3{font-size:2rem;font-weight:700;margin-bottom:.25rem}.stat-content p{color:var(--text-secondary);font-size:.875rem}.dashboard-sections{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:1.5rem}.recent-users,.recent-posts{background:var(--bg-primary);padding:1.5rem;border-radius:8px;box-shadow:var(--shadow)}.recent-users h2,.recent-posts h2{font-size:1.25rem;margin-bottom:1rem}.user-list,.post-list{display:flex;flex-direction:column;gap:1rem}.user-card{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-secondary);border-radius:6px;cursor:pointer;transition:all .2s ease}.user-card:hover{transform:translate(4px);box-shadow:var(--shadow)}.user-info h4{margin-bottom:.25rem}.user-info p{font-size:.875rem;color:var(--text-secondary)}.user-company{display:inline-block;font-size:.75rem;color:var(--accent-color);background:var(--bg-tertiary);padding:.25rem .5rem;border-radius:4px;margin-top:.5rem}.post-card{padding:1rem;background:var(--bg-secondary);border-radius:6px;cursor:pointer;transition:all .2s ease}.post-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}.post-card h4,.post-card h3{margin-bottom:.5rem;color:var(--text-primary)}.post-body{color:var(--text-secondary);font-size:.875rem;line-height:1.5}.post-user,.post-user-badge{display:inline-block;font-size:.75rem;color:var(--accent-color);background:var(--bg-tertiary);padding:.25rem .5rem;border-radius:4px;margin-top:.5rem}.data-table{background:var(--bg-primary);border-radius:8px;box-shadow:var(--shadow);overflow:hidden}.table-header{padding:1rem;border-bottom:1px solid var(--border-color);display:flex;gap:1rem;align-items:center}.search-input{flex:1;padding:.5rem 1rem;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);color:var(--text-primary);font-size:.875rem}.table-wrapper{overflow-x:auto}table{width:100%;border-collapse:collapse}thead{background:var(--bg-secondary)}th{padding:.75rem 1rem;text-align:left;font-weight:600;font-size:.875rem;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none}th.sorted{color:var(--accent-color)}.sort-indicator{margin-left:.5rem}td{padding:.75rem 1rem;border-top:1px solid var(--border-color);font-size:.875rem}tbody tr{cursor:pointer;transition:background .2s ease}tbody tr:hover{background:var(--bg-secondary)}.no-data{text-align:center;color:var(--text-secondary);padding:2rem!important}.table-footer{padding:.75rem 1rem;border-top:1px solid var(--border-color);font-size:.875rem;color:var(--text-secondary)}.user-detail-grid{display:grid;grid-template-columns:300px 1fr;gap:1.5rem}.user-info-card{background:var(--bg-primary);padding:2rem;border-radius:8px;box-shadow:var(--shadow);text-align:center}.user-avatar-large{width:100px;height:100px;border-radius:50%;background:var(--accent-color);color:#fff;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:700;margin:0 auto 1rem}.user-username{color:var(--text-secondary);margin-bottom:1.5rem}.user-details{text-align:left}.detail-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:var(--bg-secondary);border-radius:6px;margin-bottom:.5rem}.detail-icon{font-size:1.25rem}.user-posts-section{background:var(--bg-primary);padding:1.5rem;border-radius:8px;box-shadow:var(--shadow)}.posts-list{display:flex;flex-direction:column;gap:1rem}.no-posts{text-align:center;color:var(--text-secondary);padding:2rem}.posts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.5rem}.post-header{display:flex;justify-content:space-between;align-items:start;gap:1rem;margin-bottom:.75rem}.post-footer{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border-color)}.filter-select{padding:.5rem 1rem;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-primary);color:var(--text-primary);font-size:.875rem;cursor:pointer}.empty-state{text-align:center;padding:4rem 2rem;color:var(--text-secondary)}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent-color) 0%,#6f42c1 100%);padding:2rem}.login-container{width:100%;max-width:400px}.login-card{background:var(--bg-primary);padding:2.5rem;border-radius:12px;box-shadow:var(--shadow-lg)}.login-card h1{font-size:1.75rem;margin-bottom:.5rem;text-align:center}.login-subtitle{text-align:center;color:var(--text-secondary);margin-bottom:2rem}.login-form{margin-bottom:1.5rem}.form-group{margin-bottom:1.25rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:500;font-size:.875rem}.form-group input{width:100%;padding:.75rem 1rem;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-secondary);color:var(--text-primary);font-size:1rem}.form-group input:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 3px #007bff1a}.login-info{background:var(--bg-secondary);padding:1rem;border-radius:6px;font-size:.875rem}.login-info code{background:var(--bg-primary);padding:.25rem .5rem;border-radius:4px;font-family:Courier New,monospace}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;padding:1rem;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-container{background:var(--bg-primary);border-radius:8px;box-shadow:var(--shadow-lg);max-width:600px;width:100%;max-height:80vh;display:flex;flex-direction:column;animation:popIn .3s ease-out}.modal-header{padding:1.5rem;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.modal-header h2{font-size:1.25rem}.modal-close{background:transparent;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-secondary);padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center}.modal-body{padding:1.5rem;overflow-y:auto;flex:1}.modal-footer{padding:1.5rem;border-top:1px solid var(--border-color);display:flex;gap:.75rem;justify-content:flex-end}.comments-list{display:flex;flex-direction:column;gap:1rem}.comment{padding:1rem;background:var(--bg-secondary);border-radius:6px;margin-bottom:.5rem}.comment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.comment-email{font-size:.75rem;color:var(--text-secondary)}.comment-body{font-size:.875rem;line-height:1.5}.post-detail{line-height:1.6}.post-author{margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--border-color)}.post-content{font-size:.95rem;color:var(--text-secondary)}app-loading-spinner[data-visible=true]{display:flex;position:fixed;inset:0;background:#0000004d;z-index:3000;align-items:center;justify-content:center}.spinner-container{background:var(--bg-primary);padding:2rem;border-radius:8px;box-shadow:var(--shadow-lg);text-align:center}.spinner{width:48px;height:48px;border:4px solid var(--border-color);border-top-color:var(--accent-color);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 1rem}@keyframes spin{to{transform:rotate(360deg)}}.error-message{background:#fff3cd;border:1px solid #ffc107;border-radius:6px;padding:1rem;margin-bottom:1rem;display:flex;gap:1rem;align-items:start}[data-theme=dark] .error-message{background:#3d2f00;border-color:#805b00}.error-icon{font-size:1.5rem}.error-content{flex:1}.error-content h3{margin-bottom:.5rem;font-size:1rem}.error-content p{font-size:.875rem;margin-bottom:.75rem}@media(max-width:768px){.sidebar{transform:translate(-100%)}.sidebar-open .sidebar{transform:translate(0)}.main-content{margin-left:0}.mobile-menu-btn{display:block}.user-detail-grid,.dashboard-sections,.posts-grid,.stats-grid{grid-template-columns:1fr}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.page-content{animation:fadeIn .3s ease}