:root {
  --fb-navy: #1F3A5F;
  --fb-orange: #F97316;
  --fb-blue: #2563EB;
  --fb-snow: #F8FAFC;
  --fb-white: #FFFFFF;
  --fb-text: #15263D;
  --fb-muted: #64748B;
  --fb-border: #E2E8F0;
  --fb-success: #16A34A;
  --fb-warning: #D97706;
  --fb-danger: #DC2626;
  --fb-radius-sm: 10px;
  --fb-radius-md: 16px;
  --fb-radius-lg: 24px;
  --fb-shadow: 0 14px 35px rgba(31, 58, 95, 0.08);
  --fb-sidebar-width: 248px;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--fb-snow);
  color: var(--fb-text);
  font-family: "Plus Jakarta Sans", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: var(--fb-sidebar-width) 1fr;
}

.sidebar {
  background: var(--fb-navy);
  color: white;
  padding: 26px 18px;
}

.brand {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 10px;
  font-weight: 800;
  font-size: 1.15rem;
  margin-bottom: 34px;
}

.brand-logo {
  display: block;
  width: 200px;
  max-width: 100%;
  height: auto;
}

.nav-link {
  display: block;
  color: rgba(255,255,255,.78);
  text-decoration: none;
  padding: 12px 14px;
  margin: 6px 0;
  border-radius: 12px;
}

.nav-link.active, .nav-link:hover {
  color: white;
  background: rgba(255,255,255,.1);
}

.main { padding: 28px; }
.detail-grid > section[hidden], .quick-links[hidden], .workspace-tabs[hidden] { display: none; }
.workspace-tabs [data-client-tab] { border: 0; background: transparent; color: inherit; font: inherit; padding: 12px 8px; min-height: 44px; }
.workspace-tabs [data-client-tab][aria-current="page"] { color: var(--fb-text); border-bottom: 2px solid var(--fb-orange); font-weight: 600; }
.today-item { display: flex; align-items: center; gap: 12px; }
.today-item > a { flex: 1; min-width: 0; }
@media (max-width: 600px) { .today-item { flex-wrap: wrap; } .today-item > a { flex-basis: 100%; } }

.topbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 24px;
}

.eyebrow {
  color: var(--fb-blue);
  font-weight: 700;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

h1 { margin: 6px 0; color: var(--fb-navy); }

.muted { color: var(--fb-muted); }

.clock-group {
  display: flex;
  gap: 10px;
}

.clock {
  background: var(--fb-white);
  border: 1px solid var(--fb-border);
  border-radius: var(--fb-radius-md);
  padding: 12px 16px;
  min-width: 150px;
  box-shadow: var(--fb-shadow);
}

.clock strong { color: var(--fb-navy); display: block; }

.grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 18px;
}

.card {
  background: var(--fb-white);
  border: 1px solid var(--fb-border);
  border-radius: var(--fb-radius-lg);
  box-shadow: var(--fb-shadow);
  padding: 22px;
}

.mission { grid-column: span 8; }
.ai-card { grid-column: span 4; }
.metric { grid-column: span 3; }

.metric-value {
  font-size: 2rem;
  font-weight: 800;
  color: var(--fb-navy);
  margin: 8px 0;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: 0;
  border-radius: 12px;
  padding: 11px 16px;
  font-weight: 700;
  cursor: pointer;
}

.btn-primary { background: var(--fb-orange); color: white; }
.btn-secondary { background: var(--fb-navy); color: white; }

.progress {
  height: 10px;
  background: #EAF0F7;
  border-radius: 999px;
  overflow: hidden;
}

.progress > span {
  display: block;
  height: 100%;
  width: 0%;
  background: var(--fb-orange);
}

.prospect-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.prospect-form label { color: var(--fb-navy); display: grid; font-size: .88rem; font-weight: 700; gap: 6px; }
.prospect-form input, .prospect-form select, .prospect-form textarea { width: 100%; border: 1px solid var(--fb-border); border-radius: var(--fb-radius-sm); color: var(--fb-text); font: inherit; padding: 10px 12px; }
.prospect-form textarea { resize: vertical; }
.form-actions { align-self: end; display: flex; }
[data-lead-details] .form-actions { grid-column: 1 / -1; justify-content: space-between; align-items: center; gap: 12px; }
[data-lead-details].prospect-form .btn-primary { background: var(--fb-blue); color: #fff; }
[data-lead-details] .btn-secondary { background: transparent; color: var(--fb-navy); border: 1px solid var(--fb-navy); margin-left: auto; }
.field-error { color: var(--fb-danger); font-weight: 600; }
.notice { border-radius: var(--fb-radius-sm); margin-bottom: 18px; padding: 12px 16px; }
.notice.success { background: #DCFCE7; color: #166534; }
.notice.error { background: #FEE2E2; color: #991B1B; }
.table-wrap { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; }
th, td { border-bottom: 1px solid var(--fb-border); padding: 14px 10px; text-align: left; }
th { color: var(--fb-muted); font-size: .78rem; text-transform: uppercase; }
td a { color: var(--fb-blue); font-weight: 700; }
.pill { background: #EAF0F7; border-radius: 999px; color: var(--fb-navy); display: inline-block; font-size: .82rem; padding: 4px 8px; text-transform: capitalize; }

@media (max-width: 980px) {
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { display: none; }
  .mission, .ai-card, .metric { grid-column: span 12; }
  .topbar { flex-direction: column; }
  .clock-group { width: 100%; flex-wrap: wrap; }
  .prospect-form { grid-template-columns: 1fr; }
}

/* Client workspace */
body { line-height: 1.5; }
a { color: var(--fb-blue); }
button, input, select, textarea { font: inherit; }
button, summary, .btn { min-height: 44px; }
:focus-visible { outline: 3px solid #2563eb; outline-offset: 3px; }
.main { min-width: 0; }
.crm-shell { --fb-sidebar-width: 224px; }
.crm-shell .sidebar { display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; padding: 32px 18px; background: #182f4f; }
.brand-link { text-decoration: none; color: white; }
.brand-subtitle { display: block; font-size: .65rem; font-weight: 400; letter-spacing: .07em; color: #b8c7da; }
.crm-shell .nav-link { padding: 13px 16px; }
.crm-shell .nav-link.active { background: #2c4564; box-shadow: inset 3px 0 var(--fb-orange); }
.sidebar-account { display: grid; margin-top: auto; padding: 18px 14px 0; gap: 3px; border-top: 1px solid #40516b; }
.sidebar-account .small { color: #b8c7da; }
.logout-button { color: white; background: none; border: 0; padding: 7px 0; cursor: pointer; text-decoration: underline; }
.crm-shell .main { padding: 28px 36px; max-width: 1720px; width: 100%; margin: 0 auto; }
.workspace-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: .68rem; color: #60728a; letter-spacing: .08em; margin-bottom: 38px; }
.crm-shell h1 { font-size: clamp(1.8rem, 3.3vw, 2.8rem); letter-spacing: -.045em; font-weight: 750; line-height: 1.2; overflow-wrap: anywhere; }
.crm-shell h2 { font-size: 1.12rem; letter-spacing: -.02em; margin: 0 0 18px; }
.crm-shell h3 { font-size: 1rem; margin: 5px 0; }
.crm-shell .topbar { align-items: center; margin-bottom: 28px; }
.crm-shell .eyebrow { font-size: .68rem; color: #66758b; }
.crm-shell .card { border-radius: 16px; box-shadow: 0 4px 18px #1f3a5f04; padding: 24px; }
.crm-shell .btn-primary { background: #b94208; color: #fff; }
.crm-shell .btn { font-size: .82rem; white-space: nowrap; border-radius: 8px; }
.btn-quiet { background: #f0f4f8; color: var(--fb-navy); }
.small { font-size: .78rem; }
.demo-notice { background: #fff4e8; color: #884113; font-size: .8rem; }
.stack { display: grid; gap: 16px; }
.stack label, .filters label { display: grid; gap: 6px; font-size: .78rem; color: var(--fb-navy); font-weight: 600; min-width: 0; }
.stack input, .stack select, .stack textarea, .filters input, .filters select { width: 100%; min-width: 0; padding: 11px 12px; background: white; color: var(--fb-text); border: 1px solid #d5dfe9; border-radius: 8px; }
textarea { resize: vertical; }
.quick-links { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 22px; }
.quick-links a { font-size: .8rem; color: #455870; padding: 9px 14px; border: 1px solid #dce4ee; border-radius: 8px; text-decoration: none; background: white; }
.quick-links a:hover, .quick-links a.selected { background: var(--fb-navy); color: white; border-color: var(--fb-navy); }
.filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; padding-bottom: 24px; border-bottom: 1px solid var(--fb-border); margin-bottom: 22px; }
.filters label { flex: 1 1 120px; }
.filters .search-label { flex: 2.5 1 235px; }
.clear-filter { font-size: .8rem; padding: 11px 4px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.section-heading h2 { margin: 0; }
.count { display: inline-flex; font-weight: 500; background: #edf2f7; color: #566981; border-radius: 6px; padding: 2px 7px; font-size: .75rem; vertical-align: middle; }
.client-table { font-size: .82rem; }
.client-table td { vertical-align: top; padding: 21px 10px; }
.client-table th { font-size: .66rem; font-weight: 600; letter-spacing: .05em; padding: 13px 10px; background: #f8fafc; }
.client-table tr:last-child td { border-bottom: 0; }
.client-name { color: var(--fb-navy); font-size: .92rem; text-decoration: none; }
.cell-detail { display: block; font-weight: 400; font-size: .77rem; color: #66758b; margin-top: 4px; overflow-wrap: anywhere; }
a.cell-detail { color: #36577f; font-weight: 400; text-decoration: none; }
.pill { font-size: .7rem; font-weight: 600; padding: 5px 9px; white-space: nowrap; }
.status-active, .payment-paid { background: #e6f5ed; color: #176b3d; }
.status-onboarding, .payment-partial { background: #fff1dc; color: #8b5000; }
.status-paused, .payment-unpaid { background: #eff1f6; color: #4d5874; }
.payment-overdue { background: #fce9e7; color: #a63127; }
.status-closed, .payment-not_recorded { background: #f0f2f5; color: #606c7e; }
.overdue-text { color: #ad3228 !important; }
.empty-state { text-align: center; padding: 64px 20px; max-width: 560px; margin: auto; }
.empty-state .empty-icon { display: grid; place-items: center; background: #fff1e8; color: #b94208; border-radius: 16px; width: 56px; height: 56px; font-size: 2rem; margin: 0 auto 22px; }
.empty-state.compact { padding: 28px 15px; }
.back-link { font-size: .82rem; display: inline-block; margin-bottom: 20px; text-decoration: none; }
.detail-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 22px; }
.detail-grid > * { min-width: 0; }
.full-width { grid-column: 1 / -1; }
.balance { color: var(--fb-navy); font-size: 2rem; font-weight: 750; letter-spacing: -.04em; }
.new-followup { border: 1px solid var(--fb-border); border-radius: 10px; margin-bottom: 16px; }
.new-followup summary { width: fit-content; margin: 14px; }
.followup-create { padding: 6px 18px 20px; }
.form-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.followup-item { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; padding: 22px 0; border-bottom: 1px solid var(--fb-border); }
.followup-item:last-child { border-bottom: 0; }
.followup-description { min-width: 200px; flex: 1; overflow-wrap: anywhere; }
.followup-description a { font-size: .8rem; }
.followup-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: start; }
.reschedule-form { padding: 16px; background: #f8fafc; border: 1px solid var(--fb-border); border-radius: 10px; margin-top: 10px; width: 270px; }
.timeline article { border-left: 2px solid #e2e8f0; padding: 0 0 20px 18px; margin-top: 20px; font-size: .82rem; }
.timeline article strong { font-weight: 600; }
.timeline article p { margin: 8px 0; }
.preserve-lines { white-space: pre-wrap; overflow-wrap: anywhere; }
.pagination { display: flex; align-items: center; justify-content: center; gap: 20px; padding-top: 20px; font-size: .8rem; }
.workspace-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 32px; padding: 20px 0; border-top: 1px solid var(--fb-border); color: #718096; font-size: .7rem; }
.phone-footer-controls { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.phone-footer-switch { display:inline-flex; align-items:center; gap:8px; margin:0; }
.phone-footer-status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.phone-footer-status.is-error { position:static; width:auto; height:auto; max-width:260px; clip-path:none; white-space:normal; }
.phone-footer-switch button { display:inline-flex; align-items:center; gap:7px; min-height:32px; padding:0; border:0; background:transparent; color:inherit; font:inherit; cursor:pointer; white-space:nowrap; }
.phone-footer-track { display:inline-flex; align-items:center; flex-shrink:0; width:28px; height:16px; padding:2px; border-radius:16px; background:#b91c1c; }
.phone-footer-track > span { width:12px; height:12px; border-radius:50%; background:#fff; transition:transform .15s; }
.phone-footer-switch button[aria-checked="true"] .phone-footer-track { background:#15803d; }
.phone-footer-switch button[aria-checked="true"] .phone-footer-track > span { transform:translateX(12px); }
.phone-footer-switch button:focus-visible { outline:2px solid currentColor; outline-offset:4px; border-radius:3px; }
.phone-footer-switch button:disabled { opacity:.65; cursor:wait; }
@media (prefers-reduced-motion:reduce) { .phone-footer-track > span { transition:none; } }
.login-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: #eef2f7; }
.login-card { max-width: 450px; width: 100%; padding: 38px; }
.login-card .brand { color: var(--fb-navy); }
.skip-link { position: absolute; top: -100px; left: 15px; background: white; z-index: 10; padding: 10px; }
.skip-link:focus { top: 10px; }
@media (max-width: 1100px) { .detail-grid { grid-template-columns: 1fr; } .crm-shell .main { padding: 24px; } }
@media (max-width: 980px) {
 .crm-shell .sidebar { position: static; height: auto; padding: 18px 22px; display: grid; grid-template-columns: 1fr auto; gap: 12px; }
 .crm-shell .brand { margin: 0; font-size: 1rem; }
 .crm-shell .sidebar nav { grid-row: 2; grid-column: 1 / -1; display: flex; gap: 8px; }
 .crm-shell .nav-link { padding: 10px 13px; margin: 0; font-size: .82rem; }
 .sidebar-account { border: 0; padding: 0; font-size: .7rem; text-align: right; margin: 0; }
 .sidebar-account > .small { display: none; }
 .logout-button { min-height: 28px; padding: 0; font-size: .7rem; }
 .workspace-top { margin-bottom: 26px; }
 .crm-shell .topbar { align-items: start; }
 .crm-shell .topbar p { margin-bottom: 0; }
}
@media (max-width: 700px) {
 .crm-shell .main { padding: 22px 16px; }
 .crm-shell .card { padding: 18px; }
 .workspace-top { font-size: .6rem; letter-spacing: .035em; }
 .section-heading { flex-wrap: wrap; }
 .section-heading > .small { display: none; }
 .client-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
 .client-table, .client-table tbody, .client-table tr { display: block; }
 .client-table tr { padding: 16px 0; border-bottom: 1px solid var(--fb-border); }
 .client-table td { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 2px 10px; padding: 8px 0; border: 0; overflow-wrap: anywhere; }
 .client-table td::before { content: attr(data-label); grid-column: 1; grid-row: 1 / span 5; color: #6b7c91; font-size: .72rem; padding-top: 3px; }
 .client-table td > * { grid-column: 2; justify-self: start; }
 .client-table td .pill { justify-self: start; }
 .client-table td[data-label="Owner"] { display: block; padding-left: 110px; position: relative; }
 .client-table td[data-label="Owner"]::before { position: absolute; left: 0; }
 .filters .search-label { flex-basis: 100%; }
 .followup-actions { width: 100%; }
 .followup-actions details { width: 100%; }
 .reschedule-form { width: 100%; }
 .form-pair { grid-template-columns: 1fr; }
 .login-card { padding: 26px; }
}

/* Daily operations and website progress */
.dashboard-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
.dashboard-metric { display: grid; gap: 10px; color: var(--fb-navy); text-decoration: none; font-size: .85rem; }
.dashboard-metric strong { font-size: 2.5rem; line-height: 1.15; letter-spacing: -.04em; }
.dashboard-metric.urgent strong { color: #ae3c2b; }
.dashboard-metric:hover { border-color: #839bb6; }
.dashboard-metric .small { display: flex; justify-content: space-between; gap: 10px; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 24px; }
.dashboard-grid > * { min-width: 0; }
.priority-item { display: flex; align-items: center; gap: 14px; padding: 18px 0; color: var(--fb-navy); text-decoration: none; border-bottom: 1px solid var(--fb-border); }
.priority-item:last-child { border-bottom: 0; }
.priority-body { min-width: 0; flex: 1; overflow-wrap: anywhere; font-size: .87rem; }
.priority-item:hover strong { text-decoration: underline; }
.due-marker { flex-shrink: 0; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; background: #edf3fa; color: #365b87; }
.due-marker.overdue { background: #fff0e9; color: #a23c1c; }
.attention-item { display: grid; grid-template-columns: 1fr auto 16px; gap: 16px; padding: 17px 0; border-bottom: 1px solid var(--fb-border); text-decoration: none; color: var(--fb-navy); font-size: .82rem; }
.attention-item:last-child { border-bottom: 0; }
.attention-item:hover span:first-child { text-decoration: underline; }
.pipeline-row { display: grid; grid-template-columns: 12px 1fr auto 16px; align-items: center; gap: 14px; padding: 12px 0; text-decoration: none; color: var(--fb-navy); font-size: .84rem; }
.pipeline-row:hover { background: #f8fafc; }
.stage-dot { width: 10px; height: 10px; border-radius: 50%; background: #b7c5d5; }
.stage-onboarding { background: #eaf0f8; color: #36577f; }
.stage-designing { background: #eeeafa; color: #6b45a0; }
.stage-awaiting_feedback { background: #fff1dc; color: #8b5000; }
.stage-ready_to_launch { background: #e4f4f4; color: #1b6565; }
.stage-live { background: #e6f5ed; color: #176b3d; }
.stage-dot.stage-onboarding { background: #668db8; }
.stage-dot.stage-designing { background: #9577b8; }
.stage-dot.stage-awaiting_feedback { background: #dba455; }
.stage-dot.stage-ready_to_launch { background: #60a5a5; }
.stage-dot.stage-live { background: #5ea579; }
.unset-stages { display: block; font-size: .8rem; padding: 14px; border-radius: 8px; margin-top: 14px; background: #f1f5f9; }
.currency-balance { padding: 20px 0; border-bottom: 1px solid var(--fb-border); }
.currency-balance .section-heading { margin-bottom: 8px; }
.currency-balance p { margin-bottom: 0; }
.stage-track { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); list-style: none; counter-reset: stage; padding: 0; gap: 10px; margin: 24px 0; }
.stage-track li { counter-increment: stage; color: #61738b; padding: 12px 10px; border-top: 3px solid #e2e8f0; font-size: .8rem; }
.stage-track li::before { content: counter(stage) '. '; }
.stage-track .current { border-top-color: var(--fb-orange); color: var(--fb-navy); font-weight: 700; background: #fff7f0; border-radius: 0 0 8px 8px; }
.progress-form { display: flex; flex-wrap: wrap; align-items: end; gap: 16px; }
.progress-form label { display: grid; gap: 6px; flex: 1 1 170px; min-width: 0; font-size: .8rem; color: var(--fb-navy); font-weight: 600; }
.progress-form .next-step-label { flex: 2 1 260px; }
.progress-form input, .progress-form select { width: 100%; min-width: 0; padding: 11px 12px; border: 1px solid #d5dfe9; border-radius: 8px; background: white; color: var(--fb-text); }
.filter-context { font-size: .8rem; padding: 10px 12px; background: #eef3f9; border-radius: 8px; }
.filter-context a { margin-left: 12px; }
@media (max-width: 1150px) { .dashboard-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dashboard-grid { grid-template-columns: 1fr; } }
@media (max-width: 700px) {
 .dashboard-metrics { gap: 10px; }
 .crm-shell .dashboard-metric { padding: 16px; }
 .dashboard-metric strong { font-size: 2rem; }
 .dashboard-metric .small { font-size: .7rem; }
 .stage-track { grid-template-columns: 1fr; gap: 4px; }
 .stage-track li { border-top: 0; border-left: 3px solid #e2e8f0; padding: 8px 12px; }
 .stage-track .current { border-left-color: var(--fb-orange); }
 .crm-shell .sidebar nav { flex-wrap: wrap; gap: 4px; }
 .crm-shell .nav-link { padding: 10px; }
}

/* Client requests and internal work */
.work-row { display: grid; grid-template-columns: minmax(0, 1fr) 155px 180px; gap: 20px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--fb-border); }
.work-row:last-child { border-bottom: 0; }
.work-body { min-width: 0; overflow-wrap: anywhere; }
.work-body h3 { margin: 7px 0; font-size: .96rem; }
.work-body h3 a { color: var(--fb-navy); text-decoration: none; }
.work-body h3 a:hover { text-decoration: underline; }
.work-meta { display: grid; gap: 8px; justify-items: start; overflow-wrap: anywhere; min-width: 0; }
.work-status-open { background: #eef2f7; color: #405975; }
.work-status-in_progress { background: #eeeafa; color: #6b45a0; }
.work-status-waiting { background: #fff1dc; color: #8b5000; }
.work-status-completed { background: #e6f5ed; color: #176b3d; }
.work-status-cancelled { background: #edf0f4; color: #667485; }
.work-editor { max-width: 940px; }
.work-dashboard .quick-links { margin-top: 16px; }
@media (max-width: 760px) {
 .work-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
 .work-body { grid-column: 1 / -1; }
 .work-meta .pill { white-space: normal; }
}

/* Project links and asset handoff */
.resource-columns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; }
.resource-columns > div { min-width: 0; }
.resource-row { display: grid; grid-template-columns: minmax(0, 1fr) 160px; gap: 20px; align-items: start; padding: 20px 0; border-bottom: 1px solid var(--fb-border); }
.resource-row:last-child { border-bottom: 0; }
.resource-body { min-width: 0; overflow-wrap: anywhere; }
.resource-body h3 { margin: 6px 0; font-size: .96rem; }
.resource-body h3 a { color: var(--fb-navy); text-decoration: none; }
.resource-body h3 a:hover { text-decoration: underline; }
.resource-url { display: block; margin-top: 8px; overflow-wrap: anywhere; }
.resource-summary { display: flex; flex-wrap: wrap; gap: 12px 24px; padding: 18px; margin: 0 0 24px; border-radius: 12px; background: #edf3f9; font-size: .84rem; }
.work-dashboard .resource-summary { margin: 20px 0 0; }
.asset-status-missing, .asset-status-requested { background: #fff1dc; color: #8b5000; }
.asset-status-received, .asset-status-active { background: #e6f5ed; color: #176b3d; }
.asset-status-not_needed, .asset-status-archived { background: #edf0f4; color: #667485; }
.resource-columns .resource-row { grid-template-columns: minmax(0, 1fr); gap: 12px; }
.resource-columns .work-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
@media (max-width: 1100px) { .resource-columns { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .resource-row { grid-template-columns: minmax(0, 1fr); gap: 12px; } .resource-row .work-meta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; } }

/* Preview reviews and recorded client decisions */
.review-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 24px; }
.review-grid > * { min-width: 0; overflow-wrap: anywhere; }
.review-status-awaiting_feedback { background: #fff1dc; color: #8b5000; }
.review-status-changes_requested { background: #eeeafa; color: #6b45a0; }
.review-status-approved { background: #e6f5ed; color: #176b3d; }
.review-status-withdrawn { background: #edf0f4; color: #667485; }
.review-summary { cursor: pointer; color: var(--fb-blue); padding: 12px 0; }
.review-subform { max-width: 620px; margin: 14px 0; }
.prospect-form .review-confirm { display: flex; align-items: start; gap: 12px; font-weight: 400; padding: 14px; border-radius: 10px; background: #f1f5f9; }
.prospect-form .review-confirm input { width: 20px; height: 20px; flex: 0 0 20px; margin-top: 2px; }
@media (max-width: 1100px) { .review-grid { grid-template-columns: 1fr; } }

/* Sales CRM: compact records, a scrollable pipeline, and accessible native forms. */
.sales-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0 0 24px; border:1px solid var(--fb-border); border-radius:12px; background:#fff; }
.sales-metrics > div { padding:22px 24px; border-right:1px solid var(--fb-border); }
.sales-metrics > div:last-child { border:0; }
.sales-metrics span { display:block; color:#627083; font-size:.8rem; margin-bottom:12px; }
.sales-metrics strong { display:block; font-size:1.8rem; letter-spacing:-.06em; color:#1f3a5f; }
.sales-metrics a { color:inherit; }
.sales-toolbar,.sales-pagination { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
.sales-tabs { display:flex; gap:8px; }
.sales-tabs a { color:#58677a; text-decoration:none; padding:10px 15px; border-radius:7px; font-size:.86rem; }
.sales-tabs a[aria-current] { background:#eaf0f7; color:#1f3a5f; font-weight:700; }
.sales-filters { display:flex; gap:14px; align-items:end; margin:24px 0; flex-wrap:wrap; }
.sales-filters label { display:grid; gap:7px; font-size:.8rem; font-weight:600; }
.sales-filters label:first-child { flex:1 1 220px; }
.sales-filters input,.sales-filters select,.sales-stack input,.sales-stack select,.sales-stack textarea { width:100%; border:1px solid #d5dfe9; border-radius:7px; padding:11px 12px; background:#fff; font:inherit; color:#20334a; }
.sales-board { display:flex; gap:16px; overflow-x:auto; padding:8px 0 22px; align-items:stretch; }
.sales-column { flex:0 0 250px; padding:12px; background:#f4f6f9; border-radius:10px; min-height:280px; }
.sales-column header { display:flex; gap:8px; align-items:center; padding:4px 0 18px; }
.sales-column h2 { font-size:.8rem; margin:0; flex:1; }
.sales-column header > span:last-child { color:#68798b; font-size:.8rem; }
.stage-dot { width:8px; height:8px; border-radius:50%; background:#95a3b5; }
.stage-qualified,.stage-contacted,.stage-meeting_booked { background:#6a7fda; }
.stage-proposal_sent,.stage-negotiation { background:#eda148; }
.stage-won { background:#309472; }.stage-lost { background:#c96161; }
.sales-lead-card { display:grid; gap:10px; background:white; border:1px solid #e1e6ec; padding:17px; margin-bottom:10px; border-radius:8px; color:#253b55; text-decoration:none; font-size:.83rem; overflow-wrap:anywhere; box-shadow:0 2px 3px #20334a04; }
.sales-lead-card:hover { border-color:#8094b0; box-shadow:0 3px 8px #20334a0d; }
.sales-lead-card strong { font-size:.91rem; }
.sales-empty { text-align:center; padding:56px 20px; }
.sales-empty-icon { display:inline-grid; place-items:center; width:48px; height:48px; background:#edf2f8; color:#1f3a5f; border-radius:12px; font-size:1.5rem; }
.sales-empty p { max-width:480px; margin:12px auto 24px; }
.sales-detail-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr); gap:24px; align-items:start; }
.sales-detail-grid > * { min-width:0; }
.sales-activity-column { display:grid; gap:24px; }
.sales-stack { display:grid; gap:14px; margin:18px 0; }
.sales-stack label { display:grid; gap:7px; font-size:.83rem; font-weight:600; }
.sales-stack small { font-weight:400; }
.sales-stack button { justify-self:start; }
.sales-full { grid-column:1/-1; }
.prospect-form .sales-checkbox { display:flex; gap:10px; align-items:center; }
.prospect-form .sales-checkbox input { width:18px; height:18px; }
.sales-blocked { color:#a33232; font-size:.78rem; }
.sales-timeline article { border-left:2px solid #dce4ee; margin-top:20px; padding-left:16px; overflow-wrap:anywhere; font-size:.85rem; }
.sales-timeline article p { line-height:1.6; }
.sales-timeline .small { margin-top:7px; }
.sales-pagination { margin-top:24px; }
.sales-detail-grid h1,.sales-directory td { overflow-wrap:anywhere; }
@media(max-width:1100px) { .sales-detail-grid { grid-template-columns:1fr; } }
@media(max-width:700px) { .sales-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } .sales-metrics > div { padding:16px; } .sales-metrics strong { font-size:1.4rem; } .sales-filters label { flex:1 1 100%; } .sales-column { flex-basis:230px; } .sales-detail-grid .prospect-form { grid-template-columns:1fr; } }

/* Pipeline stage moves; the select/button also supports touch and keyboards. */
.sales-lead-card[draggable="true"] { cursor:grab; }
.sales-lead-card > a { color:inherit; text-decoration:none; }
.sales-lead-card > a:hover { text-decoration:underline; }
.sales-lead-card.is-dragging { opacity:.45; }
.sales-lead-card.is-saving { opacity:.65; cursor:progress; }
.sales-column.is-drop-target { outline:2px dashed #2563eb; outline-offset:-2px; background:#eaf1fc; }
.pipeline-move { display:flex; gap:8px; align-items:end; border-top:1px solid #e1e6ec; padding-top:12px; }
.pipeline-move label { flex:1; min-width:0; }
.pipeline-move select { display:block; width:100%; margin-top:5px; padding:6px; border:1px solid #d5dfe9; border-radius:5px; background:white; }
.pipeline-move .btn { padding:8px; font-size:.75rem; }
#pipeline-status { min-height:1.4em; font-size:.85rem; }
.sales-task { border-top:1px solid #e1e6ec; padding:16px 0; overflow-wrap:anywhere; }
.saved-view-links { flex-wrap:wrap; margin:18px 0; }
.saved-view-links [aria-current] { font-weight:700; text-decoration:underline; }
.saved-view-editor { margin:18px 0; padding:14px 16px; border:1px solid #e1e6ec; border-radius:8px; }
.saved-view-editor summary { cursor:pointer; color:#1f3a5f; font-size:.85rem; }
.pipeline-move { flex-wrap:wrap; }
.pipeline-loss-fields { flex:1 0 100%; font-size:.75rem; }
.pipeline-loss-fields summary { cursor:pointer; color:#627083; }
.pipeline-loss-fields label { display:block; margin-top:10px; }
.pipeline-loss-fields textarea { width:100%; border:1px solid #d5dfe9; border-radius:5px; }
#loss-reason-dialog { width:min(440px,calc(100vw - 32px)); border:1px solid #d5dfe9; border-radius:12px; padding:24px; color:#20334a; }
#loss-reason-dialog::backdrop { background:#14233988; }
.sales-filters .sales-checkbox { display:flex; align-items:center; gap:8px; flex:none; }
.sales-filters .sales-checkbox input { width:18px; height:18px; }
.sales-lead-card { position:relative; }
.sales-lead-card > a { padding-right:20px; }
.pipeline-drag-handle { position:absolute; right:10px; top:12px; color:#8090a3; font-size:1.3rem; cursor:grab; padding:4px; user-select:none; }
.lead-tabs { display:flex; gap:6px; flex-wrap:wrap; border-bottom:1px solid #dce4ee; margin:0 0 24px; padding-bottom:10px; }
.lead-tabs a { padding:10px 15px; border-radius:7px; text-decoration:none; color:#53667e; font-size:.86rem; }
.lead-tabs a[aria-current] { color:#1f3a5f; background:#e8eef6; font-weight:700; }
.lead-tab-content { max-width:1050px; display:grid; gap:24px; }
.call-queue-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(230px,1fr); gap:24px; align-items:start; }
.call-queue-grid > * { min-width:0; overflow-wrap:anywhere; }
.call-queue-grid aside [aria-current] { font-weight:700; }
.sales-stack .sales-checkbox { display:flex; gap:10px; align-items:center; }
.sales-stack .sales-checkbox input { width:18px; height:18px; }
@media(max-width:800px) { .call-queue-grid { grid-template-columns:1fr; } .lead-tabs a { padding:9px 10px; } }

/* Workspace clocks and account settings */
.workspace-time{text-align:right;display:flex;flex-direction:column;gap:6px}.workspace-clocks{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px 14px;font-size:12px;text-transform:none;letter-spacing:normal}.workspace-clocks time{font-variant-numeric:tabular-nums;font-weight:700}.uk-clock time{color:#267044}.uk-closed .uk-clock time{color:#b42318}.settings-section{padding:24px;margin-bottom:20px}.settings-section .stack{max-width:540px}.settings-section h2{margin-top:0}.settings-form{padding:18px 0}.settings-user{border-top:1px solid var(--border,#e4e7ec);padding:16px 0}.settings-section summary{cursor:pointer;font-weight:600;overflow-wrap:anywhere}.settings-key{border-top:1px solid #e4e7ec;margin-top:16px;padding-top:16px;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between}.checkbox-label{display:flex!important;flex-direction:row!important;align-items:center;gap:10px}.checkbox-label input{width:auto!important}.passkey-login{margin-top:24px;padding-top:20px;border-top:1px solid #e4e7ec}.passkey-login .btn{width:100%}[data-passkey-status]{overflow-wrap:anywhere}.workspace-top{align-items:flex-start}@media(max-width:600px){.workspace-top{gap:12px}.workspace-clocks{flex-direction:column;gap:4px}.settings-section{padding:16px}.settings-key{display:block}}

/* Three workspace areas with page navigation in the content pane. */
.area-shell { grid-template-columns: 184px minmax(0, 1fr); grid-template-rows: auto 1fr; background: #fff; }
.workspace-header { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 20px 32px; border-bottom: 1px solid #e9edf2; background: #fff; }
.area-shell .workspace-header .brand { margin: 0; color: #182f4f; font-size: 1.15rem; letter-spacing: -.04em; }
.area-shell .workspace-header .brand { flex: 0 1 200px; }
.workspace-header .workspace-time { color: #60728a; font-size: .68rem; }
.area-shell .main { grid-column: 2; grid-row: 2; padding: 32px; }
.area-shell .area-sidebar { grid-column: 1; grid-row: 2; background: #f8fafc; color: #182f4f; border-right: 1px solid #e9edf2; padding: 24px 14px 22px; height: calc(100dvh - 108px); min-height: 380px; overflow-y: auto; }
.area-menu-label { padding: 0 13px; margin-bottom: 18px; color: #738094; font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; }
.area-shell .area-sidebar .workspace-navigation { display: grid; gap: 7px; margin: 0 0 24px; }
.area-shell .area-sidebar .nav-link { margin: 0; padding: 13px; border-radius: 8px; font-size: .85rem; font-weight: 500; color: #60728a; }
.area-shell .area-sidebar .nav-link:hover { background: #edf1f6; color: #182f4f; }
.area-shell .area-sidebar .nav-link.active { color: #fff; background: #182f4f; box-shadow: none; }
.area-shell .sidebar-account { padding: 18px 10px 0; border-color: #e0e6ee; font-size: .78rem; overflow-wrap: anywhere; }
.area-shell .sidebar-account .small { color: #60728a; }
.area-shell .logout-button, .area-shell .account-settings { color: #60728a; font-size: .75rem; }
.area-shell .account-settings { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.area-shell .account-settings:hover, .area-shell .account-settings[aria-current] { color: #182f4f; text-decoration: underline; }
.workspace-context { display: flex; align-items: center; gap: 12px; color: #60728a; font-size: .73rem; margin-bottom: 22px; }
.workspace-context a { color: inherit; text-decoration: none; }
.workspace-context a:hover { text-decoration: underline; }
.workspace-tabs { display: flex; flex-wrap: wrap; gap: 0 24px; border-bottom: 1px solid #e4e9ef; margin-bottom: 30px; }
.workspace-tabs a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 0 12px; border-bottom: 2px solid transparent; color: #60728a; font-size: .81rem; text-decoration: none; }
.workspace-tabs a:hover { color: #182f4f; }
.workspace-tabs a[aria-current] { color: #182f4f; border-bottom-color: var(--fb-orange); font-weight: 600; }
@media (max-width: 980px) {
  .area-shell { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto 1fr; }
  .workspace-header { padding: 18px 22px; }
  .area-shell .area-sidebar { grid-column: 1; grid-row: 2; position: static; height: auto; min-height: 0; display: flex; flex-direction: column; gap: 10px; padding: 12px 22px; border-left: 0; border-bottom: 1px solid #e9edf2; overflow: visible; }
  .area-menu-label { display: none; }
  .area-shell .area-sidebar .workspace-navigation { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; gap: 8px; }
  .area-shell .area-sidebar .nav-link { text-align: center; padding: 12px 8px; }
  .area-shell .sidebar-account { display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; gap: 12px; padding: 0; margin: 0; border: 0; }
  .area-shell .sidebar-account .small { display: none; }
  .area-shell .logout-button { min-height: 44px; }
  .area-shell .main { grid-column: 1; grid-row: 3; padding: 24px; }
}
@media (max-width: 600px) {
  .workspace-header { align-items: flex-start; padding: 16px; gap: 12px; }
  .area-shell .workspace-header .brand { font-size: .95rem; gap: 7px; }
  .workspace-header .workspace-clocks { font-size: .65rem; }
  .area-shell .area-sidebar { padding: 10px 16px; }
  .area-shell .main { padding: 22px 16px; }
  .workspace-tabs { gap: 0 18px; margin-bottom: 24px; }
}

/* Collapsible left navigation; links stay available in compact mode. */
.sidebar-heading { display: flex; align-items: center; justify-content: space-between; gap: 4px; margin-bottom: 14px; }
.sidebar-heading .area-menu-label { margin: 0; padding: 0 8px; }
.sidebar-toggle { display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 1px solid #e0e6ee; border-radius: 8px; background: #fff; color: #60728a; cursor: pointer; }
.sidebar-toggle[hidden] { display: none; }
.sidebar-toggle:hover { color: #182f4f; background: #edf1f6; }
.area-shell .area-sidebar .nav-link, .area-shell .account-settings, .area-shell .logout-button { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.area-icon { flex-shrink: 0; }
.area-shell.is-sidebar-collapsed .sidebar-toggle svg { transform: rotate(180deg); }
.area-shell.is-sidebar-collapsed .sidebar-link-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.area-shell.is-sidebar-collapsed .area-menu-label, .area-shell.is-sidebar-collapsed .sidebar-user-name, .area-shell.is-sidebar-collapsed .sidebar-account > .small { display: none; }
.area-shell.is-sidebar-collapsed .sidebar-heading { justify-content: center; }
.area-shell.is-sidebar-collapsed .area-sidebar .nav-link, .area-shell.is-sidebar-collapsed .account-settings, .area-shell.is-sidebar-collapsed .logout-button { justify-content: center; padding: 12px; }
@media (min-width: 981px) {
  .area-shell.is-sidebar-collapsed { grid-template-columns: 76px minmax(0, 1fr); }
  .area-shell.is-sidebar-collapsed .area-sidebar { padding-left: 10px; padding-right: 10px; }
  .area-shell.is-sidebar-collapsed .sidebar-account { padding-left: 0; padding-right: 0; }
}
@media (max-width: 980px) {
  .area-shell .area-sidebar { border-right: 0; }
  .sidebar-heading { justify-content: flex-end; margin-bottom: 0; }
  .area-shell .area-sidebar .nav-link { justify-content: center; }
  .area-shell.is-sidebar-collapsed .sidebar-heading { justify-content: flex-end; }
}

/* Lead source tags and conditional loss fields. */
.prospect-form [data-loss-field][hidden] { display: none; }
.prospect-form .source-tags { min-width: 0; margin: 0; padding: 0; border: 0; }
.source-tags legend { color: var(--fb-navy); font-size: .88rem; font-weight: 700; margin-bottom: 6px; padding: 0; }
.source-tag-options { display: flex; flex-wrap: wrap; gap: 8px; }
.prospect-form .source-tag { position: relative; display: block; cursor: pointer; }
.prospect-form .source-tag input { position: absolute; opacity: 0; width: 1px; height: 1px; padding: 0; }
.source-tag span { display: block; border: 1px solid var(--fb-border); border-radius: 999px; padding: 8px 12px; background: #fff; }
.source-tag input:checked + span { background: var(--fb-navy); border-color: var(--fb-navy); color: #fff; }
.source-tag input:focus-visible + span { outline: 2px solid var(--fb-navy); outline-offset: 3px; }
.source-tag-empty span { font-weight: 400; }

.expense-suggestion{background:#f0f6ff;border:1px solid #c9dcf6;min-width:0;overflow-wrap:anywhere}.expense-suggestion[hidden]{display:none}.expense-suggestion p{margin:8px 0}.expense-suggestion .btn{white-space:normal;max-width:100%}.expense-suggestion .btn:disabled{opacity:.65;cursor:default}
.expense-suggestion [hidden]{display:none}
.work-editor .form-actions{flex-wrap:wrap;gap:10px}.work-editor .form-actions .btn{white-space:normal}

/* Connector settings keep credential forms and actions inside narrow viewports. */
.stripe-settings .stack { min-width:0; }
.stripe-settings .form-actions { flex-wrap:wrap; gap:8px; }
.stripe-settings p, .stripe-settings dd { overflow-wrap:anywhere; }
.stripe-settings input[readonly] { width:100%; min-width:0; padding:10px; border:1px solid #d5dfe9; border-radius:8px; font:inherit; font-size:.8rem; }

.stripe-status { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; margin:24px 0; }
.stripe-status dt { color:#60728a; font-size:.72rem; margin-bottom:6px; }
.stripe-status dd { margin:0; font-size:.8rem; font-weight:600; }

.application-version { white-space:nowrap; font-variant-numeric:tabular-nums; }
.login-card .workspace-footer { margin-top:24px; padding-bottom:0; }

.updates-page { background:#f8fafc; color:#182f4f; }
.updates-content { width:min(100%,860px); margin:0 auto; padding:32px 24px; }
.updates-content header { margin-bottom:28px; }
.updates-content header .brand { color:#182f4f; margin-bottom:28px; }
.updates-list { display:grid; gap:14px; }
.update-entry { background:white; border:1px solid #e3e9ee; border-radius:10px; padding:16px 20px; }
.update-entry summary { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; }
.update-entry summary strong { font-size:.95rem; }
.update-entry time { color:#60728a; font-size:.8rem; }
.update-entry ul { padding-left:20px; margin:14px 0 0; font-size:.87rem; line-height:1.7; }
.update-entry li + li { margin-top:8px; }
.update-entry li { overflow-wrap:anywhere; }
.update-entry summary:focus-visible { outline:2px solid #2866a5; outline-offset:4px; }
@media(max-width:600px) { .updates-content { padding:24px 16px; } .update-entry { padding:14px; } }

.update-entry summary::before { content:"+"; width:12px; color:#60728a; }
.update-entry[open] summary::before { content:"−"; }
.update-entry summary strong { margin-right:auto; }

.website-upload-note{flex:0 0 100%;min-width:0;line-height:1.8;overflow-wrap:anywhere}.website-upload-note code{white-space:normal;overflow-wrap:anywhere}

/* Header time comparison. */
.workspace-time[data-time-comparison]{position:relative}
.workspace-clock-row{position:relative;padding-right:26px}
.workspace-header .header-popup-button{position:absolute;right:0;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;min-height:0;width:20px;height:20px;padding:2px;border:0;background:transparent;color:#60728a;border-radius:4px;cursor:pointer;line-height:1}
.workspace-header .header-popup-button:hover{background:#edf1f6;color:#182f4f}
.workspace-header .header-popup-button:focus-visible{outline:2px solid #2563eb;outline-offset:2px}
.clock-trigger:focus-visible,.clock-close:focus-visible{outline:2px solid #267044;outline-offset:4px}
.time-comparison{position:absolute;right:0;top:100%;z-index:100;width:430px;max-width:calc(100vw - 32px);padding:16px;border:1px solid #dce3eb;border-radius:12px;background:#fff;box-shadow:0 12px 36px #182f4f26;text-align:left;color:#182f4f;font-size:12px;letter-spacing:normal;text-transform:none}
.time-comparison[hidden]{display:none}
.time-comparison-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px}
.clock-close{border:0;background:transparent;color:#60728a;font-size:24px;line-height:1;min-width:32px;min-height:32px;cursor:pointer}
.time-comparison-date{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin-top:10px;margin-bottom:12px;font-size:12px}
.time-comparison-date input{width:auto;min-width:0;max-width:180px;padding:6px 8px;font:inherit}
.time-comparison-note{margin:10px 0;color:#60728a;font-size:11px;line-height:1.5}
.time-comparison-scroll{position:relative;max-height:min(300px,45dvh);overflow:auto;overscroll-behavior:contain;border:1px solid #e4e9ef;border-radius:6px}
.time-comparison-table{width:100%;border-collapse:collapse;font-size:11px;white-space:normal}
.time-comparison-table th{position:sticky;top:0;z-index:1;background:#f8fafc;color:#60728a;text-align:left;font-size:10px;letter-spacing:normal;text-transform:none}
.time-comparison-table th,.time-comparison-table td{padding:9px 7px;border-bottom:1px solid #e4e9ef;font-variant-numeric:tabular-nums}
.time-comparison-table .time-too-early{background:#fff4e5;color:#9a4b00}
.time-comparison-table .time-outside-hours{background:#fff0ef;color:#b42318}
.time-comparison-table .time-working-hours{background:#eff8f2;color:#267044}
.time-comparison-table .time-cutoff td{border-top:2px solid #267044}
@media(max-width:600px){.time-comparison{position:fixed;top:104px;right:16px;width:430px;max-height:calc(100dvh - 120px);overflow:auto}.time-comparison-table th,.time-comparison-table td{padding:9px 5px}}

/* Keep the current hour visible while comparing another row. */
.time-comparison-table .time-current td{box-shadow:inset 0 2px #2563eb,inset 0 -2px #2563eb}
.time-comparison-table .time-current td:first-child{border-left:2px solid #2563eb}
.time-comparison-table .time-current td:last-child{border-right:2px solid #2563eb}
.time-comparison-table tbody tr{cursor:pointer}
.time-comparison-table tbody tr:hover td,.time-comparison-table tbody tr:focus td,.time-comparison-table .time-selected td{background:#e4edff}
.time-comparison-table tbody tr:focus{outline:2px solid #1d4ed8;outline-offset:-2px}
.time-now{display:inline-block;margin-left:5px;padding:1px 4px;border-radius:4px;background:#2563eb;color:#fff;font-size:9px;font-weight:600}

.uk-hours-remaining{display:inline-block;white-space:nowrap;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;color:#182f4f;padding-left:10px;border-left:1px solid #dce3eb}

.time-comparison-date label{display:flex;align-items:center;gap:8px}

/* Manual phone screening results beside saved lead numbers. */
.phone-check { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin:7px 0; font-size:.78rem; }
.phone-check-tag { display:inline-block; padding:4px 9px; border-radius:999px; font-weight:650; }
.phone-check-checked { background:#dcfce7; color:#166534; }
.phone-check-blocked { background:#fee2e2; color:#991b1b; }
.phone-check-required { background:#f1f5f9; color:#475569; }
.phone-check small { flex-basis:100%; }
.phone-check-field { min-width:0; }
.phone-check-field > small { display:block; font-size:.75rem; }

.phone-number-blocked, .prospect-form input.phone-number-blocked { color:#991b1b; text-decoration:line-through; text-decoration-thickness:2px; }

/* Keep Today actions easy to scan and usable on narrow screens. */
.today-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.today-actions details { position:relative; }
.today-actions summary { cursor:pointer; }
.today-actions details form { min-width:220px; padding:12px; }
@media (max-width:600px) { .today-actions { width:100%; } .today-actions details form { min-width:0; } }

.calling-review-dialog { width:min(620px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); box-sizing:border-box; overflow:auto; border:1px solid #d5dfe9; border-radius:12px; padding:24px; color:var(--text,#20334a); background:var(--surface,#fff); }
.calling-review-dialog::backdrop { background:#14233988; }
.calling-review-close { float:right; margin:0 0 12px 12px; }
.calling-review-content { clear:both; }
body:has(.calling-review-dialog[open]) { overflow:hidden; }
@media(max-width:600px) { .calling-review-dialog { padding:16px; } }

.form-save-status { display:block; grid-column:1 / -1; width:100%; font-size:13px; color:var(--fb-muted,#52657a); overflow-wrap:anywhere; }
.form-save-status[data-state="saved"] { color:var(--fb-success,#166534); }
.form-save-status[data-state="error"] { color:var(--fb-danger,#991b1b); }
.form-save-status[data-state="saving"] { color:var(--fb-blue,#2456a6); }

.lead-last-called { color:var(--fb-success,#166534); font-weight:600; white-space:nowrap; }

.lead-header-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }

.pill.sales-stage-interested { background:#dcfce7; color:#166534; }
.stage-dot.stage-interested { background:#309472; }