* {margin:0;padding:0;box-sizing:border-box;}:root {--primary-color:#6366f1;--primary-hover:#4f46e5;--secondary-color:#64748b;--background:#f8fafc;--surface:#ffffff;--text-primary:#1e293b;--text-secondary:#64748b;--border-color:#e2e8f0;--success:#10b981;--error:#ef4444;--shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.05);--shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.1);--shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.1);--radius-sm:6px;--radius-md:12px;--radius-lg:16px;}body {font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', sans-serif;background:var(--background);color:var(--text-primary);line-height:1.6;min-height:100vh;}.container {max-width:1200px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:250px 1fr;gap:30px;padding-top:120px;padding-bottom:60px;}.container.create-page {display:block;max-width:900px;}.container.profile-page {display:block;max-width:960px;}.container.post-page {display:block;max-width:960px;}@media (max-width:768px) {body {background:var(--surface);}.container {grid-template-columns:1fr;padding-top:95px;padding-bottom:60px;background:var(--surface);}.sidebar {order:2;position:static;height:auto;}.main-content {order:1;}}.header {position:fixed;top:0;left:0;right:0;background:var(--surface);border-bottom:1px solid var(--border-color);padding:15px 0;z-index:1000;box-shadow:var(--shadow-sm);}.header-content {max-width:1200px;margin:0 auto;padding:0 25px;display:flex;justify-content:space-between;align-items:center;gap:20px;}.logo {font-size:24px;font-weight:700;color:var(--primary-color);text-decoration:none;display:flex;align-items:center;gap:8px;flex-shrink:0;}.nav-links {display:flex;gap:20px;align-items:center;flex-shrink:0;}.nav-links a {color:var(--text-secondary);text-decoration:none;font-weight:500;transition:color 0.2s;white-space:nowrap;}.nav-links a:hover {color:var(--primary-color);}.user-menu {display:flex;align-items:center;gap:12px;flex-shrink:0;}.user-dropdown {position:relative;display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px 12px;border-radius:var(--radius-sm);transition:background 0.2s;}.user-dropdown:hover {background:var(--background);}.user-name {font-size:14px;font-weight:500;color:var(--text-primary);}.dropdown-menu {position:absolute;top:100%;right:0;background:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);min-width:110px;display:none;z-index:1000;margin-top:18px;}.dropdown-menu.show {display:block;}.dropdown-menu a {display:block;padding:5px 10px;color:var(--text-primary);text-decoration:none;font-size:14px;transition:background 0.2s;margin:10px;}.dropdown-menu a:hover {background:var(--background);color:var(--primary-color);border-radius:var(--radius-sm);}.user-avatar,.post-author-avatar,.reply-avatar,.profile-avatar-img,.author-avatar {width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--primary-color);aspect-ratio:1/1;flex-shrink:0;}.user-avatar {width:40px;height:40px;min-width:40px;min-height:40px;}.post-author-avatar {width:48px;height:48px;}.reply-avatar {width:40px;height:40px;}.profile-avatar-img {width:120px;height:120px;border:4px solid var(--primary-color);}.author-avatar {width:50px;height:50px;}.avatar-placeholder {width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);display:flex;align-items:center;justify-content:center;color:white;font-size:14px;font-weight:600;text-transform:uppercase;}.btn {padding:10px 24px;border:none;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;transition:all 0.2s;text-decoration:none;display:inline-block;text-align:center;}.btn-primary {background:var(--primary-color);color:white;}.btn-primary:hover {background:var(--primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md);}.btn-secondary {background:var(--surface);color:var(--text-secondary);border:1px solid var(--border-color);}.btn-secondary:hover {border-color:var(--primary-color);color:var(--primary-color);}.btn-block {width:100%;}.sidebar {position:sticky;top:100px;height:fit-content;}.sidebar-section {background:var(--surface);border-radius:var(--radius-md);padding:24px;margin-bottom:24px;box-shadow:var(--shadow-sm);}.sidebar-section h3 {font-size:16px;font-weight:600;margin-bottom:16px;color:var(--text-primary);}.sidebar-section:hover {box-shadow:var(--shadow-lg);}.tag-cloud {display:flex;flex-direction:column;gap:8px;}.tag-item {padding:10px 16px;border-radius:var(--radius-sm);text-decoration:none;color:var(--text-secondary);font-weight:500;transition:all 0.2s;display:flex;align-items:center;justify-content:space-between;}.tag-item:hover {background:var(--background);color:var(--primary-color);}.tag-item.active {background:var(--primary-color);color:white;}.main-content {min-height:calc(100vh - 200px);}.content-header {display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:16px;}.content-header h2 {font-size:20px;font-weight:700;color:var(--text-primary);}.search-form {display:flex;gap:12px;flex-wrap: nowrap;align-items: center;}.search-form input {padding:10px 16px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:14px;width:250px;transition:border-color 0.2s;}.search-form input:focus {outline:none;border-color:var(--primary-color);}.search-form input[type="text"] {flex: 1;min-width: 0;}.search-form button {flex-shrink: 0;white-space: nowrap;}.posts-feed {display:flex;flex-direction:column;gap:20px;}.post-card {background:var(--surface);border-radius:var(--radius-md);padding:48px;box-shadow:var(--shadow-sm);transition:all 0.3s;}.post-card-link {display:block;text-decoration:none;color:inherit;transition:all 0.3s;}.post-card-link * {text-decoration:none !important;}.post-card-link:hover .post-card {transform:translateY(-2px);box-shadow:var(--shadow-lg);}.post-card-link:hover .post-title {color:var(--primary-hover);}.post-card-header {display:flex;align-items:center;gap:12px;margin-bottom:16px;}.post-author-avatar {width:48px;height:48px;border-radius:50%;object-fit:cover;}.post-author-avatar-link {display:inline-block;text-decoration:none;}.post-author-avatar-link:hover {opacity:0.8;}.post-meta-info {flex:1;}.post-author {font-weight:600;color:var(--text-primary);font-size:15px;text-decoration:none;}.post-author:hover {color:var(--primary-color);text-decoration:none;}.post-time {font-size:14px;color:var(--text-secondary);}.featured-badge {background:linear-gradient(135deg, #f59e0b, #d97706);color:white;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;}.post-title {font-size:20px;font-weight:700;margin-bottom:12px;line-height:1.4;color:var(--primary-color);}.post-excerpt {color:var(--text-secondary);font-size:15px;line-height:1.7;margin-bottom:16px;word-wrap:break-word;overflow-wrap:break-word;word-break:break-word;}.post-tags {display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}.post-tags a {text-decoration:none;}.tag-badge {padding:6px 14px;border-radius:20px;color:white;font-size:13px;font-weight:500;}.post-stats {display:flex;gap:20px;color:var(--text-secondary);}.stat-item {display:flex;align-items:center;gap:6px;font-size:14px;}.icon-eye {font-size:26px;}.icon-eye::before {content:'👁';}.icon-comment::before {content:'💬';}.icon-heart::before {content:'❤️';}.empty-state {text-align:center;padding:80px 20px;background:var(--surface);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);}.empty-state p {color:var(--text-secondary);font-size:18px;margin-bottom:24px;}.pagination {display:flex;justify-content:center;gap:8px;margin-top:32px;}.page-link {padding:10px 16px;border:1px solid var(--border-color);border-radius:var(--radius-sm);text-decoration:none;color:var(--text-secondary);font-weight:500;transition:all 0.2s;}.page-link:hover {border-color:var(--primary-color);color:var(--primary-color);}.page-link.active {background:var(--primary-color);color:white;border-color:var(--primary-color);}.auth-container {min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);padding:35px;}.auth-card {background:var(--surface);border-radius:var(--radius-lg);padding:48px;width:100%;max-width:420px;box-shadow:var(--shadow-lg);}.auth-header {text-align:center;margin-bottom:32px;}.auth-header h1 {font-size:32px;font-weight:700;color:var(--primary-color);margin-bottom:8px;}.auth-header p {color:var(--text-secondary);font-size:16px;}.auth-form {display:flex;flex-direction:column;gap:20px;}.form-group {display:flex;flex-direction:column;gap:8px;}.form-group label {font-weight:600;font-size:14px;color:var(--text-primary);}.form-group input,.form-group textarea {padding:12px 16px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:14px;transition:border-color 0.2s;font-family:inherit;}.form-group input:focus,.form-group textarea:focus {outline:none;border-color:var(--primary-color);}.auth-footer {text-align:center;margin-top:24px;color:var(--text-secondary);}.auth-footer a {color:var(--primary-color);text-decoration:none;font-weight:600;}.alert {padding:12px 16px;border-radius:var(--radius-sm);margin-bottom:20px;font-size:14px;font-weight:500;}.alert-error {background:#fee2e2;color:#dc2626;border:1px solid #fecaca;}.alert-success {background:#d1fae5;color:#059669;border:1px solid #a7f3d0;}.post-detail {background:var(--surface);border-radius:var(--radius-md);padding:32px;margin-bottom:25px;}.post-detail h1 {font-size:22px;font-weight:700;margin-bottom:20px;line-height:1.4;}.post-meta {display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--border-color);}.author-info {display:flex;align-items:center;gap:12px;}.author-avatar {width:50px;height:50px;border-radius:50%;object-fit:cover;}.author-avatar-link {display:inline-block;text-decoration:none;}.author-avatar-link:hover {opacity:0.8;}.author-name {font-weight:600;font-size:16px;text-decoration:none !important;}.author-name:hover {color:var(--primary-color);text-decoration:none !important;}.post-content {font-size:16px;line-height:1.8;color:var(--text-primary);margin-bottom:24px;word-wrap:break-word;overflow-wrap:break-word;}.post-images-grid {display:grid;gap:4px;margin-bottom:24px;border-radius:var(--radius-sm);overflow:hidden;}.post-images-grid-1 {grid-template-columns:1fr;max-width:600px;margin:0 auto 24px auto;}.post-images-grid-1 img {width:100%;height:auto;max-height:600px;object-fit:contain;}.post-images-grid-2 {grid-template-columns:repeat(2, 1fr);max-width:800px;margin:0 auto 24px auto;}.post-images-grid-2 img {width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;}.post-images-grid-3 {grid-template-columns:repeat(3, 1fr);}.post-images-grid-3 img {width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;}.post-images-grid img {cursor:pointer;transition:all 0.3s;}.post-images-grid img:hover {opacity:0.9;}.image-modal {display:none;position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.9);justify-content:center;align-items:center;}.image-modal.active {display:flex;}.image-modal-content {max-width:90%;max-height:90%;object-fit:contain;}.image-modal-close {position:absolute;top:20px;right:30px;color:#fff;font-size:40px;font-weight:bold;cursor:pointer;z-index:10000;}.image-modal-close:hover {color:#ccc;}.author-bio {background:var(--background);padding:16px;border-radius:var(--radius-sm);font-size:14px;color:var(--text-secondary);}.replies-section {padding:30px; background:var(--surface);}.replies-section h3 {font-size:18px;font-weight:700;margin-bottom:20px;}.reply-form {margin-bottom:32px;}.reply-form-inner {display:flex;flex-direction:column;gap:16px;}.reply-form-inner textarea {width:100%;min-height:100px;resize:vertical;padding:16px;border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:14px;font-family:inherit;}.reply-form-inner textarea:focus {outline:none;border-color:var(--primary-color);}.login-prompt {text-align:center;padding:40px;background:var(--background);border-radius:var(--radius-sm);color:var(--text-secondary);}.login-prompt a {color:var(--primary-color);text-decoration:none;font-weight:600;}.replies-list {display:flex;flex-direction:column;gap:16px;}.reply-item {padding:20px;border-bottom: 1px solid var(--border-color);transition: background-color 0.2s ease;}.reply-item:last-child {border-bottom: none;}.reply-item:hover .reply-content {font-weight:700;}.reply-header {display:flex;align-items:center;gap:12px;margin-bottom:12px;}.reply-avatar {width:40px;height:40px;border-radius:50%;object-fit:cover;}.reply-meta {flex:1;}.reply-author {font-weight:600;font-size:14px;color:var(--text-primary);text-decoration:none !important;}.reply-time {font-size:14px;color:var(--text-secondary);}.reply-content {font-size:15px;line-height:1.7;color:var(--text-primary);}.delete-reply-btn {background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:4px 12px;border-radius:6px;font-size:12px;transition:all 0.2s;margin-left:auto;}.delete-reply-btn:hover {background:#fee2e2;color:#dc2626;}.reply-actions {display:flex;justify-content:flex-end;margin-top:12px;}.reply-to-reply-btn {background:none;border:none;color:var(--primary-color);cursor:pointer;padding:4px 12px;border-radius:6px;font-size:12px;transition:all 0.2s;}.reply-to-reply-btn:hover {background:var(--background);}.reply-form-wrapper {margin-top:16px;padding:16px;background:var(--background);border-radius:var(--radius-sm);}.reply-form-inner textarea {width:100%;min-height:80px;margin-bottom:12px;}.reply-form-buttons {display:flex;gap:8px;justify-content:flex-end;}.reply-form-buttons .btn {padding:8px 20px;font-size:14px;}.create-post-card {background:var(--surface);border-radius:var(--radius-md);padding:32px;box-shadow:var(--shadow-sm);}.container.create-page .create-post-card {box-shadow:var(--shadow-md);}.container.profile-page .profile-header,.container.profile-page .profile-edit-section {box-shadow:var(--shadow-md);}.container.post-page .post-detail,.container.post-page .replies-section {border-radius:var(--radius-md);}.container.post-page .post-detail:hover,.container.post-page .replies-section:hover {box-shadow:var(--shadow-lg);}.create-post-card h2 {font-size:24px;font-weight:700;margin-bottom:24px;}.post-form {display:flex;flex-direction:column;gap:20px;}.tags-selector {display:flex;flex-wrap:wrap;gap:12px;}.tag-radio {cursor:pointer;position:relative;}.tag-radio input {display:none;}.tag-radio .tag-badge {display:inline-block;padding:8px 16px;border-radius:20px;color:white;font-size:13px;font-weight:500;transition:all 0.2s;opacity:0.7;}.tag-radio input:checked + .tag-badge {opacity:1;box-shadow:0 0 0 3px rgba(99, 102, 241, 0.3);}.image-upload-area {border:2px dashed var(--border-color);border-radius:var(--radius-md);padding:32px;text-align:center;cursor:pointer;transition:all 0.3s;}.image-upload-area:hover {border-color:var(--primary-color);background:var(--background);}.upload-placeholder {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--text-secondary);}.upload-icon {font-size:48px;color:var(--primary-color);font-weight:300;}.upload-placeholder.dragover {border-color:var(--primary-color);background:rgba(99, 102, 241, 0.05);}.image-preview-list {display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));gap:12px;margin-top:16px;}.image-preview-item {position:relative;border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:1/1;}.image-preview-item img {width:100%;height:100%;object-fit:cover;border-radius:var(--radius-sm);}.delete-image-btn {position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:rgba(0, 0, 0, 0.7);border:none;color:white;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s;}.delete-image-btn:hover {background:rgba(220, 38, 38, 0.9);}.footer {background:var(--surface);border-top:1px solid var(--border-color);padding:8px 0;margin-top:60px;position:fixed;bottom:0;left:0;right:0;z-index:1000;}.footer-content {max-width:1200px;margin:0 auto;padding:0 20px;text-align:center;color:var(--text-secondary);font-size:14px;}@media (max-width:768px) {.header-content {flex-direction:row;justify-content:space-between;padding:0 18px 0 15px;gap:12px;}.user-dropdown {padding:4px 8px;}.user-name {font-size:14px;}.dropdown-menu {right:-8px;min-width:120px;display:none;}.search-form input {width:100%;}.content-header {flex-direction:column;align-items:flex-start;}.search-form {width:100%;}.post-card {padding:20px;}.post-card-images-2 {grid-template-columns:repeat(2, 1fr);gap:2px;}.post-card-images-3 {grid-template-columns:repeat(3, 1fr);gap:2px;}.post-card-images-2 .post-card-image-wrapper,.post-card-images-3 .post-card-image-wrapper {padding-bottom:80%;}.post-detail, .replies-section, .create-post-card {padding:0px;}.post-detail {background:none;border-radius:none;padding:0px;margin-bottom:15px;}.comment-item {padding:15px;gap:12px;}.reply-item {background:none;padding:0px;}.icon-eye {font-size:15px;}.icon-comment {font-size:12px;}.header-content .btn {padding:6px 20px;}.author-avatar {width:40px;height:40px;}.author-name {font-size:14px;}.container.post-page .post-detail,.container.post-page .replies-section {box-shadow:none;border-radius:none;background:none}.reply-content, .login-prompt, .replies-section h3 {margin-bottom:15px;}.post-time, .reply-time, .stat-item {font-size:12px;}}