* { margin:0; padding:0; box-sizing:border-box; }
:root { --bg:#fff; --bg-alt:#f7f8fa; --primary:#2563eb; --primary-dark:#1d4ed8; --primary-light:#eff6ff; --text:#111827; --text-2:#6b7280; --text-3:#9ca3af; --border:#e5e7eb; --accent:#dc2626; --green:#059669; --radius:8px; --shadow:0 1px 3px rgba(0,0,0,.08); --shadow-md:0 4px 12px rgba(0,0,0,.1); }

body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif; background:var(--bg); color:var(--text); font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:var(--primary); text-decoration:none; }
a:hover { text-decoration:underline; }
img { max-width:100%; display:block; }
button { cursor:pointer; border:none; background:none; font:inherit; color:inherit; }
input,textarea,select { font:inherit; }

/* === HEADER (как на главной) === */
.topbar { background:var(--bg-alt); border-bottom:1px solid var(--border); font-size:13px; color:var(--text-2); }
.topbar-inner { display:flex; justify-content:space-between; align-items:center; height:36px; max-width:1200px; margin:0 auto; padding:0 16px; }
.topbar a { color:var(--text-2); }
.topbar a:hover { color:var(--primary); }
.topbar-left,.topbar-right { display:flex; gap:16px; align-items:center; }

.site-header { background:#fff; border-bottom:2px solid var(--primary); position:sticky; top:0; z-index:100; }
.header-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; padding:0 16px; height:60px; gap:16px; }
.logo { font-size:22px; font-weight:800; color:var(--primary); letter-spacing:.5px; text-decoration:none; flex-shrink:0; }
.logo:hover { text-decoration:none; }
.logo span { color:var(--accent); }
.main-nav { display:flex; gap:20px; }
.main-nav a { color:var(--text-2); font-size:14px; font-weight:500; text-decoration:none; transition:color .2s; }
.main-nav a:hover { color:var(--primary); text-decoration:none; }
.user-area { margin-left:auto; display:flex; align-items:center; gap:8px; }
.user-name { color:var(--primary); font-size:14px; font-weight:600; }
.burger { display:none; padding:8px; background:none; border:none; }
.burger span { display:block; width:22px; height:2px; background:var(--text); margin:4px 0; transition:.3s; }

/* Buttons */
.btn-sm { display:inline-flex; align-items:center; padding:8px 16px; border-radius:var(--radius); font-size:13px; font-weight:600; cursor:pointer; border:1px solid transparent; text-decoration:none; transition:all .2s; background:var(--primary); color:#fff; }
.btn-sm:hover { background:var(--primary-dark); text-decoration:none; }
.btn-accent { background:var(--primary); color:#fff; }
.btn-accent:hover { background:var(--primary-dark); }
.btn-outline { background:#fff; color:var(--text); border:1px solid var(--border); }
.btn-outline:hover { background:var(--bg-alt); border-color:var(--text-3); text-decoration:none; }
.btn-admin { background:#dc2626; color:#fff; }
.btn-admin:hover { background:#b91c1c; }

.btn { display:inline-flex; align-items:center; justify-content:center; background:var(--primary); color:#fff; font-weight:600; padding:10px 24px; border-radius:var(--radius); font-size:14px; transition:.2s; border:none; cursor:pointer; text-decoration:none; }
.btn:hover { background:var(--primary-dark); color:#fff; text-decoration:none; }
.btn-full { width:100%; }
.btn-primary { background:var(--primary); }

/* Container */
.container { max-width:1200px; margin:0 auto; padding:20px 16px; }

/* Breadcrumbs */
.breadcrumbs { padding:12px 0; font-size:13px; color:var(--text-3); }
.breadcrumbs a { color:var(--text-2); }
.breadcrumbs a:hover { color:var(--primary); }

/* Cards */
.card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); margin-bottom:16px; overflow:hidden; box-shadow:var(--shadow); }
.card-header { padding:16px 20px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
.card-header h2 { font-size:18px; font-weight:700; color:var(--text); }
.card-body { padding:20px; }

/* Category list */
.cat-item { display:flex; align-items:center; padding:16px 20px; border-bottom:1px solid var(--border); transition:background .15s; }
.cat-item:last-child { border-bottom:none; }
.cat-item:hover { background:var(--bg-alt); }
.cat-icon { font-size:28px; margin-right:16px; flex-shrink:0; }
.cat-info { flex:1; }
.cat-info h3 { font-size:16px; margin-bottom:2px; font-weight:600; }
.cat-info h3 a { color:var(--text); }
.cat-info h3 a:hover { color:var(--primary); text-decoration:none; }
.cat-info p { font-size:13px; color:var(--text-2); }
.cat-stats { text-align:right; font-size:13px; color:var(--text-3); white-space:nowrap; min-width:100px; }

/* Topic list */
.topic-item { display:flex; align-items:center; padding:14px 20px; border-bottom:1px solid var(--border); transition:.15s; }
.topic-item:last-child { border-bottom:none; }
.topic-item:hover { background:var(--bg-alt); }
.topic-avatar { width:36px; height:36px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; margin-right:14px; flex-shrink:0; }
.topic-info { flex:1; }
.topic-info h3 { font-size:15px; font-weight:500; }
.topic-info h3 a { color:var(--text); }
.topic-info h3 a:hover { color:var(--primary); text-decoration:none; }
.topic-meta { font-size:12px; color:var(--text-3); margin-top:2px; }
.topic-stats { text-align:right; font-size:13px; color:var(--text-2); white-space:nowrap; min-width:80px; }

/* Sticky topic */
.topic-item.sticky { background:#fefbf3; }

/* Pagination */
.pagination { display:flex; gap:6px; margin:20px 0; justify-content:center; flex-wrap:wrap; }
.pagination a, .pagination span { display:inline-block; padding:6px 12px; border:1px solid var(--border); border-radius:var(--radius); font-size:13px; color:var(--text-2); text-decoration:none; }
.pagination a:hover { background:var(--bg-alt); text-decoration:none; }
.pagination .active { background:var(--primary); color:#fff; border-color:var(--primary); font-weight:600; }

/* Forms */
.form-group { margin-bottom:16px; }
.form-group label { display:block; font-size:14px; font-weight:500; margin-bottom:6px; color:var(--text); }
.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="password"],
.form-group input[type="number"],
.form-group textarea,
.form-group select {
  width:100%; padding:10px 14px; font-size:14px; border:1px solid var(--border); border-radius:var(--radius); outline:none; transition:border-color .2s; background:#fff; color:var(--text);
}
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus { border-color:var(--primary); }
.form-group textarea { min-height:120px; resize:vertical; }
.form-actions { display:flex; gap:8px; align-items:center; }

/* Posts */
.post { padding:20px; border-bottom:1px solid var(--border); }
.post:last-child { border-bottom:none; }
.post-header { display:flex; align-items:center; margin-bottom:12px; }
.topic-avatar { width:40px; height:40px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:16px; margin-right:12px; flex-shrink:0; }
.post-author { font-weight:600; color:var(--text); }
.post-author a { color:var(--primary); }
.post-date { font-size:12px; color:var(--text-3); }
.post-body { font-size:14px; color:var(--text); line-height:1.7; }
.post-body img { max-width:100%; border-radius:var(--radius); margin:8px 0; }
.post-actions { margin-top:12px; padding-top:8px; border-top:1px solid var(--border); font-size:13px; }
.post-actions a { color:var(--text-2); margin-right:16px; text-decoration:none; }
.post-actions a:hover { color:var(--primary); }
.post-like { display:inline-flex; align-items:center; gap:4px; }
.post-like.liked { color:var(--accent); }

/* Reply form */
.reply-form textarea { width:100%; min-height:100px; padding:10px 14px; border:1px solid var(--border); border-radius:var(--radius); resize:vertical; font:inherit; }
.reply-form textarea:focus { border-color:var(--primary); outline:none; }

/* Alerts */
.alert { padding:12px 16px; border-radius:var(--radius); margin-bottom:16px; font-size:14px; }
.alert-info { background:var(--primary-light); color:var(--primary-dark); border:1px solid #bfdbfe; }
.alert-success { background:#ecfdf5; color:var(--green); border:1px solid #a7f3d0; }
.alert-danger { background:#fef2f2; color:var(--accent); border:1px solid #fecaca; }
.alert-warning { background:#fffbeb; color:#92400e; border:1px solid #fde68a; }

/* Profile */
.profile-header { display:flex; align-items:center; gap:16px; margin-bottom:24px; }
.profile-avatar { width:80px; height:80px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-size:32px; font-weight:700; }
.profile-info h2 { font-size:22px; font-weight:700; }
.profile-info p { color:var(--text-2); font-size:14px; }
.profile-role { display:inline-block; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:600; text-transform:uppercase; }
.profile-role.admin { background:#fee2e2; color:var(--accent); }
.profile-role.mod { background:#fef3c7; color:#92400e; }

/* Stats */
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:24px; }
.stat-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:16px; text-align:center; }
.stat-value { font-size:24px; font-weight:700; color:var(--primary); }
.stat-label { font-size:12px; color:var(--text-3); margin-top:4px; text-transform:uppercase; letter-spacing:.5px; }

/* Tables */
.table { width:100%; border-collapse:collapse; font-size:14px; }
.table th { text-align:left; padding:10px 12px; border-bottom:2px solid var(--border); font-weight:600; color:var(--text-3); font-size:11px; text-transform:uppercase; letter-spacing:.5px; }
.table td { padding:10px 12px; border-bottom:1px solid var(--border); }
.table tr:hover { background:var(--bg-alt); }

/* Login/Register */
.auth-card { max-width:420px; margin:40px auto; background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:32px; box-shadow:var(--shadow-md); }
.auth-card h1 { font-size:22px; margin-bottom:8px; text-align:center; }
.auth-card .subtitle { text-align:center; color:var(--text-2); margin-bottom:24px; font-size:14px; }
.auth-card .form-control { width:100%; padding:10px 14px; border:1px solid var(--border); border-radius:var(--radius); margin-bottom:12px; font-size:14px; }
.auth-card .form-control:focus { border-color:var(--primary); outline:none; }
.auth-card .btn { width:100%; }
.auth-error { background:#fef2f2; color:var(--accent); padding:10px 14px; border-radius:var(--radius); font-size:13px; margin-bottom:16px; }
.auth-alt { text-align:center; margin-top:16px; font-size:13px; color:var(--text-2); }

/* Garage */
.garage-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:16px; display:flex; gap:16px; align-items:center; margin-bottom:12px; }
.garage-img { width:80px; height:60px; background:var(--bg-alt); border-radius:var(--radius); display:flex; align-items:center; justify-content:center; font-size:32px; }
.garage-info { flex:1; }
.garage-info h3 { font-size:16px; font-weight:600; }
.garage-info p { font-size:13px; color:var(--text-2); }

/* Notifications badge */
.notif-badge { background:var(--accent); color:#fff; font-size:10px; font-weight:700; padding:1px 6px; border-radius:10px; min-width:18px; text-align:center; display:inline-block; }

/* Empty state */
.empty { padding:48px; text-align:center; color:var(--text-3); font-size:15px; }

/* Footer */
.footer { background:#0d1b2a; color:rgba(255,255,255,0.65); padding:40px 0 20px; margin-top:40px; }
.footer-grid { max-width:1200px; margin:0 auto; padding:0 16px; display:grid; grid-template-columns:repeat(4,1fr); gap:32px; margin-bottom:24px; }
.footer-col h4 { font-size:12px; text-transform:uppercase; letter-spacing:1px; color:rgba(255,255,255,0.4); margin-bottom:14px; font-weight:700; }
.footer-col p, .footer-col a { color:rgba(255,255,255,0.65); font-size:13px; display:block; padding:3px 0; text-decoration:none; }
.footer-col a:hover { color:#fff; }
.footer-col .brand { font-size:22px; font-weight:800; color:#fff; letter-spacing:0.5px; margin-bottom:8px; }
.footer-col .brand span { color:#dc2626; }
.footer-col .addr { color:rgba(255,255,255,0.5); line-height:1.6; }
.footer-bottom { max-width:1200px; margin:0 auto; padding:16px; border-top:1px solid rgba(255,255,255,0.1); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:12px; color:rgba(255,255,255,0.35); }
.footer-pay { display:flex; gap:8px; align-items:center; }
.footer-pay span { background:rgba(255,255,255,0.08); padding:4px 10px; border-radius:4px; font-size:11px; font-weight:600; }
@media (max-width:768px) { .footer-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px) { .footer-grid { grid-template-columns:1fr; } }

/* Mobile */
@media (max-width:768px) {
  .topbar-right { display:none; }
  .main-nav { display:none; }
  .main-nav.open { display:flex; flex-direction:column; position:absolute; top:60px; left:0; right:0; background:#fff; border-bottom:1px solid var(--border); padding:16px; gap:12px; }
  .burger { display:block; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .cat-stats,.topic-stats { display:none; }
  .post-body { font-size:13px; }
  .reply-form textarea { font-size:14px; }
}