html, body { min-height: 100%; }
body { background: #f5f7fb; color: #1f2937; }
.site-nav { background: #111827 !important; }
.site-main { min-height: calc(100vh - 130px); }
.navbar-brand { letter-spacing: .2px; }
.nav-link.active { color: #fff !important; font-weight: 600; }
.hero-card { background: linear-gradient(135deg, #ffffff, #eef4ff); border: 1px solid #dbe5f5; }
.info-panel { background: #fff; border: 1px solid #e5e7eb; border-radius: 1rem; padding: 1rem; box-shadow: 0 10px 30px rgba(0,0,0,0.04); }
.profile-preview { width: 140px; height: 140px; object-fit: cover; border: 6px solid #fff; box-shadow: 0 10px 30px rgba(0,0,0,0.12); }
.tree-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
.tree-node-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 1rem; padding: 1rem; box-shadow: 0 10px 20px rgba(15,23,42,0.05); }
.card, .info-panel, .hero-card { overflow: hidden; }
.dropdown-menu { border: 1px solid #e5e7eb; }
@media (max-width: 767.98px) { .hero-card { padding: 1.25rem !important; } }

@media (max-width: 767.98px) {
  .site-main { min-height: calc(100vh - 110px); }
  .navbar-brand { font-size: 1.1rem; }
  .hero-card { padding: 1rem !important; }
  .profile-preview { width: 104px; height: 104px; }
}
img { max-width: 100%; height: auto; }