#zone-controls {
  padding: var(--sp-3) var(--sp-4);
  background: var(--panel-bg);
  border: var(--panel-border);
  border-radius: var(--panel-radius);
  box-shadow: var(--panel-shadow);
}
.zone-controls-row {
  display: flex; gap: var(--sp-2); align-items: center; flex-wrap: wrap;
}
#zone-controls button {
  padding: var(--sp-2) var(--sp-3);
  background: var(--surface-3);
  color: var(--text-1);
  border: 1px solid var(--border-hair);
  border-radius: 6px;
  cursor: pointer;
  font-family: inherit;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  transition: background var(--dur-fast), transform var(--dur-fast), border-color var(--dur-fast);
}
#zone-controls button:hover:not(:disabled) {
  background: var(--surface-4);
  border-color: var(--border-strong);
  transform: translateY(-1px);
}
#zone-controls button:disabled { opacity: 0.4; cursor: not-allowed; }
#zone-controls button.on {
  background: linear-gradient(180deg, #2a6a2a 0%, #1e4a1e 100%);
  border-color: #4a8a4a;
  color: #dfd;
  box-shadow: 0 0 8px rgba(74, 138, 74, 0.3), inset 0 1px 0 rgba(255,255,255,0.1);
}
.zone-kills {
  font-size: var(--text-sm);
  color: var(--text-1);
  padding: 0 var(--sp-2);
  border-left: 1px solid var(--border-hair);
  border-right: 1px solid var(--border-hair);
  margin: 0 var(--sp-1);
  align-self: stretch;
  display: flex; align-items: center;
}
.zone-kills span { color: var(--accent-gold); font-weight: var(--weight-bold); }
.zone-info {
  display: flex; flex-wrap: wrap; gap: var(--sp-1);
  margin-left: auto;
}
.zone-info:empty { display: none; }

.tag {
  display: inline-flex; align-items: center; gap: var(--sp-1);
  background: var(--surface-3);
  border: 1px solid var(--border-hair);
  padding: 4px 10px;
  border-radius: 999px;
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  color: var(--text-1);
  letter-spacing: 0.3px;
}
.tag.boss-tag {
  background: linear-gradient(180deg, #7a5010 0%, #4a3208 100%);
  border-color: var(--accent-gold);
  color: var(--accent-gold);
  box-shadow: 0 0 6px rgba(255, 215, 0, 0.25);
}
.tag.resist {
  background: #4a2a2a;
  border-color: #7a3838;
  color: #ff9999;
}
.tag.weak {
  background: #2a4a2a;
  border-color: #388a38;
  color: #99ff99;
}