:root {
  --bex-bg-dark: #012921;
  --bex-bg-dark-2: #0B3A2C;
  --bex-bg-dark-3: #123930;
  --bex-bg-dark-4: #1B4A3A;
  --bex-mint: #51E699;
  --bex-mint-2: #2FBF7A;
  --bex-cream: #F5F2EC;
  --bex-sage: #9FB3A9;
  --bex-sage-2: #6E8078;
  --bex-white: #FFFFFF;
}

body {
  background-color: var(--bex-cream);
  color: #142621;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

.navbar-bex {
  background-color: var(--bex-bg-dark);
}
.navbar-bex .navbar-brand,
.navbar-bex .nav-link {
  color: var(--bex-cream) !important;
}
.navbar-bex .nav-link:hover {
  color: var(--bex-mint) !important;
}

.bex-hero {
  background: linear-gradient(135deg, var(--bex-bg-dark) 0%, var(--bex-bg-dark-4) 100%);
  color: var(--bex-cream);
}
.bex-hero .lead {
  color: var(--bex-sage);
}

.btn-bex {
  background-color: var(--bex-mint);
  border-color: var(--bex-mint);
  color: var(--bex-bg-dark);
  font-weight: 600;
}
.btn-bex:hover {
  background-color: var(--bex-mint-2);
  border-color: var(--bex-mint-2);
  color: var(--bex-bg-dark);
}
.btn-outline-bex {
  border-color: var(--bex-mint);
  color: var(--bex-mint);
}
.btn-outline-bex:hover {
  background-color: var(--bex-mint);
  color: var(--bex-bg-dark);
}

.card-bex {
  border: none;
  border-radius: 0.75rem;
  box-shadow: 0 2px 10px rgba(1, 41, 33, 0.08);
}

.progress-bex {
  height: 0.5rem;
  background-color: var(--bex-sage);
}
.progress-bex .progress-bar {
  background-color: var(--bex-mint-2);
}

.descriptor-option {
  display: block;
  border: 2px solid #e2e4e0;
  border-radius: 0.6rem;
  padding: 0.9rem 1.1rem;
  margin-bottom: 0.6rem;
  cursor: pointer;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.descriptor-option:hover {
  border-color: var(--bex-mint-2);
}
.descriptor-option input {
  margin-right: 0.6rem;
}
.descriptor-option.selected {
  border-color: var(--bex-mint-2);
  background-color: rgba(81, 230, 153, 0.08);
}
.descriptor-level-badge {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--bex-bg-dark);
  background-color: var(--bex-sage);
  border-radius: 999px;
  padding: 0.1rem 0.55rem;
  margin-right: 0.5rem;
}

.state-badge {
  display: inline-block;
  padding: 0.3rem 0.9rem;
  border-radius: 999px;
  font-weight: 700;
  color: var(--bex-white);
}
.state-suplik { background-color: #8a6d3b; }
.state-nosne { background-color: var(--bex-mint-2); }
.state-mlha { background-color: var(--bex-sage-2); }
.state-kouzlo { background-color: #6f5fa3; }
.state-prechodny { background-color: #4a6b7c; }

.quadrant-svg text { font-family: inherit; }

footer.bex-footer {
  background-color: var(--bex-bg-dark);
  color: var(--bex-sage);
}

@media print {
  .no-print { display: none !important; }
  body { background: #fff; }
  .card-bex { box-shadow: none; border: 1px solid #ddd; }
}