body { background: #f5f7fb; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.w-25 { width: 6.25rem; }
.w-30 { width: 7.5rem; }
.modal { transition: opacity 0.25s ease; }
.modal.hidden { display: none; }
.file-drop-zone { border: 2px dashed #cbd5e1; transition: all 0.2s; cursor: pointer; background: #f9fafb; }
.file-drop-zone:hover, .file-drop-zone.drag-over { border-color: #3b82f6; background: #eff6ff; }
.do-not-call-row { background-color: #fef2f2; }
.timeline-item { border-left: 2px solid #e2e8f0; padding-left: 1rem; margin-bottom: 1rem; position: relative; }
.timeline-item::before { content: ""; position: absolute; left: -6px; top: 0; width: 10px; height: 10px; border-radius: 50%; background: #3b82f6; }
.nav-active { color: #2563eb !important; border-bottom: 2px solid #2563eb; }
.selected-row { background-color: #dbeafe !important; }
.badge-paid { background-color: #dcfce7; color: #166534; }
.badge-unpaid { background-color: #fee2e2; color: #991b1b; }
.badge-filled { background-color: #dbeafe; color: #1e40af; }
.badge-notfilled { background-color: #fef3c7; color: #92400e; }
.chart-container { position: relative; height: 220px; width: 100%; margin: 0 auto; padding: 0.75rem; background: linear-gradient(180deg, #eff6ff, #eef2ff); border-radius: 1.5rem; }
.chart-container canvas { border-radius: 1.25rem; }
.trend-summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0.75rem; margin-top: 1rem; background: #fff; border-radius: 1.25rem; padding: 0.85rem; border: 1px solid #e5e7eb; box-shadow: 0 15px 45px rgba(15,23,42,0.08); }
.trend-stat-card { border-radius: 0.85rem; background: #fdfdfd; padding: 0.8rem 0.9rem; box-shadow: inset 0 1px 0 rgba(255,255,255,0.9); border: 1px solid rgba(15,23,42,0.06); }
.trend-stat-card strong { color: #111827; }
.trend-stat-card span { color: #475569; }
.trend-stat-card strong { display: block; font-size: 1.4rem; }
.trend-stat-card span { font-size: 0.8rem; color: #475569; letter-spacing: 0.02em; }
.chart-container canvas { width: 100% !important; height: 100% !important; }
.pie-chart-container { position: relative; height: 280px; width: 100%; max-width: 320px; margin: 0 auto; }
.stat-card { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); position: relative; overflow: hidden; cursor: pointer; }
.stat-card:hover { transform: translateY(-8px); box-shadow: 0 20px 30px -12px rgba(0, 0, 0, 0.2); }
.form-label { font-weight: 500; font-size: 0.875rem; color: #374151; margin-bottom: 0.25rem; display: block; }
.activity-log-item { transition: all 0.2s; }
.activity-log-item:hover { background-color: #f3f4f6; transform: translateX(4px); }
.quick-add-activity { background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%); }

.tab-pill { transition: all 0.2s ease; }
.tab-pill.active { background: #2563eb; color: #fff; box-shadow: 0 10px 20px -12px rgba(37, 99, 235, 0.65); }
.modal-panel { transform: translateY(20px) scale(0.98); opacity: 0; transition: transform 0.25s ease, opacity 0.25s ease; }
.modal-panel.modal-visible { transform: translateY(0) scale(1); opacity: 1; }
.modal-overlay { transition: opacity 0.25s ease; }
.role-badge { display: inline-flex; align-items: center; border-radius: 9999px; padding: 0.25rem 0.75rem; font-size: 0.75rem; font-weight: 500; }
.table-row-hover { transition: background-color 0.2s ease; }
.table-row-hover:hover { background: #f8fafc; }

.crm-surface {
  background: #f5f7fb;
}

.hero-orb {
  display: none;
}

.hero-orb.one {
  width: 10rem;
  height: 10rem;
  right: -1rem;
  top: -2rem;
  background: radial-gradient(circle, rgba(255,255,255,0.55), rgba(255,255,255,0));
}

.hero-orb.two {
  width: 7rem;
  height: 7rem;
  right: 20%;
  bottom: -1.5rem;
  background: radial-gradient(circle, rgba(191,219,254,0.55), rgba(191,219,254,0));
}

.premium-card {
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.premium-card:hover {
  border-color: #d1d5db;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

.stat-shell {
  overflow: hidden;
}

.filter-shell {
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #111827;
}

.filter-shell:focus {
  outline: none;
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.18);
}

.section-heading {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.section-heading::before {
  content: "";
  width: 0.25rem;
  height: 1.25rem;
  border-radius: 9999px;
  background: #2563eb;
}

.frost-panel {
  background: #ffffff;
}

.glow-table thead {
  background: #f8fafc;
}

.soft-divider {
  border-top: 1px solid #e5e7eb;
}
.source-chart-panel { display: flex; flex-direction: column; gap: 1rem; }
.source-legend-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0.5rem; }
.source-legend-list .legend-swatch { display: inline-block; width: 16px; height: 16px; border-radius: 9999px; }
.funnel-item-button {
  width: 100%;
  border-radius: 1rem;
  border: 1px solid #e5e7eb;
  background: #ffffff;
  transition: border-color 0.2s ease, transform 0.2s ease;
  padding: 1rem;
}
.funnel-item-button:hover {
  border-color: #a5b4fc;
  transform: translateY(-2px);
}
.funnel-item-button p {
  margin: 0;
}