* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #f5f5f5; color: #1a1a1a; font-size: 14px; }

nav { background: #1a1a1a; padding: 0 2rem; display: flex; align-items: center; justify-content: space-between; height: 52px; }
.nav-logo { color: #fff; font-size: 16px; font-weight: 600; letter-spacing: -0.3px; }
.nav-links a { color: #999; text-decoration: none; margin-left: 1.5rem; font-size: 13px; transition: color 0.15s; }
.nav-links a:hover, .nav-links a.active { color: #fff; }

main { max-width: 1400px; margin: 0 auto; padding: 2rem; }

.metrics-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 2rem; }
.metric-card { background: #fff; border-radius: 8px; padding: 1rem 1.25rem; border: 1px solid #e8e8e8; }
.metric-label { font-size: 11px; color: #999; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 6px; }
.metric-value { font-size: 28px; font-weight: 600; color: #1a1a1a; }
.metric-value.green { color: #1D9E75; }
.metric-value.blue { color: #185FA5; }

.section { background: #fff; border-radius: 8px; border: 1px solid #e8e8e8; padding: 1.5rem; margin-bottom: 1.5rem; }
.section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.section h2 { font-size: 15px; font-weight: 600; margin-bottom: 1rem; }

table { width: 100%; border-collapse: collapse; }
th { text-align: left; padding: 8px 12px; font-size: 11px; color: #999; text-transform: uppercase; letter-spacing: 0.4px; border-bottom: 1px solid #e8e8e8; }
td { padding: 10px 12px; border-bottom: 1px solid #f0f0f0; vertical-align: middle; }
tr:last-child td { border-bottom: none; }
tr:hover td { background: #fafafa; }

.score { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 12px; font-weight: 600; }
.score.hot { background: #E1F5EE; color: #0F6E56; }
.score.warm { background: #FAEEDA; color: #854F0B; }
.score.cold { background: #f0f0f0; color: #666; }

.status { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 11px; font-weight: 500; }
.status-new { background: #f0f0f0; color: #666; }
.status-called { background: #E6F1FB; color: #185FA5; }
.status-interested { background: #FAEEDA; color: #854F0B; }
.status-closed { background: #E1F5EE; color: #0F6E56; }
.status-skip { background: #FCEBEB; color: #A32D2D; }

.btn { display: inline-flex; align-items: center; padding: 6px 12px; border-radius: 6px; font-size: 12px; font-weight: 500; cursor: pointer; border: 1px solid #e8e8e8; background: #fff; color: #1a1a1a; text-decoration: none; transition: all 0.15s; }
.btn:hover { background: #f5f5f5; }
.btn-sm { padding: 4px 8px; font-size: 11px; }
.btn-green { background: #1D9E75; color: #fff; border-color: #1D9E75; }
.btn-green:hover { background: #0F6E56; }
.btn-blue { background: #185FA5; color: #fff; border-color: #185FA5; }
.btn-blue:hover { background: #0C447C; }
.btn-gray { background: #f0f0f0; color: #666; border-color: #e8e8e8; }
.btn-gray:hover { background: #e8e8e8; }

.action-buttons { display: flex; gap: 4px; flex-wrap: wrap; }

.filters form { display: flex; gap: 8px; flex-wrap: wrap; }
.filters select { padding: 6px 10px; border-radius: 6px; border: 1px solid #e8e8e8; font-size: 13px; background: #fff; }

.pagination { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-top: 1.5rem; }

.pipeline-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.pipeline-column { background: #f5f5f5; border-radius: 8px; padding: 1rem; }
.pipeline-header { font-size: 13px; font-weight: 600; margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; }
.pipeline-count { background: #e8e8e8; border-radius: 20px; padding: 2px 8px; font-size: 11px; }
.pipeline-card { background: #fff; border-radius: 6px; padding: 12px; margin-bottom: 8px; border: 1px solid #e8e8e8; }
.pipeline-card-name { font-weight: 600; font-size: 13px; margin-bottom: 4px; }
.pipeline-card-meta { font-size: 11px; color: #999; margin-bottom: 4px; }
.pipeline-card-score { font-size: 11px; color: #1D9E75; font-weight: 500; }
.pipeline-card-phone { font-size: 12px; color: #666; margin-top: 4px; }

.revenue-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.revenue-form select, .revenue-form input { padding: 8px 10px; border-radius: 6px; border: 1px solid #e8e8e8; font-size: 13px; }

.flash { padding: 10px 16px; border-radius: 6px; margin-bottom: 1rem; font-size: 13px; }
.flash.success { background: #E1F5EE; color: #0F6E56; }
.flash.error { background: #FCEBEB; color: #A32D2D; }