:root {
  --d4e-navy: #082B57;
  --d4e-blue: #1689E8;
  --d4e-light-blue: #54C7FF;
  --d4e-purple: #7046D9;
  --d4e-green: #19A974;
  --d4e-pink: #E91E73;
  --d4e-orange: #F4A000;
  --d4e-white: #FFFFFF;
  --d4e-bg: #F5F9FD;
  --d4e-radius: 14px;
  --d4e-shadow: 0 6px 24px rgba(8, 43, 87, 0.08);
}

body {
  background: var(--d4e-bg);
  font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
  color: var(--d4e-navy);
}

.d4e-navbar {
  background: var(--d4e-white);
  box-shadow: var(--d4e-shadow);
}

.d4e-brand {
  font-weight: 700;
  color: var(--d4e-navy);
}
.d4e-brand span { color: var(--d4e-blue); }

.btn-d4e-primary {
  background: var(--d4e-blue);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-weight: 600;
}
.btn-d4e-primary:hover { background: var(--d4e-navy); color: #fff; }

.btn-d4e-outline {
  background: transparent;
  color: var(--d4e-blue);
  border: 1.5px solid var(--d4e-blue);
  border-radius: 10px;
  font-weight: 600;
}
.btn-d4e-outline:hover { background: var(--d4e-blue); color: #fff; }

.d4e-card {
  background: var(--d4e-white);
  border-radius: var(--d4e-radius);
  box-shadow: var(--d4e-shadow);
  border: 1px solid rgba(8, 43, 87, 0.06);
}

.d4e-badge {
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.3rem 0.75rem;
}
.d4e-badge-verified { background: rgba(25,169,116,.12); color: var(--d4e-green); }
.d4e-badge-pending  { background: rgba(244,160,0,.14); color: var(--d4e-orange); }
.d4e-badge-rejected { background: rgba(233,30,115,.12); color: var(--d4e-pink); }

.auth-shell {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, var(--d4e-navy) 0%, var(--d4e-blue) 140%);
}

.auth-card {
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(8,43,87,.35);
  max-width: 460px;
  width: 100%;
  padding: 2.25rem;
}