:root {
  --primary: #3157d5;
  --ink: #172033;
  --muted: #68738a;
  --surface: #ffffff;
  --bg: #f5f7fb;
}
body {
  background: var(--bg);
  color: var(--ink);
  min-height: 100vh;
}
.app-navbar {
  background: linear-gradient(110deg, #172b68, #3157d5);
  box-shadow: 0 8px 24px rgba(24, 40, 90, .16);
}
.navbar-brand { letter-spacing: -.02em; }
.user-chip {
  color: rgba(255,255,255,.9);
  font-size: .86rem;
}
.hero-card {
  color: #fff;
  border-radius: 24px;
  background: radial-gradient(circle at 90% 20%, rgba(255,255,255,.20), transparent 28%),
              linear-gradient(120deg, #172b68, #3157d5 55%, #5978e4);
  box-shadow: 0 20px 50px rgba(42, 70, 160, .18);
  overflow: hidden;
  position: relative;
}
.eyebrow {
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .72rem;
  font-weight: 800;
  opacity: .75;
}
.stat-pill {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .75rem 1rem;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.2);
}
.stat-pill span { font-size: 1.35rem; font-weight: 800; }
.doc-card, .form-card, .login-card, .viewer-card, .empty-state {
  background: var(--surface);
  border: 1px solid #e8ebf2;
  border-radius: 18px;
  box-shadow: 0 12px 35px rgba(24, 36, 70, .07);
}
.doc-card {
  overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease;
}
.doc-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 42px rgba(24, 36, 70, .12);
}
.doc-thumb {
  height: 180px;
  background: #eef2ff;
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
}
.doc-thumb > i { font-size: 4.5rem; color: #d63b4a; }
.doc-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}
.doc-card:hover .doc-thumb img { transform: scale(1.04); }
.file-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  background: rgba(255,255,255,.9);
  padding: .35rem .55rem;
  border-radius: 999px;
  font-size: .7rem;
  font-weight: 800;
}
.btn-primary {
  background: var(--primary);
  border-color: var(--primary);
}
.brand-icon {
  width: 68px; height: 68px;
  margin: auto;
  display: grid; place-items: center;
  border-radius: 20px;
  background: #eef2ff;
  color: var(--primary);
  font-size: 1.8rem;
}
.upload-zone {
  border: 2px dashed #cfd6e8;
  border-radius: 16px;
  padding: 1.25rem;
  text-align: center;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.upload-zone.dragover {
  border-color: var(--primary);
  background: #f0f4ff;
  transform: scale(1.01);
}
.pdf-frame {
  width: 100%;
  height: 75vh;
  border: 0;
  background: #f1f3f6;
}
.viewer-body { padding: 1rem; min-height: 300px; }
.reveal {
  animation: revealUp .55s cubic-bezier(.2,.7,.2,1) both;
  animation-delay: var(--delay, 0ms);
}
@keyframes revealUp {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 575.98px) {
  .hero-card { border-radius: 18px; }
  .doc-thumb { height: 150px; }
}