* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, 'Segoe UI', system-ui, sans-serif; background: #0f1117; color: #e0e0e0; }
a { color: #6ea8fe; text-decoration: none; }
a:hover { text-decoration: underline; }

nav { display: flex; justify-content: space-between; align-items: center; padding: 12px 24px; background: #161822; border-bottom: 1px solid #2a2d3a; }
.logo { font-weight: 700; font-size: 18px; color: #6ea8fe; }
.nav-links a { margin-left: 20px; color: #999; font-size: 14px; }
.nav-links a:hover { color: #e0e0e0; }

main { max-width: 1200px; margin: 0 auto; padding: 24px; }

.flash { padding: 10px 16px; border-radius: 6px; margin-bottom: 16px; font-size: 14px; }
.flash.success { background: #1a2e1a; color: #7ec87e; border: 1px solid #2a4a2a; }
.flash.error { background: #2e1a1a; color: #e87e7e; border: 1px solid #4a2a2a; }

/* Pipeline bar */
.pipeline-bar { display: flex; gap: 4px; margin-bottom: 20px; flex-wrap: wrap; }
.pipeline-stage { display: flex; flex-direction: column; align-items: center; padding: 8px 12px; border-radius: 6px; background: #1a1c28; border: 1px solid #2a2d3a; min-width: 80px; font-size: 12px; color: #999; }
.pipeline-stage:hover { border-color: #6ea8fe; text-decoration: none; }
.pipeline-stage.active { border-color: #6ea8fe; background: #1a2040; }
.pipeline-stage .count { font-size: 20px; font-weight: 700; color: #e0e0e0; }
.pipeline-stage .label { text-transform: capitalize; }

/* Status badges */
.status-badge { padding: 3px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; text-transform: capitalize; }
.stage-researched { background: #1a2040; color: #6ea8fe; }
.stage-qualified { background: #1a3040; color: #6ec8fe; }
.stage-outreach_drafted { background: #2a2a1a; color: #e8c87e; }
.stage-contacted { background: #2a1a2a; color: #c87ee8; }
.stage-responded { background: #1a2a2a; color: #7ec8c8; }
.stage-meeting { background: #1a2e1a; color: #7ec87e; }
.stage-proposal { background: #2e2a1a; color: #e8b87e; }
.stage-signed { background: #1a3a1a; color: #4ae84a; }
.stage-lost { background: #2e1a1a; color: #e87e7e; }

/* Search */
.search-bar { margin-bottom: 16px; }
.search-bar form { display: flex; gap: 8px; }
.search-bar input { flex: 1; padding: 8px 12px; background: #1a1c28; border: 1px solid #2a2d3a; border-radius: 6px; color: #e0e0e0; font-size: 14px; }
.search-bar button, .btn { padding: 8px 16px; background: #1a2040; border: 1px solid #2a2d3a; border-radius: 6px; color: #6ea8fe; cursor: pointer; font-size: 14px; }
.btn:hover { background: #2a3050; }
.btn-primary { background: #2a4080; color: #fff; }
.btn-danger { background: #401a1a; color: #e87e7e; border-color: #4a2a2a; }

/* Table */
table { width: 100%; border-collapse: collapse; background: #161822; border-radius: 8px; overflow: hidden; }
thead th { text-align: left; padding: 10px 12px; background: #1a1c28; color: #999; font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; border-bottom: 1px solid #2a2d3a; }
tbody tr { cursor: pointer; border-bottom: 1px solid #1a1c28; }
tbody tr:hover { background: #1a1c28; }
td { padding: 10px 12px; font-size: 14px; }
td small { color: #666; }
.empty { text-align: center; padding: 40px; color: #666; }
table.compact td { padding: 6px 10px; font-size: 13px; }

/* Detail */
.detail-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 24px; }
.detail-header h1 { font-size: 24px; }
.detail-header p { color: #999; }
.actions { display: flex; gap: 8px; align-items: center; }
.detail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin-bottom: 16px; }
.detail-card { background: #161822; border: 1px solid #2a2d3a; border-radius: 8px; padding: 16px; margin-bottom: 16px; }
.detail-card h2 { font-size: 14px; color: #999; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid #2a2d3a; }
dl { display: grid; grid-template-columns: 120px 1fr; gap: 6px 12px; }
dt { color: #666; font-size: 13px; }
dd { font-size: 14px; }

/* Outreach */
.outreach-item { padding: 12px 0; border-bottom: 1px solid #1a1c28; }
.outreach-header { display: flex; justify-content: space-between; margin-bottom: 4px; }
.outreach-type { font-size: 11px; padding: 2px 6px; background: #1a2040; border-radius: 3px; color: #6ea8fe; }
.outreach-body { white-space: pre-wrap; font-size: 13px; color: #ccc; margin-top: 8px; font-family: inherit; background: #1a1c28; padding: 12px; border-radius: 4px; }

/* Activity */
.activity-item { padding: 6px 0; font-size: 13px; border-bottom: 1px solid #0f1117; }
.activity-item small { color: #666; margin-right: 8px; }
.activity-actor { font-size: 11px; padding: 1px 4px; background: #2a2d3a; border-radius: 3px; margin-right: 4px; }

/* Form */
.prospect-form fieldset { background: #161822; border: 1px solid #2a2d3a; border-radius: 8px; padding: 16px; margin-bottom: 16px; }
.prospect-form legend { color: #6ea8fe; font-weight: 600; padding: 0 8px; }
.prospect-form label { display: block; margin-bottom: 8px; font-size: 13px; color: #999; }
.prospect-form input, .prospect-form select, .prospect-form textarea { width: 100%; padding: 8px 10px; background: #0f1117; border: 1px solid #2a2d3a; border-radius: 4px; color: #e0e0e0; font-size: 14px; margin-top: 4px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.form-actions { display: flex; gap: 8px; }

/* Login */
.login-page { display: flex; justify-content: center; align-items: center; min-height: 100vh; }
.login-box { background: #161822; border: 1px solid #2a2d3a; border-radius: 12px; padding: 40px; width: 360px; text-align: center; }
.login-box h1 { font-size: 28px; color: #6ea8fe; margin-bottom: 4px; }
.login-box .subtitle { color: #666; margin-bottom: 24px; }
.login-box input { display: block; width: 100%; padding: 10px 12px; margin-bottom: 12px; background: #0f1117; border: 1px solid #2a2d3a; border-radius: 6px; color: #e0e0e0; font-size: 14px; }
.login-box button { width: 100%; padding: 10px; background: #2a4080; border: none; border-radius: 6px; color: #fff; font-size: 14px; cursor: pointer; }