:root {
    --brand-gradient-start: #4c6ef5;
    --brand-gradient-end: #8c54ff;
    --surface-bg: #f6f7fb;
  }
  
  body.bg-surface {
    background-color: var(--surface-bg);
  }
  
  .text-gradient {
    background: linear-gradient(
      135deg,
      var(--brand-gradient-start),
      var(--brand-gradient-end)
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  
  .card-elevated {
    border: none;
    box-shadow: 0 18px 40px -18px rgba(24, 39, 75, 0.25);
    border-radius: 1rem;
  }
  
  .navbar-soft {
    backdrop-filter: blur(8px);
    background-color: rgba(255, 255, 255, 0.92);
  }
  
  .badge.text-bg-soft-primary {
    background-color: rgba(76, 110, 245, 0.15);
    color: #2d3a8c;
  }
  
  .badge.text-bg-subtle {
    background-color: rgba(15, 23, 42, 0.08);
    color: #0f172a;
    border: 1px solid rgba(15, 23, 42, 0.12);
  }
  
.list-group.taxonomy-tree > .list-group-item {
  border: none;
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}
  
  .list-group.taxonomy-tree > .list-group-item:last-child {
    border-bottom: none;
  }
  
  .taxonomy-tree .spinner-border.d-none.htmx-request {
    display: inline-block !important;
  }
  
  .taxonomy-tree button[disabled] {
    opacity: 0.6;
  }

  /* Taxonomy tree thumbnails */
  .taxonomy-tree-thumbnail {
    width: 48px;
    min-width: 48px;
    height: 48px;
    flex-shrink: 0;
  }

  .taxonomy-tree-thumbnail .inaturalist-photo-component {
    width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    margin: 0 !important;
  }

  .taxonomy-tree-thumbnail .inaturalist-photo-wrapper {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    border-radius: 6px;
  }

  .taxonomy-tree-thumbnail .inaturalist-photo {
    width: 48px !important;
    height: 48px !important;
  }

  .taxonomy-tree-thumbnail .inaturalist-photo-placeholder {
    font-size: 20px;
  }

  .taxonomy-tree-thumbnail .spinner-border-sm {
    width: 1rem;
    height: 1rem;
  }