body { font-family: 'Heebo', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
input, select, textarea { outline: none; }
.dir-ltr { direction: ltr; text-align: left; }
.shadow-soft { box-shadow: 0 18px 55px rgba(15, 23, 42, .10); }
.hero-card {
  position: relative;
  overflow: hidden;
  border-radius: 2rem;
  padding: clamp(1.5rem, 4vw, 3rem);
  color: white;
  background:
    radial-gradient(circle at 12% 10%, rgba(245, 158, 11, .35), transparent 26rem),
    radial-gradient(circle at 86% 80%, rgba(16, 185, 129, .28), transparent 24rem),
    linear-gradient(135deg, #172554 0%, #0f172a 68%, #064e3b 100%);
  box-shadow: 0 24px 70px rgba(15, 23, 42, .16);
}
.hero-card::after {
  content: "";
  position: absolute;
  inset: auto -6rem -8rem auto;
  width: 22rem;
  height: 22rem;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}
.field {
  width: 100%;
  border-radius: 1rem;
  border: 1px solid #e2e8f0;
  background: white;
  padding: .85rem 1rem;
  transition: box-shadow .15s ease, border-color .15s ease;
}
.field:focus {
  border-color: #1d4ed8;
  box-shadow: 0 0 0 4px rgba(59, 130, 246, .12);
}
.metric-card {
  border-radius: 1.5rem;
  background: white;
  border: 1px solid #f5e6c8;
  padding: 1.25rem;
  font-weight: 800;
  color: #475569;
  box-shadow: 0 18px 55px rgba(15, 23, 42, .08);
}
.metric-number {
  font-size: 2rem;
  line-height: 1;
  font-weight: 900;
  color: #172554;
  margin-bottom: .35rem;
}
.prayer-card {
  border-radius: 1.5rem;
  background: white;
  border: 1px solid #f5e6c8;
  padding: 1.25rem;
  box-shadow: 0 18px 55px rgba(15, 23, 42, .08);
  transition: transform .16s ease, box-shadow .16s ease;
}
.prayer-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
}
.tag-blue {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  border-radius: 999px;
  background: #eff6ff;
  color: #1e3a8a;
  padding: .3rem .75rem;
  font-size: .875rem;
  font-weight: 900;
}
.ad-card {
  border-radius: 1.5rem;
  background: linear-gradient(135deg, #fffbeb, #ffffff);
  border: 1px solid #fde68a;
  padding: 1.25rem;
  box-shadow: 0 18px 55px rgba(120, 53, 15, .08);
}
.quick-action {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  border-width: 1px;
  border-radius: 1rem;
  padding: .75rem 1rem;
  font-weight: 900;
  transition: background-color .15s ease, transform .15s ease;
}
.quick-action:hover { transform: translateY(-1px); }
.compact-card { padding: 1rem; box-shadow: 0 10px 30px rgba(15, 23, 42, .06); }
.compact-field { padding-top: .72rem; padding-bottom: .72rem; }
.upcoming-row {
  display: flex;
  align-items: center;
  gap: .9rem;
  padding: .9rem .25rem;
  transition: background-color .15s ease;
}
.upcoming-row:hover { background: #f8fafc; }
.upcoming-time {
  width: 4.6rem;
  flex: 0 0 4.6rem;
  color: #172554;
  font-size: 1.55rem;
  line-height: 1;
  font-weight: 900;
}
.schedule-row {
  padding: .85rem .25rem;
  transition: background-color .15s ease;
}
.schedule-row:hover { background: #f8fafc; }
@media (max-width: 640px) {
  .dir-ltr { text-align: right; }
  .upcoming-time { width: 4rem; flex-basis: 4rem; font-size: 1.35rem; }
}