:root {
  --ink: #2E2C27;
  --ink-soft: #6B6A63;
  --ink-grey: #B4B3A8;
  --bg: #FCFCFB;
  --wash: #F9F9F7;
  --hairline: #E4E3DC;
  --clay: #C6613F;
  --clay-dark: #AE5133;
  --green: #4C7A5A;
  --green-bg: #EAF2EC;
  --red: #B4462F;
  --red-bg: #FBEEEA;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
a { color: var(--clay-dark); text-decoration: none; }
a:hover { text-decoration: underline; }

.topnav {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 24px; border-bottom: 1px solid var(--hairline); background: var(--wash);
  flex-wrap: wrap; gap: 10px;
}
.topnav .brand { font-weight: 600; }
.topnav .links a { margin-left: 16px; color: var(--ink-soft); font-size: 14px; }
.topnav .links a.active { color: var(--ink); font-weight: 600; }
.topnav .links a.logout { color: var(--red); }

.wrap { max-width: 1080px; margin: 0 auto; padding: 24px; }

.snapshot-note {
  background: var(--wash); border: 1px solid var(--hairline); border-radius: 10px;
  padding: 10px 16px; font-size: 13px; color: var(--ink-soft); margin-bottom: 20px;
}

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
@media (max-width: 720px) { .grid-2 { grid-template-columns: 1fr; } }

.card { background: var(--wash); border: 1px solid var(--hairline); border-radius: 12px; padding: 20px 22px; }
.card h2 { font-size: 15px; margin: 0 0 14px; display: flex; align-items: center; gap: 8px; justify-content: space-between; }
.card-link { font-size: 12px; font-weight: 400; }
.dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.dot.clay { background: var(--clay); }
.dot.green { background: var(--green); }
.muted { color: var(--ink-grey); font-size: 13px; }

.biz-group { margin-bottom: 14px; }
.biz-group:last-child { margin-bottom: 0; }
.biz-name { font-size: 12px; font-weight: 600; color: var(--ink-soft); margin-bottom: 6px; }

.today-list, .task-list { list-style: none; margin: 0; padding: 0; }
.today-list li, .task-list li {
  padding: 8px 0; border-bottom: 1px solid var(--hairline); font-size: 14px;
  display: flex; align-items: center; gap: 10px;
}
.today-list li:last-child, .task-list li:last-child { border-bottom: none; }

.check-btn, .delete-btn {
  border: 1px solid var(--hairline); background: var(--bg); border-radius: 6px;
  width: 26px; height: 26px; cursor: pointer; font-size: 13px; color: var(--ink-soft); flex-shrink: 0;
}
.check-btn:hover { background: var(--green-bg); color: var(--green); border-color: var(--green); }
.delete-btn:hover { background: var(--red-bg); color: var(--red); border-color: var(--red); }

.task-body { flex: 1; }
.task-title { font-weight: 500; }
.task-title.done { text-decoration: line-through; color: var(--ink-grey); }
.task-meta { font-size: 12px; color: var(--ink-soft); }
.task-notes { font-size: 12.5px; color: var(--ink-soft); margin-top: 2px; }
.done-list li { justify-content: space-between; }

.reminders { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.reminder-chip { background: var(--bg); border: 1px solid var(--hairline); border-radius: 10px; padding: 12px 14px; }
.reminder-chip .name { font-size: 13px; font-weight: 600; margin-bottom: 3px; }
.reminder-chip .freq { font-size: 12px; color: var(--ink-soft); }

.week-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
@media (max-width: 900px) { .week-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .week-grid { grid-template-columns: 1fr 1fr; } }
.day-col { background: var(--bg); border: 1px solid var(--hairline); border-radius: 10px; padding: 10px 12px; min-height: 90px; }
.day-col.today { background: #FBEFE9; border-color: #E9C4B2; }
.day-col.past { opacity: 0.5; }
.day-name { font-size: 12px; font-weight: 600; }
.day-date { font-size: 11px; color: var(--ink-soft); margin-bottom: 8px; }
.day-task { font-size: 12.5px; padding: 4px 0; border-bottom: 1px dashed var(--hairline); }
.day-task:last-child { border-bottom: none; }
.day-empty { font-size: 12px; color: var(--ink-grey); font-style: italic; }

table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
th { text-align: left; color: var(--ink-soft); font-weight: 600; font-size: 12px; padding: 8px 10px; border-bottom: 1px solid var(--hairline); }
td { padding: 10px; border-bottom: 1px solid var(--hairline); vertical-align: top; }
tr:last-child td { border-bottom: none; }

.status-pill { font-size: 11px; padding: 3px 9px; border-radius: 20px; display: inline-block; white-space: nowrap; background: var(--hairline); }
.status-pill.follow_up, .status-pill.pitched { background: #FCEFE4; color: var(--clay-dark); }
.status-pill.not_contacted { background: var(--hairline); color: var(--ink-soft); }
.status-pill.demo { background: #EAF0F7; color: #3A6591; }
.status-pill.closed { background: var(--green-bg); color: var(--green); }

.stacked-form { display: flex; flex-direction: column; gap: 10px; }
.form-row { display: flex; gap: 10px; flex-wrap: wrap; }
.form-row input, .form-row select { flex: 1; min-width: 140px; }
.small-label { font-size: 12px; color: var(--ink-soft); display: flex; flex-direction: column; gap: 4px; }

input, select, textarea, button {
  font-family: inherit; font-size: 14px; padding: 8px 10px; border: 1px solid var(--hairline);
  border-radius: 8px; background: var(--bg); color: var(--ink);
}
textarea { width: 100%; min-height: 60px; resize: vertical; }
button { background: var(--clay); color: #fff; border: none; cursor: pointer; padding: 9px 16px; font-weight: 500; }
button:hover { background: var(--clay-dark); }

.week-nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; font-size: 14px; }
.week-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 720px) { .week-plan-grid { grid-template-columns: 1fr; } }
.day-col-lg { background: var(--wash); border: 1px solid var(--hairline); border-radius: 12px; padding: 14px; }
.plan-items { list-style: none; margin: 8px 0; padding: 0; }
.plan-items li { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px dashed var(--hairline); font-size: 13.5px; }
.plan-add-form { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.plan-add-form select, .plan-add-form input { flex: 1; min-width: 100px; font-size: 12.5px; padding: 6px; }
.plan-add-form button { padding: 6px 10px; }

.auth-page { display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.auth-card { background: var(--wash); border: 1px solid var(--hairline); border-radius: 14px; padding: 32px; width: 300px; text-align: center; }
.auth-card h1 { font-size: 20px; margin: 0 0 4px; }
.auth-card .sub { color: var(--ink-soft); font-size: 13px; margin-bottom: 18px; }
.auth-card input { width: 100%; margin-bottom: 12px; text-align: center; letter-spacing: 4px; font-size: 18px; }
.auth-card button { width: 100%; }
.error { color: var(--red); font-size: 13px; margin-bottom: 10px; }

.chat-card { display: flex; flex-direction: column; height: 60vh; }
.chat-log { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.chat-msg { padding: 8px 12px; border-radius: 10px; max-width: 75%; font-size: 14px; }
.chat-msg.user { align-self: flex-end; background: var(--clay); color: #fff; }
.chat-msg.assistant { align-self: flex-start; background: var(--bg); border: 1px solid var(--hairline); }
#chat-form { display: flex; gap: 8px; }
#chat-input { flex: 1; }