:root { font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #242220; background: #faf9f8; }
* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.shell { display: grid; grid-template-columns: 224px minmax(0, 1fr); min-height: 100vh; }
.sidebar { background: #fff; border-right: 1px solid #e8e4e1; padding: 24px 15px; }
.wordmark { padding: 0 10px 28px; font-size: 19px; font-weight: 750; letter-spacing: -.035em; }
.wordmark small { display: block; color: #8b8581; margin-top: 5px; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.project { padding: 11px 12px; border: 1px solid #e5e0dd; border-radius: 10px; font-size: 12px; color: #89837f; }
.project strong { display: block; color: #252320; font-size: 14px; margin-top: 2px; }
.project select { width: 100%; margin-top: 7px; font-size: 13px; font-weight: 700; }
.project-create { margin-top: 11px; color: #5f5a55; }
.project-create summary { cursor: pointer; }
.project-create p { margin: 9px 0 0; color: #77716d; font-size: 11px; line-height: 1.5; }
.project-create form { display: grid; gap: 8px; margin-top: 10px; }
.project-create button { width: 100%; }
.logout-button { margin: 7px 10px; border: 0; background: transparent; color: #77716d; padding: 7px 0; }
nav { display: grid; gap: 5px; margin-top: 20px; }
nav a, nav span { padding: 11px 12px; border-radius: 9px; font-size: 13px; color: #85807b; text-decoration: none; }
nav a.active { color: #1b1918; background: #f1efed; font-weight: 700; }
.sidebar-note { color: #8d8782; line-height: 1.6; font-size: 12px; padding: 15px 11px; }
main { min-width: 0; padding: 35px min(4vw, 60px) 55px; max-width: 1700px; }
h1, h2, p { margin-top: 0; }
h1 { font-size: 29px; line-height: 1.25; margin-bottom: 8px; letter-spacing: -.045em; }
h2 { font-size: 15px; margin-bottom: 7px; }
p { line-height: 1.55; }
.eyebrow { display: inline-block; color: #526fdb; font-size: 11px; letter-spacing: .11em; font-weight: 750; margin-bottom: 8px; }
.page-head { display: flex; justify-content: space-between; align-items: start; gap: 20px; }
.page-head p, .control-block p { color: #77716d; font-size: 13px; }
.page-head .project-mode { color: #526fdb; font-size: 12px; margin-bottom: 0; }
.state { color: #716c68; font-size: 12px; border-radius: 999px; background: #f0edeb; padding: 7px 11px; white-space: nowrap; }
.state.ready { color: #246645; background: #eaf6ef; }
.controls { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 24px; }
.control-block, .run-panel, .list-panel, .detail-panel, .stats>div { background: #fff; border: 1px solid #e7e3e0; border-radius: 13px; }
.control-block { padding: 18px 19px; }
.control-block p { min-height: 42px; margin-bottom: 12px; }
.form-row { display: flex; gap: 9px; align-items: end; }
label { display: grid; gap: 6px; color: #77716d; font-size: 11px; font-weight: 650; }
label.grow { flex: 1; }
input, select, textarea { border: 1px solid #ded9d5; border-radius: 8px; background: #fff; color: #282522; padding: 9px 10px; min-width: 0; }
input { width: 100%; }
textarea { width: 100%; resize: vertical; min-height: 41px; }
button { border: 1px solid #ded9d5; border-radius: 8px; background: #fff; color: #292623; padding: 9px 13px; font-size: 12px; font-weight: 700; white-space: nowrap; }
button.primary { background: #282421; border-color: #282421; color: #fff; }
button:disabled { opacity: .48; cursor: not-allowed; }
.control-block small { display: block; color: #8c8682; margin-top: 9px; line-height: 1.4; }
.notice { margin-top: 17px; padding: 12px 14px; background: #fff7e8; border: 1px solid #edddbc; border-radius: 10px; color: #805614; font-size: 13px; }
.notice.error { background: #fff0ee; border-color: #efcbc5; color: #a33a32; }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin: 20px 0 18px; }
.stats>div { padding: 17px 19px; }
.stats span { display: block; color: #8b8580; font-size: 12px; }
.stats strong { display: block; margin-top: 6px; font-size: 25px; }
.run-panel { padding: 16px 19px; margin-bottom: 16px; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.section-head h2 { margin-bottom: 0; }
.link-button { border: 0; color: #4868db; background: transparent; padding: 3px 0; }
.runs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.run { background: #f7f6f5; border-radius: 8px; padding: 7px 10px; font-size: 12px; color: #625d59; }
.run.failed { color: #a33a32; background: #fff0ee; }
.run.running { color: #3857bf; background: #eef2ff; }
.work-grid { display: grid; grid-template-columns: minmax(290px, 38%) minmax(0, 1fr); gap: 16px; align-items: start; }
.list-panel, .detail-panel { min-height: 420px; overflow: hidden; }
.list-panel .section-head { padding: 16px 19px; border-bottom: 1px solid #eeebe9; }
.list-panel select { padding: 6px 9px; font-size: 12px; }
.leads { max-height: 760px; overflow: auto; }
.lead { width: 100%; text-align: left; border: 0; border-bottom: 1px solid #f0eeec; border-radius: 0; background: #fff; padding: 16px 19px; white-space: normal; }
.lead:hover, .lead.selected { background: #f6f7ff; }
.lead.selected { box-shadow: inset 3px 0 #5873e3; }
.lead-head { display: flex; justify-content: space-between; align-items: start; gap: 8px; }
.lead strong { font-size: 14px; overflow-wrap: anywhere; }
.lead small { display: block; margin-top: 5px; color: #8a8580; font-size: 11px; font-weight: 400; }
.badge { display: inline-block; padding: 4px 7px; border-radius: 999px; font-size: 10px; font-weight: 700; white-space: nowrap; color: #82623a; background: #fff3e2; }
.badge.priority { color: #216343; background: #e8f5ee; }
.badge.not_fit { color: #8a5754; background: #f8eeee; }
.detail-panel { padding: 20px 22px; }
.detail-head { display: flex; justify-content: space-between; gap: 10px; align-items: start; }
.detail-head h2 { font-size: 18px; overflow-wrap: anywhere; }
.detail-head a, .finding a { color: #4c68d6; overflow-wrap: anywhere; text-decoration: none; }
.muted, .detail-head p { color: #88817c; font-size: 12px; }
.detail-section { border-top: 1px solid #ece9e6; padding: 17px 0 4px; margin-top: 16px; }
.detail-section h3 { font-size: 13px; margin: 0 0 10px; }
.reason { display: flex; gap: 9px; font-size: 12px; line-height: 1.45; margin: 7px 0; color: #57534f; }
.reason::before { content: "•"; color: #5873e3; }
.finding { padding: 11px 13px; background: #f8f7f5; border-radius: 8px; margin: 7px 0; font-size: 12px; }
.finding strong, .finding span { display: block; margin-bottom: 5px; }
.finding span { color: #6f6965; }
.detail-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 13px; }
.empty { color: #98918c; font-size: 12px; margin: 0; }
.detail-empty { padding-top: 120px; text-align: center; }
footer { color: #96908b; font-size: 11px; margin-top: 26px; }
.login-page { min-height: 100vh; display: grid; place-items: center; padding: 18px; }
.login-card { width: min(420px, 100%); background: #fff; border: 1px solid #e7e3e0; border-radius: 16px; padding: 32px; }
.login-card .wordmark { padding: 0 0 25px; }
.login-card p { color: #77716d; font-size: 13px; }
.login-card form { display: grid; gap: 15px; margin-top: 22px; }
.login-card form button { width: 100%; }
@media(max-width: 1100px) { .controls, .work-grid { grid-template-columns: 1fr; } .control-block p { min-height: 0; } }
@media(max-width: 760px) { .shell { display: block; } .sidebar { padding: 15px; border-right: 0; border-bottom: 1px solid #e8e4e1; } .wordmark { padding: 0; } .project { margin-top: 13px; } nav, .sidebar-note { display: none; } main { padding: 21px 14px; } .page-head { display: block; } .state { display: inline-block; margin-top: 10px; } .stats { grid-template-columns: repeat(2, 1fr); } .form-row { flex-wrap: wrap; } .form-row label, .form-row button { width: 100%; } }
